new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Radix Primitives · all subjects

separator

13 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Separator component import and usage

The Separator component is imported from 'radix-ui'. It has a Root component that is used as `<Separator.Root />`.

Separator asChild prop

The asChild prop (boolean, default false) allows you to change the default rendered element for the one passed as a child, merging their props and behavior. See the Composition guide for more details.

Separator decorative prop

The decorative prop is a boolean that, when true, signifies the separator is purely visual with no semantic meaning, and ensures it is not present in the accessibility tree.

Separator data-orientation attribute

The Separator component has a data-orientation attribute that reflects the current orientation state with values 'vertical' or 'horizontal'.

Separator accessibility role

The Separator component adheres to the separator role requirements from WAI-ARIA 1.2 specification (https://www.w3.org/TR/wai-aria-1.2/#separator).

Separator supports horizontal and vertical orientations

The Separator primitive supports both horizontal and vertical orientations for visually or semantically separating content.

Separator component purpose and usage

The Separator component is used to visually or semantically separate content. It can be displayed horizontally or vertically within layouts to divide sections or list items.

Separator orientation prop values

The orientation prop controls whether the separator is horizontal or vertical. Valid values are 'horizontal' and 'vertical'. Horizontal is the default orientation.

Separator size prop

The size prop controls the size or thickness of the separator. Valid values are '1', '2', '3', and '4', where '4' is the largest step that takes full width or height of the container.

Separator color prop

The color prop assigns a specific color to the separator. Colors follow the theme's color system and can include values such as 'indigo', 'cyan', 'orange', and 'crimson'.

Separator supports common margin props

The Separator component inherits props from the Separator primitive and supports common margin props for controlling spacing around the separator.

Separator example with margin

Example showing Separator with my='3' prop to control vertical margin spacing and size='4' to set the separator size.

Separator example vertical list dividers

Separators can be used with orientation='vertical' to divide items in a horizontal layout, such as dividing navigation items or menu options in a single row.

Give your agent this brain