@baseline-ui/mcp 3.9.0 → 3.10.0

package/dist/server.cjs

@@ -1756,6 +1756,7 @@ import { TextIcon } from "@baseline-ui/icons/24";
 import React from "react";
 
 import { invariant } from "../../../utils";
+import { ActionButton } from "../../ActionButton";
 import { ToggleIconButton } from "../../ToggleIconButton";
 import { ActionGroup } from "../ActionGroup";
 
@@ -1801,21 +1802,25 @@ export const ActionGroupExample: React.FC<
 };
 
 export const ActionGroupCustomRendererExample: React.FC<
- Omit<ActionGroupProps, "items">
-> = ({ selectionMode, ...props }) => {
+ Omit<ActionGroupProps, "items"> & { withoutIcons?: boolean }
+> = ({ selectionMode, withoutIcons, ...props }) => {
+ const items =
+ !selectionMode || selectionMode === "single"
+ ? actionGroupSingleSelectItems
+ : actionGroupMultiSelectItems;
+
  return (
  <ActionGroup
  items={
- !selectionMode || selectionMode === "single"
- ? actionGroupSingleSelectItems
- : actionGroupMultiSelectItems
+ withoutIcons ? items.map(({ id, label }) => ({ id, label })) : items
  }
  selectionMode={selectionMode}
  renderActionItem={(item, { isSelected, isDisabled }) => {
- invariant(
- item.value && "icon" in item.value && item.value.icon,
- "Item value is required.",
+ if (!(item.value && "icon" in item.value && item.value.icon)) {
+ return (
+ <ActionButton label={item.textValue} isDisabled={isDisabled} />
  );
+ }
 
  return (
  <ToggleIconButton
@@ -1845,7 +1850,7 @@ export const ActionGroupWithIconExample: React.FC<
 import { ActionIconButton } from "@baseline-ui/core";
 import { EllipseIcon } from "@baseline-ui/icons/16";
 
-<ActionIconButton icon={EllipseIcon} />;
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon} />;
 \`\`\`
 
 \`\`\`jsx
@@ -1856,25 +1861,26 @@ import { EllipseIcon as EllipseIcon20 } from "@baseline-ui/icons/20";
 import { EllipseIcon as EllipseIcon16 } from "@baseline-ui/icons/16";
 import { EllipseIcon as EllipseIcon24 } from "@baseline-ui/icons/24";
 
-<ActionIconButton icon={EllipseIcon8} size="xxs" />
-<ActionIconButton icon={EllipseIcon12} size="xs" />
-<ActionIconButton icon={EllipseIcon16} size="sm" />
-<ActionIconButton icon={EllipseIcon20} size="md" />
-<ActionIconButton icon={EllipseIcon24} size="lg" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon8} size="xxs" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon12} size="xs" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon16} size="sm" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon20} size="md" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon24} size="lg" />
 \`\`\`
 
 \`\`\`jsx
-<ActionIconButton icon={EllipseIcon8} isDisabled size="xxs" />
-<ActionIconButton icon={EllipseIcon12} isDisabled size="xs" />
-<ActionIconButton icon={EllipseIcon16} isDisabled size="sm" />
-<ActionIconButton icon={EllipseIcon20} isDisabled size="md" />
-<ActionIconButton icon={EllipseIcon24} isDisabled size="lg" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon8} isDisabled size="xxs" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon12} isDisabled size="xs" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon16} isDisabled size="sm" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon20} isDisabled size="md" />
+<ActionIconButton aria-label="Ellipse" icon={EllipseIcon24} isDisabled size="lg" />
 \`\`\`
 
 You can listen for events by passing the \`onPress\` prop. The \`onPress\` prop will fire when the button is activated by mouse, touch, or keyboard interactions.
 
 \`\`\`jsx
 <ActionIconButton
+ aria-label="Ellipse"
  icon={EllipseIcon20}
  onPress={() => alert("Button pressed!")}
 />
@@ -1889,9 +1895,9 @@ You can listen for events by passing the \`onPress\` prop. The \`onPress\` prop
 | \\[data-pressed] | Whether the button is currently pressed. |
 
 | Key | Function |
-| ------- | --------------------------------- |
-| \`Space\` | Activates/deactivates the toggle. |
-| \`Enter\` | Activates/deactivates the toggle. |`,props:`interface ActionIconButtonProps {
+| ------- | --------------------- |
+| \`Space\` | Activates the button. |
+| \`Enter\` | Activates the button. |`,props:`interface ActionIconButtonProps {
 /**
  * The button's class name.
  */
@@ -2328,8 +2334,8 @@ export const ActionableWithNativeButton: React.FC<
 <a href="?path=/story/core-overlays-alertdialog--basic">View story</a>
 
 * Exposed to assistive technologies as an alert dialog using the ARIA \`role="alertdialog"\`.
-* Focus is moved into the dialog on mount and restored to the trigger element on unmount.
-* Focus is trapped inside the dialog while it is open, preventing the user from tabbing outside.
+* Focus is moved into the dialog when it opens.
+* Inside \`ModalContent\`, focus is trapped in the dialog while it is open and restored to the trigger element when it closes.
 * Optional close button in the header for dismissing the dialog.
 * Supports keyboard interaction for navigating and activating buttons.
 
@@ -2400,10 +2406,10 @@ AlertDialog exposes className props for its inner elements:
 | \`primaryActionClassName\` | Primary action button |
 
 | Key | Function |
-| ----------- | ------------------------------------------------------------------------------ |
-| \`Tab\` | Moves focus to the next focusable element within the dialog. Focus is trapped. |
+| ----------- | ---------------------------------------------------------------------------------------------------------- |
+| \`Tab\` | Moves focus to the next focusable element within the dialog. Focus is trapped while inside \`ModalContent\`. |
 | \`Shift+Tab\` | Moves focus to the previous focusable element within the dialog. |
-| \`Escape\` | Closes the dialog and returns focus to the trigger element. |
+| \`Escape\` | Closes the dialog and returns focus to the trigger element. Handled by \`ModalContent\`. |
 | \`Space\` | Activates the focused button. |
 | \`Enter\` | Activates the focused button. |
 
@@ -3579,6 +3585,8 @@ className?: string
 style?: React.CSSProperties
 /**
  * The size of the calendar.
+ * 
+ * @default "sm"
  */
 size?: "xs" | "sm"
 /**
@@ -4081,6 +4089,8 @@ className?: string
 style?: React.CSSProperties
 /**
  * The size of the calendar.
+ * 
+ * @default "sm"
  */
 size?: "xs" | "sm"
 /**
@@ -5095,7 +5105,7 @@ noneLabel?: string
         aria-label="Indeterminate"
         tooltip
         indeterminateIcon={null} />
-</Box>;`}],implementation:""},similarTo:[],figmaUrl:null},ColorSwatchPicker:{id:"core-forms-colorswatchpicker",breadcrumb:"Core/Forms/ColorSwatchPicker",importStatement:'import { ColorSwatchPicker } from "@baseline-ui/core";',description:"`ColorSwatchPicker` is a keyboard-navigable grid of color swatches from which a user picks exactly one color. Use it when you want users to choose from a curated palette without the overhead of a full color picker.",documentation:`\`ColorSwatchPicker\` is a keyboard-navigable grid of color swatches from which a user picks exactly one color. Use it when you want users to choose from a curated palette without the overhead of a full color picker.
+</Box>;`}],implementation:""},similarTo:[],figmaUrl:null},ColorSwatchPicker:{id:"core-forms-colorswatchpicker",breadcrumb:"Core/Forms/ColorSwatchPicker",importStatement:'import { ColorSwatchPicker } from "@baseline-ui/core";',description:"`ColorSwatchPicker` is a keyboard-navigable row of color swatches from which a user picks one color. Pressing the selected swatch again clears the selection and calls `onChange` with `undefined`. Use it when you want users to choose from a curated palette without the overhead of a full color picker.",documentation:`\`ColorSwatchPicker\` is a keyboard-navigable row of color swatches from which a user picks one color. Pressing the selected swatch again clears the selection and calls \`onChange\` with \`undefined\`. Use it when you want users to choose from a curated palette without the overhead of a full color picker.
 
 * Exposed to assistive technologies via ARIA attributes.
 * Supports keyboard navigation.
@@ -5176,7 +5186,8 @@ icon?: React.FC<IconProps>
  */
 value?: string
 /**
- * A function that is called when the selected item changes.
+ * A function that is called when the selected item changes. It receives
+ * \`undefined\` when the user presses the selected swatch again to clear it.
  */
 onChange?: (value?: string) => void
 /**
@@ -5491,15 +5502,19 @@ className?: string
  */
 style?: React.CSSProperties
 /**
- * The description to display below the input.
+ * The description to display below the input. Hidden while an \`errorMessage\`
+ * or \`warningMessage\` is shown.
  */
 description?: string
 /**
- * The error message to display when the input is in an error state.
+ * The error message to display below the input, in place of the \`description\`
+ * and \`warningMessage\`. Setting it also puts the input in the error state.
  */
 errorMessage?: string
 /**
- * The warning message to display when the input is in a warning state.
+ * The warning message to display below the input, in place of the
+ * \`description\`. An \`errorMessage\` takes precedence over it. \`FileInput\`
+ * shows it only while \`validationState\` is \`"warning"\`.
  */
 warningMessage?: string
 /**
@@ -6413,15 +6428,19 @@ className?: string
  */
 style?: React.CSSProperties
 /**
- * The description to display below the input.
+ * The description to display below the input. Hidden while an \`errorMessage\`
+ * or \`warningMessage\` is shown.
  */
 description?: string
 /**
- * The error message to display when the input is in an error state.
+ * The error message to display below the input, in place of the \`description\`
+ * and \`warningMessage\`. Setting it also puts the input in the error state.
  */
 errorMessage?: string
 /**
- * The warning message to display when the input is in a warning state.
+ * The warning message to display below the input, in place of the
+ * \`description\`. An \`errorMessage\` takes precedence over it. \`FileInput\`
+ * shows it only while \`validationState\` is \`"warning"\`.
  */
 warningMessage?: string
 /**
@@ -7210,8 +7229,8 @@ export const TestComponent = ({
  );
 };`},similarTo:[],figmaUrl:null},Dialog:{id:"core-overlays-dialog",breadcrumb:"Core/Overlays/Dialog",importStatement:'import { Dialog, DialogExample, DialogSizesExample } from "@baseline-ui/core";',description:"`Dialog` is a modal overlay that interrupts the user's flow to present focused content or require a decision. Use it for tasks that must be completed or acknowledged before returning to the underlying view.",documentation:`\`Dialog\` is a modal overlay that interrupts the user's flow to present focused content or require a decision. Use it for tasks that must be completed or acknowledged before returning to the underlying view.
 
-* Exposed to assistive technologies as a \`dialog\` using ARIA \`role="dialog"\`. The content outside the dialog is hidden from assistive technologies to prevent it from being read while the dialog is open.
-* Focus is moved into the dialog on mount, and restored to the trigger element on unmount. While open, focus is contained within the dialog, preventing the user from tabbing outside.
+* Exposed to assistive technologies as a \`dialog\` using ARIA \`role="dialog"\`. Inside \`ModalContent\`, the content outside the dialog is hidden from assistive technologies to prevent it from being read while the dialog is open.
+* Focus moves into the dialog when it opens. Rendered inside \`ModalContent\`, focus is also contained within the dialog while it is open and restored to the trigger when it closes; a \`Dialog\` rendered on its own does neither.
 
 \`\`\`jsx
 import {
@@ -7246,12 +7265,12 @@ The \`Dialog\` component has two variants: \`primary\` and \`ghost\`
 * [Primary](/story/core-overlays-dialog--basic)
 * [Ghost](/story/core-overlays-dialog--ghost)
 
-By default, the \`Dialog\` component traps focus within the dialog. This means that when the dialog is open, focus is contained within the dialog. This prevents the user from tabbing outside the dialog.
+The focus trap comes from \`ModalContent\`, not from \`Dialog\` itself. Inside \`ModalContent\`, focus is contained within the dialog while it is open, so the user cannot tab outside it, and returns to the trigger when it closes. Set \`disableFocusManagement\` on \`ModalContent\` to turn both off.
 
 | Key | Function |
-| -------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
-| <kbd>Esc</kbd> | Close the dialog |
-| <kbd>Tab</kbd> | Move focus to the next focusable element in the dialog. If focus is on the last element, move focus to the first focusable element. |`,props:`interface DialogProps {
+| -------------- | ------------------------------------------------------------------------------------------------------------------------------ |
+| <kbd>Esc</kbd> | Close the dialog. Handled by \`ModalContent\`; set \`isKeyboardDismissDisabled\` on it to turn this off. |
+| <kbd>Tab</kbd> | Move focus to the next focusable element in the dialog. Inside \`ModalContent\`, focus wraps from the last element to the first. |`,props:`interface DialogProps {
 /**
  * @deprecated Do not use in new components. This is a legacy block
  * identifier; new components should exclude it via
@@ -7352,6 +7371,9 @@ export const DialogExample: React.FC<{
  imageOnlyTitle?: boolean;
  titleStyle?: React.CSSProperties;
  remountTitleOnRename?: boolean;
+ remountTitleWrapperOnRename?: boolean;
+ titleId?: string;
+ initialTitle?: string;
 }> = ({
  modalProps,
  contentProps,
@@ -7361,8 +7383,12 @@ export const DialogExample: React.FC<{
  titleStyle,
  remountTitleOnRename,
  imageOnlyTitle,
+ titleId,
+ remountTitleWrapperOnRename,
+ initialTitle = "Dialog Title",
 }) => {
- const [title, setTitle] = useState("Dialog Title");
+ const [title, setTitle] = useState(initialTitle);
+ const TitleWrapper = remountTitleWrapperOnRename ? Box : React.Fragment;
  return (
  <Modal {...modalProps}>
  <ModalTrigger>
@@ -7376,6 +7402,7 @@ export const DialogExample: React.FC<{
  "PSPDFKit-Dialog",
  )}
  >
+ <TitleWrapper key={remountTitleWrapperOnRename ? title : undefined}>
  <DialogTitle style={{ marginBottom: 10, ...titleStyle }}>
  {imageOnlyTitle ? (
  <h3>
@@ -7388,6 +7415,7 @@ export const DialogExample: React.FC<{
  ) : (
  <Text
  key={remountTitleOnRename ? title : undefined}
+ id={titleId}
  className="PSPDFKit-Title"
  type="title"
  elementType="h3"
@@ -7396,6 +7424,7 @@ export const DialogExample: React.FC<{
  </Text>
  )}
  </DialogTitle>
+ </TitleWrapper>
 
  {renamedTitle ? (
  <ActionButton
@@ -7595,7 +7624,7 @@ The \`description\` prop is optional. When omitted or set to an empty string, th
 </Disclosure>
 \`\`\`
 
-The disclosure can be disabled using the \`isDisabled\` prop. When disabled, the disclosure cannot be toggled and appears in a disabled state:
+The disclosure can be disabled using the \`isDisabled\` prop. When disabled, the header button is disabled and the disclosure cannot be toggled. It has no separate disabled styling:
 
 \`\`\`jsx
 <Disclosure
@@ -7615,13 +7644,13 @@ The disclosure can be disabled using the \`isDisabled\` prop. When disabled, the
 You can provide a custom icon component to replace the default icon for a variant:
 
 \`\`\`jsx
-import { CustomIcon } from "@baseline-ui/icons/16";
+import { EllipseIcon } from "@baseline-ui/icons/16";
 
 <Disclosure
  variant="active"
  title="Custom Status"
  description="Using a custom icon"
- icon={CustomIcon}
+ icon={EllipseIcon}
 >
  <Box padding="lg" display="flex" flexDirection="column" gap="sm">
  <Text type="label" size="sm">
@@ -8068,7 +8097,7 @@ export const TruncatedTitleDisclosure: React.FC = () => {
  </Disclosure>
  </div>
  );
-};`},similarTo:[],figmaUrl:null},Drawer:{id:"core-overlays-drawer",breadcrumb:"Core/Overlays/Drawer",importStatement:'import { Drawer } from "@baseline-ui/core";',description:"`Drawer` is a dialog panel that hosts secondary content or actions; inside a `Modal` with `enableDrawer` it slides in from the edge of the screen. Use it for tasks like editing details, viewing settings, or filtering, where the user should stay anchored to the main view.",documentation:'`Drawer` is a dialog panel that hosts secondary content or actions; inside a `Modal` with `enableDrawer` it slides in from the edge of the screen. Use it for tasks like editing details, viewing settings, or filtering, where the user should stay anchored to the main view.\n\n* Exposed to assistive technologies as a `dialog` using ARIA `role="dialog"`, labelled by its title.\n* Focus is moved to the dialog on mount.\n* `Drawer` on its own is not modal: content outside it stays available to assistive technologies, focus can leave it, and focus is not restored on unmount. Render it inside a `Modal` (a `Dialog` with `inheritDrawer` in a `ModalContent` with `enableDrawer`) to get those behaviours.\n\n```jsx\nimport { Drawer } from "@baseline-ui/core";\n\n<Drawer title="Drawer Title" onCloseRequest={() => {}}>\n <div>Drawer Content</div>\n</Drawer>;\n```\n\nThis component has two background variants: `medium` and `subtle`. The `medium` variant is used for the default background, and the `subtle` variant is used for the background.\n\nThe `Drawer` component can have an additional action button that is displayed at the top of the drawer. This button is used to perform an action, such as saving or submitting the content in the drawer.\n\nThe `Drawer` component can have different types of dialogs, such as `dialog` and `alertdialog`. The `dialog` type is used for dialogs that require user input, and the `alertdialog` type is used for dialogs that require user attention. The default\ntype is `dialog`.\n\n```jsx\n<Drawer title="Drawer Title" type="alertdialog" onCloseRequest={() => {}}>\n <div>Dialog Content</div>\n</Drawer>\n```',props:`interface DrawerProps {
+};`},similarTo:[],figmaUrl:null},Drawer:{id:"core-overlays-drawer",breadcrumb:"Core/Overlays/Drawer",importStatement:'import { Drawer } from "@baseline-ui/core";',description:"`Drawer` is a dialog panel that hosts secondary content or actions; inside a `Modal` with `enableDrawer` it slides in from the edge of the screen. Use it for tasks like editing details, viewing settings, or filtering, where the user should stay anchored to the main view.",documentation:'`Drawer` is a dialog panel that hosts secondary content or actions; inside a `Modal` with `enableDrawer` it slides in from the edge of the screen. Use it for tasks like editing details, viewing settings, or filtering, where the user should stay anchored to the main view.\n\n* Exposed to assistive technologies as a `dialog` by default (see [Dialog Roles](#dialog-roles)), labelled by its title.\n* Focus is moved to the dialog on mount.\n* `Drawer` on its own is not modal: content outside it stays available to assistive technologies, focus can leave it, and focus is not restored on unmount. Render it inside a `Modal` (a `Dialog` with `inheritDrawer` in a `ModalContent` with `enableDrawer`) to get those behaviours.\n\n```jsx\nimport { Drawer } from "@baseline-ui/core";\n\n<Drawer title="Drawer Title" onCloseRequest={() => {}}>\n <div>Drawer Content</div>\n</Drawer>;\n```\n\nThis component has two background variants: `medium` and `subtle`. The `medium` variant is used for the default background, and the `subtle` variant is used for the background.\n\nThe `Drawer` component can have an additional action button that is displayed at the top of the drawer. This button is used to perform an action, such as saving or submitting the content in the drawer.\n\nThe `role` prop sets the accessibility role of the drawer to `dialog` or `alertdialog`. Use `dialog` for drawers that require user input, and `alertdialog` for drawers that require user attention. The default role is `dialog`. An `alertdialog` drawer is not described by its content automatically, so point `aria-describedby` at the message.\n\n```jsx\n<Drawer\n title="Drawer Title"\n role="alertdialog"\n aria-describedby="drawer-message"\n onCloseRequest={() => {}}\n>\n <div id="drawer-message">Dialog Content</div>\n</Drawer>\n```',props:`interface DrawerProps {
 /**
  * @deprecated Do not use in new components. This is a legacy block
  * identifier; new components should exclude it via
@@ -9635,15 +9664,19 @@ export const HeadlessHtmlStylesDemo: React.FC = () => (
  </Box>
 );`},similarTo:[],figmaUrl:null},FileInput:{id:"core-forms-fileinput",breadcrumb:"Core/Forms/FileInput",importStatement:'import { FileInput, VariantViewer } from "@baseline-ui/core";',description:"`FileInput` is a form control for selecting one or more files from the user's device. It pairs a primary button with a read-only display of the chosen file name and supports labels, helper text, validation states, and accessibility hooks consistent with `TextInput`.",documentation:'`FileInput` is a form control for selecting one or more files from the user\'s device. It pairs a primary button with a read-only display of the chosen file name and supports labels, helper text, validation states, and accessibility hooks consistent with `TextInput`.\n\n* Built on top of [React Aria\'s `FileTrigger`](https://react-spectrum.adobe.com/react-aria/FileTrigger.html), so it works with mouse, touch, and keyboard.\n* Only the button is interactive \u2014 the label, file name, and helper text are visual and wired into the button via `aria-describedby` for assistive technology.\n* Accepts an array of MIME types or file extensions via `acceptedFileTypes`, and an `allowsMultiple` flag for selecting more than one file.\n* Supports directory selection ([`acceptDirectory`](https://react-spectrum.adobe.com/react-aria/FileTrigger.html#directory-selection)) and mobile capture ([`defaultCamera`](https://react-spectrum.adobe.com/react-aria/FileTrigger.html#media-capture)) via the underlying `FileTrigger`.\n* Renders helper, warning, and error messages with the same precedence rules as the rest of the form components: error > warning > description.\n\n```jsx\nimport { FileInput } from "@baseline-ui/core";\n\n<FileInput\n label="Attachment"\n description="Supports .mov and .mp4"\n acceptedFileTypes={[".mov", ".mp4"]}\n onValueChange={(files) => console.log(files)}\n/>;\n```\n\nIf you need a drag-and-drop drop zone instead of a button trigger, use [`ImageDropZone`](/story/core-forms-imagedropzone--basic) or [`FileUploader`](/story/core-forms-fileuploader--default).\n\nPass a visible `label` for sighted users; the label is wired into the button\'s accessible description so it is announced on focus.\n\n```jsx\n<FileInput label="Attachment" description="Supports .mov and .mp4" />\n```\n\nBy default the label sits above the field. Pass `labelPosition="start"` to align it inline.\n\n```jsx\n<FileInput label="Attachment" labelPosition="start" />\n```\n\nIf the field is described by surrounding context, omit `label`. The button\'s intrinsic name (`buttonLabel`, "Choose file" by default) is still announced.\n\n```jsx\n<FileInput aria-label="Upload a file" />\n```\n\nSet `allowsMultiple` to allow more than one file. The display switches to an aggregate `"N files"` count once more than one file is selected.\n\n```jsx\n<FileInput label="Attachments" allowsMultiple onValueChange={setFiles} />\n```\n\nPass an array of MIME types or file extensions to `acceptedFileTypes`.\n\n```jsx\n<FileInput\n label="Avatar"\n acceptedFileTypes={["image/png", "image/jpeg"]}\n onValueChange={setAvatar}\n/>\n```\n\nSet `acceptDirectory` to let users pick a folder. The browser forwards every file inside the chosen directory to `onValueChange`.\n\n```jsx\n<FileInput label="Upload folder" acceptDirectory onValueChange={setFiles} />\n```\n\nSet `defaultCamera="user"` (front-facing) or `"environment"` (rear-facing) to hint that the picker should open the device\'s camera on mobile.\n\n```jsx\n<FileInput\n label="Take a photo"\n acceptedFileTypes={["image/*"]}\n defaultCamera="environment"\n/>\n```\n\nSet `autoFocus` to focus the button on mount \u2014 useful in dialogs or multi-step flows.\n\n```jsx\n<FileInput label="Attachment" autoFocus />\n```\n\nOverride `buttonLabel` and `placeholder` for non-English copy or domain-specific wording.\n\n```jsx\n<FileInput\n label="Avatar"\n buttonLabel="Browse..."\n placeholder="Drop an image here"\n/>\n```\n\nPass `validationState="warning"` and a `warningMessage` to show a non-blocking advisory.\n\n```jsx\n<FileInput\n label="Attachment"\n validationState="warning"\n warningMessage="This file format is uncommon \u2014 make sure it is supported."\n/>\n```\n\nSetting `errorMessage` flips the field into the error state and replaces the helper text. The error message takes precedence over both `description` and `warningMessage`.\n\n```jsx\n<FileInput label="Attachment" errorMessage="Please choose a supported file." />\n```\n\nDisable the field with `isDisabled`. The button cannot be activated and the displayed file name uses the disabled text color.\n\n```jsx\n<FileInput label="Attachment" isDisabled />\n```\n\n`FileInput` exposes a single callback for handling the selection:\n\n| Prop | Signature | When to use |\n| --------------- | ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| `onValueChange` | `(files: File[]) => void` | Receives the parsed file list directly. When `allowsMultiple` is not set, the array has at most one entry. An empty array means the user opened and dismissed the file picker. |\n\n`FileInput` sets the following data attributes on the field wrapper. Use them to scope your custom styles.\n\n| Selector | Description |\n| ----------------------------------- | ---------------------------------------------------- |\n| `[data-disabled]` | Present when `isDisabled` is true. |\n| `[data-validation-state="error"]` | Present when an error message or error state is set. |\n| `[data-validation-state="warning"]` | Present when `validationState="warning"`. |\n| `.BaselineUI-FileInput` | Root element of the component. |\n\nTo style the button itself, target `.BaselineUI-FileInput button` or pass a class via `buttonClassName` / inline styles via `buttonStyle`.\n\n* Only the button is interactive; the label, file name, and helper text are visual elements wired into the button via `aria-describedby`.\n* The button keeps its own accessible name (`"Choose file"` by default), so screen readers announce the action on focus.\n* The visible `label`, the selected file name, and any helper/warning/error message are all referenced from the button\'s `aria-describedby`, so they are announced after the action label.\n* An externally supplied `aria-describedby` is merged with the internal IDs rather than replacing them.\n\n| Key | Action |\n| ----------------- | ----------------------------- |\n| `Tab` | Moves focus to the button. |\n| `Shift + Tab` | Moves focus out of the field. |\n| `Space` / `Enter` | Opens the system file picker. |',props:`interface FileInputProps {
 /**
- * The description to display below the input.
+ * The description to display below the input. Hidden while an \`errorMessage\`
+ * or \`warningMessage\` is shown.
  */
 description?: string
 /**
- * The error message to display when the input is in an error state.
+ * The error message to display below the input, in place of the \`description\`
+ * and \`warningMessage\`. Setting it also puts the input in the error state.
  */
 errorMessage?: string
 /**
- * The warning message to display when the input is in a warning state.
+ * The warning message to display below the input, in place of the
+ * \`description\`. An \`errorMessage\` takes precedence over it. \`FileInput\`
+ * shows it only while \`validationState\` is \`"warning"\`.
  */
 warningMessage?: string
 /**
@@ -9795,7 +9828,7 @@ labelPosition?: any
       ],
     }}
   />
-);`}],implementation:""},similarTo:[],figmaUrl:null},FileList:{id:"core-collections-filelist",breadcrumb:"Core/Collections/FileList",importStatement:'import { FileList, Image } from "@baseline-ui/core";',description:"FileList renders a list of files. The default `compact` variant shows each uploaded or attached file with its name, an upload-progress spinner or remove button, and an optional error state; use it to surface attachments inside forms, drawers, or upload flows. The `expanded` and `grid` variants offer files to pick instead, such as samples next to a `FileUploader`.",documentation:'FileList renders a list of files. The default `compact` variant shows each uploaded or attached file with its name, an upload-progress spinner or remove button, and an optional error state; use it to surface attachments inside forms, drawers, or upload flows. The `expanded` and `grid` variants offer files to pick instead, such as samples next to a `FileUploader`.\n\nFor collecting files, pair this with `FileUploader` or `ImageDropZone`.\n\n* Built on `UNSAFE_ListBox`, so rows are keyboard navigable and announced as listbox options\n* Per-row remove button, plus `Delete` / `Backspace` keyboard removal on the focused row\n* Loading state replaces the remove button with a `ProgressSpinner`\n* Error state with a red border, error message, and optional explanation\n* Long file names truncate with an ellipsis; the full name is exposed via `title`\n* Disabled state propagates to every remove button and blocks keyboard removal\n\n```jsx\nimport { FileList } from "@baseline-ui/core";\n\nconst items = [\n { id: "1", name: "report.pdf" },\n { id: "2", name: "photo.png" },\n];\n\nexport default function App() {\n return (\n <FileList\n aria-label="Uploaded files"\n items={items}\n onRemove={(id) => console.log("remove", id)}\n />\n );\n}\n```\n\nWhen `items` is empty, FileList renders nothing \u2014 render an empty-state component yourself if you need one.\n\nA `compact` row can appear in three primary states: default, loading, and error. The states can be mixed across items in a single list.\n\nSet `isLoading` on an item to show a spinner instead of the remove button while the upload is in flight. Keyboard removal (`Delete` / `Backspace`) is suppressed on loading rows.\n\n```jsx\n<FileList\n aria-label="Uploaded files"\n items={[\n { id: "1", name: "uploading.zip", isLoading: true },\n { id: "2", name: "done.pdf" },\n ]}\n onRemove={handleRemove}\n/>\n```\n\nSet `errorMessage` (and optionally `errorExplanation`) on an item to render the row in the error state. The row gets a red border and the messages appear below the file name. The remove button stays visible so the user can clear the failed item.\n\n```jsx\n<FileList\n aria-label="Uploaded files"\n items={[\n {\n id: "1",\n name: "too-large.mp4",\n errorMessage: "Upload failed",\n errorExplanation: "File exceeds the 50 MB limit.",\n },\n ]}\n onRemove={handleRemove}\n/>\n```\n\nPass `disabledKeys="all"` to disable removal across every row, or an iterable of item ids to disable specific rows. Both the per-row remove button and `Delete` / `Backspace` keyboard removal are suppressed for disabled rows; loading rows keep their spinner. In the `expanded` and `grid` variants, disabled items are dimmed and cannot be picked with `onAction`.\n\n```jsx\n<FileList aria-label="Uploaded files" items={items} disabledKeys="all" />\n```\n\nFile names that exceed the row width truncate with an ellipsis. The full name is exposed via the `title` attribute and read by assistive technologies, so it is recoverable on hover and through screen readers.\n\n`variant="expanded"` renders each item as a card with a file icon, its name, a\n`description` and an optional `tag`; `variant="grid"` renders preview tiles with\nthe item\'s `preview` (typically an `Image`), name and `description`. Use them to\noffer files to pick, such as samples next to a `FileUploader`, and handle the\npick in `onAction`. They do not render the remove button, spinner or error\nmessages of the default `compact` variant.\n\n```jsx\n<FileList\n variant="grid"\n label="Or start from a sample"\n items={[\n { id: "invoice", name: "Invoice", description: "2 pages" },\n {\n id: "medical-bill",\n name: "Medical bill",\n preview: <Image src="/medical-bill.png" alt="Medical bill preview" />,\n },\n ]}\n onAction={loadSample}\n/>\n```\n\nA `tag` is a `label` and an optional `variant`, such as\n`{ label: "Compliant", variant: "green" }`. An `Image` preview that fails to load shows the file\nicon. `label` renders a title above the list that also names it for assistive\ntechnology.\n\nLong lists scroll so the content around them stays in view: `expanded` shows\nabout five rows, and `grid` about two, with up to six tiles per row.\n\nEach item is named by its file name and described by its `description` and\n`tag`. In `grid`, `ArrowLeft` and `ArrowRight` move between tiles in a row, and\n`ArrowUp` and `ArrowDown` move between rows.\n\nProvide `label`, `aria-label` or `aria-labelledby` so the listbox has an accessible name. `aria-labelledby` points to the id of an existing visible label.\n\n```jsx\n<>\n <span id="attachments-label">Attached files</span>\n <FileList aria-labelledby="attachments-label" items={items} />\n</>\n```\n\n| Selector | Description |\n| ----------------------------- | ------------------------------------------ |\n| `.BaselineUI-FileList` | Root element wrapping the listbox. |\n| `[role="option"][data-key]` | A row. `data-key` matches the item\'s `id`. |\n| `[data-focus-visible="true"]` | Row currently showing the focus ring. |\n| `[data-disabled="true"]` | Row that is currently disabled. |\n\n| Key | Function |\n| -------------------------- | ---------------------------------------------- |\n| `Tab` / `Shift+Tab` | Moves focus into and out of the list. |\n| `ArrowUp` / `ArrowDown` | Moves focus between rows. |\n| `ArrowLeft` / `ArrowRight` | In `grid`, moves focus between tiles in a row. |\n| `Home` / `End` | Moves focus to the first or last row. |\n| `Delete` | Removes the focused row (calls `onRemove`). |\n| `Backspace` | Removes the focused row (calls `onRemove`). |\n\nThe remove button is excluded from the tab order \u2014 keyboard users delete rows by focusing the row and pressing `Delete` or `Backspace`, while pointer users click the row\'s remove button. `Delete` / `Backspace` are suppressed when the focused item is disabled (via `disabledKeys`) or loading.\n\n* `FileUploader` \u2014 picker / drop target that produces files to render here.\n* `ImageDropZone` \u2014 a dedicated drop target specialized for images.\n* `UNSAFE_ListBox` \u2014 the underlying listbox primitive.',props:`interface FileListProps {
+);`}],implementation:""},similarTo:[],figmaUrl:null},FileList:{id:"core-collections-filelist",breadcrumb:"Core/Collections/FileList",importStatement:'import { FileList, Image } from "@baseline-ui/core";',description:"FileList renders a list of files. The default `compact` variant shows each uploaded or attached file with its name, an upload-progress spinner or remove button, and an optional error state; use it to surface attachments inside forms, drawers, or upload flows. The `expanded` and `grid` variants offer files to pick instead, such as samples next to a `FileUploader`.",documentation:'FileList renders a list of files. The default `compact` variant shows each uploaded or attached file with its name, an upload-progress spinner or remove button, and an optional error state; use it to surface attachments inside forms, drawers, or upload flows. The `expanded` and `grid` variants offer files to pick instead, such as samples next to a `FileUploader`.\n\nFor collecting files, pair this with `FileUploader` or `ImageDropZone`.\n\n* Built on `UNSAFE_ListBox`, so rows are keyboard navigable and announced as listbox options\n* Per-row remove button, plus `Delete` / `Backspace` keyboard removal on the focused row\n* Optional `description` under each file name, such as a status or page count\n* Loading state replaces the remove button with a `ProgressSpinner`\n* Error state with a red border, error message, and optional explanation\n* Long file names truncate with an ellipsis; the full name is exposed via `title`\n* Disabled state propagates to every remove button and blocks keyboard removal\n\n```jsx\nimport { FileList } from "@baseline-ui/core";\n\nconst items = [\n { id: "1", name: "report.pdf" },\n { id: "2", name: "photo.png" },\n];\n\nexport default function App() {\n return (\n <FileList\n aria-label="Uploaded files"\n items={items}\n onRemove={(id) => console.log("remove", id)}\n />\n );\n}\n```\n\nWhen `items` is empty, FileList renders nothing \u2014 render an empty-state component yourself if you need one.\n\nA `compact` row can appear in three primary states: default, loading, and error. The states can be mixed across items in a single list.\n\nSet `isLoading` on an item to show a spinner instead of the remove button while the upload is in flight. Keyboard removal (`Delete` / `Backspace`) is suppressed on loading rows.\n\n```jsx\n<FileList\n aria-label="Uploaded files"\n items={[\n { id: "1", name: "uploading.zip", isLoading: true },\n { id: "2", name: "done.pdf" },\n ]}\n onRemove={handleRemove}\n/>\n```\n\nSet `errorMessage` (and optionally `errorExplanation`) on an item to render the row in the error state. The row gets a red border and the messages appear below the file name. The remove button stays visible so the user can clear the failed item.\n\n```jsx\n<FileList\n aria-label="Uploaded files"\n items={[\n {\n id: "1",\n name: "too-large.mp4",\n errorMessage: "Upload failed",\n errorExplanation: "File exceeds the 50 MB limit.",\n },\n ]}\n onRemove={handleRemove}\n/>\n```\n\nPass `disabledKeys="all"` to disable removal across every row, or an iterable of item ids to disable specific rows. Both the per-row remove button and `Delete` / `Backspace` keyboard removal are suppressed for disabled rows; loading rows keep their spinner. In the `expanded` and `grid` variants, disabled items are dimmed and cannot be picked with `onAction`.\n\n```jsx\n<FileList aria-label="Uploaded files" items={items} disabledKeys="all" />\n```\n\nFile names that exceed the row width truncate with an ellipsis. The full name is exposed via the `title` attribute and read by assistive technologies, so it is recoverable on hover and through screen readers.\n\nAn item\'s `description` is shown under its name, such as a status or page count,\nand read as the row\'s accessible description, ahead of any error text.\n\n`variant="expanded"` renders each item as a card with a file icon, its name, a\n`description` and an optional `tag`; `variant="grid"` renders preview tiles with\nthe item\'s `preview` (typically an `Image`), name and `description`. Use them to\noffer files to pick, such as samples next to a `FileUploader`, and handle the\npick in `onAction`. They do not render the remove button, spinner or error\nmessages of the default `compact` variant.\n\n```jsx\n<FileList\n variant="grid"\n label="Or start from a sample"\n items={[\n { id: "invoice", name: "Invoice", description: "2 pages" },\n {\n id: "medical-bill",\n name: "Medical bill",\n preview: <Image src="/medical-bill.png" alt="Medical bill preview" />,\n },\n ]}\n onAction={loadSample}\n/>\n```\n\nA `tag` is a `label` and an optional `variant`, such as\n`{ label: "Compliant", variant: "green" }`. An `Image` preview that fails to load shows the file\nicon. `label` renders a title above the list that also names it for assistive\ntechnology.\n\nLong lists scroll so the content around them stays in view: `expanded` shows\nabout five rows, and `grid` about two, with up to six tiles per row.\n\nEach item is named by its file name and described by its `description` and\n`tag`. In `grid`, `ArrowLeft` and `ArrowRight` move between tiles in a row, and\n`ArrowUp` and `ArrowDown` move between rows.\n\nProvide `label`, `aria-label` or `aria-labelledby` so the listbox has an accessible name. `aria-labelledby` points to the id of an existing visible label.\n\n```jsx\n<>\n <span id="attachments-label">Attached files</span>\n <FileList aria-labelledby="attachments-label" items={items} />\n</>\n```\n\n| Selector | Description |\n| ----------------------------- | ------------------------------------------ |\n| `.BaselineUI-FileList` | Root element wrapping the listbox. |\n| `[role="option"][data-key]` | A row. `data-key` matches the item\'s `id`. |\n| `[data-focus-visible="true"]` | Row currently showing the focus ring. |\n| `[data-disabled="true"]` | Row that is currently disabled. |\n\n| Key | Function |\n| -------------------------- | ---------------------------------------------- |\n| `Tab` / `Shift+Tab` | Moves focus into and out of the list. |\n| `ArrowUp` / `ArrowDown` | Moves focus between rows. |\n| `ArrowLeft` / `ArrowRight` | In `grid`, moves focus between tiles in a row. |\n| `Home` / `End` | Moves focus to the first or last row. |\n| `Delete` | Removes the focused row (calls `onRemove`). |\n| `Backspace` | Removes the focused row (calls `onRemove`). |\n\nThe remove button is excluded from the tab order \u2014 keyboard users delete rows by focusing the row and pressing `Delete` or `Backspace`, while pointer users click the row\'s remove button. `Delete` / `Backspace` are suppressed when the focused item is disabled (via `disabledKeys`) or loading.\n\n* `FileUploader` \u2014 picker / drop target that produces files to render here.\n* `ImageDropZone` \u2014 a dedicated drop target specialized for images.\n* `UNSAFE_ListBox` \u2014 the underlying listbox primitive.',props:`interface FileListProps {
 /**
  * The className applied to the root element.
  */
@@ -9807,8 +9840,8 @@ style?: React.CSSProperties
 /**
  * How the items are rendered.
  * 
- * - \`compact\` (default): divided rows with a file icon and name, for files
- *   the user has added. The only variant that renders the remove button,
+ * - \`compact\` (default): divided rows with a file icon, name and
+ *   \`description\`, for files the user has added. The only variant that renders the remove button,
  *   the loading spinner and error messages.
  * - \`expanded\`: bordered cards with the name, \`description\` and \`tag\`.
  *   Past about five rows the list scrolls.
@@ -9989,6 +10022,21 @@ removeHintLabel?: string | ((values: { fileName: string }) => string)
               setItems((current) => current.filter((item) => item.id !== id));
             }} />
     );
+};`},{id:"core-collections-filelist--with-description",name:"With Description",snippet:`const WithDescription = () => {
+    const [items, setItems] = React.useState(args.items);
+    React.useEffect(() => {
+      setItems(args.items);
+    }, [args.items]);
+
+    return (
+        <FileList
+            aria-label="Uploaded files"
+            items={items}
+            onRemove={(id) => {
+              args.onRemove?.(id);
+              setItems((current) => current.filter((item) => item.id !== id));
+            }} />
+    );
 };`},{id:"core-collections-filelist--expanded",name:"Expanded",snippet:`const Expanded = () => {
     const [items, setItems] = React.useState(args.items);
     React.useEffect(() => {
@@ -10722,10 +10770,10 @@ You can specify a container element to constrain overlays within:
 
 \`\`\`tsx
 function App() {
- const [container, setContainer] = useState(null);
+ const [container, setContainer] = useState<HTMLDivElement | null>(null);
  return (
  <FrameProvider container={container} shouldContainOverlays="always">
- <div ref={setContainer}>
+ <div ref={setContainer} style={{ position: "relative" }}>
  <YourContent />
  </div>
  </FrameProvider>
@@ -10743,19 +10791,25 @@ The \`shouldContainOverlays\` prop controls how overlays are contained:
 
 You can find the demo for this [here](/story/core-utilities-frameprovider--never-contained).
 
-FrameProvider supports nesting, allowing you to create hierarchical overlay containment:
+FrameProvider supports nesting, allowing you to create hierarchical overlay containment. Each level needs its own positioned \`container\`; without one, a \`FrameProvider\` falls back to the document body and contains nothing:
 
 \`\`\`tsx
-<FrameProvider shouldContainOverlays="always">
- <div>
+function App() {
+ const [outer, setOuter] = useState<HTMLDivElement | null>(null);
+ const [inner, setInner] = useState<HTMLDivElement | null>(null);
+ return (
+ <FrameProvider container={outer} shouldContainOverlays="always">
+ <div ref={setOuter} style={{ position: "relative" }}>
  <OuterContent />
- <FrameProvider shouldContainOverlays="always">
- <div>
+ <FrameProvider container={inner} shouldContainOverlays="always">
+ <div ref={setInner} style={{ position: "relative" }}>
  <InnerContent />
  </div>
  </FrameProvider>
  </div>
-</FrameProvider>
+ </FrameProvider>
+ );
+}
 \`\`\`
 
 You can find the demo for this [here](/story/core-utilities-frameprovider--nested-containers).
@@ -10785,7 +10839,7 @@ function ContainerInfo() {
 }
 
 function App() {
- const [container, setContainer] = useState(null);
+ const [container, setContainer] = useState<HTMLDivElement | null>(null);
  return (
  <FrameProvider container={container} shouldContainOverlays="always">
  <div
@@ -10832,7 +10886,9 @@ data-block-class?: string
  */
 children: React.ReactNode
 /**
- * The container inside which all the overlays should be confined to
+ * The container inside which all the overlays should be confined to. It must
+ * be positioned (not \`position: static\`). Without it, the document body is
+ * used and overlays are not contained.
  */
 container?: HTMLElement | null
 /**
@@ -11700,6 +11756,17 @@ export const FreehandCanvasWithHint = (props: FreehandCanvasProps) => (
  <p id="freehand-canvas-hint">Sign inside the box.</p>
  <FreehandCanvas {...props} />
  </>
+);
+
+export const FreehandCanvasPair = (props: FreehandCanvasProps) => (
+ <>
+ <FreehandCanvas aria-label="Defaults" defaultValue={defaultValue} />
+ <FreehandCanvas
+ aria-label="Custom"
+ defaultValue={defaultValue}
+ {...props}
+ />
+ </>
 );`},similarTo:[],figmaUrl:null},GridList:{id:"core-collections-gridlist",breadcrumb:"Core/Collections/GridList",importStatement:'import { DynamicGridListExample, GridList } from "@baseline-ui/core";',description:"`GridList` displays a collection of items in a single column or row with support for selection, interactive children, and arrow-key navigation. Use it when you need a keyboard-navigable list whose rows can contain buttons, checkboxes, or other controls.",documentation:`\`GridList\` displays a collection of items in a single column or row with support for selection, interactive children, and arrow-key navigation. Use it when you need a keyboard-navigable list whose rows can contain buttons, checkboxes, or other controls.
 
 * **Item Selection**: Single or multiple selections with optional checkboxes.
@@ -12538,7 +12605,7 @@ import { ImageDropZone } from "@baseline-ui/core";
 />;
 \`\`\`
 
-The \`ImageDropZone\` component can be initialized with a default image by passing in the \`defaultImageSrc\` prop. This prop accepts a string value that represents the image source.
+The \`ImageDropZone\` component can be initialized with a default image by passing in the \`defaultImageSrc\` prop. This prop accepts an image URL string or a \`File\`.
 
 \`\`\`jsx
 <ImageDropZone
@@ -12550,8 +12617,8 @@ The \`ImageDropZone\` component can be initialized with a default image by passi
 />
 \`\`\`
 
-You can control the \`ImageDropZone\` component by passing in the \`imageSrc\` prop. This prop accepts a string value that represents the image source.
-If you pass this, the \`ImageDropZone\` component will render the image in the drop zone and will not allow the user to upload any other images.
+You can control the \`ImageDropZone\` component by passing in the \`imageSrc\` prop. This prop accepts an image URL string or a \`File\`.
+The drop zone always shows \`imageSrc\`: picking, dropping, pasting or clearing an image calls \`onValueChange\`, and the new image appears only once you pass the reported file back as \`imageSrc\`.
 
 \`\`\`jsx
 <ImageDropZone
@@ -12657,6 +12724,12 @@ description?: string
  * The accepted file types, passed through to the underlying
  * \`<input type="file">\` \`accept\` attribute \u2014 a comma-separated list of MIME
  * types and/or extensions (e.g. \`"image/png,image/jpeg"\` or \`"image/*"\`).
+ * Dropped, pasted and selected files are all checked against it; a file that
+ * does not match calls \`onFileTypeError\` and is not used. A file the browser
+ * reports no MIME type for matches any MIME token, so its name is only
+ * checked when \`accept\` lists extensions alone.
+ * 
+ * @default "image/*"
  */
 accept?: string
 /**
@@ -12664,7 +12737,9 @@ accept?: string
  */
 name?: string
 /**
- * The callback function that is fired when the value changes.
+ * The \`change\` event of the file input, fired when the user picks a file in
+ * the file dialog. It does not fire for a drop, a paste or a clear; use
+ * \`onValueChange\` for every change of the image.
  */
 onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void
 /**
@@ -12684,8 +12759,9 @@ aria-describedby?: string
 defaultImageSrc?: string | File
 /**
  * The image to display. This will be used as the \`src\` attribute of the
- * \`<img>\` element and will not be able to be changed from within the
- * component. Basically, this makes the component controlled.
+ * \`<img>\` element and makes the component controlled: picking, dropping,
+ * pasting or clearing an image calls \`onValueChange\`, and the shown image
+ * changes only when you update \`imageSrc\`.
  */
 imageSrc?: string | File
 /**
@@ -12709,6 +12785,8 @@ pickerButtonLabel?: string
 includeCheckeredBackground?: boolean
 /**
  * Whether the component is inlined.
+ * 
+ * @default true
  */
 isInline?: boolean
 /**
@@ -12858,7 +12936,28 @@ export const KeyboardDragImageDropZoneExample: React.FC<
  <Draggable onDragEnd={onDragEnd} />
  <ImageDropZone pickerButtonLabel="Upload" aria-label="Image" {...props} />
  </>
-);`},similarTo:[],figmaUrl:null},ImageGallery:{id:"core-collections-imagegallery",breadcrumb:"Core/Collections/ImageGallery",importStatement:`import {
+);
+
+export const FormImageDropZoneExample: React.FC<ImageDropZoneProps> = (
+ props,
+) => {
+ const [keptFiles, setKeptFiles] = React.useState<FileList | null>(null);
+
+ return (
+ <form>
+ <ImageDropZone
+ pickerButtonLabel="Upload"
+ aria-label="Image"
+ name="avatar"
+ onChange={(e) => {
+ setKeptFiles(e.target.files);
+ }}
+ {...props}
+ />
+ <output aria-label="Kept files">{keptFiles?.length ?? 0}</output>
+ </form>
+ );
+};`},similarTo:[],figmaUrl:null},ImageGallery:{id:"core-collections-imagegallery",breadcrumb:"Core/Collections/ImageGallery",importStatement:`import {
     Box,
     ControlledImageGalleryExample,
     CustomSizeImageGalleryExample,
@@ -12868,61 +12967,7 @@ export const KeyboardDragImageDropZoneExample: React.FC<
     ImageGalleryExample,
     Text,
     Virtualizer,
-} from "@baseline-ui/core";`,description:"`ImageGallery` renders a grid of selectable, reorderable thumbnails with single or multiple selection and optional deletion. Use it to manage an ordered collection of images, such as a photo album, page list, or asset picker.",documentation:`\`ImageGallery\` renders a grid of selectable, reorderable thumbnails with single or multiple selection and optional deletion. Use it to manage an ordered collection of images, such as a photo album, page list, or asset picker.
-
-* An interactive, feature-rich display platform for image content
-* Mouse, touch, and keyboard interaction support
-* Smooth image fade-in effect during load
-* Built-in support for rearranging the order of images
-* Single and multiple selection modes for images
-
-\`\`\`jsx
-import { ImageGallery } from "@baseline-ui/core";
-
-export const items = Array.from({ length: 10 }, (_, i) => {
- const index = i + 1;
-
- return {
- id: index.toString(),
- src: \`/gallery/\${index}.jpg\`,
- alt: \`Image \${index}\`,
- label: index.toString(),
- };
-});
-
-<ImageGallery defaultItems={items} />;
-\`\`\`
-
-The ImageGallery supports drag and drop operations for rearranging images. This is especially useful in scenarios where the order of images matters, like in a photo editing workflow or when creating a custom photo album. You can select an image by clicking on it, touch (on touch-enabled devices), or via keyboard (Enter key) and then move it to a new position as needed.
-
-Reordering is enabled when you pass an \`onReorder\` handler.
-
-Depending on the context, you might want to allow your users to select multiple images at once (like when bulk deleting images or adding them to a cart). Alternatively, you might only want them to select one image at a time (like choosing a profile picture). ImageGallery supports both single and multiple selection modes, providing flexibility to suit varied use cases. The Space key can be used for selecting images.
-
-You can enable single selection mode by setting the \`selectionMode\` prop to \`single\`. In this mode, only one image can be selected at a time.
-
-You can enable multiple selection mode by setting the \`selectionMode\` prop to \`multiple\`. In this mode, multiple images can be selected at once.
-
-You can enable deletion by passing a function to the \`onDelete\` prop. This function will be called when the user deletes an image. The function receives the ids of the images to be deleted as an argument.
-
-You can provide a custom size for the images by passing a number to the \`imageWidth\` prop.
-
-You can use the \`items\` prop to control the gallery. This is useful when you need to manage the state of the gallery externally.
-
-The \`ImageGallery\` component optimizes long labels for touch and non-touch devices.
-
-* On touch devices, the labels are not truncated and the tooltip is not shown.
-* On non-touch devices, the labels are truncated and the tooltip is shown when the user hovers over the image. If the user is using a keyboard, the tooltip will be shown when the user focuses on the image.
-
-| Key | Description |
-| --------------- | --------------------------------------------- |
-| \`ArrowLeft\` | Navigate to previous |
-| \`ArrowRight\` | Navigate to next |
-| \`ArrowUp\` | Navigate to the image above the current image |
-| \`ArrowDown\` | Navigate to the image below the current image |
-| \`Space\` | Select the current image |
-| \`Shift + Space\` | Add current image to Selected Images |
-| \`Enter\` | Select the current image for reorder |`,props:`interface ImageGalleryProps {
+} from "@baseline-ui/core";`,description:"`ImageGallery` renders a grid of selectable, reorderable thumbnails with single or multiple selection and optional deletion. Use it to manage an ordered collection of images, such as a photo album, page list, or asset picker.",documentation:'`ImageGallery` renders a grid of selectable, reorderable thumbnails with single or multiple selection and optional deletion. Use it to manage an ordered collection of images, such as a photo album, page list, or asset picker.\n\n* An interactive, feature-rich display platform for image content\n* Mouse, touch, and keyboard interaction support\n* Smooth image fade-in effect during load\n* Built-in support for rearranging the order of images\n* Single and multiple selection modes for images\n\n```jsx\nimport { ImageGallery } from "@baseline-ui/core";\n\nexport const items = Array.from({ length: 10 }, (_, i) => {\n const index = i + 1;\n\n return {\n id: index.toString(),\n src: `/gallery/${index}.jpg`,\n alt: `Image ${index}`,\n label: index.toString(),\n };\n});\n\n<ImageGallery defaultItems={items} />;\n```\n\nThe ImageGallery supports drag and drop operations for rearranging images. This is especially useful in scenarios where the order of images matters, like in a photo editing workflow or when creating a custom photo album. You can select an image by clicking on it, touch (on touch-enabled devices), or via keyboard (Enter key) and then move it to a new position as needed.\n\nReordering is enabled when you pass an `onReorder` handler.\n\nDepending on the context, you might want to allow your users to select multiple images at once (like when bulk deleting images or adding them to a cart). Alternatively, you might only want them to select one image at a time (like choosing a profile picture). ImageGallery supports both single and multiple selection modes, providing flexibility to suit varied use cases. The Space key can be used for selecting images.\n\nYou can enable single selection mode by setting the `selectionMode` prop to `single`. In this mode, only one image can be selected at a time.\n\nYou can enable multiple selection mode by setting the `selectionMode` prop to `multiple`. In this mode, multiple images can be selected at once.\n\nYou can enable deletion by passing a function to the `onDelete` prop. This function will be called when the user deletes an image. The function receives the ids of the images to be deleted as an argument.\n\nSet the size of the images with the `imageDimensions` prop. Pass `{ width, height }` or `{ width, aspectRatio }`, where `width` is a number of pixels or `"sm"` or `"md"`. To size images by state, pass a function that receives the item and `{ isSelected }` and returns the dimensions.\n\nYou can use the `items` prop to control the gallery. This is useful when you need to manage the state of the gallery externally.\n\nThe `ImageGallery` component optimizes long labels for touch and non-touch devices.\n\n* On touch devices, the labels are not truncated and the tooltip is not shown.\n* On non-touch devices, the labels are truncated and the tooltip is shown when the user hovers over the image. If the user is using a keyboard, the tooltip will be shown when the user focuses on the image.\n\n| Key | Description |\n| --------------- | --------------------------------------------- |\n| `ArrowLeft` | Navigate to previous |\n| `ArrowRight` | Navigate to next |\n| `ArrowUp` | Navigate to the image above the current image |\n| `ArrowDown` | Navigate to the image below the current image |\n| `Space` | Select the current image |\n| `Shift + Space` | Add current image to Selected Images |\n| `Enter` | Select the current image for reorder |',props:`interface ImageGalleryProps {
 /**
  * @deprecated Do not use in new components. This is a legacy block
  * identifier; new components should exclude it via
@@ -13003,12 +13048,14 @@ defaultItems?: Item[]
 /**
  * The width of the images.
  * 
+ * @deprecated Use \`imageDimensions\` instead.
  * @default "sm"
  */
 imageWidth?: number | "sm" | "md"
 /**
  * The aspect ratio of the images.
  * 
+ * @deprecated Use \`imageDimensions\` instead.
  * @default 3 / 4
  */
 aspectRatio?: number
@@ -13059,7 +13106,7 @@ imageContainerStyle?: React.CSSProperties
 /**
  * The dimensions of the image.
  * 
- * @default { width: imageWidth, aspectRatio }
+ * @default { width: "sm", aspectRatio: 3 / 4 }
  */
 imageDimensions?: | Dimension
 | ((
@@ -13894,7 +13941,10 @@ onClose?: () => void
  */
 closeLabel?: string
 /**
- * The arrangement of the variable.
+ * How the title, description and action button are laid out: \`single\` keeps
+ * them on one row, \`multi\` and \`compact\` stack the title above the
+ * description, and \`compact\` also places the action button below the
+ * message.
  * 
  * @default "single"
  * @typedef {"single" | "multi" | "compact"} Arrangement
@@ -14639,7 +14689,10 @@ children: React.JSX.Element
 items: Item[] | ((selection: Selection | null) => Item[])
 /**
  * Callback that is called when an item is selected. The \`id\` of the selected
- * item and the current selection will be passed as arguments.
+ * item and the current selection will be passed as arguments. When the
+ * toolbar is opened by \`anchorRect\` without a text selection in its
+ * children, this is the current selection of the document or shadow root
+ * that contains the toolbar, which may be empty or lie outside the children.
  */
 onAction?: (id: string, selection: Selection) => void
 /**
@@ -14748,17 +14801,25 @@ export const items = [
  },
 ];
 
+const ContentWithoutRef = () => (
+ <div className="content">Content that does not forward its ref.</div>
+);
+
 export const InlineToolbarExample = ({
  children,
  itemsAsFunction,
+ childWithoutRef,
  ...args
 }: Partial<React.ComponentProps<typeof InlineToolbar>> & {
  itemsAsFunction?: boolean;
+ childWithoutRef?: boolean;
 }) => {
  return (
  <InlineToolbar {...args} items={itemsAsFunction ? () => items : items}>
  {React.Children.count(children) > 0 ? (
  children!
+ ) : childWithoutRef ? (
+ <ContentWithoutRef />
  ) : (
  <div className="content">
  Select the text or part of the text to see the inline toolbar.
@@ -14772,32 +14833,7 @@ export const InlineToolbarInShadowRootExample = () => (
  <ShadowRoot style={{ width: 400, height: 200 }}>
  <InlineToolbarExample />
  </ShadowRoot>
-);`},similarTo:[],figmaUrl:null},Kbd:{id:"core-content-kbd",breadcrumb:"Core/Content/Kbd",importStatement:'import { Box, Kbd } from "@baseline-ui/core";',description:"`Kbd` renders a key or keyboard shortcut as a styled keycap and adapts modifier names to the user's operating system. Use it to display hotkeys inline with text, in menus, or in help documentation.",documentation:`\`Kbd\` renders a key or keyboard shortcut as a styled keycap and adapts modifier names to the user's operating system. Use it to display hotkeys inline with text, in menus, or in help documentation.
-
-* Keycap-styled visual appearance
-* OS-aware shortcut conversion (Ctrl becomes Cmd on Mac)
-* Support for symbol mode (\u2318, \u2325, \u21E7) or text mode (Cmd, Option, Shift)
-* \`+\` separator between keys
-
-\`\`\`tsx
-import { Kbd } from "@baseline-ui/core";
-
-// Single key
-<Kbd>K</Kbd>
-
-// Key combination (auto-converts to OS format)
-<Kbd>Ctrl+K</Kbd>
-
-// With symbols
-<Kbd shouldUseSymbol>Ctrl+Shift+P</Kbd>
-\`\`\`
-
-When \`shouldUseSymbol\` is true, modifier keys are displayed as symbols:
-
-* Ctrl \u2192 \u2318
-* Alt \u2192 \u2325
-* Shift \u2192 \u21E7
-* Enter \u2192 \u21A9`,props:`interface KbdProps {
+);`},similarTo:[],figmaUrl:null},Kbd:{id:"core-content-kbd",breadcrumb:"Core/Content/Kbd",importStatement:'import { Box, Kbd } from "@baseline-ui/core";',description:"`Kbd` renders a key or keyboard shortcut as a styled keycap and adapts modifier names to the user's operating system. Use it to display hotkeys inline with text, in menus, or in help documentation.",documentation:'`Kbd` renders a key or keyboard shortcut as a styled keycap and adapts modifier names to the user\'s operating system. Use it to display hotkeys inline with text, in menus, or in help documentation.\n\n* Keycap-styled visual appearance\n* OS-aware shortcut conversion (Ctrl becomes Cmd on Mac)\n* Support for symbol mode (\u2318, \u2325, \u21E7) or text mode (Cmd, Option, Shift)\n* `+` separator between keys\n\n```tsx\nimport { Kbd } from "@baseline-ui/core";\n\n// Single key\n<Kbd>K</Kbd>\n\n// Key combination (auto-converts to OS format)\n<Kbd>Ctrl+K</Kbd>\n\n// With symbols\n<Kbd shouldUseSymbol>Ctrl+Shift+P</Kbd>\n```\n\nOn macOS, `Ctrl` and `Alt` are shown as `Cmd` and `Option` when another key follows them (`Ctrl+K`); a standalone or trailing `Ctrl` or `Alt` stays as written. When `shouldUseSymbol` is true, macOS shows these keys as symbols instead \u2014 `Enter` anywhere, the others only when another key follows:\n\n* Ctrl \u2192 \u2318\n* Alt \u2192 \u2325\n* Shift \u2192 \u21E7\n* Enter \u2192 \u21A9\n* Space \u2192 \u2423\n\nOn other platforms the shortcut is shown as written, with or without `shouldUseSymbol`.',props:`interface KbdProps {
 /**
  * The keyboard shortcut to display. Can be:
  * 
@@ -14810,8 +14846,10 @@ When \`shouldUseSymbol\` is true, modifier keys are displayed as symbols:
  */
 children: string
 /**
- * Whether to use symbols for modifier keys (e.g., "\u2318" instead of "Cmd"). Only
- * applies when the shortcut contains modifiers like Ctrl, Alt, Shift.
+ * Whether to show modifier keys as symbols (e.g., "\u2318" instead of "Cmd"). Only
+ * applies on macOS; other platforms show the shortcut as written. \`Ctrl\`,
+ * \`Alt\`, \`Shift\` and \`Space\` become symbols when another key follows them,
+ * \`Enter\` anywhere.
  * 
  * @default false
  */
@@ -15668,7 +15706,7 @@ export const ListBoxFocusLastItemExample: React.FC<{ items: ListItem[] }> = ({
  <ListBox aria-label="List box" items={items} listBoxHandle={handle} />
  </Box>
  );
-};`},similarTo:[],figmaUrl:null},Markdown:{id:"core-content-markdown",breadcrumb:"Core/Content/Markdown",importStatement:'import { Markdown } from "@baseline-ui/core";',description:"`Markdown` renders a Markdown string as styled HTML with support for [GitHub Flavored Markdown](https://github.github.com/gfm/). Use it to display authored content such as release notes, help text, or user-supplied prose.",documentation:`\`Markdown\` renders a Markdown string as styled HTML with support for [GitHub Flavored Markdown](https://github.github.com/gfm/). Use it to display authored content such as release notes, help text, or user-supplied prose.
+};`},similarTo:[],figmaUrl:null},Markdown:{id:"core-content-markdown",breadcrumb:"Core/Content/Markdown",importStatement:'import { Markdown } from "@baseline-ui/core";',description:"`Markdown` renders a [CommonMark](https://commonmark.org/) string as styled HTML, plus tables and `~~strikethrough~~`. Task lists and bare-URL autolinks are not supported, and raw HTML is shown as text. Use it to display authored content such as release notes, help text, or user-supplied prose.",documentation:`\`Markdown\` renders a [CommonMark](https://commonmark.org/) string as styled HTML, plus tables and \`~~strikethrough~~\`. Task lists and bare-URL autolinks are not supported, and raw HTML is shown as text. Use it to display authored content such as release notes, help text, or user-supplied prose.
 
 \`\`\`jsx
 import { Markdown } from "@baseline-ui/core";
@@ -15804,8 +15842,7 @@ import { CheckmarkIcon } from "@baseline-ui/icons/16";`,description:"`Menu` is a
 7. Auto-scroll: The menu automatically scrolls as the user navigates through it with their keyboard.
 8. Keyboard menu opening: The menu can be opened using the keyboard, and automatically focuses on the first or last item.
 9. Typeahead: Users can quickly navigate to a menu item by typing the first few letters of the item's label.
-10. Virtualized scrolling: For long lists, performance is improved by only rendering the visible items.
-11. Per-item customization: Options can take a class, an inline style, or a completely custom body.
+10. Per-item customization: Options can take a class, an inline style, or a completely custom body.
 
 Pass the list of options via \`items\` and a \`triggerLabel\` for the default
 \`ActionButton\` trigger. \`Menu\` renders its own trigger and popover \u2014 it does not
@@ -16608,10 +16645,10 @@ export const MenuSectionOptionClassToggleExample: React.FC<{
  );
 };`},similarTo:[],figmaUrl:null},MessageFormat:{id:"core-utilities-messageformat",breadcrumb:"Core/Utilities/MessageFormat",importStatement:'import { MessageFormat } from "@baseline-ui/core";',description:"`MessageFormat` renders a single message from the catalog supplied to `I18nProvider`. When the catalog has no entry for `id`, it renders `defaultMessage` \u2014 and when it was given no `defaultMessage` either, the `id` itself. Unlike the rest of the library, it has no English of its own to fall back on: `id` arrives at runtime, so pass a catalog covering it or a `defaultMessage` beside it.",documentation:'`MessageFormat` renders a single message from the catalog supplied to `I18nProvider`. When the catalog has no entry for `id`, it renders `defaultMessage` \u2014 and when it was given no `defaultMessage` either, the `id` itself. Unlike the rest of the library, it has no English of its own to fall back on: `id` arrives at runtime, so pass a catalog covering it or a `defaultMessage` beside it.\n\nBecause it is a component rather than a hook, it is also how a class component reaches a translation \u2014 see [From a class component](/?path=/docs/internationalization--docs#from-a-class-component).\n\n```jsx\nimport { I18nProvider, MessageFormat } from "@baseline-ui/core";\nimport en from "@baseline-ui/core/intl/en.json";\nimport fr from "@baseline-ui/core/intl/fr.json";\n\nconst App = () => (\n <I18nProvider locale="en" messages={{ en, fr }}>\n <MessageFormat id="bui.calendar.previousMonth" />\n <MessageFormat id="myApp.hello" defaultMessage="Hello!" />\n </I18nProvider>\n);\n```\n\nPassing `id` and `defaultMessage` as separate props leaves `defaultMessage` easy to omit, and an `id` nothing answers for renders as itself. Declaring the message with `defineMessages` and spreading the descriptor keeps the two together, so there is no way to pass one without the other \u2014 and the same descriptor is what the extraction pipeline reads:\n\n```jsx\nimport { defineMessages, MessageFormat } from "@baseline-ui/core";\n\nconst messages = defineMessages({\n hello: {\n id: "myApp.hello",\n defaultMessage: "Hello, {name}!",\n description: "Greeting shown at the top of the dashboard.",\n },\n});\n\n<MessageFormat {...messages.hello} values={{ name: "Ada" }} />;\n```\n\n`description` is translator context; it is ignored at render time and never reaches the DOM.\n\nWrite every `defaultMessage` as a literal, whether it comes from a descriptor or the prop. Each distinct template is compiled once and cached, so a message built per render \u2014 interpolating a file name or a row into the template itself rather than passing it through `values` \u2014 churns that cache and recompiles the templates it displaces.\n\nMessages that carry ICU placeholders take their substitutions through `values`:\n\n```jsx\nconst messages = defineMessages({\n pageXofY: {\n id: "myApp.pageXofY",\n defaultMessage: "Page {current} of {total}",\n description:\n "Pagination status. `current` is the current page, `total` the last.",\n },\n});\n\n<MessageFormat {...messages.pageXofY} values={{ current: 2, total: 10 }} />;\n// \u2192 "Page 2 of 10"\n```\n\nSpreading the descriptor is what makes that true on its own. With a bare\n`id`, the same line renders `"Page 2 of 10"` only where a supplied catalog\ncovers the active locale, and the id itself everywhere else.',props:`interface MessageFormatProps {
 /**
- * By default \`<MessageFormat>\` will render the formatted string into a
- * \`<React.Fragment>\`. If you need to customize rendering, you can either wrap
- * it with another React element (recommended), specify a different tagName
- * (e.g., 'div')
+ * The element to render the formatted string into, e.g. \`"div"\` or \`"span"\`.
+ * By default it renders into a \`<React.Fragment>\`.
+ * 
+ * @default React.Fragment
  */
 elementType?: React.ElementType | "div" | "span"
 /**
@@ -17410,11 +17447,14 @@ variant?: "primary" | "ghost"
  */
 showStepper?: boolean
 /**
- * The description to display below the input.
+ * The description to display below the input. Hidden while an
+ * \`errorMessage\` is shown.
  */
 description?: string
 /**
- * The error message to display when the input is in an error state.
+ * The error message to display below the input, in place of the
+ * \`description\`. Shown whenever it is set; it does not put the input in the
+ * error state, so set \`isInvalid\` for that.
  */
 errorMessage?: string
 }`,stories:{usage:[{id:"core-forms-numberinput--basic",name:"Basic",snippet:'const Basic = () => <NumberInput placeholder="Placeholder" aria-label="Label" />;'},{id:"core-forms-numberinput--variants",name:"Variants",snippet:`const Variants = (args) => (
@@ -18033,7 +18073,7 @@ Use \`maxSize\` to constrain how large a panel can grow.
 
 Nest \`PanelGroup\` components to create complex layouts.
 
-\`Panel\` and \`PanelGroup\` provide imperative APIs via \`ref\` for setting sizes, and change handlers for reading them:
+\`Panel\` and \`PanelGroup\` provide imperative APIs via \`ref\` for setting sizes, and change handlers for reading them. A number passed to \`resize\` is a size in pixels, unlike the size props; pass a string such as \`"30%"\` for a percentage:
 
 \`\`\`jsx
 import { PanelGroup, Panel, PanelResizeHandle } from "@baseline-ui/core";
@@ -18173,6 +18213,8 @@ style?: React.CSSProperties
 children: ReactNode
 /**
  * Orientation of the layout
+ * 
+ * @default "horizontal"
  */
 direction?: "horizontal" | "vertical"
 /**
@@ -18765,7 +18807,9 @@ The demo can be found [here](/story/core-content-pointpicker-pointpickercontent-
 | \`Home\` | Move the point to the extreme left |
 | \`End\` | Move the point to the extreme right |
 | \`PageUp\` | Move the point to the extreme top |
-| \`PageDown\` | Move the point to the extreme bottom |`,props:`interface PointPickerProps {
+| \`PageDown\` | Move the point to the extreme bottom |
+
+Focusing the content with \`Tab\` places the point at the centre. If the content has focus but no point, for example after a click and the pointer leaving it, the first arrow key, \`Home\`, \`End\`, \`PageUp\`, \`PageDown\`, \`Enter\` or \`Space\` places the point at the centre without moving or selecting it.`,props:`interface PointPickerProps {
 isDisabled?: any
 }`,stories:{usage:[{id:"core-content-pointpicker--basic",name:"Basic",snippet:`const Basic = () => <RichContentExample
     title="Basic Point Picker Demo"
@@ -21638,7 +21682,7 @@ export const CustomRenderItem: React.FC<
 };
 
 export const RadioGroupWithNextFocusable: React.FC<
- Omit<RadioGroupProps, "items">
+ Omit<RadioGroupProps, "items"> & { items?: ListOption[] }
 > = (props) => (
  <>
  <RadioGroup items={items} {...props} />
@@ -21646,7 +21690,7 @@ export const RadioGroupWithNextFocusable: React.FC<
  </>
 );`},similarTo:[],figmaUrl:null},Reaction:{id:"core-buttons-reaction",breadcrumb:"Core/Buttons/Reaction",importStatement:'import { Reaction, VariantViewer } from "@baseline-ui/core";',description:"`Reaction` is a toggleable button paired with a count that lets users add or remove a reaction to a post or comment. Use it when surfacing lightweight social affordances such as likes, emoji responses, or upvotes.",documentation:`\`Reaction\` is a toggleable button paired with a count that lets users add or remove a reaction to a post or comment. Use it when surfacing lightweight social affordances such as likes, emoji responses, or upvotes.
 
-* It is exposed as a input checkbox via ARIA
+* It is exposed as a switch (\`role="switch"\`) via ARIA
 * It has mouse, keyboard, and touch support
 * It has keyboard focus management and cross browser normalization
 
@@ -21739,6 +21783,8 @@ className?: string
 style?: React.CSSProperties
 /**
  * The size of the reaction.
+ * 
+ * @default "md"
  */
 size?: "sm" | "md"
 /**
@@ -21929,9 +21975,9 @@ import { ScrollControlButton } from "../ScrollControlButton";
 
 import type { ScrollControlButtonProps } from "../ScrollControlButton.types";
 
-export const ScrollControlButtonExample: React.FC<ScrollControlButtonProps> = (
- args,
-) => {
+export const ScrollControlButtonExample: React.FC<
+ ScrollControlButtonProps & { dir?: "ltr" | "rtl" }
+> = ({ dir, ...args }) => {
  const ref = React.useRef<HTMLDivElement>(null);
 
  return (
@@ -21969,6 +22015,7 @@ export const ScrollControlButtonExample: React.FC<ScrollControlButtonProps> = (
  </div>
  </div>
  <div
+ dir={dir}
  className={sprinkles({
  position: "relative",
  backgroundColor: "background.primary.subtle",
@@ -23802,70 +23849,7 @@ export const SliderWithExternalDescriptionExample: React.FC = () => (
  />
  </>
 );`},similarTo:[],figmaUrl:null},StatusCard:{id:"core-content-statuscard",breadcrumb:"Core/Content/StatusCard",importStatement:`import { Actionable, Box, StatusCard, Text, VariantViewer } from "@baseline-ui/core";
-import { CaretUpIcon } from "@baseline-ui/icons/12";`,description:"`StatusCard` is a compact card that pairs a status icon with a title and description to communicate the state of a process or item. Use it to surface health, progress, or outcome signals such as active, success, warning, error, or denied conditions.",documentation:`\`StatusCard\` is a compact card that pairs a status icon with a title and description to communicate the state of a process or item. Use it to surface health, progress, or outcome signals such as active, success, warning, error, or denied conditions.
-
-* Supports multiple status variants: \`active\`, \`warning\`, \`error\`, \`denied\`, and \`success\`
-* Tinted variants available for a lighter, more subtle appearance
-* Tinted-strong variants with stronger border colors
-* Default icons for each variant, with support for custom icons
-* Optional trailing element support via \`renderTrailingElement\` prop
-* Pulsing animation for the \`active\` variant icon
-* Exposed to assistive technologies using semantic HTML
-
-\`\`\`jsx
-import { StatusCard } from "@baseline-ui/core";
-
-<StatusCard variant="active" title="Disclosure" description="Running..." />;
-\`\`\`
-
-The \`StatusCard\` component supports the following variants: \`active\`, \`warning\`, \`error\`, \`denied\`, and \`success\`. Each variant has two tinted versions:
-
-* \`{variant}-tinted\`: Provides a lighter background with subtle colored borders
-* \`{variant}-tinted-strong\`: Provides a lighter background with stronger colored borders
-
-Tinted variants provide a lighter, more subtle appearance with colored backgrounds and borders:
-
-Tinted-strong variants provide a lighter background with stronger, more prominent colored borders:
-
-You can provide a custom icon component to replace the default icon for a variant:
-
-\`\`\`jsx
-import { CustomIcon } from "@baseline-ui/icons/16";
-
-<StatusCard
- variant="active"
- title="Custom Status"
- description="Using a custom icon"
- icon={CustomIcon}
-/>;
-\`\`\`
-
-The \`renderTrailingElement\` prop allows you to render custom content at the end of the status card. This is useful for displaying indicators like caret icons, action buttons, or other UI elements.
-
-\`\`\`jsx
-import { StatusCard } from "@baseline-ui/core";
-import { CaretUpIcon } from "@baseline-ui/icons/12";
-import { Box } from "@baseline-ui/core";
-
-<StatusCard
- variant="active"
- title="With Trailing Element"
- description="Custom trailing content"
- renderTrailingElement={() => (
- <Box padding="sm" display="inline-flex">
- <CaretUpIcon size={12} />
- </Box>
- )}
-/>;
-\`\`\`
-
-The \`StatusCard\` component uses semantic HTML elements to ensure proper accessibility:
-
-* The title is rendered as an \`<h3>\` element
-* The description is rendered as a \`<span>\` element
-* The component structure is exposed to assistive technologies through proper HTML semantics
-
-The \`StatusCard\` component itself does not handle keyboard interactions. If you need interactive behavior, wrap it in a clickable element or use it within an interactive component like \`Disclosure\`.`,props:`interface StatusCardProps {
+import { CaretUpIcon } from "@baseline-ui/icons/12";`,description:"`StatusCard` is a compact card that pairs a status icon with a title and description to communicate the state of a process or item. Use it to surface health, progress, or outcome signals such as active, success, warning, error, or denied conditions.",documentation:'`StatusCard` is a compact card that pairs a status icon with a title and description to communicate the state of a process or item. Use it to surface health, progress, or outcome signals such as active, success, warning, error, or denied conditions.\n\n* Supports multiple status variants: `active`, `warning`, `error`, `denied`, and `success`\n* Tinted variants available for a lighter, more subtle appearance\n* Default icons for each variant, with support for custom icons\n* Optional trailing element support via `renderTrailingElement` prop\n* Pulsing animation for the `active` variant icon\n* Exposed to assistive technologies using semantic HTML\n\n```jsx\nimport { StatusCard } from "@baseline-ui/core";\n\n<StatusCard variant="active" title="Disclosure" description="Running..." />;\n```\n\nThe `StatusCard` component supports the following variants: `active`, `warning`, `error`, `denied`, and `success`. Each variant also has a tinted version, `{variant}-tinted`, with a lighter background and subtle colored borders.\n\nTinted variants provide a lighter, more subtle appearance with colored backgrounds and borders:\n\nYou can provide a custom icon component to replace the default icon for a variant:\n\n```jsx\nimport { EllipseIcon } from "@baseline-ui/icons/16";\n\n<StatusCard\n variant="active"\n title="Custom Status"\n description="Using a custom icon"\n icon={EllipseIcon}\n/>;\n```\n\nThe `renderTrailingElement` prop allows you to render custom content at the end of the status card. This is useful for displaying indicators like caret icons, action buttons, or other UI elements.\n\n```jsx\nimport { StatusCard } from "@baseline-ui/core";\nimport { CaretUpIcon } from "@baseline-ui/icons/12";\nimport { Box } from "@baseline-ui/core";\n\n<StatusCard\n variant="active"\n title="With Trailing Element"\n description="Custom trailing content"\n renderTrailingElement={() => (\n <Box padding="sm" display="inline-flex">\n <CaretUpIcon size={12} />\n </Box>\n )}\n/>;\n```\n\nThe `StatusCard` component uses semantic HTML elements to ensure proper accessibility:\n\n* The title is rendered as an `<h4>` element\n* The description is rendered as a `<span>` element\n* The component structure is exposed to assistive technologies through proper HTML semantics\n\nThe `StatusCard` component itself does not handle keyboard interactions. If you need interactive behavior, wrap it in a clickable element or use it within an interactive component like `Disclosure`.',props:`interface StatusCardProps {
 /**
  * The visual variant of the status card. Controls the color scheme and
  * styling. Variants ending with "-tinted" provide a lighter, tinted
@@ -24851,6 +24835,8 @@ label?: React.ReactNode
 description?: string
 /**
  * The position of the label.
+ * 
+ * @default "top"
  */
 labelPosition?: "top" | "left"
 /**
@@ -26945,7 +26931,7 @@ import { Tabs, TabItem } from "@baseline-ui/core";
 </Tabs>;
 \`\`\`
 
-Individual tab items can be disabled by passing the \`disabledValues\` prop to the \`Tabs\` component. The value should be an array of \`value\`s of the \`TabItem\`s that should be disabled.
+Individual tab items can be disabled by passing the \`disabledValues\` prop to the \`Tabs\` component. The value should be a \`Set\` of the \`value\`s of the \`TabItem\`s that should be disabled.
 
 \`\`\`jsx
 import { Tabs, TabItem } from "@baseline-ui/core";
@@ -27198,7 +27184,7 @@ export const AddButtonExample: React.FC<{
  ))}
  </Tabs>
  );
-};`},similarTo:[],figmaUrl:null},Tag:{id:"core-content-tag",breadcrumb:"Core/Content/Tag",importStatement:'import { Tag } from "@baseline-ui/core";',description:"`Tag` is a compact, color-coded label that can be selected, removed, or paired with an icon. Use it to mark items with a category, attribute, or filter value, either on its own or within a `TagGroup`.",documentation:'`Tag` is a compact, color-coded label that can be selected, removed, or paired with an icon. Use it to mark items with a category, attribute, or filter value, either on its own or within a `TagGroup`.\n\n* Five visual variants: `neutral`, `red`, `green`, `blue`, and `high-contrast`\n* Two sizes: `md` (default) and `sm`\n* Optional leading icon (replaced by a checkmark when selected)\n* Optional remove button via `onRemove`\n* Selected and disabled states\n* Focus ring support\n* Works standalone or inside a `TagGroup` for collection behavior\n\n```jsx\nimport { Tag } from "@baseline-ui/core";\n\n<Tag>Label</Tag>;\n```\n\nFor collection behavior with keyboard navigation and selection, use `Tag` inside a `TagGroup`. See the <a href="?path=/docs/core-content-taggroup--docs">TagGroup documentation</a> for details.\n\n`Tag` supports five visual variants: `neutral`, `red`, `green`, `blue`, and\n`high-contrast`.\n\n```jsx\n<Tag>Neutral</Tag>\n<Tag variant="red">Red</Tag>\n<Tag variant="green">Green</Tag>\n<Tag variant="blue">Blue</Tag>\n<Tag variant="high-contrast">High Contrast</Tag>\n```\n\nPass an `icon` prop to display a leading icon. Use `@baseline-ui/icons/16` for `md` size and `@baseline-ui/icons/12` for `sm` size. When the tag is selected, the custom icon is replaced by a checkmark.\n\n```jsx\nimport { EllipseIcon } from "@baseline-ui/icons/16";\n\n<Tag icon={EllipseIcon}>With Icon</Tag>;\n```\n\nPass `onRemove` to render a remove button. When the tag is disabled, the remove button is present but non-interactive.\n\n```jsx\n<Tag onRemove={() => console.log("removed")}>Removable</Tag>\n```\n\nWhen selected, the tag displays a checkmark icon and uses the interactive color scheme. If a custom `icon` is provided, the checkmark replaces it.\n\n```jsx\n<Tag isSelected>Selected</Tag>\n```\n\n```jsx\n<Tag isDisabled>Disabled</Tag>\n```\n\n```jsx\n<Tag size="sm">Small</Tag>\n```\n\nSet `elementType="span"` to render the tag as a `span` so it can sit inside a button or other inline content, where a `div` is not valid HTML. The tag still lays out as a block, so make its container a flex row to keep it on the same line as the text.\n\n```jsx\n<button\n type="button"\n style={{ display: "inline-flex", alignItems: "center", gap: 8 }}\n>\n Report.pdf <Tag elementType="span">Draft</Tag>\n</button>\n```\n\n| Selector | Description |\n| ---------------------- | -------------------------------------------- |\n| `.BaselineUI-Tag` | The root tag element. |\n| `.BaselineUI-Tag-Icon` | The icon element (custom icon or checkmark). |\n\nWhen the tag has a remove button:\n\n| Key | Function |\n| ------- | --------------------------------- |\n| `Tab` | Moves focus to the remove button. |\n| `Enter` | Activates the remove button. |\n| `Space` | Activates the remove button. |\n\n* <a href="?path=/docs/core-content-taggroup--docs">TagGroup</a> \u2014 Use for\n collections of tags with keyboard navigation, selection, and removal.\n* <a href="?path=/docs/core-content-badge--docs">Badge</a> \u2014 Use for numeric or\n status indicators that don\'t need interaction.',props:`interface TagProps {
+};`},similarTo:[],figmaUrl:null},Tag:{id:"core-content-tag",breadcrumb:"Core/Content/Tag",importStatement:'import { Tag } from "@baseline-ui/core";',description:"`Tag` is a compact, color-coded label that can be selected, removed, or paired with an icon. Use it to mark items with a category, attribute, or filter value, either on its own or within a `TagGroup`.",documentation:'`Tag` is a compact, color-coded label that can be selected, removed, or paired with an icon. Use it to mark items with a category, attribute, or filter value, either on its own or within a `TagGroup`.\n\n* Five visual variants: `neutral`, `red`, `green`, `blue`, and `high-contrast`\n* Two sizes: `md` (default) and `sm`\n* Optional leading icon (replaced by a checkmark when selected)\n* Optional remove button via `onRemove`\n* Selected and disabled states\n* Focus ring support\n* Works standalone or inside a `TagGroup` for collection behavior\n\n```jsx\nimport { Tag } from "@baseline-ui/core";\n\n<Tag>Label</Tag>;\n```\n\nFor collection behavior with keyboard navigation and selection, use `Tag` inside a `TagGroup`. See the <a href="?path=/docs/core-content-taggroup--docs">TagGroup documentation</a> for details.\n\n`Tag` supports five visual variants: `neutral`, `red`, `green`, `blue`, and\n`high-contrast`.\n\n```jsx\n<Tag>Neutral</Tag>\n<Tag variant="red">Red</Tag>\n<Tag variant="green">Green</Tag>\n<Tag variant="blue">Blue</Tag>\n<Tag variant="high-contrast">High Contrast</Tag>\n```\n\nPass an `icon` prop to display a leading icon. Use `@baseline-ui/icons/16` for `md` size and `@baseline-ui/icons/12` for `sm` size. When the tag is selected, the custom icon is replaced by a checkmark.\n\n```jsx\nimport { EllipseIcon } from "@baseline-ui/icons/16";\n\n<Tag icon={EllipseIcon}>With Icon</Tag>;\n```\n\nPass `onRemove` to render a remove button. When the tag is disabled, the remove button is present but non-interactive.\n\n```jsx\n<Tag onRemove={() => console.log("removed")}>Removable</Tag>\n```\n\nWhen selected, the tag displays a checkmark icon and uses the interactive color scheme. If a custom `icon` is provided, the checkmark replaces it.\n\n```jsx\n<Tag isSelected>Selected</Tag>\n```\n\n```jsx\n<Tag isDisabled>Disabled</Tag>\n```\n\n```jsx\n<Tag size="sm">Small</Tag>\n```\n\nSet `elementType="span"` to render the tag as a `span` so it can sit inside a button or other inline content, where a `div` is not valid HTML. The tag still lays out as a block, so make its container a flex row to keep it on the same line as the text.\n\n```jsx\n<button\n type="button"\n style={{ display: "inline-flex", alignItems: "center", gap: 8 }}\n>\n Report.pdf <Tag elementType="span">Draft</Tag>\n</button>\n```\n\n| Selector | Description |\n| ---------------------- | -------------------------------------------- |\n| `.BaselineUI-Tag` | The root tag element. |\n| `.BaselineUI-Tag-Icon` | The icon element (custom icon or checkmark). |\n| `[data-disabled]` | Whether the tag is disabled. |\n\nWhen the tag has a remove button:\n\n| Key | Function |\n| ------- | --------------------------------- |\n| `Tab` | Moves focus to the remove button. |\n| `Enter` | Activates the remove button. |\n| `Space` | Activates the remove button. |\n\n* <a href="?path=/docs/core-content-taggroup--docs">TagGroup</a> \u2014 Use for\n collections of tags with keyboard navigation, selection, and removal.\n* <a href="?path=/docs/core-content-badge--docs">Badge</a> \u2014 Use for numeric or\n status indicators that don\'t need interaction.',props:`interface TagProps {
 /**
  * @deprecated Do not use in new components. This is a legacy block
  * identifier; new components should exclude it via
@@ -27311,7 +27297,7 @@ import { TagGroup } from "@baseline-ui/core";
 <TagGroup items={[{ id: "tag", label: "Tag" }]} />;
 \`\`\`
 
-The \`TagGroup\` component has four variants: \`neutral\`, \`red\`, \`green\`, \`blue\` and \`high-constrast\`. You can set the variant of whole group or individual tags.
+The \`TagGroup\` component has five variants: \`neutral\`, \`red\`, \`green\`, \`blue\` and \`high-contrast\`. You can set the variant of whole group or individual tags.
 
 \`\`\`jsx
 import { TagGroup } from "@baseline-ui/core";
@@ -27883,7 +27869,7 @@ export const TaggedPaginationInToolbarExample: React.FC<
  </Toolbar>
  <ActionButton label="Outside" />
  </div>
-);`},similarTo:[],figmaUrl:null},Text:{id:"core-content-text",breadcrumb:"Core/Content/Text",importStatement:'import { Input, Label, Text, TextField, VariantViewer } from "@baseline-ui/core";',description:"`Text` is a typography primitive that renders strings with consistent type, size, and weight from the design system. Use it whenever you need to display textual content so that headings, body copy, values, and helper text stay visually aligned.",documentation:'`Text` is a typography primitive that renders strings with consistent type, size, and weight from the design system. Use it whenever you need to display textual content so that headings, body copy, values, and helper text stay visually aligned.\n\n* Consistent type, size, and weight pulled from the design system\n* Renders as any HTML element via the `elementType` prop\n* Opt-in integration with a container\'s context through the `slot` prop for automatic `aria-describedby` / `aria-labelledby` wiring\n\n```jsx\nimport { Text } from "@baseline-ui/core";\n\n<Text type="subtitle" size="sm">\n Text\n</Text>;\n```\n\nThe `Text` component supports the following types: `title`, `subtitle`, `body`, `label`, `value`, and `helper`. It\nalso supports the following sizes: `sm`, `md`, and `lg`.\n\n`Text` can integrate with a container component\'s context. Pass a `slot` name\nand the text picks up the `id` the container provides for that slot, so it gets\nassociated via `aria-describedby` / `aria-labelledby` without manually wiring an\n`id`.\n\n```jsx\n<Text slot="description">\n This description is linked to its field automatically.\n</Text>\n```\n\nSlot integration is **opt-in**: a `Text` without a `slot` never inherits an\nambient context, so it renders identically whether or not a container is\npresent. Naming a `slot` the surrounding container does not define will throw \u2014\nonly pass slots you know the container exposes.\n\nNo Baseline container currently provides a slotted `TextContext`, so this is\ngroundwork for future containers.\n\n`Text` always emits a stable class name you can target for styling.\n\n| Selector | Description |\n| ------------------ | ------------------------------------- |\n| `.BaselineUI-Text` | Applied to the rendered text element. |',props:`interface TextProps {
+);`},similarTo:[],figmaUrl:null},Text:{id:"core-content-text",breadcrumb:"Core/Content/Text",importStatement:'import { Input, Label, Text, TextField, VariantViewer } from "@baseline-ui/core";',description:"`Text` is a typography primitive that renders strings with consistent type, size, and weight from the design system. Use it whenever you need to display textual content so that headings, body copy, values, and helper text stay visually aligned.",documentation:'`Text` is a typography primitive that renders strings with consistent type, size, and weight from the design system. Use it whenever you need to display textual content so that headings, body copy, values, and helper text stay visually aligned.\n\n* Consistent type, size, and weight pulled from the design system\n* Renders as any HTML element via the `elementType` prop\n* Opt-in integration with a container\'s context through the `slot` prop for automatic `aria-describedby` / `aria-labelledby` wiring\n\n```jsx\nimport { Text } from "@baseline-ui/core";\n\n<Text type="subtitle" size="sm">\n Text\n</Text>;\n```\n\nThe `Text` component supports the following types: `title`, `subtitle`, `body`, `label`, `value`, and `helper`. It\nalso supports the following sizes: `sm`, `md`, and `lg`.\n\n`Text` can integrate with a container component\'s context. Pass a `slot` name\nand the text picks up the `id` the container provides for that slot, so it gets\nassociated via `aria-describedby` / `aria-labelledby` without manually wiring an\n`id`.\n\n```jsx\n<Text slot="description">\n This description is linked to its field automatically.\n</Text>\n```\n\nSlot integration is **opt-in**: a `Text` without a `slot` never inherits an\nambient context, so it renders identically whether or not a container is\npresent. Naming a `slot` the surrounding container does not define will throw \u2014\nonly pass slots you know the container exposes.\n\n`UNSAFE_ListBox` options provide the `label` and `description` slots: a\n`<Text slot="label">` or `<Text slot="description">` rendered by `renderOption`\nnames or describes its option.\n\n`Text` always emits a stable class name you can target for styling.\n\n| Selector | Description |\n| ------------------ | ------------------------------------- |\n| `.BaselineUI-Text` | Applied to the rendered text element. |',props:`interface TextProps {
 /**
  * @deprecated Do not use in new components. This is a legacy block
  * identifier; new components should exclude it via
@@ -29065,15 +29051,19 @@ className?: string
  */
 style?: React.CSSProperties
 /**
- * The description to display below the input.
+ * The description to display below the input. Hidden while an \`errorMessage\`
+ * or \`warningMessage\` is shown.
  */
 description?: string
 /**
- * The error message to display when the input is in an error state.
+ * The error message to display below the input, in place of the \`description\`
+ * and \`warningMessage\`. Setting it also puts the input in the error state.
  */
 errorMessage?: string
 /**
- * The warning message to display when the input is in a warning state.
+ * The warning message to display below the input, in place of the
+ * \`description\`. An \`errorMessage\` takes precedence over it. \`FileInput\`
+ * shows it only while \`validationState\` is \`"warning"\`.
  */
 warningMessage?: string
 }`,stories:{usage:[{id:"core-forms-timefield--basic",name:"Basic",snippet:'const Basic = () => <TimeField onChange={fn()} aria-label="Event Time" />;'},{id:"core-forms-timefield--with-label",name:"With Label",snippet:'const WithLabel = () => <TimeField onChange={fn()} label="Event Time" />;'},{id:"core-forms-timefield--variants",name:"Variants",snippet:`const Variants = (args) => (
@@ -41285,7 +41275,7 @@ padding={[null, "lg", "xl"]}
 
 * [vanilla-extract sprinkles documentation](https://vanilla-extract.style/documentation/packages/sprinkles/) - Learn about the underlying sprinkles framework
 * [Box component documentation](/docs/core-utilities-box--docs) - Detailed information about the Box component
-* [Theme documentation](/docs/theming--docs) - Learn about Baseline UI's theming system`};var m={"8":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","ChevronRightFilledIcon","ChevronRightIcon","EllipseIcon","MinusIcon","PlusIcon","XIcon"],"12":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","EditIcon","EllipseIcon","EnterKeyIcon","LockFilledIcon","LockIcon","MinusIcon","MoreVIcon","MoreIcon","PlaceholderIcon","PlusIcon","SearchIcon","SizeIcon","TrashIcon","XIcon","ZoomIcon"],"16":["AlignBottomIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDiagonalTopLeftBottomRightIcon","ArrowDownCircleFilledIcon","ArrowDownIcon","ArrowIcon","ArrowLeftRightIcon","ArrowRightIcon","ArrowUpArrowDownIcon","ArrowUpIcon","AtIcon","AttachmentsIcon","AvatarIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BulletListIcon","CalendarIcon","CaretLeftIcon","CaretRightIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","CircleFilledIcon","ClockIcon","CopyIcon","CustomizeIcon","DocumentEditIcon","DownloadIcon","DuplicateIcon","EditIcon","ElipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FilterAltIcon","FolderIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FullScreenIcon","HelpCircleIcon","HelpIcon","HereIcon","HideIcon","HighlightTextAltIcon","HighlightTextIcon","HorizontalScrollIcon","ImageIcon","InfoCircleFilledIcon","InsertIcon","ItalicIcon","LightBulbIcon","LineIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MeasureIcon","MinusIcon","MoreIcon","MoreVerticalIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","NumberedListIcon","OpenIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageVerticalScrollIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PlaceholderIcon","PlayIcon","PlusIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","ReadOnlyIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedoIcon","RemoveFormattingIcon","ReorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RulerIcon","SearchIcon","SettingsIcon","ShowIcon","SlashCommandsIcon","SoundRecordIcon","StampIcon","StarFilledIcon","StarIcon","StrikeoutTextAltIcon","TableCellIcon","TableColumnIcon","TableHeaderIcon","TableIcon","TableRowIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextDecreaseIndentIcon","TextIcon","TextIncreaseIndentIcon","TextMarkIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UndoIcon","UnlockIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WindowedIcon","WorkflowIcon","XCircleFilledIcon","XIcon"],"20":["AddPageIcon","AnonymousIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpCircleFilledIcon","AtIcon","AvatarFilledIcon","BoldIcon","CalloutIcon","CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ClockIcon","CollapseIcon","CommentIcon","CopyIcon","CutIcon","DistanceIcon","DownloadIcon","DuplicateIcon","EditIcon","EllipseIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorAlternativeCircleIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FormDateIcon","FormSignatureIcon","FormTextFieldIcon","HelpCircleIcon","HighlightTextIcon","HomeIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","ItalicIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MinusIcon","MoreIcon","MoreVerticalIcon","MoveIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OpenIcon","PageMoveLeftIcon","PageMoveRightIcon","PagesInsertIcon","PasteIcon","PipetteIcon","PlusIcon","PrintIcon","RotateClockwiseIcon","SearchIcon","SettingsIcon","ShapeIcon","ShareIcon","SoundIcon","SoundRecordIcon","StarFilledIcon","StarIcon","StyleIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UploadIcon","WarningFilledIcon","WarningIcon","XCircleFilledIcon","XCircleIcon","XIcon"],"24":["AddNoteCloudIcon","AddNoteIcon","AddTextSerifIcon","AiIcon","AirplaneIcon","AlignBottomIcon","AlignHorizontalCenterIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDownIcon","ArrowIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpIcon","AtIcon","AttachmentIcon","AvatarFilledIcon","AvatarIcon","BlendModeIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BorderColorIcon","BottomBorderIcon","BulletListIcon","CalibrateIcon","CaptureAddIcon","CaretDownIcon","CaretIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ChevronListIcon","ClockIcon","CloudyBorderIcon","CollapseIcon","ColorPaletteIcon","ColorSwatchIcon","CommentIcon","CommentInSidebarIcon","CommentOnPageIcon","CompareDocumentsIcon","CopyIcon","CopyPageIcon","CropIcon","CustomizeIcon","CutIcon","DateModifiedIcon","DatePlusIcon","DebugIcon","DocumentArrowDownCircleIcon","DocumentArrowDownIcon","DocumentArrowRightIcon","DocumentFilledIcon","DocumentLockIcon","DocumentPdfIcon","DownloadIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","DuplicateIcon","EditAnnotationsIcon","EditContentIcon","EditDocumentIcon","EditIcon","EditThumbnailsIcon","EllipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","EndCapArrowFilledIcon","EndCapArrowIcon","EndCapChevronFilledIcon","EndCapChevronIcon","EndCapCircleIcon","EndCapDiamondIcon","EndCapNoneIcon","EndCapSlantedIcon","EndCapSquareIcon","EndCapStraightIcon","EraserIcon","ErrorAltCircleFilledIcon","ErrorAltIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","ExpandVerticalIcon","FillColorIcon","FilterIcon","FitToHeightIcon","FivePagesHorizontalFilledIcon","FivePagesVerticalFilledIcon","FolderAddIcon","FolderIcon","FontListIcon","FontSizeIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormPageIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FormTwoRadioButtonsIcon","FourPagesGridFilledIcon","FourPagesHorizontalFilledIcon","FourPagesStackedFilledIcon","FourPagesVerticalFilledIcon","GroupIcon","HamburgerMenuIcon","HandIcon","HeartIcon","HideIcon","HideRevealIcon","HighlightTextIcon","HomeIcon","HorizontalScollIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","InitialsIcon","InnerHorizontalBorderIcon","InnerVerticalBorderIcon","InsertIcon","ItalicIcon","LayerBottomIcon","LayerDownIcon","LayerTopIcon","LayerUpIcon","LayersIcon","LeftBindingIcon","LeftBorderIcon","LineCapsIcon","LineIcon","LineSpacingIcon","LineStyleCloudyIcon","LineStyleDashedDoubleDashIcon","LineStyleDashedDoubleGapIcon","LineStyleDashedQuadrupleDashIcon","LineStyleDashedSingleGapIcon","LineStyleIcon","LineStyleSolidIcon","LineWidthIcon","LinkIcon","LockFilledIcon","LockIcon","MagicIcon","MagicPenIcon","MailIcon","MarkupIcon","MarqueeZoomIcon","MeasureIcon","MergeIcon","MessageCloudIcon","MinusIcon","MoonIcon","MoreCircleIcon","MoreIcon","MoreVerticalIcon","MoveAllDirectionsIcon","MoveLeftIcon","MoveLeftRightIcon","MoveRightIcon","MultiplePagesIcon","NonEditableIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OcrIcon","OpacityIcon","PageAddIcon","PageCurlIcon","PageDuplicateIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLandscapeIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageMoveLeftIcon","PageMoveRightIcon","PageNumberCircleIcon","PageNumberIcon","PagePortraitIcon","PageRemoveIcon","PageVerticalScrollIcon","PagesInsertAltIcon","PagesInsertIcon","PagesNewFromSelectionAltIcon","PagesNewFromSelectionIcon","PagesSelectAllIcon","PagesSelectNoneIcon","PasteBoardIcon","PastePageIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PinDropFilledIcon","PinDropIcon","PipetteIcon","PlayIcon","PlusCircleFilledIcon","PlusCircleIcon","PlusIcon","PointerIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","PrecisionIcon","PrintIcon","PrivateModeIcon","PushPinIcon","QuestionmarkCircleIcon","ReaderViewIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedactIcon","RedactRectangleIcon","RedactTextHighlighterIcon","RedactionTextRepeatingIcon","RedactionTextSingleIcon","RedoAllIcon","RedoIcon","RegexIcon","ReplaceIcon","RightBindingIcon","RightBorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RotateObjectClockwiseIcon","RotateObjectCounterClockwiseIcon","RulerIcon","ScaleIcon","SearchCircleIcon","SearchIcon","SearchSelectionIcon","SelectAllIcon","SelectionToolIcon","SettingsIcon","ShapesIcon","ShareAltIcon","ShareIcon","ShieldAddIcon","ShieldCheckmarkIcon","ShieldWarningIcon","ShieldXIcon","ShowIcon","SidebarIcon","SignOutIcon","SignatureDigitalIcon","SignatureIcon","SinglePageFilledIcon","SoundIcon","SquigglyTextIcon","StampAddIcon","StampIcon","StarFilledIcon","StarIcon","StartCapArrowFilledIcon","StartCapArrowIcon","StartCapChevronFilledIcon","StartCapChevronIcon","StartCapCircleIcon","StartCapDiamondIcon","StartCapNoneIcon","StartCapSlantedIcon","StartCapSquareIcon","StartCapStraightIcon","StrikeoutTextIcon","StyleFilledIcon","StyleIcon","StylusFilledIcon","StylusIcon","SunIcon","TableCellIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextColorIcon","TextIcon","TextPropertiesHideIcon","TextPropertiesShowIcon","TextSerifIcon","TextSmallerIcon","ThreePagesHorizontalFilledIcon","ThreePagesStackedFilledIcon","ThreePagesVerticalFilledIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TopBorderIcon","TrashIcon","TwoPagesHorizontalFilledIcon","TwoPagesVerticalFilledIcon","TypeTextIcon","UnderlineIcon","UnderlineTextIcon","UndoAllIcon","UndoIcon","UndoRedoIcon","UngroupIcon","UnlockIcon","UploadIcon","UserIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WidgetIcon","WorkflowIcon","XCircleFilledIcon","XCircleIcon","XIcon","ZoomInIcon","ZoomOutIcon"],"36":["ArrowRight","Check","Circle","Cross","Help","Inset","Key","NewParagraphAlt","NewParagraph","Note","PointerRight","SpeechBubble","Star"]};var r=["charts-barchart--basic","charts-barchart--custom-colors","charts-barchart--formatted","charts-barchart--hidden-axes","charts-barchart--many-series","charts-barchart--mixed-stacking","charts-barchart--single-series","charts-barchart--stacked","charts-barchart--stacked-with-three-series","charts-barchart--thicker-bars","charts-barchart--with-legend","charts-linechart--basic","charts-linechart--custom-colors","charts-linechart--formatted","charts-linechart--hidden-axes","charts-linechart--linear-curve","charts-linechart--many-lines","charts-linechart--single-line","charts-linechart--sparkline","charts-linechart--with-dots","charts-linechart--with-legend","charts-piechart--basic","charts-piechart--custom-colors","charts-piechart--donut","charts-piechart--long-legend-names","charts-piechart--many-slices","charts-piechart--no-labels","charts-piechart--no-legend","charts-piechart--no-tooltip","charts-piechart--small-slices-below-five-percent","core-buttons-actionbutton--as-div","core-buttons-actionbutton--basic","core-buttons-actionbutton--disabled","core-buttons-actionbutton--variants","core-buttons-actionbutton--with-both-icons","core-buttons-actionbutton--with-icon","core-buttons-actionbutton--with-popover","core-buttons-actiongroup--basic","core-buttons-actiongroup--default-selected","core-buttons-actiongroup--disabled","core-buttons-actiongroup--disabled-items","core-buttons-actiongroup--disabled-items-multi-select","core-buttons-actiongroup--disabled-with-selection","core-buttons-actiongroup--multi-select","core-buttons-actiongroup--multiple-default-selected","core-buttons-actiongroup--multiple-selected-items","core-buttons-actiongroup--single-item","core-buttons-actiongroup--single-select","core-buttons-actiongroup--with-custom-action-item","core-buttons-actiongroup--with-icon","core-buttons-actiongroup--with-icon-disabled","core-buttons-actiongroup--with-icon-multi-select","core-buttons-actiongroup--without-tooltip","core-buttons-actioniconbutton--basic","core-buttons-actioniconbutton--disabled","core-buttons-actioniconbutton--variants","core-buttons-actioniconbutton--with-popover","core-buttons-actioniconbutton--with-tooltip","core-buttons-reaction--basic","core-buttons-reaction--disabled","core-buttons-reaction--read-only","core-buttons-reaction--selected","core-buttons-reaction--variants","core-buttons-scrollcontrolbutton--basic","core-buttons-scrollcontrolbutton--hide-for-keyboard","core-buttons-scrollcontrolbutton--with-custom-delay","core-buttons-scrollcontrolbutton--with-reversed-items","core-buttons-scrollcontrolbutton--without-smooth-scroll","core-buttons-togglebutton--basic","core-buttons-togglebutton--controlled","core-buttons-togglebutton--default-selected","core-buttons-togglebutton--disabled","core-buttons-togglebutton--variants","core-buttons-togglebutton--with-icon","core-buttons-toggleiconbutton--basic","core-buttons-toggleiconbutton--primary-variants","core-buttons-toggleiconbutton--secondary-variants","core-buttons-toggleiconbutton--state-specific-icons","core-buttons-toggleiconbutton--teritary-variants","core-buttons-toggleiconbutton--toolbar-variants","core-buttons-toggleiconbutton--with-tooltip","core-collections-filelist--basic","core-collections-filelist--disabled","core-collections-filelist--disabled-items","core-collections-filelist--expanded","core-collections-filelist--expanded-disabled","core-collections-filelist--grid","core-collections-filelist--loading","core-collections-filelist--long-filename","core-collections-filelist--many-expanded","core-collections-filelist--many-grid","core-collections-filelist--many-items","core-collections-filelist--mixed-states","core-collections-filelist--with-error","core-collections-gridlist--basic","core-collections-gridlist--default-selected-keys","core-collections-gridlist--disabled","core-collections-gridlist--disabled-rows","core-collections-gridlist--disallow-empty-selection","core-collections-gridlist--with-drag-and-drop","core-collections-gridlist--with-multiple-selection","core-collections-gridlist--with-single-selection","core-collections-imagegallery--basic","core-collections-imagegallery--more-items","core-collections-imagegallery--rtl-with-virtualization","core-collections-imagegallery--scrollable","core-collections-imagegallery--with-controlled-list","core-collections-imagegallery--with-custom-aspect-ratio","core-collections-imagegallery--with-custom-fit","core-collections-imagegallery--with-custom-image-dimensions","core-collections-imagegallery--with-custom-image-renderer","core-collections-imagegallery--with-custom-size","core-collections-imagegallery--with-deletion","core-collections-imagegallery--with-disabled-deletion","core-collections-imagegallery--with-dynamic-list","core-collections-imagegallery--with-long-labels","core-collections-imagegallery--with-medium-size","core-collections-imagegallery--with-multiple-selection","core-collections-imagegallery--with-reordering","core-collections-imagegallery--with-single-selection","core-collections-imagegallery--with-single-selection-and-deletion","core-collections-imagegallery--with-virtualization","core-collections-listbox--basic","core-collections-listbox--controlled-auto-scroll","core-collections-listbox--drag-and-drop-custom-preview","core-collections-listbox--drag-and-drop-grid","core-collections-listbox--drag-and-drop-horizontal","core-collections-listbox--drag-and-drop-multiple","core-collections-listbox--drag-and-drop-single","core-collections-listbox--dynamic-items","core-collections-listbox--with-custom-option-style","core-collections-listbox--with-customized-section-titles","core-collections-listbox--with-default-selected","core-collections-listbox--with-disabled-items","core-collections-listbox--with-focus-loop","core-collections-listbox--with-padded-section-titles","core-collections-listbox--with-section-titles","core-collections-listbox--with-sections","core-collections-listbox--with-selected","core-collections-menu--basic","core-collections-menu--controlled-open","core-collections-menu--disabled","core-collections-menu--long-menu","core-collections-menu--multiple-selection","core-collections-menu--section-level-selection","core-collections-menu--single-selection","core-collections-menu--with-custom-options","core-collections-menu--with-custom-trigger","core-collections-menu--with-disabled-keys","core-collections-menu--with-disabled-submenu","core-collections-menu--with-icons","core-collections-menu--with-long-labels","core-collections-menu--with-sections","core-collections-menu--with-selected-keys-controlled","core-collections-menu--with-submenu","core-collections-table--async-loading","core-collections-table--default","core-collections-table--disabled-rows","core-collections-table--drag-and-drop","core-collections-table--empty","core-collections-table--long-text-content","core-collections-table--multiple-selection","core-collections-table--row-action","core-collections-table--selection-with-row-action","core-collections-table--single-selection","core-collections-table--sorting","core-collections-table--virtualized","core-collections-table--with-tag-and-menu","core-collections-table--with-toolbar","core-collections-taggroup--basic","core-collections-taggroup--disabled","core-collections-taggroup--disabled-items","core-collections-taggroup--group-variants","core-collections-taggroup--multi-select","core-collections-taggroup--removable","core-collections-taggroup--single-select","core-collections-taggroup--small-variants","core-collections-taggroup--variants","core-collections-treeview--basic","core-collections-treeview--custom-row","core-collections-treeview--custom-row-drag-and-drop","core-collections-treeview--deeply-nested","core-collections-treeview--drag-and-drop","core-collections-treeview--empty-tree","core-collections-treeview--flat-tree","core-collections-treeview--handle-only-drag-and-drop","core-collections-treeview--interactive-fields-drag-and-drop","core-collections-treeview--long-labels","core-collections-treeview--single-item","core-collections-treeview--virtualized-drag-and-drop","core-collections-treeview--virtualized-with-actions","core-collections-treeview--virtualized-with-descriptions","core-collections-treeview--virtualized-with-expand-control","core-collections-treeview--virtualized-with-rename","core-collections-treeview--with-actions-at-end","core-collections-treeview--with-controlled-expanded-keys","core-collections-treeview--with-custom-render-icons","core-collections-treeview--with-custom-render-item-title","core-collections-treeview--with-default-expanded-keys","core-collections-treeview--with-description","core-collections-treeview--with-icons","core-collections-treeview--with-primary-action","core-collections-treeview--with-primary-and-secondary-action","core-collections-treeview--with-primary-secondary-and-description-action","core-collections-treeview--with-rename","core-collections-treeview--with-selected-items","core-collections-treeview--with-virtualization","core-collections-unsafe-listbox--basic","core-collections-unsafe-listbox--controlled-auto-scroll","core-collections-unsafe-listbox--drag-and-drop-custom-preview","core-collections-unsafe-listbox--drag-and-drop-grid","core-collections-unsafe-listbox--drag-and-drop-horizontal","core-collections-unsafe-listbox--drag-and-drop-multiple","core-collections-unsafe-listbox--drag-and-drop-single","core-collections-unsafe-listbox--dynamic-items","core-collections-unsafe-listbox--virtualized-horizontal","core-collections-unsafe-listbox--virtualized-scroll-into-view","core-collections-unsafe-listbox--virtualized-vertical","core-collections-unsafe-listbox--virtualized-with-section-separators","core-collections-unsafe-listbox--virtualized-with-sections","core-collections-unsafe-listbox--with-custom-option-style","core-collections-unsafe-listbox--with-customized-section-titles","core-collections-unsafe-listbox--with-default-selected","core-collections-unsafe-listbox--with-disabled-items","core-collections-unsafe-listbox--with-focus-loop","core-collections-unsafe-listbox--with-padded-section-titles","core-collections-unsafe-listbox--with-section-titles","core-collections-unsafe-listbox--with-sections","core-collections-unsafe-listbox--with-selected","core-collections-virtualizer--grid-layout-example","core-collections-virtualizer--list-layout-example","core-collections-virtualizer--rtl-image-gallery-preset-example","core-collections-virtualizer--tree-view-preset-example","core-content-avatar--basic","core-content-avatar--disabled","core-content-avatar--variants","core-content-avatar--with-image","core-content-avatar--with-initials","core-content-avatar--with-notification","core-content-code--basic","core-content-code--with-scroll","core-content-colorswatch--basic","core-content-colorswatch--disabled","core-content-colorswatch--full-transparency","core-content-colorswatch--indeterminate","core-content-colorswatch--interactive","core-content-colorswatch--none","core-content-colorswatch--variants","core-content-colorswatch--with-custom-label","core-content-colorswatch--with-tooltip","core-content-colorswatch--with-transparency","core-content-image--basic","core-content-image--contain","core-content-image--fallback","core-content-kbd--common-shortcuts","core-content-kbd--complex-shortcut","core-content-kbd--key-combination","core-content-kbd--key-combination-with-symbols","core-content-kbd--modifier-key","core-content-kbd--single-key","core-content-kbd--symbols-showcase","core-content-markdown--basic","core-content-markdown--with-caret","core-content-pointpicker--basic","core-content-pointpicker--disabled","core-content-pointpicker-pointpickercontent--custom-cursor","core-content-pointpicker-pointpickercontent--custom-cursor-without-default","core-content-pointpicker-pointpickercontent--default","core-content-pointpicker-pointpickercontent--multiple-point-pickers","core-content-pointpicker-pointpickercontent--points-within-radius","core-content-pointpicker-pointpickercontent--programmatic-focus","core-content-pointpicker-pointpickercontent--snap-to-point","core-content-pointpicker-pointpickercontent--trailing-element","core-content-pointpicker-pointpickercontent--without-grid-lines","core-content-pointpicker-pointpickerdisplay--with-custom-scale","core-content-pointpicker-pointpickerdisplay--with-description","core-content-pointpicker-pointpickerdisplay--with-floating-display","core-content-preview--disabled","core-content-preview--image-preview","core-content-preview--svg-preview","core-content-preview--text-preview","core-content-preview--variants","core-content-preview--without-delete-button","core-content-separator--basic","core-content-separator--secondary","core-content-separator--secondary-vertical","core-content-separator--vertical","core-content-statuscard--basic","core-content-statuscard--interactive","core-content-statuscard--long-content","core-content-statuscard--truncated-title","core-content-statuscard--variants","core-content-statuscard--with-custom-icon","core-content-statuscard--with-trailing-element","core-content-statuscard--without-description","core-content-tag--basic","core-content-tag--disabled","core-content-tag--disabled-removable","core-content-tag--inline-content","core-content-tag--long-text","core-content-tag--removable","core-content-tag--selected","core-content-tag--selected-with-icon","core-content-tag--small","core-content-tag--small-with-icon","core-content-tag--with-icon","core-content-text--basic","core-content-text--slots","core-content-text--variants","core-feedback-skeleton--circle","core-feedback-skeleton--composed-example","core-feedback-skeleton--custom-shape","core-feedback-skeleton--document-view-area","core-feedback-skeleton--rectangle","core-feedback-skeleton--text-line","core-forms-buttonselect--basic","core-forms-buttonselect--controlled","core-forms-buttonselect--controlled-button-selection","core-forms-buttonselect--default-button-selected-value","core-forms-buttonselect--default-select-selected-value","core-forms-buttonselect--disabled","core-forms-buttonselect--exclude-from-tab-order","core-forms-buttonselect--items-without-icons","core-forms-buttonselect--long-text-labels","core-forms-buttonselect--many-items","core-forms-buttonselect--variants","core-forms-buttonselect--with-action-behaviour","core-forms-buttonselect--with-button-disabled-key","core-forms-buttonselect--with-callbacks","core-forms-buttonselect--with-default-open","core-forms-buttonselect--with-disabled-keys","core-forms-buttonselect--with-disabled-keys-and-default-selected","core-forms-buttonselect--with-hidden-label","core-forms-buttonselect--with-individual-button-behaviour","core-forms-buttonselect--with-multiple-disabled-keys","core-forms-buttonselect--with-validation-error","core-forms-buttonselect--without-tooltip","core-forms-calendar--default","core-forms-calendar--disabled","core-forms-calendar--extra-small","core-forms-calendar--extra-small-no-title","core-forms-calendar--fixed-weeks","core-forms-calendar--international-calendar","core-forms-calendar--read-only","core-forms-calendar--select-month","core-forms-calendar--select-month-and-year","core-forms-calendar--select-month-and-year-extra-small","core-forms-calendar--select-month-and-year-with-title","core-forms-calendar--select-month-extra-small","core-forms-calendar--select-month-with-title","core-forms-calendar--unavailable-dates","core-forms-calendar--with-default-value","core-forms-calendar--with-min-max","core-forms-calendar--with-title","core-forms-checkbox--checked","core-forms-checkbox--indeterminate","core-forms-checkbox--primary","core-forms-checkbox--with-error","core-forms-checkbox--with-label-at-end","core-forms-checkbox--with-label-at-start","core-forms-colorinput--basic","core-forms-colorinput--color-presets-only","core-forms-colorinput--controlled","core-forms-colorinput--disabled","core-forms-colorinput--indeterminate","core-forms-colorinput--lazy-picker","core-forms-colorinput--lazy-picker-mobile","core-forms-colorinput--with-alpha","core-forms-colorinput--with-controlled-open","core-forms-colorinput--with-custom-trigger","core-forms-colorinput--with-default-open","core-forms-colorinput--with-default-value","core-forms-colorinput--with-label","core-forms-colorinput--with-label-at-start","core-forms-colorinput--with-removal","core-forms-colorinput--without-alpha","core-forms-colorinput--without-color-label","core-forms-colorinput--without-color-presets","core-forms-colorinput-iconcolorinput--compact","core-forms-colorinput-iconcolorinput--compact-disabled","core-forms-colorinput-iconcolorinput--compact-indeterminate","core-forms-colorinput-iconcolorinput--disabled","core-forms-colorinput-iconcolorinput--indeterminate","core-forms-colorinput-iconcolorinput--standard","core-forms-colorinput-iconcolorinput--without-tooltip","core-forms-colorswatchpicker--basic","core-forms-colorswatchpicker--controlled","core-forms-colorswatchpicker--default-value","core-forms-colorswatchpicker--disabled","core-forms-colorswatchpicker--with-icon","core-forms-colorswatchpicker--with-label","core-forms-colorswatchpicker--with-label-at-start","core-forms-combobox--basic","core-forms-combobox--disabled","core-forms-combobox--dynamic-collections","core-forms-combobox--ghost-variant","core-forms-combobox--items-with-icon","core-forms-combobox--read-only","core-forms-combobox--variants","core-forms-combobox--with-custom-filter","core-forms-combobox--with-custom-number-value","core-forms-combobox--with-custom-value","core-forms-combobox--with-description","core-forms-combobox--with-error-message","core-forms-combobox--with-focus-menu-trigger","core-forms-combobox--with-label-at-start","core-forms-combobox--with-manual-menu-trigger","core-forms-combobox--with-min-max-value","core-forms-combobox--with-render-option","core-forms-combobox--with-tooltip","core-forms-combobox--with-warning-message","core-forms-datefield--basic","core-forms-datefield--controlled","core-forms-datefield--default-value","core-forms-datefield--different-granularity","core-forms-datefield--disabled","core-forms-datefield--ghost-variant","core-forms-datefield--html-forms","core-forms-datefield--placeholder-value","core-forms-datefield--read-only","core-forms-datefield--variants","core-forms-datefield--with-calendar-icon","core-forms-datefield--with-calendar-picker","core-forms-datefield--with-calendar-picker-and-default-value","core-forms-datefield--with-calendar-picker-and-min-max","core-forms-datefield--with-calendar-picker-disabled","core-forms-datefield--with-calendar-picker-error","core-forms-datefield--with-calendar-picker-ghost","core-forms-datefield--with-calendar-picker-read-only","core-forms-datefield--with-error-message","core-forms-datefield--with-error-message-only","core-forms-datefield--with-label","core-forms-datefield--with-label-at-start","core-forms-datefield--with-min-and-max-value","core-forms-datefield--with-warning-message","core-forms-fileinput--basic","core-forms-fileinput--custom-labels","core-forms-fileinput--directory","core-forms-fileinput--disabled","core-forms-fileinput--label-position-start","core-forms-fileinput--multiple","core-forms-fileinput--variants","core-forms-fileinput--with-error","core-forms-fileinput--with-warning","core-forms-fileinput--without-label","core-forms-fileuploader--button-variant","core-forms-fileuploader--compact","core-forms-fileuploader--default","core-forms-fileuploader--disabled","core-forms-fileuploader--error-dropzone","core-forms-fileuploader--inline","core-forms-fileuploader--no-label","core-forms-fileuploader--samples-inside-disabled","core-forms-fileuploader--samples-inside-grid","core-forms-fileuploader--samples-outside","core-forms-fileuploader--variants","core-forms-imagedropzone--basic","core-forms-imagedropzone--controlled","core-forms-imagedropzone--disabled","core-forms-imagedropzone--variants","core-forms-imagedropzone--with-default-image","core-forms-imagedropzone--with-file-size-limit","core-forms-imagedropzone--with-file-type-restriction","core-forms-numberinput--basic","core-forms-numberinput--controlled","core-forms-numberinput--disabled","core-forms-numberinput--ghost-variant","core-forms-numberinput--read-only","core-forms-numberinput--variants","core-forms-numberinput--with-custom-step","core-forms-numberinput--with-description","core-forms-numberinput--with-error","core-forms-numberinput--with-error-and-error-message","core-forms-numberinput--with-label","core-forms-numberinput--with-label-at-start","core-forms-numberinput--with-min-and-max","core-forms-numberinput--without-stepper","core-forms-pagination--controlled","core-forms-pagination--disabled","core-forms-pagination--primary","core-forms-pagination--read-only","core-forms-pagination--variants","core-forms-pagination--with-custom-messages","core-forms-pagination--with-default-value","core-forms-pagination--with-large-numbers","core-forms-pagination--with-step","core-forms-pagination--without-actions","core-forms-radiogroup--basic","core-forms-radiogroup--controlled","core-forms-radiogroup--custom-render-option","core-forms-radiogroup--default-value","core-forms-radiogroup--disabled","core-forms-radiogroup--disabled-values","core-forms-radiogroup--horizontal","core-forms-radiogroup--read-only","core-forms-radiogroup--with-group-label","core-forms-radiogroup--with-group-label-at-start","core-forms-radiogroup--with-option-description","core-forms-radiogroup--with-option-label-at-start","core-forms-rangecalendar--default","core-forms-rangecalendar--disabled","core-forms-rangecalendar--extra-small","core-forms-rangecalendar--extra-small-no-title","core-forms-rangecalendar--fixed-weeks","core-forms-rangecalendar--international-calendar","core-forms-rangecalendar--read-only","core-forms-rangecalendar--select-month","core-forms-rangecalendar--select-month-and-year","core-forms-rangecalendar--select-month-and-year-with-title","core-forms-rangecalendar--select-month-with-title","core-forms-rangecalendar--unavailable-dates","core-forms-rangecalendar--with-default-value","core-forms-rangecalendar--with-min-max","core-forms-rangecalendar--with-title","core-forms-searchinput--basic","core-forms-searchinput--clear-button-focusable","core-forms-searchinput--disabled","core-forms-searchinput--variants","core-forms-select--basic","core-forms-select--controlled","core-forms-select--empty-items","core-forms-select--ghost","core-forms-select--long-labels","core-forms-select--long-list","core-forms-select--read-only","core-forms-select--scrollable","core-forms-select--with-autocomplete","core-forms-select--with-controlled-open","core-forms-select--with-custom-trigger","core-forms-select--with-default-open","core-forms-select--with-default-selected-item","core-forms-select--with-description","core-forms-select--with-disabled","core-forms-select--with-disabled-items","core-forms-select--with-error","core-forms-select--with-error-and-error-message","core-forms-select--with-label","core-forms-select--with-label-at-start","core-forms-select--with-section-headers","core-forms-select--with-sections","core-forms-select--with-virtualized-section-headers","core-forms-select--with-warning","core-forms-select--with-warning-and-warning-message","core-forms-select-iconselect--basic","core-forms-select-iconselect--disabled","core-forms-select-iconselect--read-only","core-forms-select-iconselect--with-default-open","core-forms-select-iconselect--with-error","core-forms-select-iconselect--with-warning","core-forms-select-iconselect--without-icon","core-forms-select-iconselect--without-tooltip","core-forms-select-multiselect--basic","core-forms-select-multiselect--controlled","core-forms-select-multiselect--ghost","core-forms-select-multiselect--hide-clear","core-forms-select-multiselect--hide-select-all","core-forms-select-multiselect--hide-select-all-and-clear","core-forms-select-multiselect--long-labels-as-tags","core-forms-select-multiselect--long-list","core-forms-select-multiselect--max-count-1","core-forms-select-multiselect--max-count-3","core-forms-select-multiselect--read-only","core-forms-select-multiselect--read-only-with-tags-open","core-forms-select-multiselect--scrollable","core-forms-select-multiselect--with-autocomplete","core-forms-select-multiselect--with-controlled-open","core-forms-select-multiselect--with-custom-trigger","core-forms-select-multiselect--with-default-open","core-forms-select-multiselect--with-default-selected-item","core-forms-select-multiselect--with-description","core-forms-select-multiselect--with-disabled","core-forms-select-multiselect--with-disabled-items","core-forms-select-multiselect--with-error","core-forms-select-multiselect--with-error-and-error-message","core-forms-select-multiselect--with-error-and-tags","core-forms-select-multiselect--with-label","core-forms-select-multiselect--with-label-at-start","core-forms-select-multiselect--with-sections","core-forms-select-multiselect--with-warning","core-forms-select-multiselect--with-warning-and-warning-message","core-forms-slider--basic","core-forms-slider--controlled","core-forms-slider--disabled","core-forms-slider--read-only","core-forms-slider--read-only-with-number-input","core-forms-slider--with-description","core-forms-slider--with-label","core-forms-slider--with-label-and-number-input","core-forms-slider--with-min-and-max","core-forms-slider--with-number-input","core-forms-slider--with-step","core-forms-slider-iconslider--basic","core-forms-slider-iconslider--disabled","core-forms-slider-iconslider--with-number-input","core-forms-slider-iconslider--without-tooltip","core-forms-switch--basic","core-forms-switch--disabled","core-forms-switch--selected","core-forms-switch--selected-disabled","core-forms-switch--with-description","core-forms-switch--with-description-disabled","core-forms-switch--with-description-in-left-and-status","core-forms-switch--with-description-in-left-long-label","core-forms-switch--with-description-on-top","core-forms-switch--with-label","core-forms-switch--with-label-and-status","core-forms-switch--with-label-in-left-and-status","core-forms-switch--with-label-in-left-and-status-disabled","core-forms-taggedpagination--basic","core-forms-taggedpagination--disabled","core-forms-taggedpagination--disabled-steppers","core-forms-taggedpagination--read-only","core-forms-taggedpagination--variant","core-forms-taggedpagination--with-page-label","core-forms-textinput--basic","core-forms-textinput--controlled","core-forms-textinput--disabled","core-forms-textinput--focusing-the-input","core-forms-textinput--ghost-variant","core-forms-textinput--html-forms","core-forms-textinput--multiline","core-forms-textinput--multiline-variants","core-forms-textinput--multiline-with-rows","core-forms-textinput--read-only","core-forms-textinput--variants","core-forms-textinput--with-description","core-forms-textinput--with-error-message","core-forms-textinput--with-label","core-forms-textinput--with-label-at-start","core-forms-textinput--with-warning-message","core-forms-timefield--basic","core-forms-timefield--controlled","core-forms-timefield--default-value","core-forms-timefield--disabled","core-forms-timefield--ghost-variant","core-forms-timefield--html-forms","core-forms-timefield--placeholder-value","core-forms-timefield--read-only","core-forms-timefield--variants","core-forms-timefield--with-error-message","core-forms-timefield--with-error-message-only","core-forms-timefield--with-label","core-forms-timefield--with-label-at-start","core-forms-timefield--with-min-and-max-value","core-forms-timefield--with-warning-message","core-media-audioplayer--basic","core-media-audioplayer--small","core-miscellaneous-editor--basic","core-miscellaneous-editor--headless-clipboard-hooks","core-miscellaneous-editor--headless-custom","core-miscellaneous-editor--headless-document-model","core-miscellaneous-editor--headless-max-length","core-miscellaneous-editor--headless-paragraphs","core-miscellaneous-editor--headless-styles","core-miscellaneous-editor-plain--auto-focus","core-miscellaneous-editor-plain--auto-focus-at-end","core-miscellaneous-editor-plain--auto-focus-at-start","core-miscellaneous-editor-plain--clear-on-cancel","core-miscellaneous-editor-plain--clear-on-save","core-miscellaneous-editor-plain--controlled","core-miscellaneous-editor-plain--custom-submit-icon","core-miscellaneous-editor-plain--default-save-disabled","core-miscellaneous-editor-plain--disabled","core-miscellaneous-editor-plain--minimal","core-miscellaneous-editor-plain--minimal-disabled","core-miscellaneous-editor-plain--minimal-multiline","core-miscellaneous-editor-plain--minimal-save-disabled","core-miscellaneous-editor-plain--not-inline","core-miscellaneous-editor-plain--save-on-enter","core-miscellaneous-editor-plain--variants","core-miscellaneous-editor-plain--with-cancel","core-miscellaneous-editor-plain--with-dynamic-caret-position","core-miscellaneous-editor-rich-text--auto-focus","core-miscellaneous-editor-rich-text--auto-focus-at-end","core-miscellaneous-editor-rich-text--clear-on-cancel","core-miscellaneous-editor-rich-text--clear-on-save","core-miscellaneous-editor-rich-text--controlled","core-miscellaneous-editor-rich-text--default","core-miscellaneous-editor-rich-text--disabled","core-miscellaneous-editor-rich-text--long-content","core-miscellaneous-editor-rich-text--mentions","core-miscellaneous-editor-rich-text--mentions-max-suggestions","core-miscellaneous-editor-rich-text--not-inline","core-miscellaneous-editor-rich-text--save-disabled","core-miscellaneous-editor-rich-text--save-on-enter","core-miscellaneous-editor-rich-text--variants","core-miscellaneous-editor-rich-text--with-cancel","core-miscellaneous-editor-rich-text--with-custom-footer-buttons","core-miscellaneous-editor-rich-text--with-placeholder","core-miscellaneous-freehandcanvas--basic","core-miscellaneous-freehandcanvas--clear-button","core-miscellaneous-freehandcanvas--controlled","core-miscellaneous-freehandcanvas--default-value","core-miscellaneous-freehandcanvas--disabled","core-miscellaneous-freehandcanvas--history-enabled","core-miscellaneous-freehandcanvas--label","core-miscellaneous-freehandcanvas--streamlining","core-miscellaneous-icon--basic","core-miscellaneous-toolbar--basic","core-miscellaneous-toolbar--collapsible","core-miscellaneous-toolbar--vertical","core-miscellaneous-toolbar--with-inputs","core-miscellaneous-toolbar--with-over-flow","core-miscellaneous-toolbar--with-tabbing-within","core-miscellaneous-toolbar--with-tooltip","core-navigation-accordion--basic","core-navigation-accordion--controlled","core-navigation-accordion--default-expanded-keys","core-navigation-accordion--disabled","core-navigation-accordion--single-expansion","core-navigation-accordion-accordionitem--force-mount","core-navigation-accordion-accordionitem--show-actions-on-trigger-only","core-navigation-accordion-accordionitem--with-buttons","core-navigation-accordion-accordionitem--with-sub-labels","core-navigation-accordion-accordionitem--with-tabbable-content","core-navigation-breadcrumbs--basic","core-navigation-breadcrumbs--collapsed","core-navigation-breadcrumbs--custom-separator","core-navigation-breadcrumbs--disabled","core-navigation-breadcrumbs--variants","core-navigation-breadcrumbs--with-icons","core-navigation-breadcrumbs--with-select","core-navigation-disclosure--basic","core-navigation-disclosure--controlled","core-navigation-disclosure--truncated-title","core-navigation-disclosure--variants","core-navigation-disclosure--with-custom-icon","core-navigation-disclosure--with-interactive-content","core-navigation-disclosure--with-long-content","core-navigation-disclosure--without-description","core-navigation-link--basic","core-navigation-link--client-side-action","core-navigation-link--variants","core-navigation-stepper--all-complete","core-navigation-stepper--all-states","core-navigation-stepper--condensed","core-navigation-stepper--controlled","core-navigation-stepper--default","core-navigation-stepper--expanded-without-descriptions","core-navigation-stepper--frontier-ahead-of-selection","core-navigation-stepper--indicator-only","core-navigation-stepper--indicator-only-expanded","core-navigation-stepper--is-disabled","core-navigation-stepper--long-title-and-description","core-navigation-stepper--mixed-indicator-and-titled-items","core-navigation-stepper--per-item-aria-label-overrides-title","core-navigation-stepper--single-item","core-navigation-stepper--size-small-condensed","core-navigation-stepper--size-small-expanded","core-navigation-stepper--two-steps","core-navigation-stepper--with-disabled-completed-step","core-navigation-stepper--with-disabled-step","core-navigation-tabs--basic","core-navigation-tabs--controlled","core-navigation-tabs--ghost","core-navigation-tabs--with-action-button","core-navigation-tabs--with-close-button","core-navigation-tabs--with-default-selected","core-navigation-tabs--with-disabled","core-navigation-tabs--with-disabled-and-close-button","core-navigation-tabs--with-focusable-content","core-navigation-tabs--with-specific-disabled","core-navigation-tabs-tabitem--with-icon","core-overlays-alertdialog--auto-focus-cancel-button","core-overlays-alertdialog--basic","core-overlays-alertdialog--custom-focused-button","core-overlays-alertdialog--default-open","core-overlays-alertdialog--long-content","core-overlays-alertdialog--only-cancel-button","core-overlays-alertdialog--only-primary-action","core-overlays-alertdialog--primary-action-disabled","core-overlays-alertdialog--separate-close-handler","core-overlays-alertdialog--with-text-input","core-overlays-alertdialog--with-title-only","core-overlays-alertdialog--without-close-button","core-overlays-alertdialog--without-icon","core-overlays-alertdialog--without-message-and-actions","core-overlays-dialog--basic","core-overlays-dialog--default-open","core-overlays-dialog--different-sizes","core-overlays-dialog--ghost","core-overlays-drawer--basic","core-overlays-drawer--with-action","core-overlays-inlinetoolbar--basic","core-overlays-inlinetoolbar--controlled","core-overlays-inlinetoolbar--disabled","core-overlays-inlinetoolbar--disabled-keys","core-overlays-inlinetoolbar--with-interactive-element","core-overlays-inlinetoolbar--with-scroll","core-overlays-modal--basic","core-overlays-modal--controlled","core-overlays-modal--default-open","core-overlays-modal-modalcontent--disabled-animation","core-overlays-modal-modalcontent--drawer-mobile","core-overlays-modal-modalcontent--drawer-mobile-with-nested-popover","core-overlays-modal-modalcontent--form-controls","core-overlays-modal-modalcontent--long-content","core-overlays-modal-modalcontent--not-dismissable","core-overlays-modal-modalcontent--uncontrolled-interaction-outside","core-overlays-modal-modalcontent--with-disabled-focus-management","core-overlays-modal-modalcontent--with-inert","core-overlays-popover--basic","core-overlays-popover--event-leak-fix","core-overlays-popover--with-arrow","core-overlays-popover--with-boundary-element","core-overlays-popover--with-custom-target","core-overlays-popover--with-dynamic-trigger-width","core-overlays-popover--with-no-boundary","core-overlays-popover--with-scrollable-content","core-overlays-popover--with-scrollable-content-non-modal","core-overlays-popover--with-scrollable-viewport","core-overlays-popover--with-tooltip","core-overlays-popover-popovercontent--basic","core-overlays-popover-popovercontent--contained-focus","core-overlays-popover-popovercontent--default-open-with-arrow","core-overlays-popover-popovercontent--disable-animation","core-overlays-popover-popovercontent--manual-repositioning","core-overlays-popover-popovercontent--nested-scrollable-containers","core-overlays-popover-popovercontent--scroll-repositioning","core-overlays-popover-popovercontent--with-boundary-axis","core-overlays-popover-popovercontent--with-horizontal-boundary-behavior","core-overlays-popover-popovertrigger--basic","core-overlays-popover-popovertrigger--function-children","core-overlays-popover-popovertrigger--with-updated-position","core-overlays-tooltip--basic","core-overlays-tooltip--controlled-open","core-overlays-tooltip--disabled","core-overlays-tooltip--focus-trigger","core-overlays-tooltip--no-text","core-overlays-tooltip--placement","core-overlays-tooltip--variants","core-overlays-tooltip--variants-size","core-overlays-tooltip--with-cross-offset","core-overlays-tooltip--with-focusable","core-overlays-tooltip--with-offset","core-overlays-tooltip--with-on-open-change","core-status-inlinealert--basic","core-status-inlinealert--compact","core-status-inlinealert--compact-with-action","core-status-inlinealert--compact-with-action-and-close","core-status-inlinealert--multi-line","core-status-inlinealert--multi-line-with-action","core-status-inlinealert--multi-line-with-action-and-close","core-status-inlinealert--sizes","core-status-inlinealert--variants","core-status-inlinealert--with-action","core-status-inlinealert--with-action-and-close","core-status-progressbar--basic","core-status-progressbar--variants","core-status-progressbar--with-custom-number-formatter","core-status-progressbar--with-custom-value-label","core-status-progressbar--with-error","core-status-progressbar--with-max-value","core-status-progressbar--with-min-and-max-value","core-status-progressbar--with-min-value","core-status-progressbar--with-no-description","core-status-progressbar--with-no-label","core-status-progressbar--with-show-value","core-status-progressspinner--error","core-status-progressspinner--primary","core-status-progressspinner--success","core-status-progressspinner--variants","core-status-progressspinner--without-label","core-status-toast--basic","core-status-toast--timeout","core-status-toast--variants-with-action","core-status-toast--variants-without-action","core-status-toast--with-action","core-utilities-actionable--basic","core-utilities-actionable--disabled","core-utilities-actionable--with-complex-content","core-utilities-actionable--with-div","core-utilities-actionable--with-dynamic-button-styling","core-utilities-actionable--with-dynamic-child-styling","core-utilities-box--basic","core-utilities-box--element-type","core-utilities-box--flex-layout","core-utilities-box--media-queries","core-utilities-box--nested-boxes","core-utilities-dateformat--basic","core-utilities-dateformat--time-only","core-utilities-dateformat--time-only-with-time-zone","core-utilities-dateformat--time-zone-24-hour","core-utilities-dateformat--with-date-and-time","core-utilities-deviceprovider--always-desktop","core-utilities-deviceprovider--always-mobile","core-utilities-deviceprovider--basic","core-utilities-deviceprovider--custom-breakpoints","core-utilities-frameprovider--always-contained","core-utilities-frameprovider--basic","core-utilities-frameprovider--custom-portal-container","core-utilities-frameprovider--inside-shadow-root","core-utilities-frameprovider--nested-containers","core-utilities-frameprovider--never-contained","core-utilities-frameprovider--popover-with-frame-boundary","core-utilities-frameprovider--portal-container-outside-container","core-utilities-frameprovider--with-interactive-elements-outside-of-container","core-utilities-group--basic","core-utilities-i18nprovider--string-format","core-utilities-messageformat--basic","core-utilities-numberformat--basic","core-utilities-numberformat--currency","core-utilities-numberformat--currency-with-fraction-digits","core-utilities-numberformat--currency-with-fraction-digits-and-currency-display","core-utilities-numberformat--percent","core-utilities-numberformat--percent-with-fraction-digits","core-utilities-panel--basic","core-utilities-panel--collapsible","core-utilities-panel--conditional","core-utilities-panel--controlled","core-utilities-panel--disabled-handle","core-utilities-panel--max-size","core-utilities-panel--multiple","core-utilities-panel--nested","core-utilities-panel--persistent","core-utilities-panel--vertical","core-utilities-portal--basic","core-utilities-themeprovider--basic","json-render-examples--dashboard","json-render-examples--data-table","json-render-examples--login-form","json-render-examples--settings-panel"];var h={version:"3.9.0"};var b=`
+* [Theme documentation](/docs/theming--docs) - Learn about Baseline UI's theming system`};var m={"8":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","ChevronRightFilledIcon","ChevronRightIcon","EllipseIcon","MinusIcon","PlusIcon","XIcon"],"12":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","EditIcon","EllipseIcon","EnterKeyIcon","LockFilledIcon","LockIcon","MinusIcon","MoreVIcon","MoreIcon","PlaceholderIcon","PlusIcon","SearchIcon","SizeIcon","TrashIcon","XIcon","ZoomIcon"],"16":["AlignBottomIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDiagonalTopLeftBottomRightIcon","ArrowDownCircleFilledIcon","ArrowDownIcon","ArrowIcon","ArrowLeftRightIcon","ArrowRightIcon","ArrowUpArrowDownIcon","ArrowUpIcon","AtIcon","AttachmentsIcon","AvatarIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BulletListIcon","CalendarIcon","CaretLeftIcon","CaretRightIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","CircleFilledIcon","ClockIcon","CopyIcon","CustomizeIcon","DocumentEditIcon","DownloadIcon","DuplicateIcon","EditIcon","ElipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FilterAltIcon","FolderIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FullScreenIcon","HelpCircleIcon","HelpIcon","HereIcon","HideIcon","HighlightTextAltIcon","HighlightTextIcon","HorizontalScrollIcon","ImageIcon","InfoCircleFilledIcon","InsertIcon","ItalicIcon","LightBulbIcon","LineIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MeasureIcon","MinusIcon","MoreIcon","MoreVerticalIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","NumberedListIcon","OpenIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageVerticalScrollIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PlaceholderIcon","PlayIcon","PlusIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","ReadOnlyIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedoIcon","RemoveFormattingIcon","ReorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RulerIcon","SearchIcon","SettingsIcon","ShowIcon","SlashCommandsIcon","SoundRecordIcon","StampIcon","StarFilledIcon","StarIcon","StrikeoutTextAltIcon","TableCellIcon","TableColumnIcon","TableHeaderIcon","TableIcon","TableRowIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextDecreaseIndentIcon","TextIcon","TextIncreaseIndentIcon","TextMarkIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UndoIcon","UnlockIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WindowedIcon","WorkflowIcon","XCircleFilledIcon","XIcon"],"20":["AddPageIcon","AnonymousIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpCircleFilledIcon","AtIcon","AvatarFilledIcon","BoldIcon","CalloutIcon","CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ClockIcon","CollapseIcon","CommentIcon","CopyIcon","CutIcon","DistanceIcon","DownloadIcon","DuplicateIcon","EditIcon","EllipseIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorAlternativeCircleIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FormDateIcon","FormSignatureIcon","FormTextFieldIcon","HelpCircleIcon","HighlightTextIcon","HomeIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","ItalicIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MinusIcon","MoreIcon","MoreVerticalIcon","MoveIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OpenIcon","PageMoveLeftIcon","PageMoveRightIcon","PagesInsertIcon","PasteIcon","PipetteIcon","PlusIcon","PrintIcon","RotateClockwiseIcon","SearchIcon","SettingsIcon","ShapeIcon","ShareIcon","SoundIcon","SoundRecordIcon","StarFilledIcon","StarIcon","StyleIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UploadIcon","WarningFilledIcon","WarningIcon","XCircleFilledIcon","XCircleIcon","XIcon"],"24":["AddNoteCloudIcon","AddNoteIcon","AddTextSerifIcon","AiIcon","AirplaneIcon","AlignBottomIcon","AlignHorizontalCenterIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDownIcon","ArrowIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpIcon","AtIcon","AttachmentIcon","AvatarFilledIcon","AvatarIcon","BlendModeIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BorderColorIcon","BottomBorderIcon","BulletListIcon","CalibrateIcon","CaptureAddIcon","CaretDownIcon","CaretIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ChevronListIcon","ClockIcon","CloudyBorderIcon","CollapseIcon","ColorPaletteIcon","ColorSwatchIcon","CommentIcon","CommentInSidebarIcon","CommentOnPageIcon","CompareDocumentsIcon","CopyIcon","CopyPageIcon","CropIcon","CustomizeIcon","CutIcon","DateModifiedIcon","DatePlusIcon","DebugIcon","DocumentArrowDownCircleIcon","DocumentArrowDownIcon","DocumentArrowRightIcon","DocumentFilledIcon","DocumentLockIcon","DocumentPdfIcon","DownloadIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","DuplicateIcon","EditAnnotationsIcon","EditContentIcon","EditDocumentIcon","EditIcon","EditThumbnailsIcon","EllipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","EndCapArrowFilledIcon","EndCapArrowIcon","EndCapChevronFilledIcon","EndCapChevronIcon","EndCapCircleIcon","EndCapDiamondIcon","EndCapNoneIcon","EndCapSlantedIcon","EndCapSquareIcon","EndCapStraightIcon","EraserIcon","ErrorAltCircleFilledIcon","ErrorAltIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","ExpandVerticalIcon","FillColorIcon","FilterIcon","FitToHeightIcon","FivePagesHorizontalFilledIcon","FivePagesVerticalFilledIcon","FolderAddIcon","FolderIcon","FontListIcon","FontSizeIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormPageIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FormTwoRadioButtonsIcon","FourPagesGridFilledIcon","FourPagesHorizontalFilledIcon","FourPagesStackedFilledIcon","FourPagesVerticalFilledIcon","GroupIcon","HamburgerMenuIcon","HandIcon","HeartIcon","HideIcon","HideRevealIcon","HighlightTextIcon","HomeIcon","HorizontalScollIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","InitialsIcon","InnerHorizontalBorderIcon","InnerVerticalBorderIcon","InsertIcon","ItalicIcon","LayerBottomIcon","LayerDownIcon","LayerTopIcon","LayerUpIcon","LayersIcon","LeftBindingIcon","LeftBorderIcon","LineCapsIcon","LineIcon","LineSpacingIcon","LineStyleCloudyIcon","LineStyleDashedDoubleDashIcon","LineStyleDashedDoubleGapIcon","LineStyleDashedQuadrupleDashIcon","LineStyleDashedSingleGapIcon","LineStyleIcon","LineStyleSolidIcon","LineWidthIcon","LinkIcon","LockFilledIcon","LockIcon","MagicIcon","MagicPenIcon","MailIcon","MarkupIcon","MarqueeZoomIcon","MeasureIcon","MergeIcon","MessageCloudIcon","MinusIcon","MoonIcon","MoreCircleIcon","MoreIcon","MoreVerticalIcon","MoveAllDirectionsIcon","MoveLeftIcon","MoveLeftRightIcon","MoveRightIcon","MultiplePagesIcon","NonEditableIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OcrIcon","OpacityIcon","PageAddIcon","PageCurlIcon","PageDuplicateIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLandscapeIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageMoveLeftIcon","PageMoveRightIcon","PageNumberCircleIcon","PageNumberIcon","PagePortraitIcon","PageRemoveIcon","PageVerticalScrollIcon","PagesInsertAltIcon","PagesInsertIcon","PagesNewFromSelectionAltIcon","PagesNewFromSelectionIcon","PagesSelectAllIcon","PagesSelectNoneIcon","PasteBoardIcon","PastePageIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PinDropFilledIcon","PinDropIcon","PipetteIcon","PlayIcon","PlusCircleFilledIcon","PlusCircleIcon","PlusIcon","PointerIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","PrecisionIcon","PrintIcon","PrivateModeIcon","PushPinIcon","QuestionmarkCircleIcon","ReaderViewIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedactIcon","RedactRectangleIcon","RedactTextHighlighterIcon","RedactionTextRepeatingIcon","RedactionTextSingleIcon","RedoAllIcon","RedoIcon","RegexIcon","ReplaceIcon","RightBindingIcon","RightBorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RotateObjectClockwiseIcon","RotateObjectCounterClockwiseIcon","RulerIcon","ScaleIcon","SearchCircleIcon","SearchIcon","SearchSelectionIcon","SelectAllIcon","SelectionToolIcon","SettingsIcon","ShapesIcon","ShareAltIcon","ShareIcon","ShieldAddIcon","ShieldCheckmarkIcon","ShieldWarningIcon","ShieldXIcon","ShowIcon","SidebarIcon","SignOutIcon","SignatureDigitalIcon","SignatureIcon","SinglePageFilledIcon","SoundIcon","SquigglyTextIcon","StampAddIcon","StampIcon","StarFilledIcon","StarIcon","StartCapArrowFilledIcon","StartCapArrowIcon","StartCapChevronFilledIcon","StartCapChevronIcon","StartCapCircleIcon","StartCapDiamondIcon","StartCapNoneIcon","StartCapSlantedIcon","StartCapSquareIcon","StartCapStraightIcon","StrikeoutTextIcon","StyleFilledIcon","StyleIcon","StylusFilledIcon","StylusIcon","SunIcon","TableCellIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextColorIcon","TextIcon","TextPropertiesHideIcon","TextPropertiesShowIcon","TextSerifIcon","TextSmallerIcon","ThreePagesHorizontalFilledIcon","ThreePagesStackedFilledIcon","ThreePagesVerticalFilledIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TopBorderIcon","TrashIcon","TwoPagesHorizontalFilledIcon","TwoPagesVerticalFilledIcon","TypeTextIcon","UnderlineIcon","UnderlineTextIcon","UndoAllIcon","UndoIcon","UndoRedoIcon","UngroupIcon","UnlockIcon","UploadIcon","UserIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WidgetIcon","WorkflowIcon","XCircleFilledIcon","XCircleIcon","XIcon","ZoomInIcon","ZoomOutIcon"],"36":["ArrowRight","Check","Circle","Cross","Help","Inset","Key","NewParagraphAlt","NewParagraph","Note","PointerRight","SpeechBubble","Star"]};var r=["charts-barchart--basic","charts-barchart--custom-colors","charts-barchart--formatted","charts-barchart--hidden-axes","charts-barchart--many-series","charts-barchart--mixed-stacking","charts-barchart--single-series","charts-barchart--stacked","charts-barchart--stacked-with-three-series","charts-barchart--thicker-bars","charts-barchart--with-legend","charts-linechart--basic","charts-linechart--custom-colors","charts-linechart--formatted","charts-linechart--hidden-axes","charts-linechart--linear-curve","charts-linechart--many-lines","charts-linechart--single-line","charts-linechart--sparkline","charts-linechart--with-dots","charts-linechart--with-legend","charts-piechart--basic","charts-piechart--custom-colors","charts-piechart--donut","charts-piechart--long-legend-names","charts-piechart--many-slices","charts-piechart--no-labels","charts-piechart--no-legend","charts-piechart--no-tooltip","charts-piechart--small-slices-below-five-percent","core-buttons-actionbutton--as-div","core-buttons-actionbutton--basic","core-buttons-actionbutton--disabled","core-buttons-actionbutton--variants","core-buttons-actionbutton--with-both-icons","core-buttons-actionbutton--with-icon","core-buttons-actionbutton--with-popover","core-buttons-actiongroup--basic","core-buttons-actiongroup--default-selected","core-buttons-actiongroup--disabled","core-buttons-actiongroup--disabled-items","core-buttons-actiongroup--disabled-items-multi-select","core-buttons-actiongroup--disabled-with-selection","core-buttons-actiongroup--multi-select","core-buttons-actiongroup--multiple-default-selected","core-buttons-actiongroup--multiple-selected-items","core-buttons-actiongroup--single-item","core-buttons-actiongroup--single-select","core-buttons-actiongroup--with-custom-action-item","core-buttons-actiongroup--with-icon","core-buttons-actiongroup--with-icon-disabled","core-buttons-actiongroup--with-icon-multi-select","core-buttons-actiongroup--without-tooltip","core-buttons-actioniconbutton--basic","core-buttons-actioniconbutton--disabled","core-buttons-actioniconbutton--variants","core-buttons-actioniconbutton--with-popover","core-buttons-actioniconbutton--with-tooltip","core-buttons-reaction--basic","core-buttons-reaction--disabled","core-buttons-reaction--read-only","core-buttons-reaction--selected","core-buttons-reaction--variants","core-buttons-scrollcontrolbutton--basic","core-buttons-scrollcontrolbutton--hide-for-keyboard","core-buttons-scrollcontrolbutton--with-custom-delay","core-buttons-scrollcontrolbutton--with-reversed-items","core-buttons-scrollcontrolbutton--without-smooth-scroll","core-buttons-togglebutton--basic","core-buttons-togglebutton--controlled","core-buttons-togglebutton--default-selected","core-buttons-togglebutton--disabled","core-buttons-togglebutton--variants","core-buttons-togglebutton--with-icon","core-buttons-toggleiconbutton--basic","core-buttons-toggleiconbutton--primary-variants","core-buttons-toggleiconbutton--secondary-variants","core-buttons-toggleiconbutton--state-specific-icons","core-buttons-toggleiconbutton--teritary-variants","core-buttons-toggleiconbutton--toolbar-variants","core-buttons-toggleiconbutton--with-tooltip","core-collections-filelist--basic","core-collections-filelist--disabled","core-collections-filelist--disabled-items","core-collections-filelist--expanded","core-collections-filelist--expanded-disabled","core-collections-filelist--grid","core-collections-filelist--loading","core-collections-filelist--long-filename","core-collections-filelist--many-expanded","core-collections-filelist--many-grid","core-collections-filelist--many-items","core-collections-filelist--mixed-states","core-collections-filelist--with-description","core-collections-filelist--with-error","core-collections-gridlist--basic","core-collections-gridlist--default-selected-keys","core-collections-gridlist--disabled","core-collections-gridlist--disabled-rows","core-collections-gridlist--disallow-empty-selection","core-collections-gridlist--with-drag-and-drop","core-collections-gridlist--with-multiple-selection","core-collections-gridlist--with-single-selection","core-collections-imagegallery--basic","core-collections-imagegallery--more-items","core-collections-imagegallery--rtl-with-virtualization","core-collections-imagegallery--scrollable","core-collections-imagegallery--with-controlled-list","core-collections-imagegallery--with-custom-aspect-ratio","core-collections-imagegallery--with-custom-fit","core-collections-imagegallery--with-custom-image-dimensions","core-collections-imagegallery--with-custom-image-renderer","core-collections-imagegallery--with-custom-size","core-collections-imagegallery--with-deletion","core-collections-imagegallery--with-disabled-deletion","core-collections-imagegallery--with-dynamic-list","core-collections-imagegallery--with-long-labels","core-collections-imagegallery--with-medium-size","core-collections-imagegallery--with-multiple-selection","core-collections-imagegallery--with-reordering","core-collections-imagegallery--with-single-selection","core-collections-imagegallery--with-single-selection-and-deletion","core-collections-imagegallery--with-virtualization","core-collections-listbox--basic","core-collections-listbox--controlled-auto-scroll","core-collections-listbox--drag-and-drop-custom-preview","core-collections-listbox--drag-and-drop-grid","core-collections-listbox--drag-and-drop-horizontal","core-collections-listbox--drag-and-drop-multiple","core-collections-listbox--drag-and-drop-single","core-collections-listbox--dynamic-items","core-collections-listbox--with-custom-option-style","core-collections-listbox--with-customized-section-titles","core-collections-listbox--with-default-selected","core-collections-listbox--with-disabled-items","core-collections-listbox--with-focus-loop","core-collections-listbox--with-padded-section-titles","core-collections-listbox--with-section-titles","core-collections-listbox--with-sections","core-collections-listbox--with-selected","core-collections-menu--basic","core-collections-menu--controlled-open","core-collections-menu--disabled","core-collections-menu--long-menu","core-collections-menu--multiple-selection","core-collections-menu--section-level-selection","core-collections-menu--single-selection","core-collections-menu--with-custom-options","core-collections-menu--with-custom-trigger","core-collections-menu--with-disabled-keys","core-collections-menu--with-disabled-submenu","core-collections-menu--with-icons","core-collections-menu--with-long-labels","core-collections-menu--with-sections","core-collections-menu--with-selected-keys-controlled","core-collections-menu--with-submenu","core-collections-table--async-loading","core-collections-table--default","core-collections-table--disabled-rows","core-collections-table--drag-and-drop","core-collections-table--empty","core-collections-table--long-text-content","core-collections-table--multiple-selection","core-collections-table--row-action","core-collections-table--selection-with-row-action","core-collections-table--single-selection","core-collections-table--sorting","core-collections-table--virtualized","core-collections-table--with-tag-and-menu","core-collections-table--with-toolbar","core-collections-taggroup--basic","core-collections-taggroup--disabled","core-collections-taggroup--disabled-items","core-collections-taggroup--group-variants","core-collections-taggroup--multi-select","core-collections-taggroup--removable","core-collections-taggroup--single-select","core-collections-taggroup--small-variants","core-collections-taggroup--variants","core-collections-treeview--basic","core-collections-treeview--custom-row","core-collections-treeview--custom-row-drag-and-drop","core-collections-treeview--deeply-nested","core-collections-treeview--drag-and-drop","core-collections-treeview--empty-tree","core-collections-treeview--flat-tree","core-collections-treeview--handle-only-drag-and-drop","core-collections-treeview--interactive-fields-drag-and-drop","core-collections-treeview--long-labels","core-collections-treeview--single-item","core-collections-treeview--virtualized-drag-and-drop","core-collections-treeview--virtualized-with-actions","core-collections-treeview--virtualized-with-descriptions","core-collections-treeview--virtualized-with-expand-control","core-collections-treeview--virtualized-with-rename","core-collections-treeview--with-actions-at-end","core-collections-treeview--with-controlled-expanded-keys","core-collections-treeview--with-custom-render-icons","core-collections-treeview--with-custom-render-item-title","core-collections-treeview--with-default-expanded-keys","core-collections-treeview--with-description","core-collections-treeview--with-icons","core-collections-treeview--with-primary-action","core-collections-treeview--with-primary-and-secondary-action","core-collections-treeview--with-primary-secondary-and-description-action","core-collections-treeview--with-rename","core-collections-treeview--with-selected-items","core-collections-treeview--with-virtualization","core-collections-unsafe-listbox--basic","core-collections-unsafe-listbox--controlled-auto-scroll","core-collections-unsafe-listbox--drag-and-drop-custom-preview","core-collections-unsafe-listbox--drag-and-drop-grid","core-collections-unsafe-listbox--drag-and-drop-horizontal","core-collections-unsafe-listbox--drag-and-drop-multiple","core-collections-unsafe-listbox--drag-and-drop-single","core-collections-unsafe-listbox--dynamic-items","core-collections-unsafe-listbox--virtualized-horizontal","core-collections-unsafe-listbox--virtualized-scroll-into-view","core-collections-unsafe-listbox--virtualized-vertical","core-collections-unsafe-listbox--virtualized-with-section-separators","core-collections-unsafe-listbox--virtualized-with-sections","core-collections-unsafe-listbox--with-custom-option-style","core-collections-unsafe-listbox--with-customized-section-titles","core-collections-unsafe-listbox--with-default-selected","core-collections-unsafe-listbox--with-disabled-items","core-collections-unsafe-listbox--with-focus-loop","core-collections-unsafe-listbox--with-padded-section-titles","core-collections-unsafe-listbox--with-section-titles","core-collections-unsafe-listbox--with-sections","core-collections-unsafe-listbox--with-selected","core-collections-virtualizer--grid-layout-example","core-collections-virtualizer--list-layout-example","core-collections-virtualizer--rtl-image-gallery-preset-example","core-collections-virtualizer--tree-view-preset-example","core-content-avatar--basic","core-content-avatar--disabled","core-content-avatar--variants","core-content-avatar--with-image","core-content-avatar--with-initials","core-content-avatar--with-notification","core-content-code--basic","core-content-code--with-scroll","core-content-colorswatch--basic","core-content-colorswatch--disabled","core-content-colorswatch--full-transparency","core-content-colorswatch--indeterminate","core-content-colorswatch--interactive","core-content-colorswatch--none","core-content-colorswatch--variants","core-content-colorswatch--with-custom-label","core-content-colorswatch--with-tooltip","core-content-colorswatch--with-transparency","core-content-image--basic","core-content-image--contain","core-content-image--fallback","core-content-kbd--common-shortcuts","core-content-kbd--complex-shortcut","core-content-kbd--key-combination","core-content-kbd--key-combination-with-symbols","core-content-kbd--modifier-key","core-content-kbd--single-key","core-content-kbd--symbols-showcase","core-content-markdown--basic","core-content-markdown--with-caret","core-content-pointpicker--basic","core-content-pointpicker--disabled","core-content-pointpicker-pointpickercontent--custom-cursor","core-content-pointpicker-pointpickercontent--custom-cursor-without-default","core-content-pointpicker-pointpickercontent--default","core-content-pointpicker-pointpickercontent--multiple-point-pickers","core-content-pointpicker-pointpickercontent--points-within-radius","core-content-pointpicker-pointpickercontent--programmatic-focus","core-content-pointpicker-pointpickercontent--snap-to-point","core-content-pointpicker-pointpickercontent--trailing-element","core-content-pointpicker-pointpickercontent--without-grid-lines","core-content-pointpicker-pointpickerdisplay--with-custom-scale","core-content-pointpicker-pointpickerdisplay--with-description","core-content-pointpicker-pointpickerdisplay--with-floating-display","core-content-preview--disabled","core-content-preview--image-preview","core-content-preview--svg-preview","core-content-preview--text-preview","core-content-preview--variants","core-content-preview--without-delete-button","core-content-separator--basic","core-content-separator--secondary","core-content-separator--secondary-vertical","core-content-separator--vertical","core-content-statuscard--basic","core-content-statuscard--interactive","core-content-statuscard--long-content","core-content-statuscard--truncated-title","core-content-statuscard--variants","core-content-statuscard--with-custom-icon","core-content-statuscard--with-trailing-element","core-content-statuscard--without-description","core-content-tag--basic","core-content-tag--disabled","core-content-tag--disabled-removable","core-content-tag--inline-content","core-content-tag--long-text","core-content-tag--removable","core-content-tag--selected","core-content-tag--selected-with-icon","core-content-tag--small","core-content-tag--small-with-icon","core-content-tag--with-icon","core-content-text--basic","core-content-text--slots","core-content-text--variants","core-feedback-skeleton--circle","core-feedback-skeleton--composed-example","core-feedback-skeleton--custom-shape","core-feedback-skeleton--document-view-area","core-feedback-skeleton--rectangle","core-feedback-skeleton--text-line","core-forms-buttonselect--basic","core-forms-buttonselect--controlled","core-forms-buttonselect--controlled-button-selection","core-forms-buttonselect--default-button-selected-value","core-forms-buttonselect--default-select-selected-value","core-forms-buttonselect--disabled","core-forms-buttonselect--exclude-from-tab-order","core-forms-buttonselect--items-without-icons","core-forms-buttonselect--long-text-labels","core-forms-buttonselect--many-items","core-forms-buttonselect--variants","core-forms-buttonselect--with-action-behaviour","core-forms-buttonselect--with-button-disabled-key","core-forms-buttonselect--with-callbacks","core-forms-buttonselect--with-default-open","core-forms-buttonselect--with-disabled-keys","core-forms-buttonselect--with-disabled-keys-and-default-selected","core-forms-buttonselect--with-hidden-label","core-forms-buttonselect--with-individual-button-behaviour","core-forms-buttonselect--with-multiple-disabled-keys","core-forms-buttonselect--with-validation-error","core-forms-buttonselect--without-tooltip","core-forms-calendar--default","core-forms-calendar--disabled","core-forms-calendar--extra-small","core-forms-calendar--extra-small-no-title","core-forms-calendar--fixed-weeks","core-forms-calendar--international-calendar","core-forms-calendar--read-only","core-forms-calendar--select-month","core-forms-calendar--select-month-and-year","core-forms-calendar--select-month-and-year-extra-small","core-forms-calendar--select-month-and-year-with-title","core-forms-calendar--select-month-extra-small","core-forms-calendar--select-month-with-title","core-forms-calendar--unavailable-dates","core-forms-calendar--with-default-value","core-forms-calendar--with-min-max","core-forms-calendar--with-title","core-forms-checkbox--checked","core-forms-checkbox--indeterminate","core-forms-checkbox--primary","core-forms-checkbox--with-error","core-forms-checkbox--with-label-at-end","core-forms-checkbox--with-label-at-start","core-forms-colorinput--basic","core-forms-colorinput--color-presets-only","core-forms-colorinput--controlled","core-forms-colorinput--disabled","core-forms-colorinput--indeterminate","core-forms-colorinput--lazy-picker","core-forms-colorinput--lazy-picker-mobile","core-forms-colorinput--with-alpha","core-forms-colorinput--with-controlled-open","core-forms-colorinput--with-custom-trigger","core-forms-colorinput--with-default-open","core-forms-colorinput--with-default-value","core-forms-colorinput--with-label","core-forms-colorinput--with-label-at-start","core-forms-colorinput--with-removal","core-forms-colorinput--without-alpha","core-forms-colorinput--without-color-label","core-forms-colorinput--without-color-presets","core-forms-colorinput-iconcolorinput--compact","core-forms-colorinput-iconcolorinput--compact-disabled","core-forms-colorinput-iconcolorinput--compact-indeterminate","core-forms-colorinput-iconcolorinput--disabled","core-forms-colorinput-iconcolorinput--indeterminate","core-forms-colorinput-iconcolorinput--standard","core-forms-colorinput-iconcolorinput--without-tooltip","core-forms-colorswatchpicker--basic","core-forms-colorswatchpicker--controlled","core-forms-colorswatchpicker--default-value","core-forms-colorswatchpicker--disabled","core-forms-colorswatchpicker--with-icon","core-forms-colorswatchpicker--with-label","core-forms-colorswatchpicker--with-label-at-start","core-forms-combobox--basic","core-forms-combobox--disabled","core-forms-combobox--dynamic-collections","core-forms-combobox--ghost-variant","core-forms-combobox--items-with-icon","core-forms-combobox--read-only","core-forms-combobox--variants","core-forms-combobox--with-custom-filter","core-forms-combobox--with-custom-number-value","core-forms-combobox--with-custom-value","core-forms-combobox--with-description","core-forms-combobox--with-error-message","core-forms-combobox--with-focus-menu-trigger","core-forms-combobox--with-label-at-start","core-forms-combobox--with-manual-menu-trigger","core-forms-combobox--with-min-max-value","core-forms-combobox--with-render-option","core-forms-combobox--with-tooltip","core-forms-combobox--with-warning-message","core-forms-datefield--basic","core-forms-datefield--controlled","core-forms-datefield--default-value","core-forms-datefield--different-granularity","core-forms-datefield--disabled","core-forms-datefield--ghost-variant","core-forms-datefield--html-forms","core-forms-datefield--placeholder-value","core-forms-datefield--read-only","core-forms-datefield--variants","core-forms-datefield--with-calendar-icon","core-forms-datefield--with-calendar-picker","core-forms-datefield--with-calendar-picker-and-default-value","core-forms-datefield--with-calendar-picker-and-min-max","core-forms-datefield--with-calendar-picker-disabled","core-forms-datefield--with-calendar-picker-error","core-forms-datefield--with-calendar-picker-ghost","core-forms-datefield--with-calendar-picker-read-only","core-forms-datefield--with-error-message","core-forms-datefield--with-error-message-only","core-forms-datefield--with-label","core-forms-datefield--with-label-at-start","core-forms-datefield--with-min-and-max-value","core-forms-datefield--with-warning-message","core-forms-fileinput--basic","core-forms-fileinput--custom-labels","core-forms-fileinput--directory","core-forms-fileinput--disabled","core-forms-fileinput--label-position-start","core-forms-fileinput--multiple","core-forms-fileinput--variants","core-forms-fileinput--with-error","core-forms-fileinput--with-warning","core-forms-fileinput--without-label","core-forms-fileuploader--button-variant","core-forms-fileuploader--compact","core-forms-fileuploader--default","core-forms-fileuploader--disabled","core-forms-fileuploader--error-dropzone","core-forms-fileuploader--inline","core-forms-fileuploader--no-label","core-forms-fileuploader--samples-inside-disabled","core-forms-fileuploader--samples-inside-grid","core-forms-fileuploader--samples-outside","core-forms-fileuploader--variants","core-forms-imagedropzone--basic","core-forms-imagedropzone--controlled","core-forms-imagedropzone--disabled","core-forms-imagedropzone--variants","core-forms-imagedropzone--with-default-image","core-forms-imagedropzone--with-file-size-limit","core-forms-imagedropzone--with-file-type-restriction","core-forms-numberinput--basic","core-forms-numberinput--controlled","core-forms-numberinput--disabled","core-forms-numberinput--ghost-variant","core-forms-numberinput--read-only","core-forms-numberinput--variants","core-forms-numberinput--with-custom-step","core-forms-numberinput--with-description","core-forms-numberinput--with-error","core-forms-numberinput--with-error-and-error-message","core-forms-numberinput--with-label","core-forms-numberinput--with-label-at-start","core-forms-numberinput--with-min-and-max","core-forms-numberinput--without-stepper","core-forms-pagination--controlled","core-forms-pagination--disabled","core-forms-pagination--primary","core-forms-pagination--read-only","core-forms-pagination--variants","core-forms-pagination--with-custom-messages","core-forms-pagination--with-default-value","core-forms-pagination--with-large-numbers","core-forms-pagination--with-step","core-forms-pagination--without-actions","core-forms-radiogroup--basic","core-forms-radiogroup--controlled","core-forms-radiogroup--custom-render-option","core-forms-radiogroup--default-value","core-forms-radiogroup--disabled","core-forms-radiogroup--disabled-values","core-forms-radiogroup--horizontal","core-forms-radiogroup--read-only","core-forms-radiogroup--with-group-label","core-forms-radiogroup--with-group-label-at-start","core-forms-radiogroup--with-option-description","core-forms-radiogroup--with-option-label-at-start","core-forms-rangecalendar--default","core-forms-rangecalendar--disabled","core-forms-rangecalendar--extra-small","core-forms-rangecalendar--extra-small-no-title","core-forms-rangecalendar--fixed-weeks","core-forms-rangecalendar--international-calendar","core-forms-rangecalendar--read-only","core-forms-rangecalendar--select-month","core-forms-rangecalendar--select-month-and-year","core-forms-rangecalendar--select-month-and-year-with-title","core-forms-rangecalendar--select-month-with-title","core-forms-rangecalendar--unavailable-dates","core-forms-rangecalendar--with-default-value","core-forms-rangecalendar--with-min-max","core-forms-rangecalendar--with-title","core-forms-searchinput--basic","core-forms-searchinput--clear-button-focusable","core-forms-searchinput--disabled","core-forms-searchinput--variants","core-forms-select--basic","core-forms-select--controlled","core-forms-select--empty-items","core-forms-select--ghost","core-forms-select--long-labels","core-forms-select--long-list","core-forms-select--read-only","core-forms-select--scrollable","core-forms-select--with-autocomplete","core-forms-select--with-controlled-open","core-forms-select--with-custom-trigger","core-forms-select--with-default-open","core-forms-select--with-default-selected-item","core-forms-select--with-description","core-forms-select--with-disabled","core-forms-select--with-disabled-items","core-forms-select--with-error","core-forms-select--with-error-and-error-message","core-forms-select--with-label","core-forms-select--with-label-at-start","core-forms-select--with-section-headers","core-forms-select--with-sections","core-forms-select--with-virtualized-section-headers","core-forms-select--with-warning","core-forms-select--with-warning-and-warning-message","core-forms-select-iconselect--basic","core-forms-select-iconselect--disabled","core-forms-select-iconselect--read-only","core-forms-select-iconselect--with-default-open","core-forms-select-iconselect--with-error","core-forms-select-iconselect--with-warning","core-forms-select-iconselect--without-icon","core-forms-select-iconselect--without-tooltip","core-forms-select-multiselect--basic","core-forms-select-multiselect--controlled","core-forms-select-multiselect--ghost","core-forms-select-multiselect--hide-clear","core-forms-select-multiselect--hide-select-all","core-forms-select-multiselect--hide-select-all-and-clear","core-forms-select-multiselect--long-labels-as-tags","core-forms-select-multiselect--long-list","core-forms-select-multiselect--max-count-1","core-forms-select-multiselect--max-count-3","core-forms-select-multiselect--read-only","core-forms-select-multiselect--read-only-with-tags-open","core-forms-select-multiselect--scrollable","core-forms-select-multiselect--with-autocomplete","core-forms-select-multiselect--with-controlled-open","core-forms-select-multiselect--with-custom-trigger","core-forms-select-multiselect--with-default-open","core-forms-select-multiselect--with-default-selected-item","core-forms-select-multiselect--with-description","core-forms-select-multiselect--with-disabled","core-forms-select-multiselect--with-disabled-items","core-forms-select-multiselect--with-error","core-forms-select-multiselect--with-error-and-error-message","core-forms-select-multiselect--with-error-and-tags","core-forms-select-multiselect--with-label","core-forms-select-multiselect--with-label-at-start","core-forms-select-multiselect--with-sections","core-forms-select-multiselect--with-warning","core-forms-select-multiselect--with-warning-and-warning-message","core-forms-slider--basic","core-forms-slider--controlled","core-forms-slider--disabled","core-forms-slider--read-only","core-forms-slider--read-only-with-number-input","core-forms-slider--with-description","core-forms-slider--with-label","core-forms-slider--with-label-and-number-input","core-forms-slider--with-min-and-max","core-forms-slider--with-number-input","core-forms-slider--with-step","core-forms-slider-iconslider--basic","core-forms-slider-iconslider--disabled","core-forms-slider-iconslider--with-number-input","core-forms-slider-iconslider--without-tooltip","core-forms-switch--basic","core-forms-switch--disabled","core-forms-switch--selected","core-forms-switch--selected-disabled","core-forms-switch--with-description","core-forms-switch--with-description-disabled","core-forms-switch--with-description-in-left-and-status","core-forms-switch--with-description-in-left-long-label","core-forms-switch--with-description-on-top","core-forms-switch--with-label","core-forms-switch--with-label-and-status","core-forms-switch--with-label-in-left-and-status","core-forms-switch--with-label-in-left-and-status-disabled","core-forms-taggedpagination--basic","core-forms-taggedpagination--disabled","core-forms-taggedpagination--disabled-steppers","core-forms-taggedpagination--read-only","core-forms-taggedpagination--variant","core-forms-taggedpagination--with-page-label","core-forms-textinput--basic","core-forms-textinput--controlled","core-forms-textinput--disabled","core-forms-textinput--focusing-the-input","core-forms-textinput--ghost-variant","core-forms-textinput--html-forms","core-forms-textinput--multiline","core-forms-textinput--multiline-variants","core-forms-textinput--multiline-with-rows","core-forms-textinput--read-only","core-forms-textinput--variants","core-forms-textinput--with-description","core-forms-textinput--with-error-message","core-forms-textinput--with-label","core-forms-textinput--with-label-at-start","core-forms-textinput--with-warning-message","core-forms-timefield--basic","core-forms-timefield--controlled","core-forms-timefield--default-value","core-forms-timefield--disabled","core-forms-timefield--ghost-variant","core-forms-timefield--html-forms","core-forms-timefield--placeholder-value","core-forms-timefield--read-only","core-forms-timefield--variants","core-forms-timefield--with-error-message","core-forms-timefield--with-error-message-only","core-forms-timefield--with-label","core-forms-timefield--with-label-at-start","core-forms-timefield--with-min-and-max-value","core-forms-timefield--with-warning-message","core-media-audioplayer--basic","core-media-audioplayer--small","core-miscellaneous-editor--basic","core-miscellaneous-editor--headless-clipboard-hooks","core-miscellaneous-editor--headless-custom","core-miscellaneous-editor--headless-document-model","core-miscellaneous-editor--headless-max-length","core-miscellaneous-editor--headless-paragraphs","core-miscellaneous-editor--headless-styles","core-miscellaneous-editor-plain--auto-focus","core-miscellaneous-editor-plain--auto-focus-at-end","core-miscellaneous-editor-plain--auto-focus-at-start","core-miscellaneous-editor-plain--clear-on-cancel","core-miscellaneous-editor-plain--clear-on-save","core-miscellaneous-editor-plain--controlled","core-miscellaneous-editor-plain--custom-submit-icon","core-miscellaneous-editor-plain--default-save-disabled","core-miscellaneous-editor-plain--disabled","core-miscellaneous-editor-plain--minimal","core-miscellaneous-editor-plain--minimal-disabled","core-miscellaneous-editor-plain--minimal-multiline","core-miscellaneous-editor-plain--minimal-save-disabled","core-miscellaneous-editor-plain--not-inline","core-miscellaneous-editor-plain--save-on-enter","core-miscellaneous-editor-plain--variants","core-miscellaneous-editor-plain--with-cancel","core-miscellaneous-editor-plain--with-dynamic-caret-position","core-miscellaneous-editor-rich-text--auto-focus","core-miscellaneous-editor-rich-text--auto-focus-at-end","core-miscellaneous-editor-rich-text--clear-on-cancel","core-miscellaneous-editor-rich-text--clear-on-save","core-miscellaneous-editor-rich-text--controlled","core-miscellaneous-editor-rich-text--default","core-miscellaneous-editor-rich-text--disabled","core-miscellaneous-editor-rich-text--long-content","core-miscellaneous-editor-rich-text--mentions","core-miscellaneous-editor-rich-text--mentions-max-suggestions","core-miscellaneous-editor-rich-text--not-inline","core-miscellaneous-editor-rich-text--save-disabled","core-miscellaneous-editor-rich-text--save-on-enter","core-miscellaneous-editor-rich-text--variants","core-miscellaneous-editor-rich-text--with-cancel","core-miscellaneous-editor-rich-text--with-custom-footer-buttons","core-miscellaneous-editor-rich-text--with-placeholder","core-miscellaneous-freehandcanvas--basic","core-miscellaneous-freehandcanvas--clear-button","core-miscellaneous-freehandcanvas--controlled","core-miscellaneous-freehandcanvas--default-value","core-miscellaneous-freehandcanvas--disabled","core-miscellaneous-freehandcanvas--history-enabled","core-miscellaneous-freehandcanvas--label","core-miscellaneous-freehandcanvas--streamlining","core-miscellaneous-icon--basic","core-miscellaneous-toolbar--basic","core-miscellaneous-toolbar--collapsible","core-miscellaneous-toolbar--vertical","core-miscellaneous-toolbar--with-inputs","core-miscellaneous-toolbar--with-over-flow","core-miscellaneous-toolbar--with-tabbing-within","core-miscellaneous-toolbar--with-tooltip","core-navigation-accordion--basic","core-navigation-accordion--controlled","core-navigation-accordion--default-expanded-keys","core-navigation-accordion--disabled","core-navigation-accordion--single-expansion","core-navigation-accordion-accordionitem--force-mount","core-navigation-accordion-accordionitem--show-actions-on-trigger-only","core-navigation-accordion-accordionitem--with-buttons","core-navigation-accordion-accordionitem--with-sub-labels","core-navigation-accordion-accordionitem--with-tabbable-content","core-navigation-breadcrumbs--basic","core-navigation-breadcrumbs--collapsed","core-navigation-breadcrumbs--custom-separator","core-navigation-breadcrumbs--disabled","core-navigation-breadcrumbs--variants","core-navigation-breadcrumbs--with-icons","core-navigation-breadcrumbs--with-select","core-navigation-disclosure--basic","core-navigation-disclosure--controlled","core-navigation-disclosure--truncated-title","core-navigation-disclosure--variants","core-navigation-disclosure--with-custom-icon","core-navigation-disclosure--with-interactive-content","core-navigation-disclosure--with-long-content","core-navigation-disclosure--without-description","core-navigation-link--basic","core-navigation-link--client-side-action","core-navigation-link--variants","core-navigation-stepper--all-complete","core-navigation-stepper--all-states","core-navigation-stepper--condensed","core-navigation-stepper--controlled","core-navigation-stepper--default","core-navigation-stepper--expanded-without-descriptions","core-navigation-stepper--frontier-ahead-of-selection","core-navigation-stepper--indicator-only","core-navigation-stepper--indicator-only-expanded","core-navigation-stepper--is-disabled","core-navigation-stepper--long-title-and-description","core-navigation-stepper--mixed-indicator-and-titled-items","core-navigation-stepper--per-item-aria-label-overrides-title","core-navigation-stepper--single-item","core-navigation-stepper--size-small-condensed","core-navigation-stepper--size-small-expanded","core-navigation-stepper--two-steps","core-navigation-stepper--with-disabled-completed-step","core-navigation-stepper--with-disabled-step","core-navigation-tabs--basic","core-navigation-tabs--controlled","core-navigation-tabs--ghost","core-navigation-tabs--with-action-button","core-navigation-tabs--with-close-button","core-navigation-tabs--with-default-selected","core-navigation-tabs--with-disabled","core-navigation-tabs--with-disabled-and-close-button","core-navigation-tabs--with-focusable-content","core-navigation-tabs--with-specific-disabled","core-navigation-tabs-tabitem--with-icon","core-overlays-alertdialog--auto-focus-cancel-button","core-overlays-alertdialog--basic","core-overlays-alertdialog--custom-focused-button","core-overlays-alertdialog--default-open","core-overlays-alertdialog--long-content","core-overlays-alertdialog--only-cancel-button","core-overlays-alertdialog--only-primary-action","core-overlays-alertdialog--primary-action-disabled","core-overlays-alertdialog--separate-close-handler","core-overlays-alertdialog--with-text-input","core-overlays-alertdialog--with-title-only","core-overlays-alertdialog--without-close-button","core-overlays-alertdialog--without-icon","core-overlays-alertdialog--without-message-and-actions","core-overlays-dialog--basic","core-overlays-dialog--default-open","core-overlays-dialog--different-sizes","core-overlays-dialog--ghost","core-overlays-drawer--basic","core-overlays-drawer--with-action","core-overlays-inlinetoolbar--basic","core-overlays-inlinetoolbar--controlled","core-overlays-inlinetoolbar--disabled","core-overlays-inlinetoolbar--disabled-keys","core-overlays-inlinetoolbar--with-interactive-element","core-overlays-inlinetoolbar--with-scroll","core-overlays-modal--basic","core-overlays-modal--controlled","core-overlays-modal--default-open","core-overlays-modal-modalcontent--disabled-animation","core-overlays-modal-modalcontent--drawer-mobile","core-overlays-modal-modalcontent--drawer-mobile-with-nested-popover","core-overlays-modal-modalcontent--form-controls","core-overlays-modal-modalcontent--long-content","core-overlays-modal-modalcontent--not-dismissable","core-overlays-modal-modalcontent--uncontrolled-interaction-outside","core-overlays-modal-modalcontent--with-disabled-focus-management","core-overlays-modal-modalcontent--with-inert","core-overlays-popover--basic","core-overlays-popover--event-leak-fix","core-overlays-popover--with-arrow","core-overlays-popover--with-boundary-element","core-overlays-popover--with-custom-target","core-overlays-popover--with-dynamic-trigger-width","core-overlays-popover--with-no-boundary","core-overlays-popover--with-scrollable-content","core-overlays-popover--with-scrollable-content-non-modal","core-overlays-popover--with-scrollable-viewport","core-overlays-popover--with-tooltip","core-overlays-popover-popovercontent--basic","core-overlays-popover-popovercontent--contained-focus","core-overlays-popover-popovercontent--default-open-with-arrow","core-overlays-popover-popovercontent--disable-animation","core-overlays-popover-popovercontent--manual-repositioning","core-overlays-popover-popovercontent--nested-scrollable-containers","core-overlays-popover-popovercontent--scroll-repositioning","core-overlays-popover-popovercontent--with-boundary-axis","core-overlays-popover-popovercontent--with-horizontal-boundary-behavior","core-overlays-popover-popovertrigger--basic","core-overlays-popover-popovertrigger--function-children","core-overlays-popover-popovertrigger--with-updated-position","core-overlays-tooltip--basic","core-overlays-tooltip--controlled-open","core-overlays-tooltip--disabled","core-overlays-tooltip--focus-trigger","core-overlays-tooltip--no-text","core-overlays-tooltip--placement","core-overlays-tooltip--variants","core-overlays-tooltip--variants-size","core-overlays-tooltip--with-cross-offset","core-overlays-tooltip--with-focusable","core-overlays-tooltip--with-offset","core-overlays-tooltip--with-on-open-change","core-status-inlinealert--basic","core-status-inlinealert--compact","core-status-inlinealert--compact-with-action","core-status-inlinealert--compact-with-action-and-close","core-status-inlinealert--multi-line","core-status-inlinealert--multi-line-with-action","core-status-inlinealert--multi-line-with-action-and-close","core-status-inlinealert--sizes","core-status-inlinealert--variants","core-status-inlinealert--with-action","core-status-inlinealert--with-action-and-close","core-status-progressbar--basic","core-status-progressbar--variants","core-status-progressbar--with-custom-number-formatter","core-status-progressbar--with-custom-value-label","core-status-progressbar--with-error","core-status-progressbar--with-max-value","core-status-progressbar--with-min-and-max-value","core-status-progressbar--with-min-value","core-status-progressbar--with-no-description","core-status-progressbar--with-no-label","core-status-progressbar--with-show-value","core-status-progressspinner--error","core-status-progressspinner--primary","core-status-progressspinner--success","core-status-progressspinner--variants","core-status-progressspinner--without-label","core-status-toast--basic","core-status-toast--timeout","core-status-toast--variants-with-action","core-status-toast--variants-without-action","core-status-toast--with-action","core-utilities-actionable--basic","core-utilities-actionable--disabled","core-utilities-actionable--with-complex-content","core-utilities-actionable--with-div","core-utilities-actionable--with-dynamic-button-styling","core-utilities-actionable--with-dynamic-child-styling","core-utilities-box--basic","core-utilities-box--element-type","core-utilities-box--flex-layout","core-utilities-box--media-queries","core-utilities-box--nested-boxes","core-utilities-dateformat--basic","core-utilities-dateformat--time-only","core-utilities-dateformat--time-only-with-time-zone","core-utilities-dateformat--time-zone-24-hour","core-utilities-dateformat--with-date-and-time","core-utilities-deviceprovider--always-desktop","core-utilities-deviceprovider--always-mobile","core-utilities-deviceprovider--basic","core-utilities-deviceprovider--custom-breakpoints","core-utilities-frameprovider--always-contained","core-utilities-frameprovider--basic","core-utilities-frameprovider--custom-portal-container","core-utilities-frameprovider--inside-shadow-root","core-utilities-frameprovider--nested-containers","core-utilities-frameprovider--never-contained","core-utilities-frameprovider--popover-with-frame-boundary","core-utilities-frameprovider--portal-container-outside-container","core-utilities-frameprovider--with-interactive-elements-outside-of-container","core-utilities-group--basic","core-utilities-i18nprovider--string-format","core-utilities-messageformat--basic","core-utilities-numberformat--basic","core-utilities-numberformat--currency","core-utilities-numberformat--currency-with-fraction-digits","core-utilities-numberformat--currency-with-fraction-digits-and-currency-display","core-utilities-numberformat--percent","core-utilities-numberformat--percent-with-fraction-digits","core-utilities-panel--basic","core-utilities-panel--collapsible","core-utilities-panel--conditional","core-utilities-panel--controlled","core-utilities-panel--disabled-handle","core-utilities-panel--max-size","core-utilities-panel--multiple","core-utilities-panel--nested","core-utilities-panel--persistent","core-utilities-panel--vertical","core-utilities-portal--basic","core-utilities-themeprovider--basic","json-render-examples--dashboard","json-render-examples--data-table","json-render-examples--login-form","json-render-examples--settings-panel"];var h={version:"3.10.0"};var b=`
 # Baseline UI MCP Server Guidelines
 
 This MCP server provides AI assistants with structured access to Baseline UI's comprehensive component documentation, icon library, theming resources, and design guidelines.