Separator

Ein Separator ist eine horizontale Linie, die inhaltliche Abschnitte voneinander abgrenzt.GitHubMarkdown

Properties

PropertyTypeDefaultDescription
classNamestring'react-aria-Separator'The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.
orientationOrientation'horizontal'The orientation of the separator.
elementTypestring-The HTML element type that will be used to render the separator.
idstring-The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).
styleStyleOrFunction<TooltipRenderProps>-The inline [style](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. A function may be provided to compute the style based on component state.
slotstring-A slot name for the component. Slots allow the component to receive props from a parent component. An explicit `null` value indicates that the local props completely override all props received from a parent.
renderDOMRenderFunction<"div", TooltipRenderProps>-Overrides the default DOM element with a custom render function. This allows rendering existing components with built-in styles and behaviors such as router links, animation libraries, and pre-styled components. Requirements: - You must render the expected element type (e.g. if `<button>` is expected, you cannot render an `<a>`). - Only a single root DOM element can be rendered (no fragments). - You must pass through props and ref to the underlying DOM element, merging with your own prop as appropriate.
dirstring-
langstring-
hiddenboolean-
inertboolean-
translate"yes" | "no"-

Events

PropertyTypeDefaultDescription
onClickMouseEventHandler<HTMLDivElement>-
onClickCaptureMouseEventHandler<HTMLDivElement>-
onAuxClickMouseEventHandler<HTMLDivElement>-
onAuxClickCaptureMouseEventHandler<HTMLDivElement>-
onContextMenuMouseEventHandler<HTMLDivElement>-
onContextMenuCaptureMouseEventHandler<HTMLDivElement>-
onDoubleClickMouseEventHandler<HTMLDivElement>-
onDoubleClickCaptureMouseEventHandler<HTMLDivElement>-
onMouseDownMouseEventHandler<HTMLDivElement>-
onMouseDownCaptureMouseEventHandler<HTMLDivElement>-
onMouseEnterMouseEventHandler<HTMLDivElement>-
onMouseLeaveMouseEventHandler<HTMLDivElement>-
onMouseMoveMouseEventHandler<HTMLDivElement>-
onMouseMoveCaptureMouseEventHandler<HTMLDivElement>-
onMouseOutMouseEventHandler<HTMLDivElement>-
onMouseOutCaptureMouseEventHandler<HTMLDivElement>-
onMouseOverMouseEventHandler<HTMLDivElement>-
onMouseOverCaptureMouseEventHandler<HTMLDivElement>-
onMouseUpMouseEventHandler<HTMLDivElement>-
onMouseUpCaptureMouseEventHandler<HTMLDivElement>-
onTouchCancelTouchEventHandler<HTMLDivElement>-
onTouchCancelCaptureTouchEventHandler<HTMLDivElement>-
onTouchEndTouchEventHandler<HTMLDivElement>-
onTouchEndCaptureTouchEventHandler<HTMLDivElement>-
onTouchMoveTouchEventHandler<HTMLDivElement>-
onTouchMoveCaptureTouchEventHandler<HTMLDivElement>-
onTouchStartTouchEventHandler<HTMLDivElement>-
onTouchStartCaptureTouchEventHandler<HTMLDivElement>-
onPointerDownPointerEventHandler<HTMLDivElement>-
onPointerDownCapturePointerEventHandler<HTMLDivElement>-
onPointerMovePointerEventHandler<HTMLDivElement>-
onPointerMoveCapturePointerEventHandler<HTMLDivElement>-
onPointerUpPointerEventHandler<HTMLDivElement>-
onPointerUpCapturePointerEventHandler<HTMLDivElement>-
onPointerCancelPointerEventHandler<HTMLDivElement>-
onPointerCancelCapturePointerEventHandler<HTMLDivElement>-
onPointerEnterPointerEventHandler<HTMLDivElement>-
onPointerLeavePointerEventHandler<HTMLDivElement>-
onPointerOverPointerEventHandler<HTMLDivElement>-
onPointerOverCapturePointerEventHandler<HTMLDivElement>-
onPointerOutPointerEventHandler<HTMLDivElement>-
onPointerOutCapturePointerEventHandler<HTMLDivElement>-
onGotPointerCapturePointerEventHandler<HTMLDivElement>-
onGotPointerCaptureCapturePointerEventHandler<HTMLDivElement>-
onLostPointerCapturePointerEventHandler<HTMLDivElement>-
onLostPointerCaptureCapturePointerEventHandler<HTMLDivElement>-
onScrollUIEventHandler<HTMLDivElement>-
onScrollCaptureUIEventHandler<HTMLDivElement>-
onWheelWheelEventHandler<HTMLDivElement>-
onWheelCaptureWheelEventHandler<HTMLDivElement>-
onAnimationStartAnimationEventHandler<HTMLDivElement>-
onAnimationStartCaptureAnimationEventHandler<HTMLDivElement>-
onAnimationEndAnimationEventHandler<HTMLDivElement>-
onAnimationEndCaptureAnimationEventHandler<HTMLDivElement>-
onAnimationIterationAnimationEventHandler<HTMLDivElement>-
onAnimationIterationCaptureAnimationEventHandler<HTMLDivElement>-
onTransitionCancelTransitionEventHandler<HTMLDivElement>-
onTransitionCancelCaptureTransitionEventHandler<HTMLDivElement>-
onTransitionEndTransitionEventHandler<HTMLDivElement>-
onTransitionEndCaptureTransitionEventHandler<HTMLDivElement>-
onTransitionRunTransitionEventHandler<HTMLDivElement>-
onTransitionRunCaptureTransitionEventHandler<HTMLDivElement>-
onTransitionStartTransitionEventHandler<HTMLDivElement>-
onTransitionStartCaptureTransitionEventHandler<HTMLDivElement>-

Accessibility

PropertyTypeDefaultDescription
aria-labelstring-Defines a string value that labels the current element.
aria-labelledbystring-Identifies the element (or elements) that labels the current element.
aria-describedbystring-Identifies the element (or elements) that describes the object.
aria-detailsstring-Identifies the element (or elements) that provide a detailed, extended description for the object.

Auf dieser Seite