@stratakit/structures 0.1.1 → 0.2.1

package/CHANGELOG.md

@@ -1,5 +1,47 @@
 # Changelog
 
+## 0.2.1
+
+- [#736](https://github.com/iTwin/design-system/pull/736): Updated the `label` prop type in the `<Chip />` component from `string` to `ReactNode`.
+- [#740](https://github.com/iTwin/design-system/pull/740): Added `types` field to `package.json` file for better TypeScript support and TS icon on `npm`.
+- [#737](https://github.com/iTwin/design-system/pull/737): Fixed console warnings raised from `<Tree.Item>` component.
+- Updated dependencies:
+  - @stratakit/foundations@0.1.5
+  - @stratakit/bricks@0.2.1
+
+## 0.2.0
+
+### Breaking changes
+
+- [#720](https://github.com/iTwin/design-system/pull/720): Renamed `onExpandedChange` prop for `unstable_ErrorRegion.Root` to `setOpen`.
+  Renamed `expanded` prop for `unstable_ErrorRegion.Root` to `open`.
+- [#709](https://github.com/iTwin/design-system/pull/709): `unstable_AccordionItem` breaking changes:
+
+  - `AccordionItem.Trigger` renamed to `AccordionItem.Header` and no longer represents the underlying `<button>` element (see `AccordionItem.Label`).
+  - `AccordionItem.Label` must be wrapped with the new `AccordionItem.Button`.
+
+  ```diff
+   <AccordionItem.Root>
+  +  <AccordionItem.Header>
+  -  <AccordionItem.Trigger>
+  +    <AccordionItem.Button>
+  +      <AccordionItem.Label>Label</AccordionItem.Label>
+  +    </AccordionItem.Button>
+  -    <AccordionItem.Label>Label</AccordionItem.Label>
+  +  </AccordionItem.Header>
+  -  </AccordionItem.Trigger>
+     <AccordionItem.Content>Body</AccordionItem.Content>
+   </AccordionItem.Root>
+  ```
+
+- [#720](https://github.com/iTwin/design-system/pull/720): Renamed `onOpenChange` prop for `unstable_AccordionItem.Root` to `setOpen`.
+
+### Non-breaking changes
+
+- [#709](https://github.com/iTwin/design-system/pull/709): Introduce `unstable_AccordionItem.Heading` component for wrapping `unstable_AccordionItem.Button` and `unstable_AccordionItem.Button` which represents the underlying `<button>` element.
+- Updated dependencies:
+  - @stratakit/foundations@0.1.4
+
 ## 0.1.1
 
 - [#704](https://github.com/iTwin/design-system/pull/704): The following components have been moved from `@stratakit/bricks` into `@stratakit/structures`.

package/dist/AccordionItem.d.ts

@@ -17,18 +17,39 @@ interface AccordionItemProps extends BaseProps {
      *
      * Should be used with the `open` prop.
      */
-    onOpenChange?: (open: boolean) => void;
+    setOpen?: (open: boolean) => void;
 }
 /**
- * An item within an accordion.
+ * An item within an accordion. Disclosed content with a label.
  *
  * Bare minimum example:
  * ```tsx
  * <AccordionItem.Root>
- * 	 <AccordionItem.Trigger>
- *     <AccordionItem.Label>Label</AccordionItem.Label>
+ *   <AccordionItem.Header>
+ *     <AccordionItem.Button>
+ *       <AccordionItem.Label>Label</AccordionItem.Label>
+ *     </AccordionItem.Button>
  *     <AccordionItem.Marker />
- *   </AccordionItem.Trigger>
+ *   </AccordionItem.Header>
+ *   <AccordionItem.Content>Body</AccordionItem.Content>
+ * </AccordionItem.Root>
+ * ```
+ *
+ * If the accordion item discloses a significant section of the page, it may be
+ * desirable to markup its label as a heading for accessibility purposes (e.g.
+ * screen reader users often navigate by heading). For those cases, you can wrap
+ * the `AccordionItem.Button` component with an `AccordionItem.Heading`
+ * component and use its `render` prop for rendering an HTML heading element.
+ * ```tsx
+ * <AccordionItem.Root>
+ *   <AccordionItem.Header>
+ *     <AccordionItem.Heading render={<h2 />}>
+ *       <AccordionItem.Button>
+ *         <AccordionItem.Label>Label</AccordionItem.Label>
+ *       </AccordionItem.Button>
+ *     </AccordionItem.Heading>
+ *     <AccordionItem.Marker />
+ *   </AccordionItem.Header>
  *   <AccordionItem.Content>Body</AccordionItem.Content>
  * </AccordionItem.Root>
  * ```
@@ -36,82 +57,108 @@ interface AccordionItemProps extends BaseProps {
  * Example with a decoration:
  * ```tsx
  * <AccordionItem.Root>
- * 	 <AccordionItem.Trigger>
+ *   <AccordionItem.Header>
  *     <AccordionItem.Decoration render={<Icon href={placeholder} />} />
- *     <AccordionItem.Label>Label</AccordionItem.Label>
+ *     <AccordionItem.Button>
+ *       <AccordionItem.Label>Label</AccordionItem.Label>
+ *     </AccordionItem.Button>
  *     <AccordionItem.Marker />
- *   </AccordionItem.Trigger>
+ *   </AccordionItem.Header>
  *   <AccordionItem.Content>Body</AccordionItem.Content>
  * </AccordionItem.Root>
  * ```
  */
 declare const AccordionItemRoot: import("react").ForwardRefExoticComponent<AccordionItemProps & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
 /**
- * The trigger for collapsing and expanding an accordion item’s content.
+ * The always visible header of an accordion item.
  *
- * Must include an `AccordionItem.Label` as a direct descendant.
+ * Must include an `AccordionItem.Button` and `AccordionItem.Marker` as a direct
+ * descendants.
  *
  * Example:
  * ```tsx
  * <AccordionItem.Root>
- * 	 <AccordionItem.Trigger>
- *     <AccordionItem.Label>Label</AccordionItem.Label>
+ * 	 <AccordionItem.Header>
+ *     <AccordionItem.Button>
+ *       <AccordionItem.Label>Label</AccordionItem.Label>
+ *     </AccordionItem.Button>
  *     <AccordionItem.Marker />
- *   </AccordionItem.Trigger>
+ *   </AccordionItem.Header>
  *   <AccordionItem.Content>Body</AccordionItem.Content>
  * </AccordionItem.Root>
  * ```
  */
-declare const AccordionItemTrigger: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "render"> & import("react").RefAttributes<HTMLElement | HTMLButtonElement>>;
+declare const AccordionItemHeader: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "render"> & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
 /**
- * The always-visible label of an accordion item’s trigger.
+ * The accordion item button.
  *
- * Use as a direct descendant of `AccordionItem.Trigger`.
+ * Must be a direct descendant of `AccordionItem.Header`.
  *
  * Example:
  * ```tsx
- * <AccordionItem.Trigger>
- *   <AccordionItem.Label>Label</AccordionItem.Label>
+ * <AccordionItem.Header>
+ *   <AccordionItem.Button>
+ *     <AccordionItem.Label>Label</AccordionItem.Label>
+ *   </AccordionItem.Button>
  *   <AccordionItem.Marker />
- * </AccordionItem.Trigger>
+ * </AccordionItem.Header>
+ * ```
+ */
+declare const AccordionItemButton: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "render"> & import("react").RefAttributes<HTMLElement | HTMLButtonElement>>;
+/**
+ * An accordion item’s label.
+ *
+ * Must be a descendant of `AccordionItem.Button`.
+ *
+ * Example:
+ * ```tsx
+ * <AccordionItem.Button>
+ *   <AccordionItem.Label>Label</AccordionItem.Label>
+ * </AccordionItem.Button>
  * ```
  */
 declare const AccordionItemLabel: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "render"> & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
 /**
- * The always-visible, optional decoration of an accordion item’s trigger.
+ * The always-visible, optional decoration of an accordion item’s button.
  *
- * Use as a direct descendant of `AccordionItem.Trigger`. This will be visually
- * presented before the trigger’s label.
+ * Use as a direct descendant of `AccordionItem.Header`. This will be visually
+ * presented before the button’s label.
  *
  * Example:
  * ```tsx
- * <AccordionItem.Trigger>
+ * <AccordionItem.Header>
  *   <AccordionItem.Decoration render={<Icon href={placeholder} />} />
- *   <AccordionItem.Label>Label</AccordionItem.Label>
+ *   <AccordionItem.Button>
+ *     <AccordionItem.Label>Label</AccordionItem.Label>
+ *   </AccordionItem.Button>
  *   <AccordionItem.Marker />
- * </AccordionItem.Trigger>
+ * </AccordionItem.Header>
  * ```
  */
 declare const AccordionItemDecoration: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "render"> & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
 /**
- * The visual marker of an accordion item’s trigger.
+ * The visual marker of an accordion item’s button.
  *
  * Example:
  * ```tsx
- * <AccordionItem.Trigger>
- *   <AccordionItem.Label>Label</AccordionItem.Label>
+ * <AccordionItem.Header>
+ *   <AccordionItem.Button>
+ *     <AccordionItem.Label>Label</AccordionItem.Label>
+ *   </AccordionItem.Button>
  *   <AccordionItem.Marker />
- * </AccordionItem.Trigger>
+ * </AccordionItem.Header>
  * ```
  *
  * Pass an icon as a child to override the default chevron icon:
  * ```tsx
- * <AccordionItem.Trigger>
- *   <AccordionItem.Label>Label</AccordionItem.Label>
+ * <AccordionItem.Header>
+ *   <AccordionItem.Button>
+ *     <AccordionItem.Label>Label</AccordionItem.Label>
+ *   </AccordionItem.Button>
  *   <AccordionItem.Marker>
  *     <Icon href={placeholder} />
  *   </AccordionItem.Marker>
- * </AccordionItem.Trigger>
+ * </AccordionItem.Header>
  * ```
  */
 declare const AccordionItemMarker: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "render"> & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
@@ -121,13 +168,35 @@ declare const AccordionItemMarker: import("react").ForwardRefExoticComponent<Pic
  * Example:
  * ```tsx
  * <AccordionItem.Root>
- * 	 <AccordionItem.Trigger>
- *     <AccordionItem.Label>Label</AccordionItem.Label>
+ * 	 <AccordionItem.Header>
+ *     <AccordionItem.Button>
+ *       <AccordionItem.Label>Label</AccordionItem.Label>
+ *     </AccordionItem.Button>
  *     <AccordionItem.Marker />
- *   </AccordionItem.Trigger>
+ *   </AccordionItem.Header>
  *   <AccordionItem.Content>Body</AccordionItem.Content>
  * </AccordionItem.Root>
  * ```
  */
 declare const AccordionItemContent: import("react").ForwardRefExoticComponent<Pick<import("@ariakit/react/role").RoleProps, "render"> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "render"> & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
-export { AccordionItemRoot as Root, AccordionItemContent as Content, AccordionItemTrigger as Trigger, AccordionItemLabel as Label, AccordionItemDecoration as Decoration, AccordionItemMarker as Marker, };
+interface AccordionItemHeadingProps extends BaseProps {
+    render: NonNullable<BaseProps["render"]>;
+}
+/**
+ * A heading for wrapping `AccordionItem.Button`.
+ *
+ * The `render` prop is required.
+ *
+ * Example:
+ * ```tsx
+ * <AccordionItem.Header>
+ *   <AccordionItem.Heading render={<h2 />}>
+ *     <AccordionItem.Button>
+ *       <AccordionItem.Label>Label</AccordionItem.Label>
+ *     </AccordionItem.Button>
+ *   </AccordionItem.Heading>
+ *   <AccordionItem.Marker />
+ * </AccordionItem.Header>
+ */
+declare const AccordionItemHeading: import("react").ForwardRefExoticComponent<AccordionItemHeadingProps & import("react").RefAttributes<HTMLDivElement | HTMLElement>>;
+export { AccordionItemRoot as Root, AccordionItemContent as Content, AccordionItemHeader as Header, AccordionItemButton as Button, AccordionItemLabel as Label, AccordionItemDecoration as Decoration, AccordionItemMarker as Marker, AccordionItemHeading as Heading, };

package/dist/AccordionItem.js

@@ -10,23 +10,37 @@ import {
   GhostAligner,
   IconButtonPresentation
 } from "@stratakit/bricks/secret-internals";
-import { forwardRef } from "@stratakit/foundations/secret-internals";
+import {
+  forwardRef,
+  useControlledState
+} from "@stratakit/foundations/secret-internals";
 import cx from "classnames";
 import { ChevronDown } from "./~utils.icons.js";
 const AccordionItemRoot = forwardRef(
   (props, forwardedRef) => {
-    const { defaultOpen, open, onOpenChange, ...rest } = props;
+    const {
+      defaultOpen,
+      open: openProp,
+      setOpen: setOpenProp,
+      ...rest
+    } = props;
+    const [open, setOpen] = useControlledState(
+      defaultOpen ?? false,
+      openProp,
+      setOpenProp
+    );
     return /* @__PURE__ */ jsx(
       DisclosureProvider,
       {
         defaultOpen,
         open,
-        setOpen: onOpenChange,
+        setOpen,
         children: /* @__PURE__ */ jsx(
           Role,
           {
             ...rest,
             className: cx("\u{1F95D}-accordion-item", props.className),
+            "data-kiwi-open": open,
             ref: forwardedRef
           }
         )
@@ -34,16 +48,26 @@ const AccordionItemRoot = forwardRef(
     );
   }
 );
-const AccordionItemTrigger = forwardRef(
+const AccordionItemHeader = forwardRef(
   (props, forwardedRef) => /* @__PURE__ */ jsx(GhostAligner, { align: "block", children: /* @__PURE__ */ jsx(
-    Disclosure,
+    Role,
     {
       ...props,
-      className: cx("\u{1F95D}-accordion-item-trigger", props.className),
+      className: cx("\u{1F95D}-accordion-item-header", props.className),
       ref: forwardedRef
     }
   ) })
 );
+const AccordionItemButton = forwardRef(
+  (props, forwardedRef) => /* @__PURE__ */ jsx(
+    Disclosure,
+    {
+      ...props,
+      className: cx("\u{1F95D}-accordion-item-button", props.className),
+      ref: forwardedRef
+    }
+  )
+);
 const AccordionItemLabel = forwardRef(
   (props, forwardedRef) => /* @__PURE__ */ jsx(
     Text,
@@ -93,11 +117,24 @@ const AccordionItemContent = forwardRef(
     }
   )
 );
+const AccordionItemHeading = forwardRef(
+  (props, forwardedRef) => /* @__PURE__ */ jsx(
+    Text,
+    {
+      ...props,
+      variant: "body-sm",
+      className: cx("\u{1F95D}-accordion-item-heading", props.className),
+      ref: forwardedRef
+    }
+  )
+);
 export {
+  AccordionItemButton as Button,
   AccordionItemContent as Content,
   AccordionItemDecoration as Decoration,
+  AccordionItemHeader as Header,
+  AccordionItemHeading as Heading,
   AccordionItemLabel as Label,
   AccordionItemMarker as Marker,
-  AccordionItemRoot as Root,
-  AccordionItemTrigger as Trigger
+  AccordionItemRoot as Root
 };

package/dist/Chip.d.ts

@@ -4,7 +4,7 @@ interface ChipProps extends Omit<BaseProps<"div">, "children"> {
     /**
      * The label displayed inside the chip.
      */
-    label: string;
+    label: React.ReactNode;
     /**
      * The variant style of the Chip.
      * Use "solid" for primary states and "outline" for less prominent states.

package/dist/DEV/AccordionItem.js

@@ -10,23 +10,37 @@ import {
   GhostAligner,
   IconButtonPresentation
 } from "@stratakit/bricks/secret-internals";
-import { forwardRef } from "@stratakit/foundations/secret-internals";
+import {
+  forwardRef,
+  useControlledState
+} from "@stratakit/foundations/secret-internals";
 import cx from "classnames";
 import { ChevronDown } from "./~utils.icons.js";
 const AccordionItemRoot = forwardRef(
   (props, forwardedRef) => {
-    const { defaultOpen, open, onOpenChange, ...rest } = props;
+    const {
+      defaultOpen,
+      open: openProp,
+      setOpen: setOpenProp,
+      ...rest
+    } = props;
+    const [open, setOpen] = useControlledState(
+      defaultOpen ?? false,
+      openProp,
+      setOpenProp
+    );
     return /* @__PURE__ */ jsx(
       DisclosureProvider,
       {
         defaultOpen,
         open,
-        setOpen: onOpenChange,
+        setOpen,
         children: /* @__PURE__ */ jsx(
           Role,
           {
             ...rest,
             className: cx("\u{1F95D}-accordion-item", props.className),
+            "data-kiwi-open": open,
             ref: forwardedRef
           }
         )
@@ -35,17 +49,28 @@ const AccordionItemRoot = forwardRef(
   }
 );
 DEV: AccordionItemRoot.displayName = "AccordionItem.Root";
-const AccordionItemTrigger = forwardRef(
+const AccordionItemHeader = forwardRef(
   (props, forwardedRef) => /* @__PURE__ */ jsx(GhostAligner, { align: "block", children: /* @__PURE__ */ jsx(
-    Disclosure,
+    Role,
     {
       ...props,
-      className: cx("\u{1F95D}-accordion-item-trigger", props.className),
+      className: cx("\u{1F95D}-accordion-item-header", props.className),
       ref: forwardedRef
     }
   ) })
 );
-DEV: AccordionItemTrigger.displayName = "AccordionItem.Trigger";
+DEV: AccordionItemHeader.displayName = "AccordionItem.Header";
+const AccordionItemButton = forwardRef(
+  (props, forwardedRef) => /* @__PURE__ */ jsx(
+    Disclosure,
+    {
+      ...props,
+      className: cx("\u{1F95D}-accordion-item-button", props.className),
+      ref: forwardedRef
+    }
+  )
+);
+DEV: AccordionItemButton.displayName = "AccordionItem.Button";
 const AccordionItemLabel = forwardRef(
   (props, forwardedRef) => /* @__PURE__ */ jsx(
     Text,
@@ -99,11 +124,25 @@ const AccordionItemContent = forwardRef(
   )
 );
 DEV: AccordionItemContent.displayName = "AccordionItem.Content";
+const AccordionItemHeading = forwardRef(
+  (props, forwardedRef) => /* @__PURE__ */ jsx(
+    Text,
+    {
+      ...props,
+      variant: "body-sm",
+      className: cx("\u{1F95D}-accordion-item-heading", props.className),
+      ref: forwardedRef
+    }
+  )
+);
+DEV: AccordionItemHeading.displayName = "AccordionItem.Heading";
 export {
+  AccordionItemButton as Button,
   AccordionItemContent as Content,
   AccordionItemDecoration as Decoration,
+  AccordionItemHeader as Header,
+  AccordionItemHeading as Heading,
   AccordionItemLabel as Label,
   AccordionItemMarker as Marker,
-  AccordionItemRoot as Root,
-  AccordionItemTrigger as Trigger
+  AccordionItemRoot as Root
 };

package/dist/DEV/ErrorRegion.js

@@ -22,13 +22,19 @@ import * as React from "react";
 import { ChevronDown, StatusIcon } from "./~utils.icons.js";
 const ErrorRegionRoot = forwardRef(
   (props, forwardedRef) => {
-    const { label, items, expanded, onExpandedChange, ...rest } = props;
+    const {
+      label,
+      items,
+      open: openProp,
+      setOpen: setOpenProp,
+      ...rest
+    } = props;
     const labelId = React.useId();
     const sectionLabelledBy = props["aria-labelledby"] ?? (props["aria-label"] ? void 0 : labelId);
     const [open, setOpen] = useControlledState(
       false,
-      expanded,
-      onExpandedChange
+      openProp,
+      setOpenProp
     );
     const containerRef = React.useRef(null);
     const pulse = () => {

package/dist/DEV/TreeItem.js

@@ -38,15 +38,17 @@ const TreeItemOverflowActionsContext = React.createContext(void 0);
 const TreeItemHasOverflowActionsContext = React.createContext(false);
 const TreeItem = React.memo(
   forwardRef((props, forwardedRef) => {
-    const { expanded, selected } = props;
     const {
+      selected,
       onSelectedChange,
+      expanded,
       onExpandedChange,
       icon,
       unstable_decorations,
       label,
       description,
       actions,
+      error: _,
       onClick: onClickProp,
       onKeyDown: onKeyDownProp,
       ...rest
@@ -74,6 +76,8 @@ const TreeItem = React.memo(
       TreeItemRoot,
       {
         ...rest,
+        expanded,
+        selected,
         onClick: useEventHandlers(onClickProp, handleClick),
         onKeyDown: useEventHandlers(onKeyDownProp, handleKeyDown),
         ref: forwardedRef,
@@ -276,39 +280,33 @@ const arrowKeys = ["ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
 const TreeItemActionsOverflowMenuContext = React.createContext(false);
 function TreeItemActionsOverflowMenu() {
   const overflow = React.useContext(TreeItemHasOverflowActionsContext);
-  const [open, setOpen] = React.useState(false);
+  const [open, _setOpen] = React.useState(false);
   const isArrowKeyPressed = React.useRef(false);
+  const setOpen = React.useCallback((value) => {
+    if (value && !isArrowKeyPressed.current) {
+      _setOpen(true);
+    } else {
+      _setOpen(false);
+    }
+  }, []);
   if (!overflow) return null;
-  return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(
-    DropdownMenu.Root,
-    {
-      open,
-      setOpen: React.useCallback((value) => {
-        if (value && !isArrowKeyPressed.current) {
-          setOpen(true);
-        } else {
-          setOpen(false);
-        }
-      }, []),
-      children: [
-        /* @__PURE__ */ jsx(
-          DropdownMenu.Button,
-          {
-            onKeyDown: (e) => {
-              if (arrowKeys.includes(e.key)) {
-                isArrowKeyPressed.current = true;
-              }
-              queueMicrotask(() => {
-                isArrowKeyPressed.current = false;
-              });
-            },
-            render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
+  return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(DropdownMenu.Root, { open, setOpen, children: [
+    /* @__PURE__ */ jsx(
+      DropdownMenu.Button,
+      {
+        onKeyDown: (e) => {
+          if (arrowKeys.includes(e.key)) {
+            isArrowKeyPressed.current = true;
           }
-        ),
-        /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
-      ]
-    }
-  ) });
+          queueMicrotask(() => {
+            isArrowKeyPressed.current = false;
+          });
+        },
+        render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
+      }
+    ),
+    /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
+  ] }) });
 }
 DEV: TreeItemActionsOverflowMenu.displayName = "TreeItemActionsOverflowMenu";
 function TreeItemActionsOverflowMenuContent() {
@@ -357,7 +355,7 @@ const TreeItemAction = React.memo(
           {
             label,
             icon,
-            inert: visible === false ? true : void 0,
+            inert: visible === false ? "true" : void 0,
             ...rest,
             dot,
             variant: "ghost",

package/dist/DEV/styles.css.js

@@ -1,5 +1,5 @@
 // inline-css:/home/runner/work/design-system/design-system/packages/structures/src/styles.css
-var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--ids-color-border-neutral-muted);grid-template-rows:[trigger-start]auto[trigger-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer base{.🥝-accordion-item-trigger{padding:var(--🥝accordion-item-padding);--🥝focus-outline-offset:-4px;cursor:pointer;grid-area:trigger/decoration-before-start/trigger/decoration-after-end;grid-template-columns:inherit;border-radius:12px;align-items:center;display:grid}@supports (grid-template-columns:subgrid){.🥝-accordion-item-trigger{grid-template-columns:subgrid}}}@layer states{.🥝-accordion-item-trigger:where([aria-expanded=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-marker{grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-trigger:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;grid-column:content;font-weight:500}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--ids-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--ids-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--ids-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--ids-color-border-info-base);--🥝icon-color:var(--ids-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--ids-color-border-positive-base);--🥝icon-color:var(--ids-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--ids-color-border-attention-base);--🥝icon-color:var(--ids-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--ids-color-border-critical-base);--🥝icon-color:var(--ids-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--ids-color-border-attention-base);background-color:var(--ids-color-bg-elevation-base);box-shadow:var(--ids-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--ids-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--ids-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--ids-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--ids-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--ids-color-bg-page-base);box-shadow:var(--ids-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--ids-color-icon-attention-base);--🥝tree-item-color:var(--ids-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
+var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--ids-color-border-neutral-muted);grid-template-rows:[header-start]auto[header-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer states{.🥝-accordion-item:where([data-kiwi-open=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-header{padding:var(--🥝accordion-item-padding);grid-area:header/decoration-before-start/header/decoration-after-end;grid-template-columns:inherit;align-items:center;display:grid;position:relative}@supports (grid-template-columns:subgrid){.🥝-accordion-item-header{grid-template-columns:subgrid}}}@layer base{.🥝-accordion-item-marker{pointer-events:none;grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-header:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;font-weight:500;display:inline-block}}@layer base{.🥝-accordion-item-button{cursor:pointer;--🥝focus-outline-offset:-4px;border-radius:12px;grid-column:content}.🥝-accordion-item-button:after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer states{.🥝-accordion-item-button:focus-visible{outline:0}.🥝-accordion-item-button:focus-visible:after{outline:var(--🥝focus-outline);outline-offset:var(--🥝focus-outline-offset)}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--ids-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-accordion-item-heading{text-box:cap alphabetic;grid-column:content;margin-block:0}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--ids-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--ids-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--ids-color-border-info-base);--🥝icon-color:var(--ids-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--ids-color-border-positive-base);--🥝icon-color:var(--ids-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--ids-color-border-attention-base);--🥝icon-color:var(--ids-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--ids-color-border-critical-base);--🥝icon-color:var(--ids-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--ids-color-border-attention-base);background-color:var(--ids-color-bg-elevation-base);box-shadow:var(--ids-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--ids-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--ids-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--ids-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--ids-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--ids-color-bg-page-base);box-shadow:var(--ids-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--ids-color-icon-attention-base);--🥝tree-item-color:var(--ids-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
 
 // src/styles.css.ts
 var styles_css_default = styles_default;

package/dist/ErrorRegion.d.ts

@@ -13,15 +13,15 @@ interface ErrorRegionRootProps extends Omit<BaseProps, "children"> {
      */
     items?: React.ReactNode;
     /**
-     * The controlled expanded state of the error.
+     * The controlled open state of the region.
      */
-    expanded?: boolean;
+    open?: boolean;
     /**
-     * Callback fired when the error is expanded.
+     * Callback fired when the region is open.
      *
-     * Should be used with the `expanded` prop.
+     * Should be used with the `open` prop.
      */
-    onExpandedChange?: (expanded: boolean) => void;
+    setOpen?: (open: boolean) => void;
 }
 /**
  * A collapsible region that displays a list of error messages, which might originate from another

package/dist/ErrorRegion.js

@@ -22,13 +22,19 @@ import * as React from "react";
 import { ChevronDown, StatusIcon } from "./~utils.icons.js";
 const ErrorRegionRoot = forwardRef(
   (props, forwardedRef) => {
-    const { label, items, expanded, onExpandedChange, ...rest } = props;
+    const {
+      label,
+      items,
+      open: openProp,
+      setOpen: setOpenProp,
+      ...rest
+    } = props;
     const labelId = React.useId();
     const sectionLabelledBy = props["aria-labelledby"] ?? (props["aria-label"] ? void 0 : labelId);
     const [open, setOpen] = useControlledState(
       false,
-      expanded,
-      onExpandedChange
+      openProp,
+      setOpenProp
     );
     const containerRef = React.useRef(null);
     const pulse = () => {

package/dist/TreeItem.js

@@ -38,15 +38,17 @@ const TreeItemOverflowActionsContext = React.createContext(void 0);
 const TreeItemHasOverflowActionsContext = React.createContext(false);
 const TreeItem = React.memo(
   forwardRef((props, forwardedRef) => {
-    const { expanded, selected } = props;
     const {
+      selected,
       onSelectedChange,
+      expanded,
       onExpandedChange,
       icon,
       unstable_decorations,
       label,
       description,
       actions,
+      error: _,
       onClick: onClickProp,
       onKeyDown: onKeyDownProp,
       ...rest
@@ -74,6 +76,8 @@ const TreeItem = React.memo(
       TreeItemRoot,
       {
         ...rest,
+        expanded,
+        selected,
         onClick: useEventHandlers(onClickProp, handleClick),
         onKeyDown: useEventHandlers(onKeyDownProp, handleKeyDown),
         ref: forwardedRef,
@@ -265,39 +269,33 @@ const arrowKeys = ["ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
 const TreeItemActionsOverflowMenuContext = React.createContext(false);
 function TreeItemActionsOverflowMenu() {
   const overflow = React.useContext(TreeItemHasOverflowActionsContext);
-  const [open, setOpen] = React.useState(false);
+  const [open, _setOpen] = React.useState(false);
   const isArrowKeyPressed = React.useRef(false);
+  const setOpen = React.useCallback((value) => {
+    if (value && !isArrowKeyPressed.current) {
+      _setOpen(true);
+    } else {
+      _setOpen(false);
+    }
+  }, []);
   if (!overflow) return null;
-  return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(
-    DropdownMenu.Root,
-    {
-      open,
-      setOpen: React.useCallback((value) => {
-        if (value && !isArrowKeyPressed.current) {
-          setOpen(true);
-        } else {
-          setOpen(false);
-        }
-      }, []),
-      children: [
-        /* @__PURE__ */ jsx(
-          DropdownMenu.Button,
-          {
-            onKeyDown: (e) => {
-              if (arrowKeys.includes(e.key)) {
-                isArrowKeyPressed.current = true;
-              }
-              queueMicrotask(() => {
-                isArrowKeyPressed.current = false;
-              });
-            },
-            render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
+  return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(DropdownMenu.Root, { open, setOpen, children: [
+    /* @__PURE__ */ jsx(
+      DropdownMenu.Button,
+      {
+        onKeyDown: (e) => {
+          if (arrowKeys.includes(e.key)) {
+            isArrowKeyPressed.current = true;
           }
-        ),
-        /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
-      ]
-    }
-  ) });
+          queueMicrotask(() => {
+            isArrowKeyPressed.current = false;
+          });
+        },
+        render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
+      }
+    ),
+    /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
+  ] }) });
 }
 function TreeItemActionsOverflowMenuContent() {
   const actions = React.useContext(TreeItemOverflowActionsContext);
@@ -334,7 +332,7 @@ const TreeItemAction = React.memo(
           {
             label,
             icon,
-            inert: visible === false ? true : void 0,
+            inert: visible === false ? "true" : void 0,
             ...rest,
             dot,
             variant: "ghost",

package/dist/styles.css.js

@@ -1,5 +1,5 @@
 // inline-css:/home/runner/work/design-system/design-system/packages/structures/src/styles.css
-var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--ids-color-border-neutral-muted);grid-template-rows:[trigger-start]auto[trigger-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer base{.🥝-accordion-item-trigger{padding:var(--🥝accordion-item-padding);--🥝focus-outline-offset:-4px;cursor:pointer;grid-area:trigger/decoration-before-start/trigger/decoration-after-end;grid-template-columns:inherit;border-radius:12px;align-items:center;display:grid}@supports (grid-template-columns:subgrid){.🥝-accordion-item-trigger{grid-template-columns:subgrid}}}@layer states{.🥝-accordion-item-trigger:where([aria-expanded=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-marker{grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-trigger:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;grid-column:content;font-weight:500}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--ids-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--ids-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--ids-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--ids-color-border-info-base);--🥝icon-color:var(--ids-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--ids-color-border-positive-base);--🥝icon-color:var(--ids-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--ids-color-border-attention-base);--🥝icon-color:var(--ids-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--ids-color-border-critical-base);--🥝icon-color:var(--ids-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--ids-color-border-attention-base);background-color:var(--ids-color-bg-elevation-base);box-shadow:var(--ids-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--ids-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--ids-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--ids-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--ids-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--ids-color-bg-page-base);box-shadow:var(--ids-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--ids-color-icon-attention-base);--🥝tree-item-color:var(--ids-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
+var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--ids-color-border-neutral-muted);grid-template-rows:[header-start]auto[header-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer states{.🥝-accordion-item:where([data-kiwi-open=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-header{padding:var(--🥝accordion-item-padding);grid-area:header/decoration-before-start/header/decoration-after-end;grid-template-columns:inherit;align-items:center;display:grid;position:relative}@supports (grid-template-columns:subgrid){.🥝-accordion-item-header{grid-template-columns:subgrid}}}@layer base{.🥝-accordion-item-marker{pointer-events:none;grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-header:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;font-weight:500;display:inline-block}}@layer base{.🥝-accordion-item-button{cursor:pointer;--🥝focus-outline-offset:-4px;border-radius:12px;grid-column:content}.🥝-accordion-item-button:after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer states{.🥝-accordion-item-button:focus-visible{outline:0}.🥝-accordion-item-button:focus-visible:after{outline:var(--🥝focus-outline);outline-offset:var(--🥝focus-outline-offset)}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--ids-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-accordion-item-heading{text-box:cap alphabetic;grid-column:content;margin-block:0}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--ids-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--ids-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--ids-color-border-info-base);--🥝icon-color:var(--ids-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--ids-color-border-positive-base);--🥝icon-color:var(--ids-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--ids-color-border-attention-base);--🥝icon-color:var(--ids-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--ids-color-border-critical-base);--🥝icon-color:var(--ids-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--ids-color-border-attention-base);background-color:var(--ids-color-bg-elevation-base);box-shadow:var(--ids-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--ids-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--ids-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--ids-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--ids-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--ids-color-bg-page-base);box-shadow:var(--ids-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--ids-color-icon-attention-base);--🥝tree-item-color:var(--ids-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
 
 // src/styles.css.ts
 var styles_css_default = styles_default;

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "@stratakit/structures",
   "type": "module",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "license": "MIT",
   "sideEffects": false,
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "@stratakit/source": "./src/index.ts",
@@ -41,21 +42,21 @@
   ],
   "dependencies": {
     "@ariakit/react": "^0.4.17",
-    "@stratakit/bricks": "^0.2.0",
+    "@stratakit/bricks": "^0.2.1",
     "classnames": "^2.5.1"
   },
   "devDependencies": {
-    "@types/node": "^22.14.1",
-    "@types/react": "^19.1.2",
-    "@types/react-dom": "^19.1.2",
-    "esbuild": "^0.25.3",
+    "@types/node": "^22.15.21",
+    "@types/react": "^19.1.5",
+    "@types/react-dom": "^19.1.5",
+    "esbuild": "^0.25.4",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "typescript": "~5.8.3",
-    "@stratakit/foundations": "0.1.3"
+    "@stratakit/foundations": "0.1.5"
   },
   "peerDependencies": {
-    "@stratakit/foundations": "^0.1.3",
+    "@stratakit/foundations": "^0.1.5",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },