@react-md/core 1.0.0-next.2 → 1.0.0-next.4

package/dist/src/tree/Tree.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/Tree.tsx"],"sourcesContent":["\"use client\";\nimport {\n  type ComponentType,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { type CustomLinkComponent } from \"../link/Link.js\";\nimport { List } from \"../list/List.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n  RenderRecursively,\n  type RenderRecursiveItemsProps,\n} from \"../utils/RenderRecursively.js\";\nimport { identity } from \"../utils/identity.js\";\nimport { DefaultTreeItemRenderer } from \"./DefaultTreeItemRenderer.js\";\nimport { TreeProvider, type TreeExpansionMode } from \"./TreeProvider.js\";\nimport { tree } from \"./styles.js\";\nimport {\n  type TreeData,\n  type TreeItemNode,\n  type TreeItemSorter,\n} from \"./types.js\";\nimport { type TreeExpansion } from \"./useTreeExpansion.js\";\nimport { useTreeItems } from \"./useTreeItems.js\";\nimport { useTreeMovement } from \"./useTreeMovement.js\";\nimport { type TreeSelection } from \"./useTreeSelection.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-tree-depth\"?: number;\n    \"--rmd-tree-item-padding\"?: string | number;\n    \"--rmd-tree-item-padding-base\"?: string | number;\n    \"--rmd-tree-item-padding-incrementor\"?: string | number;\n  }\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type TreeHTMLAttributes = Omit<\n  HTMLAttributes<HTMLUListElement>,\n  \"role\" | \"tabIndex\" | \"children\"\n>;\n\n/**\n * @remarks\n * \\@since 6.0.0 There was a major API change and the `id` is now `optional`.\n * In addition, the following props were removed:\n * - `itemRenderer`\n * - `labelKey`\n * - `valueKey`\n * - `getItemLabel`\n * - `getItemValue`\n * - `getItemProps`\n */\nexport interface TreeProps<T extends TreeItemNode>\n  extends TreeHTMLAttributes,\n    TreeExpansion,\n    TreeSelection {\n  /** @see {@link TreeData} */\n  data: TreeData<T>;\n\n  /**\n   * An optional ref to pass to the tree element.\n   *\n   * @remarks \\@since 6.0.0\n   */\n  treeRef?: Ref<HTMLUListElement>;\n\n  /** @defaultValue `identity` */\n  sort?: TreeItemSorter<T>;\n\n  /**\n   * Any nodes in the {@Link data} that have a `parentId` set to this value will\n   * appear at the root of the tree.\n   *\n   * @defaultValue `null`\n   */\n  rootId?: string | null;\n\n  /**\n   * @defaultValue `\"auto\"`\n   * @see {@link TreeExpansionMode}\n   */\n  expansionMode?: TreeExpansionMode;\n\n  /**\n   * Set this to `true` to display the expander icon to the left instead of the\n   * right. This will also update the styles slightly so you can still provide a\n   * `leftAddon`.\n   *\n   * @defaultValue `false`\n   */\n  expanderLeft?: boolean;\n\n  /**\n   * @defaultValue `getIcon(\"expander\")`\n   */\n  expanderIcon?: ReactNode;\n\n  /**\n   * Set this to `true` to disable the collapse transition for all tree items.\n   *\n   * @defaultValue `false`\n   */\n  disableTransition?: boolean;\n\n  /**\n   * Set this to `true` if the collapsed tree items should be removed from the\n   * DOM instead of hidden using `display: none`. This _might_ improve\n   * performance for large trees.\n   *\n   * @defaultValue `false`\n   */\n  temporaryChildItems?: boolean;\n\n  /**\n   * @example\n   * Custom Tree Item Renderer\n   * ```tsx\n   * import {\n   *   TreeItem,\n   *   useKeyboardMovementContext,\n   *   useTreeContext,\n   *   type RenderRecursiveItemsProps,\n   * } from \"@react-md/core\";\n   * import FolderIcon from \"@react-md/material-icons/FolderIcon\";\n   * import FolderOpenIcon from \"@react-md/material-icons/FolderOpenIcon\";\n   * import { type ReactElement } from \"react\";\n   *\n   * export function CustomTreeItem(props: TreeItemRendererProps): ReactElement {\n   *   const { item, ...remaining  } = props;\n   *   const id = useId();\n   *   const { itemId } = item;\n   *   const {\n   *     data,\n   *     expandedIds,\n   *     selectedIds,\n   *     toggleTreeItemExpansion,\n   *     toggleTreeItemSelection,\n   *   } = useTreeContext()\n   *   const { activeDescendantId } = useKeyboardMovementContext();\n   *\n   *   const focused = id === activeDescendantId;\n   *   const expanded = expandedIds.has(itemId);\n   *   const selected = selectedIds.has(itemId);\n   *   const children = ...; // do whatever\n   *\n   *   return (\n   *     <TreeItem\n   *       {...remaining}\n   *       id={id}\n   *       itemId={itemId}\n   *       leftAddon={expanded ? <FolderOpenIcon /> : <FolderIcon />}\n   *     >\n   *       {children}\n   *     </TreeItem>\n   *   );\n   * }\n   * ```\n   *\n   * @see {@link DefaultTreeItemRenderer}\n   * @defaultValue `DefaultTreeItemRenderer`\n   */\n  renderer?: ComponentType<RenderRecursiveItemsProps<T, TreeData<T>>>;\n\n  /**\n   * The link component to use for any tree item nodes that have a `to` or\n   * `href`.\n   *\n   * @see {@link CustomLinkComponent}\n   * @defaultValue `Link`\n   */\n  linkComponent?: CustomLinkComponent;\n}\n\n/**\n * **Client Component**\n *\n * @example\n * Simple Tree\n * ```tsx\n * import type { TreeData } from \"@react-md/core\";\n * import { Tree, useTree } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * const data: TreeData = {\n *   \"item-1\": {\n *     itemId: \"item-1\",\n *     parentId: null,\n *     name: \"Root Level Item 1\",\n *   },\n *   \"item-2\": {\n *     itemId: \"item-2\",\n *     parentId: \"item-1\",\n *     name: \"A child for the first item\",\n *   },\n *   \"item-3\": {\n *     itemId: \"item-3\",\n *     parentId: \"item-1\",\n *     children: \"Another child for the first item\",\n *   },\n * };\n *\n * function Example(): ReactElement {\n *   const tree = useTree({\n *     // can enable multiple selected items\n *     // multiSelect: true,\n *\n *     // can set default expanded and selected items\n *     // defaultSelectedIds: [\"item-1\"],\n *     // defaultExpandedIds: [\"item-1\"],\n *   });\n *\n *   return (\n *     <Tree\n *       {...tree}\n *       aria-label=\"Tree\"\n *       data={data}\n *     />\n *   );\n * }\n * ```\n *\n * @see {@link TreeProps.renderer} for a custom tree item example.\n *\n * @remarks\n * \\@since 6.0.0 There was a major API change and the `id` is now `optional`.\n * In addition, the following props were removed:\n * - `itemRenderer`\n * - `labelKey`\n * - `valueKey`\n * - `getItemLabel`\n * - `getItemValue`\n * - `getItemProps`\n */\nexport function Tree<T extends TreeItemNode>(\n  props: LabelRequiredForA11y<TreeProps<T>>\n): ReactElement {\n  const {\n    id,\n    data,\n    sort = identity,\n    rootId = null,\n    treeRef,\n    className,\n    expandedIds,\n    selectedIds,\n    toggleTreeItemSelection,\n    selectMultipleTreeItems,\n    toggleTreeItemExpansion,\n    expandMultipleTreeItems,\n    onClick,\n    onFocus,\n    onKeyDown,\n    renderer: TreeItemRenderer = DefaultTreeItemRenderer,\n    multiSelect = false,\n    expansionMode = \"auto\",\n    expanderIcon,\n    expanderLeft = false,\n    linkComponent = \"a\",\n    disableTransition = false,\n    temporaryChildItems = false,\n    ...remaining\n  } = props;\n  const treeId = useEnsuredId(id, \"tree\");\n  const { items, treeItemChildIds } = useTreeItems({\n    data,\n    sort,\n    rootId,\n  });\n\n  const { metadataLookup, movementContext, movementProps } = useTreeMovement({\n    onClick,\n    onFocus,\n    onKeyDown,\n    data,\n    expandedIds,\n    selectedIds,\n    treeItemChildIds,\n    toggleTreeItemExpansion,\n    expandMultipleTreeItems,\n  });\n\n  return (\n    <TreeProvider\n      data={data}\n      rootId={rootId}\n      multiSelect={multiSelect}\n      linkComponent={linkComponent}\n      selectedIds={selectedIds}\n      expandedIds={expandedIds}\n      expanderIcon={expanderIcon}\n      expanderLeft={expanderLeft}\n      expansionMode={expansionMode}\n      metadataLookup={metadataLookup}\n      disableTransition={disableTransition}\n      temporaryChildItems={temporaryChildItems}\n      toggleTreeItemSelection={toggleTreeItemSelection}\n      toggleTreeItemExpansion={toggleTreeItemExpansion}\n      selectMultipleTreeItems={selectMultipleTreeItems}\n      expandMultipleTreeItems={expandMultipleTreeItems}\n    >\n      <KeyboardMovementProvider value={movementContext}>\n        <List\n          {...remaining}\n          {...movementProps}\n          id={treeId}\n          ref={treeRef}\n          role=\"tree\"\n          tabIndex={0}\n          className={tree({ className })}\n        >\n          <RenderRecursively\n            items={items}\n            getItemKey={(item) => item.itemId}\n            render={TreeItemRenderer}\n          />\n        </List>\n      </KeyboardMovementProvider>\n    </TreeProvider>\n  );\n}\n"],"names":["List","KeyboardMovementProvider","useEnsuredId","RenderRecursively","identity","DefaultTreeItemRenderer","TreeProvider","tree","useTreeItems","useTreeMovement","Tree","props","id","data","sort","rootId","treeRef","className","expandedIds","selectedIds","toggleTreeItemSelection","selectMultipleTreeItems","toggleTreeItemExpansion","expandMultipleTreeItems","onClick","onFocus","onKeyDown","renderer","TreeItemRenderer","multiSelect","expansionMode","expanderIcon","expanderLeft","linkComponent","disableTransition","temporaryChildItems","remaining","treeId","items","treeItemChildIds","metadataLookup","movementContext","movementProps","value","ref","role","tabIndex","getItemKey","item","itemId","render"],"mappings":"AAAA;;AASA,SAASA,IAAI,QAAQ,kBAAkB;AACvC,SAASC,wBAAwB,QAAQ,6CAA6C;AAEtF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SACEC,iBAAiB,QAEZ,gCAAgC;AACvC,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAASC,uBAAuB,QAAQ,+BAA+B;AACvE,SAASC,YAAY,QAAgC,oBAAoB;AACzE,SAASC,IAAI,QAAQ,cAAc;AAOnC,SAASC,YAAY,QAAQ,oBAAoB;AACjD,SAASC,eAAe,QAAQ,uBAAuB;AAwJvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DC,GACD,OAAO,SAASC,KACdC,KAAyC;IAEzC,MAAM,EACJC,EAAE,EACFC,IAAI,EACJC,OAAOV,QAAQ,EACfW,SAAS,IAAI,EACbC,OAAO,EACPC,SAAS,EACTC,WAAW,EACXC,WAAW,EACXC,uBAAuB,EACvBC,uBAAuB,EACvBC,uBAAuB,EACvBC,uBAAuB,EACvBC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,UAAUC,mBAAmBvB,uBAAuB,EACpDwB,cAAc,KAAK,EACnBC,gBAAgB,MAAM,EACtBC,YAAY,EACZC,eAAe,KAAK,EACpBC,gBAAgB,GAAG,EACnBC,oBAAoB,KAAK,EACzBC,sBAAsB,KAAK,EAC3B,GAAGC,WACJ,GAAGzB;IACJ,MAAM0B,SAASnC,aAAaU,IAAI;IAChC,MAAM,EAAE0B,KAAK,EAAEC,gBAAgB,EAAE,GAAG/B,aAAa;QAC/CK;QACAC;QACAC;IACF;IAEA,MAAM,EAAEyB,cAAc,EAAEC,eAAe,EAAEC,aAAa,EAAE,GAAGjC,gBAAgB;QACzEe;QACAC;QACAC;QACAb;QACAK;QACAC;QACAoB;QACAjB;QACAC;IACF;IAEA,qBACE,KAACjB;QACCO,MAAMA;QACNE,QAAQA;QACRc,aAAaA;QACbI,eAAeA;QACfd,aAAaA;QACbD,aAAaA;QACba,cAAcA;QACdC,cAAcA;QACdF,eAAeA;QACfU,gBAAgBA;QAChBN,mBAAmBA;QACnBC,qBAAqBA;QACrBf,yBAAyBA;QACzBE,yBAAyBA;QACzBD,yBAAyBA;QACzBE,yBAAyBA;kBAEzB,cAAA,KAACtB;YAAyB0C,OAAOF;sBAC/B,cAAA,KAACzC;gBACE,GAAGoC,SAAS;gBACZ,GAAGM,aAAa;gBACjB9B,IAAIyB;gBACJO,KAAK5B;gBACL6B,MAAK;gBACLC,UAAU;gBACV7B,WAAWV,KAAK;oBAAEU;gBAAU;0BAE5B,cAAA,KAACd;oBACCmC,OAAOA;oBACPS,YAAY,CAACC,OAASA,KAAKC,MAAM;oBACjCC,QAAQtB;;;;;AAMpB"}

package/dist/src/tree/TreeGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/TreeGroup.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, type CSSProperties, type ReactNode } from \"react\";\nimport { List, type ListProps } from \"../list/List.js\";\nimport { useCollapseTransition } from \"../transition/useCollapseTransition.js\";\nimport { useTreeContext } from \"./TreeProvider.js\";\nimport { treeGroup } from \"./styles.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface OverridableTreeGroupProps extends ListProps {\n  /** @defaultValue `false` */\n  temporary?: boolean;\n\n  /** @defaultValue `false` */\n  disableTransition?: boolean;\n}\n\n/**\n * @internal\n * @remarks \\@since 6.0.0\n */\nexport interface TreeGroupProps extends OverridableTreeGroupProps {\n  children: ReactNode;\n  depth: number;\n  collapsed: boolean;\n}\n\n/**\n * **Client Component**\n *\n * @internal\n * @remarks \\@since 6.0.0 Removed the collapse options and is no longer a\n * \"public\" component.\n */\nexport const TreeGroup = forwardRef<HTMLUListElement, TreeGroupProps>(\n  function TreeGroup(props, ref) {\n    const {\n      className,\n      collapsed,\n      depth,\n      onClick,\n      onMouseDown,\n      children,\n      temporary: propTemporary,\n      disableTransition = false,\n      ...remaining\n    } = props;\n\n    const style: CSSProperties = {\n      ...remaining.style,\n      \"--rmd-tree-depth\": depth,\n    };\n\n    const { temporaryChildItems } = useTreeContext();\n    const temporary = propTemporary ?? temporaryChildItems;\n\n    const { elementProps, rendered } = useCollapseTransition({\n      style,\n      nodeRef: ref,\n      enter: !disableTransition,\n      exit: !disableTransition,\n      transitionIn: !collapsed,\n      temporary,\n      className: treeGroup({ className }),\n    });\n\n    if (!rendered || !children) {\n      return null;\n    }\n\n    return (\n      <List\n        {...remaining}\n        onClick={(event) => {\n          onClick?.(event);\n          // always stop propagation for click events and mousedown for groups\n          // so that the parent child item's click and mousedown events aren't\n          // also fired while there are disabled child elementsS or\n          // non-interactable (like dividers or subheader)\n          event.stopPropagation();\n        }}\n        onMouseDown={(event) => {\n          onMouseDown?.(event);\n          event.stopPropagation();\n        }}\n        {...elementProps}\n        role=\"group\"\n      >\n        {children}\n      </List>\n    );\n  }\n);\n"],"names":["forwardRef","List","useCollapseTransition","useTreeContext","treeGroup","TreeGroup","props","ref","className","collapsed","depth","onClick","onMouseDown","children","temporary","propTemporary","disableTransition","remaining","style","temporaryChildItems","elementProps","rendered","nodeRef","enter","exit","transitionIn","event","stopPropagation","role"],"mappings":"AAAA;;AACA,SAASA,UAAU,QAA4C,QAAQ;AACvE,SAASC,IAAI,QAAwB,kBAAkB;AACvD,SAASC,qBAAqB,QAAQ,yCAAyC;AAC/E,SAASC,cAAc,QAAQ,oBAAoB;AACnD,SAASC,SAAS,QAAQ,cAAc;AAuBxC;;;;;;CAMC,GACD,OAAO,MAAMC,0BAAYL,WACvB,SAASK,UAAUC,KAAK,EAAEC,GAAG;IAC3B,MAAM,EACJC,SAAS,EACTC,SAAS,EACTC,KAAK,EACLC,OAAO,EACPC,WAAW,EACXC,QAAQ,EACRC,WAAWC,aAAa,EACxBC,oBAAoB,KAAK,EACzB,GAAGC,WACJ,GAAGX;IAEJ,MAAMY,QAAuB;QAC3B,GAAGD,UAAUC,KAAK;QAClB,oBAAoBR;IACtB;IAEA,MAAM,EAAES,mBAAmB,EAAE,GAAGhB;IAChC,MAAMW,YAAYC,iBAAiBI;IAEnC,MAAM,EAAEC,YAAY,EAAEC,QAAQ,EAAE,GAAGnB,sBAAsB;QACvDgB;QACAI,SAASf;QACTgB,OAAO,CAACP;QACRQ,MAAM,CAACR;QACPS,cAAc,CAAChB;QACfK;QACAN,WAAWJ,UAAU;YAAEI;QAAU;IACnC;IAEA,IAAI,CAACa,YAAY,CAACR,UAAU;QAC1B,OAAO;IACT;IAEA,qBACE,KAACZ;QACE,GAAGgB,SAAS;QACbN,SAAS,CAACe;YACRf,UAAUe;YACV,oEAAoE;YACpE,oEAAoE;YACpE,yDAAyD;YACzD,gDAAgD;YAChDA,MAAMC,eAAe;QACvB;QACAf,aAAa,CAACc;YACZd,cAAcc;YACdA,MAAMC,eAAe;QACvB;QACC,GAAGP,YAAY;QAChBQ,MAAK;kBAEJf;;AAGP,GACA"}

package/dist/src/tree/TreeItem.js

@@ -0,0 +1,173 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { useElementInteraction } from "../interaction/useElementInteraction.js";
+import { useHigherContrastChildren } from "../interaction/useHigherContrastChildren.js";
+import { ListItemChildren } from "../list/ListItemChildren.js";
+import { useKeyboardMovementContext } from "../movement/useKeyboardMovementProvider.js";
+import { useEnsuredId } from "../useEnsuredId.js";
+import { TreeGroup } from "./TreeGroup.js";
+import { TreeItemExpander } from "./TreeItemExpander.js";
+import { useTreeContext } from "./TreeProvider.js";
+import { treeItem, treeItemContent, treeItemMedia } from "./styles.js";
+/**
+ * **Client Component**
+ *
+ * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/treeview/}
+ * @remarks
+ * \@since 6.0.0 The wrapping `<li>` element will always be `role="none"` and
+ * the `<span>` or `<a>` will gain the `role="treeitem"` instead. This makes it
+ * easier to pass event handlers because of the nested behavior of tree items.
+ * \@since 6.0.0 No longer provides the `aria-level`, `aria-setsize` and
+ * `aria-posinset` attributes and allows the browser to compute them instead.
+ */ export function TreeItem(props) {
+    const { id: propId, depth, liProps, disabled = false, disabledOpacity = false, groupProps, children: propChildren, className, itemId, leftAddon, leftAddonType: propLeftAddonType, leftAddonPosition, leftAddonClassName, leftAddonForceWrap, rightAddon, rightAddonType, rightAddonPosition, rightAddonClassName, rightAddonForceWrap, disableTextChildren, disableLeftAddonCenteredMedia: propDisableLeftAddonCenteredMedia, disableRightAddonCenteredMedia, textProps, textClassName, primaryText, secondaryText, secondaryTextProps, secondaryTextClassName, multiline, childItems, contentClassName, temporaryChildItems, disableTransition: propDisableTransition, onBlur, onClick, onKeyDown, onKeyUp, onMouseDown, onMouseUp, onMouseLeave, onDragStart, onTouchStart, onTouchEnd, onTouchMove, contentRef, ...remaining } = props;
+    const id = useEnsuredId(propId, "tree-item");
+    const children = useHigherContrastChildren(propChildren);
+    if (disabled) {
+        // you can't really disable a link other than removing the href, so
+        // unset these props
+        remaining.to = undefined;
+        remaining.href = undefined;
+    }
+    const { expandedIds, selectedIds, expanderLeft, expansionMode, metadataLookup, linkComponent: Link, toggleTreeItemSelection, toggleTreeItemExpansion, disableTransition: contextDisableTransition } = useTreeContext();
+    const { activeDescendantId } = useKeyboardMovementContext();
+    const isLeafNode = !childItems;
+    const focused = activeDescendantId === id;
+    const expanded = expandedIds.has(itemId);
+    const selected = selectedIds.has(itemId);
+    const disableTransition = propDisableTransition ?? contextDisableTransition;
+    useEffect(()=>{
+        const lookup = metadataLookup.current;
+        lookup.expandable[itemId] = !isLeafNode;
+        lookup.disabledItems[itemId] = disabled;
+        lookup.elementToItem[id] = itemId;
+        lookup.itemToElement[itemId] = id;
+        return ()=>{
+            delete lookup.disabledItems[itemId];
+            delete lookup.expandable[itemId];
+            delete lookup.elementToItem[id];
+            delete lookup.itemToElement[itemId];
+        };
+    }, [
+        id,
+        metadataLookup,
+        itemId,
+        isLeafNode,
+        disabled,
+        depth
+    ]);
+    const { pressedClassName, ripples, handlers } = useElementInteraction({
+        onBlur,
+        onClick (event) {
+            onClick?.(event);
+            toggleTreeItemSelection(itemId);
+            if (!isLeafNode && expansionMode !== "manual") {
+                toggleTreeItemExpansion(itemId);
+            }
+        },
+        onKeyDown,
+        onKeyUp,
+        onMouseDown,
+        onMouseUp,
+        onMouseLeave,
+        onDragStart,
+        onTouchStart,
+        onTouchEnd,
+        onTouchMove,
+        disabled
+    });
+    const isLink = !!(remaining.to || remaining.href);
+    // cheating a bit so there are type errors around the event handlers
+    const ContentComponent = isLink ? Link : "span";
+    const leftAddonType = propLeftAddonType ?? (expanderLeft && leftAddon) ? "media" : undefined;
+    const isMediaLeftAddon = typeof propLeftAddonType === "undefined" && leftAddonType === "media";
+    const disableLeftAddonCenteredMedia = propDisableLeftAddonCenteredMedia ?? isMediaLeftAddon;
+    return /*#__PURE__*/ _jsxs("li", {
+        ...liProps,
+        role: "none",
+        className: treeItem({
+            className,
+            expander: !!childItems,
+            expanderLeft
+        }),
+        children: [
+            /*#__PURE__*/ _jsxs(ContentComponent, {
+                ...remaining,
+                // nodes with children should always apply the `aria-expanded` to show
+                // that it is expandable while leaf nodes should remain omitted
+                "aria-expanded": isLeafNode ? undefined : expanded,
+                "aria-selected": selected,
+                "aria-disabled": disabled || undefined,
+                id: id,
+                ref: contentRef,
+                role: "treeitem",
+                tabIndex: -1,
+                ...handlers,
+                className: treeItemContent({
+                    link: isLink,
+                    focused,
+                    selected,
+                    disabled,
+                    disabledOpacity,
+                    className: contentClassName,
+                    pressedClassName
+                }),
+                children: [
+                    /*#__PURE__*/ _jsx(ListItemChildren, {
+                        multiline: multiline,
+                        textClassName: textClassName,
+                        secondaryTextClassName: secondaryTextClassName,
+                        disableTextChildren: disableTextChildren,
+                        primaryText: primaryText,
+                        textProps: textProps,
+                        secondaryText: secondaryText,
+                        secondaryTextProps: secondaryTextProps,
+                        leftAddon: /*#__PURE__*/ _jsx(TreeItemExpander, {
+                            isLeft: true,
+                            itemId: itemId,
+                            addon: leftAddon,
+                            expanded: expanded,
+                            disabled: disabled,
+                            isLeafNode: isLeafNode
+                        }),
+                        leftAddonType: leftAddonType,
+                        leftAddonPosition: leftAddonPosition,
+                        leftAddonClassName: treeItemMedia({
+                            isLeafNode,
+                            isMediaLeftAddon,
+                            className: leftAddonClassName
+                        }),
+                        leftAddonForceWrap: leftAddonForceWrap,
+                        rightAddon: /*#__PURE__*/ _jsx(TreeItemExpander, {
+                            itemId: itemId,
+                            addon: rightAddon,
+                            expanded: expanded,
+                            disabled: disabled,
+                            isLeafNode: isLeafNode
+                        }),
+                        rightAddonType: rightAddonType,
+                        rightAddonPosition: rightAddonPosition,
+                        rightAddonClassName: rightAddonClassName,
+                        rightAddonForceWrap: rightAddonForceWrap,
+                        disableLeftAddonCenteredMedia: disableLeftAddonCenteredMedia,
+                        disableRightAddonCenteredMedia: disableRightAddonCenteredMedia,
+                        children: children
+                    }),
+                    ripples
+                ]
+            }),
+            /*#__PURE__*/ _jsx(TreeGroup, {
+                id: `${id}-group`,
+                temporary: temporaryChildItems,
+                disableTransition: disableTransition,
+                ...groupProps,
+                depth: depth + 1,
+                collapsed: isLeafNode || !expanded,
+                children: childItems
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=TreeItem.js.map

package/dist/src/tree/TreeItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/TreeItem.tsx"],"sourcesContent":["\"use client\";\nimport {\n  useEffect,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { ListItemChildren } from \"../list/ListItemChildren.js\";\nimport { useKeyboardMovementContext } from \"../movement/useKeyboardMovementProvider.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { TreeGroup, type OverridableTreeGroupProps } from \"./TreeGroup.js\";\nimport { TreeItemExpander } from \"./TreeItemExpander.js\";\nimport { useTreeContext } from \"./TreeProvider.js\";\nimport { treeItem, treeItemContent, treeItemMedia } from \"./styles.js\";\nimport { type DefaultTreeItemNode } from \"./types.js\";\n\n/**\n * @remarks \\@since 6.0.0  Added the `groupProps` prop.\n */\nexport interface TreeItemProps\n  extends Omit<DefaultTreeItemNode, \"parentId\">,\n    HTMLAttributes<HTMLLIElement> {\n  /**\n   * @defaultValue `\"tree-item-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * This is used to set the `--rmd-tree-depth` CSS variable which allows the\n   * padding to increase for each nested tree.\n   */\n  depth: number;\n\n  /**\n   * Any additional props that should be passed to the surrounding `<li>`\n   * element. The top-level props are passed to the `<span>` or `<a>` element\n   * instead.\n   */\n  liProps?: PropsWithRef<HTMLAttributes<HTMLLIElement>, HTMLLIElement>;\n\n  /**\n   * Any additional props to pass to the `TreeGroup` component.\n   */\n  groupProps?: PropsWithRef<OverridableTreeGroupProps, HTMLUListElement>;\n\n  /**\n   * This should normally be the text/content to display within the tree item\n   * and should **not** include nested trees.\n   */\n  children?: ReactNode;\n\n  /**\n   * The nested tree items to render within a `TreeGroup`.\n   */\n  childItems?: ReactNode;\n\n  /** @defaultValue `false` */\n  disableTransition?: boolean;\n\n  /**\n   * This ref is applied to the `<span>` or `<a>` element and can be used to\n   * implement drag and drop behavior.\n   */\n  contentRef?: Ref<HTMLElement>;\n\n  /**\n   * Set this to `true` if the {@link childItems} should not be rendered while\n   * collapsed.\n   *\n   * @defaultValue `false`\n   */\n  temporaryChildItems?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/treeview/}\n * @remarks\n * \\@since 6.0.0 The wrapping `<li>` element will always be `role=\"none\"` and\n * the `<span>` or `<a>` will gain the `role=\"treeitem\"` instead. This makes it\n * easier to pass event handlers because of the nested behavior of tree items.\n * \\@since 6.0.0 No longer provides the `aria-level`, `aria-setsize` and\n * `aria-posinset` attributes and allows the browser to compute them instead.\n */\nexport function TreeItem(props: TreeItemProps): ReactElement {\n  const {\n    id: propId,\n    depth,\n    liProps,\n    disabled = false,\n    disabledOpacity = false,\n    groupProps,\n    children: propChildren,\n    className,\n    itemId,\n    leftAddon,\n    leftAddonType: propLeftAddonType,\n    leftAddonPosition,\n    leftAddonClassName,\n    leftAddonForceWrap,\n    rightAddon,\n    rightAddonType,\n    rightAddonPosition,\n    rightAddonClassName,\n    rightAddonForceWrap,\n    disableTextChildren,\n    disableLeftAddonCenteredMedia: propDisableLeftAddonCenteredMedia,\n    disableRightAddonCenteredMedia,\n    textProps,\n    textClassName,\n    primaryText,\n    secondaryText,\n    secondaryTextProps,\n    secondaryTextClassName,\n    multiline,\n    childItems,\n    contentClassName,\n    temporaryChildItems,\n    disableTransition: propDisableTransition,\n    onBlur,\n    onClick,\n    onKeyDown,\n    onKeyUp,\n    onMouseDown,\n    onMouseUp,\n    onMouseLeave,\n    onDragStart,\n    onTouchStart,\n    onTouchEnd,\n    onTouchMove,\n    contentRef,\n    ...remaining\n  } = props;\n\n  const id = useEnsuredId(propId, \"tree-item\");\n  const children = useHigherContrastChildren(propChildren);\n  if (disabled) {\n    // you can't really disable a link other than removing the href, so\n    // unset these props\n    remaining.to = undefined;\n    remaining.href = undefined;\n  }\n\n  const {\n    expandedIds,\n    selectedIds,\n    expanderLeft,\n    expansionMode,\n    metadataLookup,\n    linkComponent: Link,\n    toggleTreeItemSelection,\n    toggleTreeItemExpansion,\n    disableTransition: contextDisableTransition,\n  } = useTreeContext();\n  const { activeDescendantId } = useKeyboardMovementContext();\n\n  const isLeafNode = !childItems;\n  const focused = activeDescendantId === id;\n  const expanded = expandedIds.has(itemId);\n  const selected = selectedIds.has(itemId);\n  const disableTransition = propDisableTransition ?? contextDisableTransition;\n\n  useEffect(() => {\n    const lookup = metadataLookup.current;\n    lookup.expandable[itemId] = !isLeafNode;\n    lookup.disabledItems[itemId] = disabled;\n    lookup.elementToItem[id] = itemId;\n    lookup.itemToElement[itemId] = id;\n\n    return () => {\n      delete lookup.disabledItems[itemId];\n      delete lookup.expandable[itemId];\n      delete lookup.elementToItem[id];\n      delete lookup.itemToElement[itemId];\n    };\n  }, [id, metadataLookup, itemId, isLeafNode, disabled, depth]);\n\n  const { pressedClassName, ripples, handlers } =\n    useElementInteraction<HTMLLIElement>({\n      onBlur,\n      onClick(event) {\n        onClick?.(event);\n        toggleTreeItemSelection(itemId);\n        if (!isLeafNode && expansionMode !== \"manual\") {\n          toggleTreeItemExpansion(itemId);\n        }\n      },\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseUp,\n      onMouseLeave,\n      onDragStart,\n      onTouchStart,\n      onTouchEnd,\n      onTouchMove,\n      disabled,\n    });\n\n  const isLink = !!(remaining.to || remaining.href);\n\n  // cheating a bit so there are type errors around the event handlers\n  const ContentComponent = (isLink ? Link : \"span\") as \"span\";\n  const leftAddonType =\n    propLeftAddonType ?? (expanderLeft && leftAddon) ? \"media\" : undefined;\n  const isMediaLeftAddon =\n    typeof propLeftAddonType === \"undefined\" && leftAddonType === \"media\";\n  const disableLeftAddonCenteredMedia =\n    propDisableLeftAddonCenteredMedia ?? isMediaLeftAddon;\n\n  return (\n    <li\n      {...liProps}\n      role=\"none\"\n      className={treeItem({\n        className,\n        expander: !!childItems,\n        expanderLeft,\n      })}\n    >\n      <ContentComponent\n        {...remaining}\n        // nodes with children should always apply the `aria-expanded` to show\n        // that it is expandable while leaf nodes should remain omitted\n        aria-expanded={isLeafNode ? undefined : expanded}\n        aria-selected={selected}\n        aria-disabled={disabled || undefined}\n        id={id}\n        ref={contentRef}\n        role=\"treeitem\"\n        tabIndex={-1}\n        {...handlers}\n        className={treeItemContent({\n          link: isLink,\n          focused,\n          selected,\n          disabled,\n          disabledOpacity,\n          className: contentClassName,\n          pressedClassName,\n        })}\n      >\n        <ListItemChildren\n          multiline={multiline}\n          textClassName={textClassName}\n          secondaryTextClassName={secondaryTextClassName}\n          disableTextChildren={disableTextChildren}\n          primaryText={primaryText}\n          textProps={textProps}\n          secondaryText={secondaryText}\n          secondaryTextProps={secondaryTextProps}\n          leftAddon={\n            <TreeItemExpander\n              isLeft\n              itemId={itemId}\n              addon={leftAddon}\n              expanded={expanded}\n              disabled={disabled}\n              isLeafNode={isLeafNode}\n            />\n          }\n          leftAddonType={leftAddonType}\n          leftAddonPosition={leftAddonPosition}\n          leftAddonClassName={treeItemMedia({\n            isLeafNode,\n            isMediaLeftAddon,\n            className: leftAddonClassName,\n          })}\n          leftAddonForceWrap={leftAddonForceWrap}\n          rightAddon={\n            <TreeItemExpander\n              itemId={itemId}\n              addon={rightAddon}\n              expanded={expanded}\n              disabled={disabled}\n              isLeafNode={isLeafNode}\n            />\n          }\n          rightAddonType={rightAddonType}\n          rightAddonPosition={rightAddonPosition}\n          rightAddonClassName={rightAddonClassName}\n          rightAddonForceWrap={rightAddonForceWrap}\n          disableLeftAddonCenteredMedia={disableLeftAddonCenteredMedia}\n          disableRightAddonCenteredMedia={disableRightAddonCenteredMedia}\n        >\n          {children}\n        </ListItemChildren>\n        {ripples}\n      </ContentComponent>\n      <TreeGroup\n        id={`${id}-group`}\n        temporary={temporaryChildItems}\n        disableTransition={disableTransition}\n        {...groupProps}\n        depth={depth + 1}\n        collapsed={isLeafNode || !expanded}\n      >\n        {childItems}\n      </TreeGroup>\n    </li>\n  );\n}\n"],"names":["useEffect","useElementInteraction","useHigherContrastChildren","ListItemChildren","useKeyboardMovementContext","useEnsuredId","TreeGroup","TreeItemExpander","useTreeContext","treeItem","treeItemContent","treeItemMedia","TreeItem","props","id","propId","depth","liProps","disabled","disabledOpacity","groupProps","children","propChildren","className","itemId","leftAddon","leftAddonType","propLeftAddonType","leftAddonPosition","leftAddonClassName","leftAddonForceWrap","rightAddon","rightAddonType","rightAddonPosition","rightAddonClassName","rightAddonForceWrap","disableTextChildren","disableLeftAddonCenteredMedia","propDisableLeftAddonCenteredMedia","disableRightAddonCenteredMedia","textProps","textClassName","primaryText","secondaryText","secondaryTextProps","secondaryTextClassName","multiline","childItems","contentClassName","temporaryChildItems","disableTransition","propDisableTransition","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave","onDragStart","onTouchStart","onTouchEnd","onTouchMove","contentRef","remaining","to","undefined","href","expandedIds","selectedIds","expanderLeft","expansionMode","metadataLookup","linkComponent","Link","toggleTreeItemSelection","toggleTreeItemExpansion","contextDisableTransition","activeDescendantId","isLeafNode","focused","expanded","has","selected","lookup","current","expandable","disabledItems","elementToItem","itemToElement","pressedClassName","ripples","handlers","event","isLink","ContentComponent","isMediaLeftAddon","li","role","expander","aria-expanded","aria-selected","aria-disabled","ref","tabIndex","link","isLeft","addon","temporary","collapsed"],"mappings":"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"}

package/dist/src/tree/TreeItemExpander.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/TreeItemExpander.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport {\n  cloneElement,\n  isValidElement,\n  type MouseEventHandler,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { getIcon } from \"../icon/iconConfig.js\";\nimport { IconRotator } from \"../icon/IconRotator.js\";\nimport { useTreeContext } from \"./TreeProvider.js\";\n\n/**\n * @internal\n * @remarks \\@since 6.0.0 Updated to use the latest API\n */\nexport interface TreeItemExpanderProps {\n  /** @defaultValue `false` */\n  isLeft?: boolean;\n  itemId: string;\n  addon: ReactNode;\n  disabled: boolean;\n  expanded: boolean;\n  isLeafNode: boolean;\n  className?: string;\n}\n\n/**\n * **Client Component**\n *\n * @internal\n * @remarks \\@since 6.0.0 Updated to support the new `expansionMode` behavior.\n */\nexport function TreeItemExpander(props: TreeItemExpanderProps): ReactElement {\n  const {\n    itemId,\n    isLeft = false,\n    addon,\n    expanded,\n    disabled,\n    isLeafNode,\n    className,\n  } = props;\n  const {\n    expanderIcon,\n    expanderLeft,\n    expansionMode,\n    disableTransition,\n    toggleTreeItemExpansion,\n  } = useTreeContext();\n\n  const icon = getIcon(\"dropdown\", expanderIcon);\n  if (isLeafNode || expanderLeft !== isLeft) {\n    if (isValidElement<{ className?: string }>(addon)) {\n      return cloneElement(addon, { className });\n    }\n\n    return <>{addon}</>;\n  }\n\n  const isCloneable = isValidElement(icon);\n  let clickProps: { onClick: MouseEventHandler<Element> } | undefined;\n  if (expansionMode === \"manual\" && !disabled) {\n    clickProps = {\n      onClick(event) {\n        // do not select the tree item if the icon is clicked\n        event.stopPropagation();\n        event.preventDefault();\n\n        toggleTreeItemExpansion(itemId);\n      },\n    };\n  }\n\n  return (\n    <>\n      <IconRotator\n        className={cnb(!addon && className)}\n        {...(!isCloneable ? clickProps : undefined)}\n        rotated={expanded}\n        forceIconWrap={!isCloneable}\n        disableTransition={disableTransition}\n      >\n        {clickProps && isCloneable ? cloneElement(icon, clickProps) : icon}\n      </IconRotator>\n      {addon}\n    </>\n  );\n}\n"],"names":["cnb","cloneElement","isValidElement","getIcon","IconRotator","useTreeContext","TreeItemExpander","props","itemId","isLeft","addon","expanded","disabled","isLeafNode","className","expanderIcon","expanderLeft","expansionMode","disableTransition","toggleTreeItemExpansion","icon","isCloneable","clickProps","onClick","event","stopPropagation","preventDefault","undefined","rotated","forceIconWrap"],"mappings":"AAAA;;AACA,SAASA,GAAG,QAAQ,YAAY;AAChC,SACEC,YAAY,EACZC,cAAc,QAIT,QAAQ;AACf,SAASC,OAAO,QAAQ,wBAAwB;AAChD,SAASC,WAAW,QAAQ,yBAAyB;AACrD,SAASC,cAAc,QAAQ,oBAAoB;AAiBnD;;;;;CAKC,GACD,OAAO,SAASC,iBAAiBC,KAA4B;IAC3D,MAAM,EACJC,MAAM,EACNC,SAAS,KAAK,EACdC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACVC,SAAS,EACV,GAAGP;IACJ,MAAM,EACJQ,YAAY,EACZC,YAAY,EACZC,aAAa,EACbC,iBAAiB,EACjBC,uBAAuB,EACxB,GAAGd;IAEJ,MAAMe,OAAOjB,QAAQ,YAAYY;IACjC,IAAIF,cAAcG,iBAAiBP,QAAQ;QACzC,kBAAIP,eAAuCQ,QAAQ;YACjD,qBAAOT,aAAaS,OAAO;gBAAEI;YAAU;QACzC;QAEA,qBAAO;sBAAGJ;;IACZ;IAEA,MAAMW,4BAAcnB,eAAekB;IACnC,IAAIE;IACJ,IAAIL,kBAAkB,YAAY,CAACL,UAAU;QAC3CU,aAAa;YACXC,SAAQC,KAAK;gBACX,qDAAqD;gBACrDA,MAAMC,eAAe;gBACrBD,MAAME,cAAc;gBAEpBP,wBAAwBX;YAC1B;QACF;IACF;IAEA,qBACE;;0BACE,KAACJ;gBACCU,WAAWd,IAAI,CAACU,SAASI;gBACxB,GAAI,CAACO,cAAcC,aAAaK,SAAS;gBAC1CC,SAASjB;gBACTkB,eAAe,CAACR;gBAChBH,mBAAmBA;0BAElBI,cAAcD,4BAAcpB,aAAamB,MAAME,cAAcF;;YAE/DV;;;AAGP"}

package/dist/src/tree/TreeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/TreeProvider.tsx"],"sourcesContent":["\"use client\";\nimport {\n  createContext,\n  useContext,\n  useMemo,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { type CustomLinkComponent } from \"../link/Link.js\";\nimport { type NonNullRef } from \"../types.js\";\nimport {\n  type DefaultTreeItemNode,\n  type TreeData,\n  type TreeItemNode,\n} from \"./types.js\";\nimport { type TreeExpansion } from \"./useTreeExpansion.js\";\nimport { type TreeSelection } from \"./useTreeSelection.js\";\n\n/**\n * When this is set to `\"auto\"`, clicking on a tree item with a mouse or with\n * the Enter/Space keys will select and expand/collapse the tree item. The user\n * can still use the ArrowLeft and ArrowRight keys to expand/collapse nested\n * tree items.\n *\n * When this is set to `\"manual\"`, clicking on a tree item with a mouse or with\n * the Enter/Space keys will only select that tree item. The user must use the\n * ArrowLeft and ArrowRight keys to expand/collapse nested tree items.\n *\n * The main use-case for the `\"manual\"` setting is creating a navigation tree\n * that requires the user to click on an icon or a button to expand the child\n * items.\n *\n * @remarks \\@since 6.0.0\n */\nexport type TreeExpansionMode = \"auto\" | \"manual\";\n\n/**\n * @internal\n * @remarks \\@since 6.0.0\n */\nexport interface TreeItemMetadataLookup {\n  /**\n   * This is used for the keyboard movement behavior for trees that allow the\n   * `ArrowRight` key for tree items that have children.\n   */\n  expandable: Record<string, boolean>;\n\n  /**\n   * This is a quick lookup if a tree item is disabled since it's possible the\n   * custom `renderer` sets the `disabled` state and not the `TreeData`.\n   */\n  disabledItems: Record<string, boolean>;\n\n  /**\n   * A lookup of element `id` (DOM id) for each tree item to the `itemId`. This\n   * is a quick way to figure out which item is being interacted with from a\n   * keyboard event without needed to add `data-*` attributes.\n   */\n  elementToItem: Record<string, string>;\n\n  /**\n   * A lookup of tree item `itemId` to the element `id` (DOM id). This is used\n   * to be able to find a parent tree item when the `ArrowLeft` key is pressed\n   * to focus that parent item.\n   */\n  itemToElement: Record<string, string>;\n}\n\n/**\n * The tree context is mostly a convenience API for implementing a custom tree\n * item that requires the {@link TreeExpansion}, {@link TreeSelection} and\n * {@link TreeData} to work.\n *\n * The other properties on the context are most likely for internal use only.\n *\n * @remarks \\@since 6.0.0\n */\nexport interface TreeContext<T extends TreeItemNode = DefaultTreeItemNode>\n  extends TreeExpansion,\n    TreeSelection {\n  data: TreeData<T>;\n  rootId: string | null;\n  disableTransition: boolean;\n  temporaryChildItems: boolean;\n\n  linkComponent: CustomLinkComponent;\n\n  /** @internal */\n  expanderLeft: boolean;\n  /** @internal */\n  expanderIcon: ReactNode;\n  /** @internal */\n  expansionMode: TreeExpansionMode;\n  /** @internal */\n  metadataLookup: NonNullRef<TreeItemMetadataLookup>;\n}\n\n// Allow the hook to correct typecast this instead\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst context = createContext<TreeContext<any> | undefined>(undefined);\ncontext.displayName = \"Tree\";\nconst { Provider } = context;\n\n/**\n * This can be used for a custom tree item renderer.\n *\n * @see The `Tree` component for an example.\n * @remarks \\@since 6.0.0\n */\nexport function useTreeContext<\n  T extends TreeItemNode = DefaultTreeItemNode,\n>(): TreeContext<T> {\n  const value = useContext(context);\n  if (!value) {\n    throw new Error(\"Cannot find a parent Tree component\");\n  }\n\n  return value;\n}\n\n/**\n * @internal\n * @remarks \\@since 6.0.0\n */\nexport interface TreeProviderProps<T extends TreeItemNode = DefaultTreeItemNode>\n  extends TreeContext<T> {\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @internal\n * @remarks \\@since 6.0.0\n */\nexport function TreeProvider<T extends TreeItemNode = DefaultTreeItemNode>(\n  props: TreeProviderProps<T>\n): ReactElement {\n  const {\n    children,\n    data,\n    rootId,\n    multiSelect,\n    expanderIcon,\n    expanderLeft,\n    expansionMode,\n    metadataLookup,\n    disableTransition,\n    temporaryChildItems,\n    linkComponent,\n    expandedIds,\n    selectedIds,\n    expandMultipleTreeItems,\n    toggleTreeItemExpansion,\n    selectMultipleTreeItems,\n    toggleTreeItemSelection,\n  } = props;\n  const value = useMemo<TreeContext<T>>(\n    () => ({\n      data,\n      rootId,\n      multiSelect,\n      expanderIcon,\n      expanderLeft,\n      expansionMode,\n      metadataLookup,\n      disableTransition,\n      temporaryChildItems,\n      linkComponent,\n      expandedIds,\n      selectedIds,\n      expandMultipleTreeItems,\n      toggleTreeItemExpansion,\n      selectMultipleTreeItems,\n      toggleTreeItemSelection,\n    }),\n    [\n      data,\n      disableTransition,\n      expandMultipleTreeItems,\n      expandedIds,\n      expanderIcon,\n      expanderLeft,\n      expansionMode,\n      linkComponent,\n      metadataLookup,\n      multiSelect,\n      rootId,\n      selectMultipleTreeItems,\n      selectedIds,\n      temporaryChildItems,\n      toggleTreeItemExpansion,\n      toggleTreeItemSelection,\n    ]\n  );\n\n  return <Provider value={value}>{children}</Provider>;\n}\n"],"names":["createContext","useContext","useMemo","context","undefined","displayName","Provider","useTreeContext","value","Error","TreeProvider","props","children","data","rootId","multiSelect","expanderIcon","expanderLeft","expansionMode","metadataLookup","disableTransition","temporaryChildItems","linkComponent","expandedIds","selectedIds","expandMultipleTreeItems","toggleTreeItemExpansion","selectMultipleTreeItems","toggleTreeItemSelection"],"mappings":"AAAA;;AACA,SACEA,aAAa,EACbC,UAAU,EACVC,OAAO,QAGF,QAAQ;AA0Ff,kDAAkD;AAClD,8DAA8D;AAC9D,MAAMC,wBAAUH,cAA4CI;AAC5DD,QAAQE,WAAW,GAAG;AACtB,MAAM,EAAEC,QAAQ,EAAE,GAAGH;AAErB;;;;;CAKC,GACD,OAAO,SAASI;IAGd,MAAMC,QAAQP,WAAWE;IACzB,IAAI,CAACK,OAAO;QACV,MAAM,IAAIC,MAAM;IAClB;IAEA,OAAOD;AACT;AAWA;;;;;CAKC,GACD,OAAO,SAASE,aACdC,KAA2B;IAE3B,MAAM,EACJC,QAAQ,EACRC,IAAI,EACJC,MAAM,EACNC,WAAW,EACXC,YAAY,EACZC,YAAY,EACZC,aAAa,EACbC,cAAc,EACdC,iBAAiB,EACjBC,mBAAmB,EACnBC,aAAa,EACbC,WAAW,EACXC,WAAW,EACXC,uBAAuB,EACvBC,uBAAuB,EACvBC,uBAAuB,EACvBC,uBAAuB,EACxB,GAAGjB;IACJ,MAAMH,QAAQN,QACZ,IAAO,CAAA;YACLW;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF,CAAA,GACA;QACEf;QACAO;QACAK;QACAF;QACAP;QACAC;QACAC;QACAI;QACAH;QACAJ;QACAD;QACAa;QACAH;QACAH;QACAK;QACAE;KACD;IAGH,qBAAO,KAACtB;QAASE,OAAOA;kBAAQI;;AAClC"}

package/dist/src/tree/styles.js

@@ -0,0 +1,58 @@
+import { cnb } from "cnbuilder";
+import { listItem } from "../list/listItemStyles.js";
+import { bem } from "../utils/bem.js";
+const treeStyles = bem("rmd-tree");
+const treeItemStyles = bem("rmd-tree-item");
+const treeGroupStyles = bem("rmd-tree-group");
+/**
+ * Apply the `className`s for a tree component. This will be type-safe if using
+ * typescript.
+ *
+ * @remarks \@since 6.0.0
+ */ export function tree(options = {}) {
+    const { className } = options;
+    return cnb(treeStyles(), className);
+}
+/**
+ * Apply the `className`s for a tree item component. This will be type-safe if
+ * using typescript.
+ *
+ * @remarks \@since 6.0.0
+ */ export function treeItem(options = {}) {
+    const { className, expander = false, expanderLeft = false } = options;
+    return cnb(treeItemStyles({
+        "expander-left": expander && expanderLeft,
+        "expander-right": expander && !expanderLeft
+    }), className);
+}
+/**
+ * @remarks \@since 6.0.0
+ */ export function treeItemContent(options = {}) {
+    const { className, link = false, focused, selected, disabled = false, ...remaining } = options;
+    return cnb(treeItemStyles("content", {
+        link,
+        focused,
+        selected,
+        disabled
+    }), listItem({
+        className,
+        disabled,
+        ...remaining
+    }));
+}
+/**
+ * @remarks \@since 6.0.0
+ */ export function treeItemMedia(options) {
+    const { isLeafNode, isMediaLeftAddon, className } = options;
+    return cnb(isMediaLeftAddon && treeItemStyles("media", {
+        single: isLeafNode
+    }), className);
+}
+/**
+ * @remarks \@since 6.0.0
+ */ export function treeGroup(options = {}) {
+    const { className } = options;
+    return cnb(treeGroupStyles(), className);
+}
+
+//# sourceMappingURL=styles.js.map

package/dist/src/tree/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport type { InternalListItemClassNameOptions } from \"../list/listItemStyles.js\";\nimport { listItem } from \"../list/listItemStyles.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst treeStyles = bem(\"rmd-tree\");\nconst treeItemStyles = bem(\"rmd-tree-item\");\nconst treeGroupStyles = bem(\"rmd-tree-group\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TreeClassNameOptions {\n  className?: string;\n}\n\n/**\n * Apply the `className`s for a tree component. This will be type-safe if using\n * typescript.\n *\n * @remarks \\@since 6.0.0\n */\nexport function tree(options: TreeClassNameOptions = {}): string {\n  const { className } = options;\n\n  return cnb(treeStyles(), className);\n}\n\n/** @remarks \\@since 6.0.0 */\nexport interface TreeItemClassNameOptions {\n  className?: string;\n  expander?: boolean;\n\n  /**\n   * Settings this to `true` will update the styles for the expander icon within\n   * the tree item to rotate `down -> right` instead of `down -> left`.\n   *\n   * @defaultValue `false`\n   */\n  expanderLeft?: boolean;\n}\n\n/**\n * Apply the `className`s for a tree item component. This will be type-safe if\n * using typescript.\n *\n * @remarks \\@since 6.0.0\n */\nexport function treeItem(options: TreeItemClassNameOptions = {}): string {\n  const { className, expander = false, expanderLeft = false } = options;\n\n  return cnb(\n    treeItemStyles({\n      \"expander-left\": expander && expanderLeft,\n      \"expander-right\": expander && !expanderLeft,\n    }),\n    className\n  );\n}\n\n/** @remarks \\@since 6.0.0 */\nexport interface TreeItemContentClassNameOptions\n  extends InternalListItemClassNameOptions {\n  /**\n   * Set this\n   *\n   * @defaultValue `false`\n   */\n  link?: boolean;\n\n  /**\n   * Set this to `true` when the tree item is the current keyboard focus with\n   * `aria-activedescendant`. This will apply the focus styles only while the\n   * parent tree component is focused and the user is in keyboard mode.\n   *\n   *\n   * @defaultValue `false`\n   */\n  focused?: boolean;\n\n  /**\n   * Set this to `true` hen the tree item has been selected by the user. The\n   * default styles just\n   *\n   * @defaultValue `false`\n   */\n  selected?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function treeItemContent(\n  options: TreeItemContentClassNameOptions = {}\n): string {\n  const {\n    className,\n    link = false,\n    focused,\n    selected,\n    disabled = false,\n    ...remaining\n  } = options;\n\n  return cnb(\n    treeItemStyles(\"content\", {\n      link,\n      focused,\n      selected,\n      disabled,\n    }),\n    listItem({\n      className,\n      disabled,\n      ...remaining,\n    })\n  );\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TreeItemMediaClassNameOptions {\n  className?: string;\n  isLeafNode: boolean;\n  isMediaLeftAddon: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function treeItemMedia(options: TreeItemMediaClassNameOptions): string {\n  const { isLeafNode, isMediaLeftAddon, className } = options;\n\n  return cnb(\n    isMediaLeftAddon && treeItemStyles(\"media\", { single: isLeafNode }),\n    className\n  );\n}\n\n/** @remarks \\@since 6.0.0 */\nexport interface TreeGroupClassNameOptions {\n  className?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function treeGroup(options: TreeGroupClassNameOptions = {}): string {\n  const { className } = options;\n\n  return cnb(treeGroupStyles(), className);\n}\n"],"names":["cnb","listItem","bem","treeStyles","treeItemStyles","treeGroupStyles","tree","options","className","treeItem","expander","expanderLeft","treeItemContent","link","focused","selected","disabled","remaining","treeItemMedia","isLeafNode","isMediaLeftAddon","single","treeGroup"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAEhC,SAASC,QAAQ,QAAQ,4BAA4B;AACrD,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,aAAaD,IAAI;AACvB,MAAME,iBAAiBF,IAAI;AAC3B,MAAMG,kBAAkBH,IAAI;AAO5B;;;;;CAKC,GACD,OAAO,SAASI,KAAKC,UAAgC,CAAC,CAAC;IACrD,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOP,IAAIG,cAAcK;AAC3B;AAgBA;;;;;CAKC,GACD,OAAO,SAASC,SAASF,UAAoC,CAAC,CAAC;IAC7D,MAAM,EAAEC,SAAS,EAAEE,WAAW,KAAK,EAAEC,eAAe,KAAK,EAAE,GAAGJ;IAE9D,OAAOP,IACLI,eAAe;QACb,iBAAiBM,YAAYC;QAC7B,kBAAkBD,YAAY,CAACC;IACjC,IACAH;AAEJ;AA+BA;;CAEC,GACD,OAAO,SAASI,gBACdL,UAA2C,CAAC,CAAC;IAE7C,MAAM,EACJC,SAAS,EACTK,OAAO,KAAK,EACZC,OAAO,EACPC,QAAQ,EACRC,WAAW,KAAK,EAChB,GAAGC,WACJ,GAAGV;IAEJ,OAAOP,IACLI,eAAe,WAAW;QACxBS;QACAC;QACAC;QACAC;IACF,IACAf,SAAS;QACPO;QACAQ;QACA,GAAGC,SAAS;IACd;AAEJ;AAWA;;CAEC,GACD,OAAO,SAASC,cAAcX,OAAsC;IAClE,MAAM,EAAEY,UAAU,EAAEC,gBAAgB,EAAEZ,SAAS,EAAE,GAAGD;IAEpD,OAAOP,IACLoB,oBAAoBhB,eAAe,SAAS;QAAEiB,QAAQF;IAAW,IACjEX;AAEJ;AAOA;;CAEC,GACD,OAAO,SAASc,UAAUf,UAAqC,CAAC,CAAC;IAC/D,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOP,IAAIK,mBAAmBG;AAChC"}

package/dist/src/tree/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/types.ts"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport type { ListItemChildrenProps } from \"../list/types.js\";\nimport type { UseStateInitializer } from \"../types.js\";\n\n/**\n * @remarks \\@since 6.0.0 This was renamed from `TreeItemIds`\n */\nexport interface TreeItemNode {\n  itemId: string;\n  parentId: string | null;\n}\n\n/**\n * The default tree item node allows for any props for rendering children within\n * list items and rendering links.\n *\n * @remarks \\@since 6.0.0\n */\nexport interface DefaultTreeItemNode\n  extends TreeItemNode,\n    ListItemChildrenProps {\n  /**\n   * If this is defined, the `TreeItem` will render the content within a `Link`\n   * instead of a `<span>`.\n   */\n  to?: string;\n\n  /**\n   * If this is defined, the `TreeItem` will render the content within a `Link`\n   * instead of a `<span>`.\n   */\n  href?: string;\n\n  /**\n   * This should only be provided if {@link to} or {@link href} exist on the\n   * node.\n   */\n  rel?: string;\n\n  /**\n   * This should only be provided if {@link to} or {@link href} exist on the\n   * node.\n   */\n  target?: string;\n\n  /**\n   * An alias for the {@link children} within a tree item. This will be used\n   * over the {@link children} if both exist.\n   */\n  name?: ReactNode;\n\n  /**\n   * The children to display in the tree item.\n   *\n   * @see {@link name}\n   */\n  children?: ReactNode;\n\n  /** @see {@link ListItemProps.disabled} */\n  disabled?: boolean;\n\n  /** @see {@link ListItemProps.disabledOpacity} */\n  disabledOpacity?: boolean;\n\n  className?: string;\n  contentClassName?: string;\n}\n\n/**\n * @example\n * Default Structure\n * ```tsx\n * import type { TreeData } from \"@react-md/core\";\n * import FolderIcon from \"@react-md/material-icons/FolderIcon\";\n *\n * export const MY_DATA: TreeData = {\n *   \"item-1\": {\n *     itemId: \"item-1\",\n *     parentId: null,\n *     name: \"Root Level Item 1\",\n *   },\n *   \"item-2\": {\n *     itemId: \"item-2\",\n *     parentId: \"item-1\",\n *     name: \"A child for the first item\",\n *     leftAddon: <FolderIcon />,\n *   },\n *   \"item-3\": {\n *     itemId: \"item-3\",\n *     parentId: \"item-1\",\n *     children: \"Another child for the first item\",\n *     leftAddon: <FolderIcon />,\n *     rightAddon: <span>Something custom</span>,\n *   },\n * };\n * ```\n *\n * @remarks \\@since 6.0.0 Updated the default types\n * @see {@link DefaultTreeItemNode}\n */\nexport type TreeData<T extends TreeItemNode = DefaultTreeItemNode> = Record<\n  string,\n  T\n>;\n\n/**\n * @remarks \\@since 6.0.0 This used to be `TreeItemIds` but was converted to a\n * Set to increase performance for large trees.\n */\nexport type TreeItemIdSet = ReadonlySet<string>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type TreeItemDefaultIds = UseStateInitializer<readonly string[]>;\n\n/**\n * A function to call that will sort the items within the tree for each unique\n * `parentId`. If you have a tree like:\n *\n * ```\n * a\n * ├── a1\n * b\n * ├── b1\n * ├── b2\n * │   └── b2.1\n * c\n * ├── c1\n * ├── c2\n * └── c3\n * ```\n *\n * This function will be called with:\n *\n * - `[a1]`\n * - `[b2.1]`\n * - `[b1, b2]`\n * - `[c1, c2, c3]`\n * - `[a, b, c]`\n *\n * Note: This **should be memoized** to prevent rerendering the entire tree each\n * render.\n */\nexport type TreeItemSorter<T extends TreeItemNode = DefaultTreeItemNode> = (\n  items: readonly T[]\n) => readonly T[];\n"],"names":[],"mappings":"AAoHA;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BC,GACD,WAEkB"}

package/dist/src/tree/useTree.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/useTree.ts"],"sourcesContent":["\"use client\";\nimport type { TreeItemDefaultIds } from \"./types.js\";\nimport type { TreeExpansion } from \"./useTreeExpansion.js\";\nimport { useTreeExpansion } from \"./useTreeExpansion.js\";\nimport type { TreeSelection } from \"./useTreeSelection.js\";\nimport { useTreeSelection } from \"./useTreeSelection.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TreeHookOptions {\n  /**\n   * @defaultValue `false`\n   */\n  multiSelect?: boolean;\n\n  /**\n   * @defaultValue `[]`\n   */\n  defaultExpandedIds?: TreeItemDefaultIds;\n\n  /**\n   * @defaultValue `[]`\n   */\n  defaultSelectedIds?: TreeItemDefaultIds;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TreeImplementation extends TreeSelection, TreeExpansion {}\n\n/**\n * This is a convenience wrapper for the {@link useTreeExpansion} and\n * {@link useTreeSelection} hooks since they will almost always be used together.\n *\n * @example\n * Simple Example\n * ```tsx\n * import type { TreeData } from \"@react-md/core\";\n * import { Tree, useTree } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * const data: TreeData = {\n *   // pretend data\n * };\n *\n * function Example(): ReactElement {\n *   const tree = useTree();\n *\n *   return <Tree {...tree} data={data} aria-label=\"Tree\" />;\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTree(options: TreeHookOptions = {}): TreeImplementation {\n  const {\n    multiSelect = false,\n    defaultExpandedIds,\n    defaultSelectedIds,\n  } = options;\n\n  return {\n    ...useTreeExpansion(defaultExpandedIds),\n    ...useTreeSelection(defaultSelectedIds, multiSelect),\n  };\n}\n"],"names":["useTreeExpansion","useTreeSelection","useTree","options","multiSelect","defaultExpandedIds","defaultSelectedIds"],"mappings":"AAAA;AAGA,SAASA,gBAAgB,QAAQ,wBAAwB;AAEzD,SAASC,gBAAgB,QAAQ,wBAAwB;AA2BzD;;;;;;;;;;;;;;;;;;;;;;;CAuBC,GACD,OAAO,SAASC,QAAQC,UAA2B,CAAC,CAAC;IACnD,MAAM,EACJC,cAAc,KAAK,EACnBC,kBAAkB,EAClBC,kBAAkB,EACnB,GAAGH;IAEJ,OAAO;QACL,GAAGH,iBAAiBK,mBAAmB;QACvC,GAAGJ,iBAAiBK,oBAAoBF,YAAY;IACtD;AACF"}

package/dist/src/tree/useTreeExpansion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/useTreeExpansion.ts"],"sourcesContent":["\"use client\";\nimport { useCallback, useState } from \"react\";\nimport type { UseStateSetter } from \"../types.js\";\nimport type { TreeItemDefaultIds, TreeItemIdSet } from \"./types.js\";\n\n/**\n * @remarks \\@since 6.0.0 Renamed from `TreeItemExpansion` and uses a Set\n * instead of a list to increase performance. Also renamed `onItemExpansion` to\n * `toggleTreeItemExpansion` and `onMultiItemExpansion` to\n * `expandMultipleTreeItems`.\n */\nexport interface TreeExpansion {\n  expandedIds: TreeItemIdSet;\n  toggleTreeItemExpansion(itemId: string): void;\n  expandMultipleTreeItems: UseStateSetter<TreeItemIdSet>;\n}\n\n/**\n * @remarks \\@since 6.0.0 Renamed from `useTreeItemExpansion` and uses a Set\n * instead of a list to increase performance.\n */\nexport function useTreeExpansion(\n  defaultExpandedIds?: TreeItemDefaultIds\n): TreeExpansion {\n  const [expandedIds, setExpandedIds] = useState<TreeItemIdSet>(() => {\n    const defaultIds =\n      typeof defaultExpandedIds === \"function\"\n        ? defaultExpandedIds()\n        : defaultExpandedIds;\n\n    return new Set(defaultIds);\n  });\n\n  const toggleTreeItemExpansion = useCallback((itemId: string) => {\n    setExpandedIds((prevExpandedIds) => {\n      const expandedIds = new Set(prevExpandedIds);\n      if (expandedIds.has(itemId)) {\n        expandedIds.delete(itemId);\n      } else {\n        expandedIds.add(itemId);\n      }\n\n      return expandedIds;\n    });\n  }, []);\n\n  return {\n    expandedIds,\n    toggleTreeItemExpansion,\n    expandMultipleTreeItems: setExpandedIds,\n  };\n}\n"],"names":["useCallback","useState","useTreeExpansion","defaultExpandedIds","expandedIds","setExpandedIds","defaultIds","Set","toggleTreeItemExpansion","itemId","prevExpandedIds","has","delete","add","expandMultipleTreeItems"],"mappings":"AAAA;AACA,SAASA,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAgB9C;;;CAGC,GACD,OAAO,SAASC,iBACdC,kBAAuC;IAEvC,MAAM,CAACC,aAAaC,eAAe,GAAGJ,SAAwB;QAC5D,MAAMK,aACJ,OAAOH,uBAAuB,aAC1BA,uBACAA;QAEN,OAAO,IAAII,IAAID;IACjB;IAEA,MAAME,0BAA0BR,YAAY,CAACS;QAC3CJ,eAAe,CAACK;YACd,MAAMN,cAAc,IAAIG,IAAIG;YAC5B,IAAIN,YAAYO,GAAG,CAACF,SAAS;gBAC3BL,YAAYQ,MAAM,CAACH;YACrB,OAAO;gBACLL,YAAYS,GAAG,CAACJ;YAClB;YAEA,OAAOL;QACT;IACF,GAAG,EAAE;IAEL,OAAO;QACLA;QACAI;QACAM,yBAAyBT;IAC3B;AACF"}

package/dist/src/tree/useTreeItems.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/useTreeItems.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport type {\n  TreeItemSorter,\n  TreeItemNode,\n  TreeData,\n  DefaultTreeItemNode,\n} from \"./types.js\";\n\n/**\n * A lookup to find all the child ids for a specific parent. This was added to\n * support the `*` keyboard behavior of opening all tree items at the current\n * level.\n *\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport type TreeItemChildIds = Map<string | null, Set<string>>;\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport type RenderableTreeItemNode<\n  T extends TreeItemNode = DefaultTreeItemNode,\n> = T & {\n  items?: readonly RenderableTreeItemNode<T>[];\n};\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport interface BuildTreeOptions<T extends TreeItemNode> {\n  sort: TreeItemSorter<T>;\n  nodes: T[];\n  parentId: string | null;\n  treeItemChildIds: TreeItemChildIds;\n}\n\n/**\n * This util performantly builds a nested list of tree items from a giant flat\n * list of items by linking items together with the provided `parentId`. This\n * will also recursively build the tree and _hopefully_ all items will be added.\n *\n * @remarks \\@since 6.0.0 Updated to include the {@link TreeItemChildIds}\n */\nexport function buildTree<T extends TreeItemNode>(\n  options: BuildTreeOptions<T>\n): readonly RenderableTreeItemNode<T>[] | undefined {\n  const { sort, nodes, parentId, treeItemChildIds } = options;\n  const childIds = treeItemChildIds.get(parentId) || new Set();\n  const childItems: RenderableTreeItemNode<T>[] = [];\n\n  // doing a \"reverse\" order filter/move so that the items array shrinks while\n  // looping. This makes it so that the entire items array doesn't need to\n  // continually be looped through as more items are added to the tree, only the\n  // remaining items will have to be looped\n  let i = nodes.length;\n  while (i > 0) {\n    i -= 1;\n    if (nodes[i] && nodes[i].parentId === parentId) {\n      const [item] = nodes.splice(i, 1);\n      childIds.add(item.itemId);\n      // shallow cloning so childItems doesn't get applied to the original data\n      // set\n      childItems.unshift({ ...item });\n    }\n  }\n\n  if (!childItems.length) {\n    return undefined;\n  }\n\n  treeItemChildIds.set(parentId, childIds);\n  childItems.forEach((childItem) => {\n    childItem.items = buildTree({\n      sort,\n      nodes,\n      parentId: childItem.itemId,\n      treeItemChildIds,\n    });\n  });\n\n  return sort(childItems);\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TreeItemOptions<T extends TreeItemNode> {\n  data: TreeData<T>;\n  sort: TreeItemSorter<T>;\n  rootId: string | null;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TreeItems<T extends TreeItemNode> {\n  items: readonly RenderableTreeItemNode<T>[];\n  treeItemChildIds: TreeItemChildIds;\n}\n\n/**\n * This is mostly an internal hook, but can be used to build tree-like\n * data structures without the need of the `Tree` component.\n *\n * @remarks \\@since 6.0.0 converted to use an object argument instead of\n * multiple arguments. Also logs any orphaned items that do not have a parent\n */\nexport function useTreeItems<T extends TreeItemNode>(\n  options: TreeItemOptions<T>\n): TreeItems<T> {\n  const { data, sort, rootId } = options;\n\n  return useMemo<TreeItems<T>>(() => {\n    const values = Object.values(data);\n    const treeItemChildIds = new Map<string, Set<string>>();\n    const items = buildTree<T>({\n      sort,\n      nodes: values,\n      parentId: rootId,\n      treeItemChildIds,\n    });\n\n    if (process.env.NODE_ENV !== \"production\" && values.length) {\n      /* eslint-disable no-console */\n      console.warn(\"The following tree items are orphaned without a parent:\");\n      console.warn(values.slice());\n    }\n\n    return {\n      items: items || [],\n      treeItemChildIds,\n    };\n  }, [data, rootId, sort]);\n}\n"],"names":["useMemo","buildTree","options","sort","nodes","parentId","treeItemChildIds","childIds","get","Set","childItems","i","length","item","splice","add","itemId","unshift","undefined","set","forEach","childItem","items","useTreeItems","data","rootId","values","Object","Map","process","env","NODE_ENV","console","warn","slice"],"mappings":"AAAA,SAASA,OAAO,QAAQ,QAAQ;AAuChC;;;;;;CAMC,GACD,OAAO,SAASC,UACdC,OAA4B;IAE5B,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,gBAAgB,EAAE,GAAGJ;IACpD,MAAMK,WAAWD,iBAAiBE,GAAG,CAACH,aAAa,IAAII;IACvD,MAAMC,aAA0C,EAAE;IAElD,4EAA4E;IAC5E,wEAAwE;IACxE,8EAA8E;IAC9E,yCAAyC;IACzC,IAAIC,IAAIP,MAAMQ,MAAM;IACpB,MAAOD,IAAI,EAAG;QACZA,KAAK;QACL,IAAIP,KAAK,CAACO,EAAE,IAAIP,KAAK,CAACO,EAAE,CAACN,QAAQ,KAAKA,UAAU;YAC9C,MAAM,CAACQ,KAAK,GAAGT,MAAMU,MAAM,CAACH,GAAG;YAC/BJ,SAASQ,GAAG,CAACF,KAAKG,MAAM;YACxB,yEAAyE;YACzE,MAAM;YACNN,WAAWO,OAAO,CAAC;gBAAE,GAAGJ,IAAI;YAAC;QAC/B;IACF;IAEA,IAAI,CAACH,WAAWE,MAAM,EAAE;QACtB,OAAOM;IACT;IAEAZ,iBAAiBa,GAAG,CAACd,UAAUE;IAC/BG,WAAWU,OAAO,CAAC,CAACC;QAClBA,UAAUC,KAAK,GAAGrB,UAAU;YAC1BE;YACAC;YACAC,UAAUgB,UAAUL,MAAM;YAC1BV;QACF;IACF;IAEA,OAAOH,KAAKO;AACd;AAmBA;;;;;;CAMC,GACD,OAAO,SAASa,aACdrB,OAA2B;IAE3B,MAAM,EAAEsB,IAAI,EAAErB,IAAI,EAAEsB,MAAM,EAAE,GAAGvB;IAE/B,OAAOF,QAAsB;QAC3B,MAAM0B,SAASC,OAAOD,MAAM,CAACF;QAC7B,MAAMlB,mBAAmB,IAAIsB;QAC7B,MAAMN,QAAQrB,UAAa;YACzBE;YACAC,OAAOsB;YACPrB,UAAUoB;YACVnB;QACF;QAEA,IAAIuB,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBAAgBL,OAAOd,MAAM,EAAE;YAC1D,6BAA6B,GAC7BoB,QAAQC,IAAI,CAAC;YACbD,QAAQC,IAAI,CAACP,OAAOQ,KAAK;QAC3B;QAEA,OAAO;YACLZ,OAAOA,SAAS,EAAE;YAClBhB;QACF;IACF,GAAG;QAACkB;QAAMC;QAAQtB;KAAK;AACzB"}

package/dist/src/tree/useTreeMovement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/useTreeMovement.ts"],"sourcesContent":["\"use client\";\nimport type {\n  FocusEventHandler,\n  KeyboardEventHandler,\n  MouseEventHandler,\n} from \"react\";\nimport { useRef } from \"react\";\nimport type { KeyboardMovementProviderImplementation } from \"../movement/types.js\";\nimport { useKeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport { getNextFocusableIndex } from \"../movement/utils.js\";\nimport type { NonNullMutableRef } from \"../types.js\";\nimport type { TreeItemMetadataLookup } from \"./TreeProvider.js\";\nimport type { TreeData, TreeItemNode } from \"./types.js\";\nimport type { TreeExpansion } from \"./useTreeExpansion.js\";\nimport type { TreeItemChildIds } from \"./useTreeItems.js\";\n\n/**\n * This helps catch the edge case where the collapse transition has occurred for\n * a tree item group, but the user uses the `ArrowDown` key before it has\n * finished. So to do this:\n *\n * - find the parent group of the tree item\n * - find the tree item that controls the group (the element before the group)\n * - check if the `aria-expanded` state is `\"false\"` meaning it is considered\n *   closed\n *\n * @internal\n * @remarks \\@since 6.0.0\n */\nconst isParentItemCollapsing = (item: HTMLElement): boolean =>\n  item\n    .closest(\"[role='group']\")\n    ?.previousElementSibling?.getAttribute(\"aria-expanded\") === \"false\";\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nconst getVisibleTreeItems = (\n  container: HTMLElement\n): readonly HTMLElement[] => {\n  const items = [\n    ...container.querySelectorAll<HTMLElement>('[role=\"treeitem\"]'),\n  ];\n\n  return items.filter(\n    (item) =>\n      // do not include items that have a `hidden` parent group\n      item.offsetParent &&\n      // do not include items that are about to become hidden\n      !isParentItemCollapsing(item)\n  );\n};\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\ninterface TreeMovementOptions<T extends TreeItemNode> extends TreeExpansion {\n  data: TreeData<T>;\n  onClick: MouseEventHandler<HTMLUListElement> | undefined;\n  onFocus: FocusEventHandler<HTMLUListElement> | undefined;\n  onKeyDown: KeyboardEventHandler<HTMLUListElement> | undefined;\n  selectedIds: ReadonlySet<string>;\n  treeItemChildIds: TreeItemChildIds;\n}\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\ninterface TreeMovement\n  extends KeyboardMovementProviderImplementation<HTMLUListElement> {\n  /**\n   * This will be mutated by the `TreeItem` component and used to handle\n   * keyboard movement.\n   */\n  metadataLookup: NonNullMutableRef<TreeItemMetadataLookup>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport function useTreeMovement<T extends TreeItemNode>(\n  options: TreeMovementOptions<T>\n): TreeMovement {\n  const {\n    onClick,\n    onFocus,\n    onKeyDown,\n    data,\n    expandedIds,\n    selectedIds,\n    treeItemChildIds,\n    toggleTreeItemExpansion,\n    expandMultipleTreeItems,\n  } = options;\n\n  const metadataLookup = useRef<TreeItemMetadataLookup>({\n    expandable: {},\n    disabledItems: {},\n    elementToItem: {},\n    itemToElement: {},\n  });\n  const movement = useKeyboardMovementProvider({\n    onClick,\n    onFocus,\n    onKeyDown,\n    extendKeyDown(movementData) {\n      const { event, activeDescendantId, currentFocusIndex, setFocusIndex } =\n        movementData;\n      const { expandable, disabledItems, elementToItem, itemToElement } =\n        metadataLookup.current;\n      const itemId = elementToItem[activeDescendantId];\n      const item = data[itemId];\n\n      /* c8 ignore start */\n      if (!item) {\n        return;\n      }\n      /* c8 ignore end */\n\n      const disabled = disabledItems[itemId];\n      const expanded = expandedIds.has(itemId);\n\n      let flagged = false;\n      switch (event.key) {\n        case \"ArrowLeft\":\n          if (expanded && !disabled) {\n            flagged = true;\n            toggleTreeItemExpansion(itemId);\n          } else if (item.parentId) {\n            // do not flag for this case since setFocusIndex already does this\n            const parentId = itemToElement[item.parentId];\n            const focusables = getVisibleTreeItems(event.currentTarget);\n            const index = focusables.findIndex(\n              (element) => element.id === parentId\n            );\n            setFocusIndex(index, focusables);\n          }\n\n          break;\n        case \"ArrowRight\":\n          if (expandable[itemId] && !disabled) {\n            if (!expanded) {\n              flagged = true;\n              toggleTreeItemExpansion(itemId);\n            } else {\n              // do not flag for this case since setFocusIndex already does this\n              const focusables = getVisibleTreeItems(event.currentTarget);\n              const index = getNextFocusableIndex({\n                loopable: false,\n                increment: true,\n                focusables,\n                includeDisabled: true,\n                currentFocusIndex: currentFocusIndex.current,\n              });\n\n              setFocusIndex(index, focusables);\n            }\n          }\n\n          break;\n        case \"*\": {\n          flagged = true;\n          const itemIds = treeItemChildIds.get(item.parentId);\n          if (itemIds) {\n            const expandableIds = [...itemIds].filter(\n              (itemId) => expandable[itemId]\n            );\n            if (expandableIds.length) {\n              expandMultipleTreeItems(\n                (prev) => new Set([...prev, ...expandableIds])\n              );\n              currentFocusIndex.current = -1;\n            }\n          }\n          break;\n        }\n      }\n\n      if (flagged) {\n        event.stopPropagation();\n        event.preventDefault();\n      }\n    },\n    searchable: true,\n    tabIndexBehavior: \"virtual\",\n    getFocusableElements: getVisibleTreeItems,\n    getDefaultFocusedIndex(options) {\n      const { focusables } = options;\n      const { elementToItem } = metadataLookup.current;\n\n      return focusables.findIndex((element) =>\n        selectedIds.has(elementToItem[element.id])\n      );\n    },\n  });\n\n  return {\n    metadataLookup,\n    ...movement,\n  };\n}\n"],"names":["useRef","useKeyboardMovementProvider","getNextFocusableIndex","isParentItemCollapsing","item","closest","previousElementSibling","getAttribute","getVisibleTreeItems","container","items","querySelectorAll","filter","offsetParent","useTreeMovement","options","onClick","onFocus","onKeyDown","data","expandedIds","selectedIds","treeItemChildIds","toggleTreeItemExpansion","expandMultipleTreeItems","metadataLookup","expandable","disabledItems","elementToItem","itemToElement","movement","extendKeyDown","movementData","event","activeDescendantId","currentFocusIndex","setFocusIndex","current","itemId","disabled","expanded","has","flagged","key","parentId","focusables","currentTarget","index","findIndex","element","id","loopable","increment","includeDisabled","itemIds","get","expandableIds","length","prev","Set","stopPropagation","preventDefault","searchable","tabIndexBehavior","getFocusableElements","getDefaultFocusedIndex"],"mappings":"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"}

package/dist/src/tree/useTreeSelection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/useTreeSelection.ts"],"sourcesContent":["\"use client\";\nimport { useCallback, useState } from \"react\";\nimport type { UseStateSetter } from \"../types.js\";\nimport type { TreeItemDefaultIds, TreeItemIdSet } from \"./types.js\";\n\n/**\n * @remarks \\@since 6.0.0 Renamed from `TreeItemSelection` and uses a Set\n * instead of a list to increase performance. Also renamed `onItemSelect` to\n * `toggleTreeItemSelection` and `onMultiItemSelect` to\n * `selectMultipleTreeItems`.\n */\nexport interface TreeSelection {\n  /** @defaultValue `false` */\n  multiSelect?: boolean;\n  selectedIds: ReadonlySet<string>;\n  toggleTreeItemSelection(itemId: string): void;\n  selectMultipleTreeItems: UseStateSetter<TreeItemIdSet>;\n}\n\n/**\n * @remarks \\@since 6.0.0 Renamed from `useTreeItemSelection` and uses a Set\n * instead of a list to increase performance.\n */\nexport function useTreeSelection(\n  defaultSelectedIds?: TreeItemDefaultIds,\n  multiSelect = false\n): Required<TreeSelection> {\n  const [selectedIds, setSelectedIds] = useState<TreeItemIdSet>(() => {\n    const defaultIds =\n      typeof defaultSelectedIds === \"function\"\n        ? defaultSelectedIds()\n        : defaultSelectedIds;\n\n    return new Set(defaultIds);\n  });\n\n  const toggleTreeItemSelection = useCallback(\n    (itemId: string) => {\n      setSelectedIds((selectedIds) => {\n        if (!multiSelect) {\n          return selectedIds.has(itemId) ? selectedIds : new Set([itemId]);\n        }\n\n        const nextSelectedIds = new Set(selectedIds);\n        if (selectedIds.has(itemId)) {\n          nextSelectedIds.delete(itemId);\n        } else {\n          nextSelectedIds.add(itemId);\n        }\n\n        return nextSelectedIds;\n      });\n    },\n    [multiSelect]\n  );\n\n  return {\n    selectedIds,\n    multiSelect,\n    toggleTreeItemSelection,\n    selectMultipleTreeItems: setSelectedIds,\n  };\n}\n"],"names":["useCallback","useState","useTreeSelection","defaultSelectedIds","multiSelect","selectedIds","setSelectedIds","defaultIds","Set","toggleTreeItemSelection","itemId","has","nextSelectedIds","delete","add","selectMultipleTreeItems"],"mappings":"AAAA;AACA,SAASA,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAkB9C;;;CAGC,GACD,OAAO,SAASC,iBACdC,kBAAuC,EACvCC,cAAc,KAAK;IAEnB,MAAM,CAACC,aAAaC,eAAe,GAAGL,SAAwB;QAC5D,MAAMM,aACJ,OAAOJ,uBAAuB,aAC1BA,uBACAA;QAEN,OAAO,IAAIK,IAAID;IACjB;IAEA,MAAME,0BAA0BT,YAC9B,CAACU;QACCJ,eAAe,CAACD;YACd,IAAI,CAACD,aAAa;gBAChB,OAAOC,YAAYM,GAAG,CAACD,UAAUL,cAAc,IAAIG,IAAI;oBAACE;iBAAO;YACjE;YAEA,MAAME,kBAAkB,IAAIJ,IAAIH;YAChC,IAAIA,YAAYM,GAAG,CAACD,SAAS;gBAC3BE,gBAAgBC,MAAM,CAACH;YACzB,OAAO;gBACLE,gBAAgBE,GAAG,CAACJ;YACtB;YAEA,OAAOE;QACT;IACF,GACA;QAACR;KAAY;IAGf,OAAO;QACLC;QACAD;QACAK;QACAM,yBAAyBT;IAC3B;AACF"}

package/dist/src/tree/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/tree/utils.ts"],"sourcesContent":["import type { TreeItemNode, TreeData, DefaultTreeItemNode } from \"./types.js\";\n\n/**\n * This will get all the items from the provided itemId up to the root of the\n * tree that can be used for drag and drop behavior or building a breadcrumb\n * list.\n *\n * @param data - The flattened tree data to navigate.\n * @param itemId - The item id to start the search at.\n * @returns an ordered list of the current item followed by all the direct\n * parents of that item.\n * @remarks \\@since 6.0.0 Renamed from `getItemsFrom` to `getTreeItemsFrom`.\n */\nexport function getTreeItemsFrom<T extends TreeItemNode = DefaultTreeItemNode>(\n  data: TreeData<T>,\n  itemId: string | null\n): readonly T[] {\n  const items: T[] = [];\n  let currentId = itemId;\n  while (currentId) {\n    const item = data[currentId];\n    currentId = item?.parentId ?? null;\n    if (item) {\n      items.push(item);\n    }\n  }\n\n  return items;\n}\n\n/**\n * Gets all the child items for a specific parent item id. If the `recursive`\n * argument is enabled, all children of the items will also be returned instead\n * of only the top level items.\n *\n * @param data - Either the flattened tree data or a list of all the tree data\n * to iterate over\n * @param parentId - The parent id to get children of\n * @param recursive - Boolean if the children's children should also be returned\n * @returns a list of all the items for a specific parent item id. Note: if the\n * recursive param is enabled, the list will be ordered so that the children of\n * a item will appear before the next item at the same level. So you either need\n * to sort by `parentId` or something else if you want a specific order.\n * @remarks \\@since 6.0.0 Renamed from `getChildItems` to `getChildTreeItems`.\n */\nexport function getChildTreeItems<T extends TreeItemNode = DefaultTreeItemNode>(\n  data: TreeData<T> | readonly T[],\n  parentId: string | null,\n  recursive = false\n): readonly T[] {\n  const items = Array.isArray(data) ? data : Object.values(data);\n\n  return items.reduce<T[]>((list, item) => {\n    if (parentId !== item.parentId) {\n      return list;\n    }\n\n    return [\n      ...list,\n      item,\n      ...(recursive ? getChildTreeItems(items, item.itemId, recursive) : []),\n    ];\n  }, []);\n}\n"],"names":["getTreeItemsFrom","data","itemId","items","currentId","item","parentId","push","getChildTreeItems","recursive","Array","isArray","Object","values","reduce","list"],"mappings":"AAEA;;;;;;;;;;CAUC,GACD,OAAO,SAASA,iBACdC,IAAiB,EACjBC,MAAqB;IAErB,MAAMC,QAAa,EAAE;IACrB,IAAIC,YAAYF;IAChB,MAAOE,UAAW;QAChB,MAAMC,OAAOJ,IAAI,CAACG,UAAU;QAC5BA,YAAYC,MAAMC,YAAY;QAC9B,IAAID,MAAM;YACRF,MAAMI,IAAI,CAACF;QACb;IACF;IAEA,OAAOF;AACT;AAEA;;;;;;;;;;;;;;CAcC,GACD,OAAO,SAASK,kBACdP,IAAgC,EAChCK,QAAuB,EACvBG,YAAY,KAAK;IAEjB,MAAMN,QAAQO,MAAMC,OAAO,CAACV,QAAQA,OAAOW,OAAOC,MAAM,CAACZ;IAEzD,OAAOE,MAAMW,MAAM,CAAM,CAACC,MAAMV;QAC9B,IAAIC,aAAaD,KAAKC,QAAQ,EAAE;YAC9B,OAAOS;QACT;QAEA,OAAO;eACFA;YACHV;eACII,YAAYD,kBAAkBL,OAAOE,KAAKH,MAAM,EAAEO,aAAa,EAAE;SACtE;IACH,GAAG,EAAE;AACP"}

package/dist/src/types.js

@@ -0,0 +1,5 @@
+/**
+ * @remarks \@since 6.0.0
+ */ export { };
+
+//# sourceMappingURL=types.js.map

package/dist/src/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/types.ts"],"sourcesContent":["import type { Dispatch, ReactElement, Ref, SetStateAction } from \"react\";\n\n/**\n * A helper type that allows an optional `ref` to also be applied with a props\n * object even though a `ref` isn't a real prop.\n */\nexport type PropsWithRef<\n  Props extends {},\n  Element extends HTMLElement,\n> = Props & {\n  /**\n   * An optional ref that can be applied.\n   */\n  ref?: Ref<Element>;\n};\n\n/**\n * A simple type that can be used for different components that clone a\n * `className` into a child component.\n */\nexport type ClassNameCloneableChild<T = {}> = ReactElement<\n  T & { className?: string }\n>;\n\n/**\n * This type allows you to require at least one of the provided keys. This is\n * super helpful for things like `aria-label` or `aria-labelledby` when it's\n * required for a11y.\n *\n * @see https://stackoverflow.com/questions/40510611/typescript-interface-require-one-of-two-properties-to-exist/49725198#49725198\n */\nexport type RequireAtLeastOne<T, Keys extends keyof T = keyof T> = Pick<\n  T,\n  Exclude<keyof T, Keys>\n> &\n  {\n    [K in Keys]-?: Required<Pick<T, K>> & Partial<Pick<T, Exclude<Keys, K>>>;\n  }[Keys];\n\nexport interface LabelA11y {\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n}\n\n/**\n * A small accessibility helper to ensure that either `aria-label` or\n * `aria-labelledby` have been provided to a component.\n *\n * @example\n * Simple Example\n * ```ts\n * import type { HTMLAttributes, ReactElement } from \"react\";\n * import type { LabelRequiredForA11y } from \"@react-md/core\";\n *\n * type Props = LabelRequiredForA11y<HTMLAttributes<HTMLDivElement>>;\n *\n * function Component(props: Props): ReactElement {\n *   return <div {...props} />;\n * }\n *\n * const test1 = <Component />\n * //            ^ type error\n * const test2 = <Component aria-label=\"Label\" />\n * const test3 = <Component aria-labelledby=\"some-other-id\" />\n * ```\n */\nexport type LabelRequiredForA11y<Props extends LabelA11y> = RequireAtLeastOne<\n  Props,\n  keyof LabelA11y\n>;\n\n/**\n * @remarks \\@since 5.0.0\n * @internal\n */\nexport interface NonNullRef<T> {\n  readonly current: T;\n}\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport interface NonNullMutableRef<T> {\n  current: T;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport type HtmlTagName = keyof JSX.IntrinsicElements;\n\n/**\n * A function to get a string from a generic item.\n *\n * @example\n * Simple Example\n * ```ts\n * interface Item {\n *   name: string;\n * }\n *\n * const items: Item[] = [{ name: 'Hello' }, { name: 'World' }];\n *\n * const extractor: TextExtractor<Item> = (item) => item.name;\n * ```\n * @remarks \\@since 6.0.0\n */\nexport type TextExtractor<T> = (item: T) => string;\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport type UseStateSetter<T> = Dispatch<SetStateAction<T>>;\n\n/**\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport type UseStateInitializer<T> = T | (() => T);\n\n/**\n * @example\n * ```ts\n * type Visibility = UseStateObject<\"visible\", boolean>;\n * // type Visibility = {\n * //   visible: boolean;\n * //   setVisible: UseStateSetter<boolean>\n * // }\n *\n * type AnotherOne = UseStateObject<\"renderAsSheet\", RenderMenuAsSheet>;\n * // type AnotherOne = {\n * //   renderAsSheet: RenderMenuAsSheet;\n * //   setRenderAsSheet: UseStateSetter<RenderMenuAsSheet>;\n * // }\n * ```\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport type UseStateObject<Name extends string, Value> = {\n  [key in Name]: Value;\n} & {\n  [key in `set${Capitalize<Name>}`]: UseStateSetter<Value>;\n};\n\n/**\n * @example\n * ```ts\n * interface Example {\n *   value: number;\n *   setValue: UseStateSetter<number>;\n * }\n *\n * type WithPrefix = RenameKeysWithPrefix<Example, \"thumb1\">;\n * // type WithPrefix = {\n * //   thumb1Value: number;\n * //   thumb1SetValue: UseStateSetter<number>;\n * // }\n * ```\n *\n * @remarks \\@since 6.0.0\n * @internal\n */\nexport type RenameKeysWithPrefix<T, Prefix extends string> = {\n  [Key in keyof T & string as `${Prefix}${Capitalize<Key>}`]: T[Key];\n};\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type CssPosition = \"fixed\" | \"sticky\" | \"static\";\n\n/**\n * @remarks \\@since 6.0.0\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type AnyFunction = (...args: any[]) => any | void;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ElementSize {\n  height: number;\n  width: number;\n}\n"],"names":[],"mappings":"AAiLA;;CAEC,GACD,WAGC"}

package/dist/src/typography/SrOnly.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/typography/SrOnly.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport {\n  Typography,\n  type CustomTypographyComponent,\n  type TypographyHTMLElement,\n  type TypographyProps,\n} from \"./Typography.js\";\nimport { cssUtils } from \"../cssUtils.js\";\n\nexport interface SrOnlyProps extends TypographyProps {\n  /** @defaultValue `\"span\"` */\n  as?: CustomTypographyComponent;\n\n  /**\n   * Set this to `true` if the content should only be screen reader only text on\n   * phones. This is useful for only displaying an icon on phones when there is\n   * limited space and then displaying an icon and text on larger devices.\n   *\n   * @defaultValue `false`\n   */\n  phoneOnly?: boolean;\n\n  /**\n   * Set this to `true` if the element should be keyboard focusable.\n   *\n   * @defaultValue `false`\n   */\n  focusable?: boolean;\n}\n\n/**\n * **Server Component**\n *\n * @example\n * Simple Example\n * ```tsx\n * import { SrOnly } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <>\n *       <SrOnly>\n *         I am only visible to screen readers.\n *       </SrOnly>\n *       <SrOnly focusable>\n *         I am only visible to screen readers but can be focused.\n *       </SrOnly>\n *     </>\n *   );\n * }\n * ```\n */\nexport const SrOnly = forwardRef<TypographyHTMLElement, SrOnlyProps>(\n  function SrOnly(props, ref) {\n    const {\n      as = \"span\",\n      className,\n      phoneOnly,\n      focusable,\n      children,\n      tabIndex,\n      ...remaining\n    } = props;\n\n    return (\n      <Typography\n        {...remaining}\n        as={as}\n        ref={ref}\n        tabIndex={tabIndex ?? (focusable ? 0 : undefined)}\n        className={cssUtils({\n          srOnly: focusable ? \"focusable\" : phoneOnly ? \"phone\" : true,\n          className,\n        })}\n      >\n        {children}\n      </Typography>\n    );\n  }\n);\n"],"names":["forwardRef","Typography","cssUtils","SrOnly","props","ref","as","className","phoneOnly","focusable","children","tabIndex","remaining","undefined","srOnly"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AACnC,SACEC,UAAU,QAIL,kBAAkB;AACzB,SAASC,QAAQ,QAAQ,iBAAiB;AAuB1C;;;;;;;;;;;;;;;;;;;;;;CAsBC,GACD,OAAO,MAAMC,uBAASH,WACpB,SAASG,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJC,KAAK,MAAM,EACXC,SAAS,EACTC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,QAAQ,EACR,GAAGC,WACJ,GAAGR;IAEJ,qBACE,KAACH;QACE,GAAGW,SAAS;QACbN,IAAIA;QACJD,KAAKA;QACLM,UAAUA,YAAaF,CAAAA,YAAY,IAAII,SAAQ;QAC/CN,WAAWL,SAAS;YAClBY,QAAQL,YAAY,cAAcD,YAAY,UAAU;YACxDD;QACF;kBAECG;;AAGP,GACA"}

package/dist/src/typography/TextContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/typography/TextContainer.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-line-length\"?: string | number;\n    \"--rmd-text-container-padding\"?: string | number;\n  }\n}\n\nconst styles = bem(\"rmd-text-container\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TextContainerClassNameOptions {\n  /**\n   * An optional className to merge with typography text container styles.\n   */\n  className?: string;\n}\n\n/**\n * @example\n * Simple Example\n * ```tsx\n * import { textContainer, Typography } from \"@react-md/core\";\n *\n * function Example() {\n *   return (\n *     <main className={textContainer()}>\n *       <Typography type=\"headline-1\">Heading</Typography>\n *       <Typography>\n *         Pretend this is a giant paragraph of text that wraps multiple lines.\n *       </Typography>\n *       <Typography>\n *         Pretend this is another giant paragraph of text that wraps multiple\n *         lines.\n *       </Typography>\n *     </main>\n *   ):\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function textContainer(\n  options: TextContainerClassNameOptions = {}\n): string {\n  const { className } = options;\n\n  return cnb(styles(), className);\n}\n\n/**\n * @remarks \\@since 6.0.0 Removed the `size` option since there is no longer a\n * different line-length for mobile and desktop.\n */\nexport interface TextContainerProps\n  extends HTMLAttributes<HTMLDivElement>,\n    TextContainerClassNameOptions {}\n\n/**\n * **Server Component**\n *\n * This component should be used to render text based content with an\n * appropriate max line length to optimize legibility.\n *\n * @example\n * Simple Example\n * ```tsx\n * import { TextContainer, Typography } from \"@react-md/core\";\n *\n * function Example() {\n *   return (\n *     <TextContainer>\n *       <Typography type=\"headline-1\">Heading</Typography>\n *       <Typography>\n *         Pretend this is a giant paragraph of text that wraps multiple lines.\n *       </Typography>\n *       <Typography>\n *         Pretend this is another giant paragraph of text that wraps multiple\n *         lines.\n *       </Typography>\n *     </TextContainer>\n *   );\n * }\n * ```\n *\n * @see {@link textContainer} If you only want to apply this class to an\n * element.\n * @remarks \\@since 6.0.0 Removed the `size` option since there is no longer a\n * different line-length for mobile and desktop.\n */\nexport const TextContainer = forwardRef<HTMLDivElement, TextContainerProps>(\n  function TextContainer(props, ref) {\n    const { className, children, ...remaining } = props;\n\n    return (\n      <div {...remaining} ref={ref} className={textContainer({ className })}>\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","bem","styles","textContainer","options","className","TextContainer","props","ref","children","remaining","div"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAA6B,QAAQ;AACxD,SAASC,GAAG,QAAQ,kBAAkB;AAStC,MAAMC,SAASD,IAAI;AAYnB;;;;;;;;;;;;;;;;;;;;;;;CAuBC,GACD,OAAO,SAASE,cACdC,UAAyC,CAAC,CAAC;IAE3C,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOL,IAAIG,UAAUG;AACvB;AAUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,MAAMC,8BAAgBN,WAC3B,SAASM,cAAcC,KAAK,EAAEC,GAAG;IAC/B,MAAM,EAAEH,SAAS,EAAEI,QAAQ,EAAE,GAAGC,WAAW,GAAGH;IAE9C,qBACE,KAACI;QAAK,GAAGD,SAAS;QAAEF,KAAKA;QAAKH,WAAWF,cAAc;YAAEE;QAAU;kBAChEI;;AAGP,GACA"}

package/dist/src/typography/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/typography/Typography.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {\n  forwardRef,\n  type ElementType,\n  type HTMLAttributes,\n  type ReactElement,\n} from \"react\";\nimport { cssUtils, type TextCssUtilsOptions } from \"../cssUtils.js\";\n\n/**\n * A union of all the material design provided typography styles. When used with\n * the Typography component, this will generate the correct typography className\n * to apply and determine what component to be rendered as if none was provided.\n *\n * @remarks \\@since 4.0.0\n */\nexport type TypographyType =\n  | \"headline-1\"\n  | \"headline-2\"\n  | \"headline-3\"\n  | \"headline-4\"\n  | \"headline-5\"\n  | \"headline-6\"\n  | \"subtitle-1\"\n  | \"subtitle-2\"\n  | \"body-1\"\n  | \"body-2\"\n  | \"caption\"\n  | \"overline\";\n\n/** @remarks \\@since 6.0.0 */\nexport interface TypographyClassNameOptions extends TextCssUtilsOptions {\n  className?: string;\n\n  /**\n   * @see {@link TypographyType}\n   * @defaultValue `\"body-1\"`\n   */\n  type?: TypographyType;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport type NullableTypographyClassNameOptions = Omit<\n  TypographyClassNameOptions,\n  \"type\"\n> & {\n  /**\n   * When using the {@link typography} class name utility, the `type` can be set\n   * to `null` to inherit font.\n   *\n   * @see {@link TypographyType}\n   * @defaultValue `\"body-1\"`\n   */\n  type?: TypographyType | null;\n};\n\n/**\n * Get a typography class name based on different typography options. This is\n * only useful if you are unable to use the {@link Typography} component for\n * some reason.\n *\n * @example\n * Simple Example\n * ```ts\n * import { getTypographyClassName } from \"@react-md/core\";\n *\n * function Example() {\n *   return (\n *     <>\n *       <h1 className={getTypographyClassName({ type: \"headline-1\" })} />\n *       <h2 className={getTypographyClassName({ type: \"headline-2\" })} />\n *       <h3 className={getTypographyClassName({ type: \"headline-3\" })} />\n *       <h4 className={getTypographyClassName({ type: \"headline-4\" })} />\n *       <h5 className={getTypographyClassName({ type: \"headline-5\" })} />\n *       <h6 className={getTypographyClassName({ type: \"headline-6\" })} />\n *       <h5 className={getTypographyClassName({ type: \"subtitle-1\" })} />\n *       <h6 className={getTypographyClassName({ type: \"subtitle-2\" })} />\n *       <p className={getTypographyClassName()} />\n *       <p className={getTypographyClassName({ type \"body-1\" })} />\n *       <p className={getTypographyClassName({ type \"body-1\" })} />\n *       <caption className={getTypographyClassName({ type: \"caption\" })} />\n *       <span className={getTypographyClassName({ type: \"overline\" })} />\n *     </>\n *   );\n * }\n * ```\n *\n * @example\n * Applying Additional Styles\n * ```ts\n * import { getTypography } from \"@react-md/core\";\n *\n * function Example() {\n *   return (\n *     <>\n *       <h1\n *         // only maintain the default margin-bottom\n *         className={getTypographyClassName({\n *           type: \"headline-1\",\n *           margin: \"bottom\",\n *         })}\n *        />\n *\n *       <h2\n *         // remove all default margin\n *         className={getTypographyClassName({\n *           type: \"headline-2\",\n *           margin: \"none\",\n *         })}\n *       />\n *\n *       <h3\n *         // only maintain the default margin-top\n *         className={getTypographyClassName({\n *           type: \"headline-3\",\n *           margin: \"top\",\n *         })}\n *       />\n *\n *       <p\n *         // center the text, set to bold, and only maintain default margin-bottom\n *         className={getTypographyClassName({\n *           type \"subtitle-1\",\n *           align: \"center\",\n *           margin: \"bottom\",\n *         })}\n *       />\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link Typography}\n * @param options - An optional object of options used to create the typography\n * class name.\n * @returns a typography class name string\n * @remarks \\@since 6.0.0\n */\nexport function typography(\n  options: NullableTypographyClassNameOptions = {}\n): string {\n  const { type = \"body-1\" } = options;\n\n  // using `&&` instead of `bem` since the latest version of typescript does not\n  // support setting the same object key (empty string)\n  return cnb(\n    \"rmd-typography\",\n    type && `rmd-typography--${type}`,\n    cssUtils(options)\n  );\n}\n\n/**\n * A union of the default supported elements that the `Typography` component can\n * be rendered as. This is mostly used for adding the correct `HTMLAttributes`\n * and enabling the forward ref.\n *\n * @remarks \\@since 4.0.0\n */\nexport type TypographyHTMLElement =\n  | HTMLHeadingElement\n  | HTMLParagraphElement\n  | HTMLSpanElement\n  | HTMLDivElement\n  | HTMLAnchorElement\n  | HTMLBodyElement\n  | HTMLHtmlElement;\n\n/** @remarks \\@since 6.0.0 */\nexport type CustomTypographyComponent = ElementType<\n  HTMLAttributes<TypographyHTMLElement> & { className: string }\n>;\n\n/** @internal */\nfunction getComponent(\n  as: CustomTypographyComponent | undefined,\n  type: TypographyType\n): ElementType {\n  if (as) {\n    return as;\n  }\n\n  switch (type) {\n    case \"headline-1\":\n      return \"h1\";\n    case \"headline-2\":\n      return \"h2\";\n    case \"headline-3\":\n      return \"h3\";\n    case \"headline-4\":\n      return \"h4\";\n    case \"headline-5\":\n      return \"h5\";\n    case \"headline-6\":\n    case \"subtitle-1\":\n    case \"subtitle-2\":\n      return \"h6\";\n    case \"body-1\":\n    case \"body-2\":\n      return \"p\";\n    case \"caption\":\n      return \"caption\";\n    default:\n      return \"span\";\n  }\n}\n\nexport interface TypographyProps\n  extends HTMLAttributes<TypographyHTMLElement>,\n    TypographyClassNameOptions {\n  /**\n   * The component to render as when the children are not a render function. If\n   * this prop is omitted, the component will be determined by the `type` prop\n   * where:\n   *\n   * - `\"headline-1\" -> <h1>`\n   * - `\"headline-2\" -> <h2>`\n   * - `\"headline-3\" -> <h3>`\n   * - `\"headline-4\" -> <h4>`\n   * - `\"headline-5\" -> <h5>`\n   * - `\"headline-6\" -> <h6>`\n   * - `\"subtitle-1\" -> <h5>`\n   * - `\"subtitle-2\" -> <h6>`\n   * - `\"body-1\"     -> <p>`\n   * - `\"body-2\"     -> <p>`\n   * - `\"caption\"    -> <caption>`\n   * - `\"overline\"   -> <span>`\n   */\n  as?: CustomTypographyComponent;\n}\n\n/**\n * **Server Component**\n *\n * Render text with one of the material design typography styles applied and\n * optional styles like font-weight, font-style, text color, etc.\n *\n * @example\n * All Example\n * ```tsx\n * import { Typography } from \"@react-md/core\":\n *\n * export function Example() {\n *   return (\n *    <>\n *      <Typography type=\"headline-1\">Headline 1</Typography>\n *      <Typography type=\"headline-2\">Headline 2</Typography>\n *      <Typography type=\"headline-3\">Headline 3</Typography>\n *      <Typography type=\"headline-4\">Headline 4</Typography>\n *      <Typography type=\"headline-5\">Headline 5</Typography>\n *      <Typography type=\"headline-6\">Headline 6</Typography>\n *      <Typography type=\"subtitle-1\">Subtitle 1</Typography>\n *      <Typography type=\"subtitle-2\">Subtitle 2</Typography>\n *      <Typography>\n *        A paragraph of text.\n *      </Typography>\n *      <Typography type=\"body-1\">\n *        A paragraph of text.\n *      </Typography>\n *      <Typography type=\"body-2\">\n *        Another paragraph of text.\n *      </Typography>\n *      <Typography type=\"caption\" component=\"h5\">\n *        Caption text\n *      </Typography>\n *      <Typography type=\"overline\" component=\"h5\">\n *        Overline text\n *      </Typography>\n *    </>\n *   ):\n * }\n * ```\n */\nexport const Typography = forwardRef<TypographyHTMLElement, TypographyProps>(\n  function Typography(props, ref): ReactElement {\n    const {\n      as,\n      type = \"body-1\",\n      className,\n      margin,\n      fontStyle,\n      fontWeight,\n      textAlign,\n      textColor,\n      textDecoration,\n      textTransform,\n      textOverflow,\n      children,\n      ...remaining\n    } = props;\n\n    const Component = getComponent(as, type);\n    return (\n      <Component\n        {...remaining}\n        ref={ref}\n        className={typography({\n          type,\n          margin,\n          fontStyle,\n          fontWeight,\n          textAlign,\n          textColor,\n          textDecoration,\n          textTransform,\n          textOverflow,\n          className,\n        })}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","cssUtils","typography","options","type","getComponent","as","Typography","props","ref","className","margin","fontStyle","fontWeight","textAlign","textColor","textDecoration","textTransform","textOverflow","children","remaining","Component"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SACEC,UAAU,QAIL,QAAQ;AACf,SAASC,QAAQ,QAAkC,iBAAiB;AAiDpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiFC,GACD,OAAO,SAASC,WACdC,UAA8C,CAAC,CAAC;IAEhD,MAAM,EAAEC,OAAO,QAAQ,EAAE,GAAGD;IAE5B,8EAA8E;IAC9E,qDAAqD;IACrD,OAAOJ,IACL,kBACAK,QAAQ,CAAC,gBAAgB,EAAEA,KAAK,CAAC,EACjCH,SAASE;AAEb;AAuBA,cAAc,GACd,SAASE,aACPC,EAAyC,EACzCF,IAAoB;IAEpB,IAAIE,IAAI;QACN,OAAOA;IACT;IAEA,OAAQF;QACN,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT,KAAK;QACL,KAAK;QACL,KAAK;YACH,OAAO;QACT,KAAK;QACL,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAO;QACT;YACE,OAAO;IACX;AACF;AA0BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyCC,GACD,OAAO,MAAMG,2BAAaP,WACxB,SAASO,WAAWC,KAAK,EAAEC,GAAG;IAC5B,MAAM,EACJH,EAAE,EACFF,OAAO,QAAQ,EACfM,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,UAAU,EACVC,SAAS,EACTC,SAAS,EACTC,cAAc,EACdC,aAAa,EACbC,YAAY,EACZC,QAAQ,EACR,GAAGC,WACJ,GAAGZ;IAEJ,MAAMa,YAAYhB,aAAaC,IAAIF;IACnC,qBACE,KAACiB;QACE,GAAGD,SAAS;QACbX,KAAKA;QACLC,WAAWR,WAAW;YACpBE;YACAO;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAR;QACF;kBAECS;;AAGP,GACA"}

package/dist/src/typography/WritingDirectionProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/typography/WritingDirectionProvider.tsx"],"sourcesContent":["\"use client\";\nimport {\n  Children,\n  cloneElement,\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n  type ReactElement,\n} from \"react\";\nimport { type UseStateInitializer } from \"../types.js\";\n\n/**\n * Note: unlike the `dir` DOM attribute, the `\"auto\"` value is not supported.\n *\n * @remarks \\@since 6.0.0\n */\nexport type Dir = \"ltr\" | \"rtl\";\n\n/** @remarks \\@since 6.0.0 */\nexport type DefaultDir = UseStateInitializer<Dir>;\n\n/** @remarks \\@since 2.3.0 */\nexport interface WritingDirectionContext {\n  /**\n   * The current writing direction that is being inherited.\n   */\n  dir: Dir;\n\n  /**\n   * Toggles the current writing direction for the first parent `Dir` component.\n   */\n  toggleDir(): void;\n}\n\n/** @internal */\ninterface InheritableContext extends WritingDirectionContext {\n  root: boolean;\n}\n\nconst context = createContext<InheritableContext>({\n  root: true,\n  dir: \"ltr\",\n  toggleDir: () => {\n    if (process.env.NODE_ENV !== \"production\") {\n      throw new Error(\n        \"Tried to toggle the current writing direction without initializing the `Dir` component.\"\n      );\n    }\n  },\n});\ncontext.displayName = \"WritingDirection\";\nconst { Provider } = context;\n\n/**\n * Gets the writing direction context which provides access to the current `dir`\n * and a `toggleDir` function.\n *\n * @example\n * Manually Changing the Writing Direction\n * ```tsx\n * import { useDir } from \"@react-md/core\";\n *\n * function Example() {\n *   const { dir, toggleDir } = useDir();\n *\n *   return (\n *     <>\n *       <p>{`The current dir is: \"${dir}\"`}</p>\n *       <button type=\"button\" onClick={toggleDir}>Toggle</button>\n *     </>\n *   );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useDir(): Readonly<WritingDirectionContext> {\n  const { root: _root, ...current } = useContext(context);\n  return current;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport interface WritingDirectionProviderProps {\n  /**\n   * A single ReactElement child. If the `WritingDirection` has a parent\n   * `WritingDirection`, the child will have the `dir` prop cloned into this\n   * element.\n   */\n  children: ReactElement<{ dir?: Dir }>;\n\n  /**\n   * The default writing direction for your app or a subtree. To change the\n   * current writing direction, use the `useDir` hook to get access to the\n   * current `dir` and the `toggleDir` function.\n   *\n   * @defaultValue `\"ltr\"`\n   * @see {@link DEFAULT_WRITING_DIRECTION}\n   */\n  defaultDir?: DefaultDir;\n}\n\n/**\n * In the browser, this will default to the `<html>`'s `dir` value if one\n * exists. If the `dir` attribute does not exist, it will default to `\"ltr\"`.\n *\n * In node environments, this will default to `\"ltr\"`.\n *\n * @remarks \\@since 6.0.0\n */\nexport const DEFAULT_WRITING_DIRECTION = (): Dir => {\n  let dir: Dir = \"ltr\";\n  if (typeof document !== \"undefined\") {\n    const rootDir = document.documentElement.getAttribute(\"dir\");\n    dir = rootDir === \"rtl\" ? \"rtl\" : \"ltr\";\n  }\n\n  return dir;\n};\n\n/**\n * **Client Component**\n *\n * The `WritingDirection` component is used to handle the current writing\n * direction within your app as well as conditionally updating the writing\n * direction for small sections in your app. When this component is used for the\n * first time near the root of your React component tree, the current direction\n * will be applied to the root `<html>` element. Otherwise the current dir will\n * be cloned into the child element so it can be passed as a prop.\n *\n * Note: Since the `dir` is cloned into the child element, you need to make sure\n * that the child is either a DOM element or the `dir` prop is passed from your\n * custom component.\n *\n * @example\n * Root Setup\n * ```tsx\n * import { createRoot } from \"react-dom/client\";\n * import { WritingDirection } from \"@react-md/core\";\n * import App from \"./App.js\":\n *\n * const container = document.getElementById(\"root\");\n * const root = createRoot(container);\n *\n * root.render(\n *   <WritingDirection>\n *     <App />\n *   </WritingDirection>\n * );\n * ```\n *\n * @example\n * Supporting RTL Languages\n * ```tsx\n * import { createRoot } from \"react-dom/client\";\n * import { WritingDirection } from \"@react-md/core\";\n * import type { Dir } from \"@react-md/core\";\n * import App from \"./App.js\":\n *\n * const container = document.getElementById(\"root\");\n * const root = createRoot(container);\n *\n * // see https://meta.wikimedia.org/wiki/Template:List_of_language_names_ordered_by_code\n * const SUPPORTED_RTL_LANGUAGES = [\n *   \"ar\",\n *   \"arc\",\n *   \"ckb\",\n *   \"dv\",\n *   \"fa\",\n *   \"ha\",\n *   \"he\",\n *   \"khw\",\n *   \"ks\",\n *   \"ps\",\n *   \"sd\",\n *   \"ur\",\n *   \"uz_AF\",\n *   \"ti\",\n * ];\n *\n * const defaultDir = (): Dir => {\n *   if (SUPPORTED_RTL_LANGUAGES.includes(navigator.language)) {\n *     return \"rtl\"\n *   }\n *\n *   return \"ltr\";\n * }\n *\n * root.render(\n *   <WritingDirection defaultDir={defaultDir}>\n *     <App />\n *   </WritingDirection>\n * );\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function WritingDirectionProvider(\n  props: WritingDirectionProviderProps\n): ReactElement {\n  const { children, defaultDir = DEFAULT_WRITING_DIRECTION } = props;\n  const { root } = useContext(context);\n  const [dir, setDir] = useState(defaultDir);\n  useEffect(() => {\n    if (!root || typeof document === \"undefined\") {\n      return;\n    }\n\n    document.documentElement.setAttribute(\"dir\", dir);\n\n    return () => {\n      document.documentElement.removeAttribute(\"dir\");\n    };\n  }, [dir, root]);\n\n  const toggleDir = useCallback(() => {\n    setDir((prevDir) => (prevDir === \"ltr\" ? \"rtl\" : \"ltr\"));\n  }, []);\n\n  const value = useMemo<InheritableContext>(\n    () => ({ root: false, dir, toggleDir }),\n    [dir, toggleDir]\n  );\n  let child = Children.only(children);\n  if (!root) {\n    child = cloneElement(child, { dir });\n  }\n\n  return <Provider value={value}>{child}</Provider>;\n}\n"],"names":["Children","cloneElement","createContext","useCallback","useContext","useEffect","useMemo","useState","context","root","dir","toggleDir","process","env","NODE_ENV","Error","displayName","Provider","useDir","_root","current","DEFAULT_WRITING_DIRECTION","document","rootDir","documentElement","getAttribute","WritingDirectionProvider","props","children","defaultDir","setDir","setAttribute","removeAttribute","prevDir","value","child","only"],"mappings":"AAAA;;AACA,SACEA,QAAQ,EACRC,YAAY,EACZC,aAAa,EACbC,WAAW,EACXC,UAAU,EACVC,SAAS,EACTC,OAAO,EACPC,QAAQ,QAEH,QAAQ;AA+Bf,MAAMC,wBAAUN,cAAkC;IAChDO,MAAM;IACNC,KAAK;IACLC,WAAW;QACT,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YACzC,MAAM,IAAIC,MACR;QAEJ;IACF;AACF;AACAP,QAAQQ,WAAW,GAAG;AACtB,MAAM,EAAEC,QAAQ,EAAE,GAAGT;AAErB;;;;;;;;;;;;;;;;;;;;;;CAsBC,GACD,OAAO,SAASU;IACd,MAAM,EAAET,MAAMU,KAAK,EAAE,GAAGC,SAAS,GAAGhB,WAAWI;IAC/C,OAAOY;AACT;AAsBA;;;;;;;CAOC,GACD,OAAO,MAAMC,4BAA4B;IACvC,IAAIX,MAAW;IACf,IAAI,OAAOY,aAAa,aAAa;QACnC,MAAMC,UAAUD,SAASE,eAAe,CAACC,YAAY,CAAC;QACtDf,MAAMa,YAAY,QAAQ,QAAQ;IACpC;IAEA,OAAOb;AACT,EAAE;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4EC,GACD,OAAO,SAASgB,yBACdC,KAAoC;IAEpC,MAAM,EAAEC,QAAQ,EAAEC,aAAaR,yBAAyB,EAAE,GAAGM;IAC7D,MAAM,EAAElB,IAAI,EAAE,GAAGL,WAAWI;IAC5B,MAAM,CAACE,KAAKoB,OAAO,GAAGvB,SAASsB;IAC/BxB,UAAU;QACR,IAAI,CAACI,QAAQ,OAAOa,aAAa,aAAa;YAC5C;QACF;QAEAA,SAASE,eAAe,CAACO,YAAY,CAAC,OAAOrB;QAE7C,OAAO;YACLY,SAASE,eAAe,CAACQ,eAAe,CAAC;QAC3C;IACF,GAAG;QAACtB;QAAKD;KAAK;IAEd,MAAME,YAAYR,YAAY;QAC5B2B,OAAO,CAACG,UAAaA,YAAY,QAAQ,QAAQ;IACnD,GAAG,EAAE;IAEL,MAAMC,QAAQ5B,QACZ,IAAO,CAAA;YAAEG,MAAM;YAAOC;YAAKC;QAAU,CAAA,GACrC;QAACD;QAAKC;KAAU;IAElB,IAAIwB,QAAQnC,SAASoC,IAAI,CAACR;IAC1B,IAAI,CAACnB,MAAM;QACT0B,sBAAQlC,aAAakC,OAAO;YAAEzB;QAAI;IACpC;IAEA,qBAAO,KAACO;QAASiB,OAAOA;kBAAQC;;AAClC"}

package/dist/src/useAsyncAction.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/useAsyncAction.ts"],"sourcesContent":["\"use client\";\nimport { useCallback, useState } from \"react\";\nimport type { NonNullRef, UseStateSetter } from \"./types.js\";\nimport { useUnmounted } from \"./useUnmounted.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type AsyncActionFunction<Args extends unknown[]> = (\n  ...args: Args\n) => Promise<void>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type HandleAsyncAction = <Args extends unknown[]>(\n  action: AsyncActionFunction<Args>\n) => AsyncActionFunction<Args>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface AsyncActionOptions {\n  /** @defaultValue `false` */\n  disabled?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface AsyncActionImplementation {\n  pending: boolean;\n  unmounted: NonNullRef<boolean>;\n  setPending: UseStateSetter<boolean>;\n  handleAsync: HandleAsyncAction;\n}\n\n/**\n * A simple utility hook for triggering a pending state while an async function\n * is running. This is really only useful if you aren't using something like\n * `react-query`, `@reduxjs/toolkit/query`, `@apollo/client`, etc for API calls\n * which have a built-in pending state for mutations.\n *\n * @example\n * Simple Example (Async Button)\n * ```tsx\n * import type { ButtonProps } from \"@react-md/core\";\n * import { box, Button, CircularProgress, useAsyncAction } from \"@react-md/core\";\n * import { cnb } from \"cnbuilder\";\n * import type { MouseEvent, ReactElement } from \"react\";\n *\n * import styles from \"./AsyncButton.module.scss\";\n *\n * export interface AsyncButtonProps extends ButtonProps {\n *   onClick(event: MouseEvent<HTMLButtonElement>): Promise<void>;\n * }\n *\n * export function AsyncButton(props: AsyncButtonProps): ReactElement {\n *   const { onClick, children, theme, className, disabled, ...remaining } = props;\n *   const { handleAsync, pending } = useAsyncAction({ disabled });\n *\n *   return (\n *     <Button\n *       {...remaining}\n *       aria-disabled={pending || undefined}\n *       disabled={disabled}\n *       className={cnb(pending && styles.loading, className)}\n *       theme={pending ? \"disabled\" : theme}\n *       onClick={handleAsync(onClick)}\n *     >\n *       {children}\n *       {pending && (\n *         <span\n *           className={box({\n *             align: \"center\",\n *             disablePadding: true,\n *             className: styles.overlay,\n *           })}\n *         >\n *           <CircularProgress />\n *         </span>\n *       )}\n *     </Button>\n *   );\n * }\n *\n * // `AsyncButton.module.scss`\n * // hide everything in the button except for the overlay containing the circular\n * // progress\n * .loading > *:not(.overlay) {\n *   opacity: 0;\n * }\n *\n * .overlay {\n *   border-radius: inherit;\n *   box-shadow: inherit;\n *   inset: 0;\n *   position: absolute;\n *   z-index: 1;\n * }\n * ```\n *\n * @example\n * Confirmation Dialog with Overlay\n * ```tsx\n * import {\n *   Button,\n *   DialogHeader,\n *   DialogContent,\n *   DialogFooter,\n *   Form,\n *   useAsyncAction,\n * } from \"@react-md/core\";\n * import CloseIcon from \"@react-md/material-icons/CloseIcon\";\n * import type { ReactElement } from \"react\";\n * import { useId } from \"react\";\n *\n * interface ExampleProps {\n *   hide(); void;\n *   submit(): Promise<void>\n * }\n *\n * function Example({ hide, submit }: ExampleProps): ReactElement {\n *   const { handleAsync, pending } = useAsyncAction();\n *   const formId = useId();\n *\n *   return (\n *     <>\n *       <DialogHeader>\n *         <DialogTitle>Some Title</DialogTitle>\n *         <Button aria-label=\"Close\" onClick={hide} disabled={pending}>\n *           <CloseIcon />\n *         </Button>\n *       </DialogHeader>\n *       <DialogContent>\n *         <Form\n *           id={formId}\n *           onReset={hide}\n *           onSubmit={handleAsync(submit)}\n *         >\n *           // pretend content\n *         </Form>\n *       </DialogContent>\n *       <DialogFooter>\n *         <Button\n *           type=\"reset\"\n *           form={formId}\n *           disabled={pending}\n *         >\n *           Cancel\n *         </Button>\n *         <Button\n *           type=\"submit\"\n *           form={formId}\n *           disabled={pending}\n *         >\n *           Confirm\n *         </Button>\n *       </DialogFooter>\n *     </>\n *   );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useAsyncAction(\n  options: AsyncActionOptions = {}\n): AsyncActionImplementation {\n  const { disabled } = options;\n\n  const [pending, setPending] = useState(false);\n  const unmounted = useUnmounted();\n\n  const handleAsync = useCallback<HandleAsyncAction>(\n    (action) =>\n      async (...args) => {\n        if (pending || disabled) {\n          return;\n        }\n\n        setPending(true);\n        try {\n          await action(...args);\n        } finally {\n          if (!unmounted.current) {\n            setPending(false);\n          }\n        }\n      },\n    [disabled, pending, unmounted]\n  );\n\n  return {\n    pending,\n    unmounted,\n    setPending,\n    handleAsync,\n  };\n}\n"],"names":["useCallback","useState","useUnmounted","useAsyncAction","options","disabled","pending","setPending","unmounted","handleAsync","action","args","current"],"mappings":"AAAA;AACA,SAASA,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAE9C,SAASC,YAAY,QAAQ,oBAAoB;AAkCjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgIC,GACD,OAAO,SAASC,eACdC,UAA8B,CAAC,CAAC;IAEhC,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IAErB,MAAM,CAACE,SAASC,WAAW,GAAGN,SAAS;IACvC,MAAMO,YAAYN;IAElB,MAAMO,cAAcT,YAClB,CAACU,SACC,OAAO,GAAGC;YACR,IAAIL,WAAWD,UAAU;gBACvB;YACF;YAEAE,WAAW;YACX,IAAI;gBACF,MAAMG,UAAUC;YAClB,SAAU;gBACR,IAAI,CAACH,UAAUI,OAAO,EAAE;oBACtBL,WAAW;gBACb;YACF;QACF,GACF;QAACF;QAAUC;QAASE;KAAU;IAGhC,OAAO;QACLF;QACAE;QACAD;QACAE;IACF;AACF"}

package/dist/src/useDebouncedFunction.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/useDebouncedFunction.ts"],"sourcesContent":["\"use client\";\nimport { useCallback, useEffect, useRef } from \"react\";\nimport type { AnyFunction } from \"./types.js\";\nimport { useIsomorphicLayoutEffect } from \"./useIsomorphicLayoutEffect.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type DebouncedFunction<F extends AnyFunction> = (\n  ...args: Parameters<F>\n) => void;\n\n/**\n * Creates a function that will only be called if it has not been called again\n * for X milliseconds.\n *\n * @example\n * Debounced Search API Requests\n * ```tsx\n * import { TextField, useDebouncedFunction, useUnmounted } from \"@react-md/core\";\n * import { useState } from \"react\";\n * import type { ReactElement } from \"react\";\n *\n * interface State {\n *   error?: unknown\n *   loading: boolean;\n *   results?: {\n *     // pretend some search results\n *     id: string;\n *     name: string;\n *   }[];\n * }\n *\n * function Example(): ReactElement {\n *   const [state, setState] = useState<State>({\n *     loading: false,\n *   });\n *   // this is only required for async actions\n *   const unmounted = useUnmounted();\n *\n *   // A new search request will be fired once every 500ms as the user types.\n *   // can't use the event here since React uses synthetic events\n *   const search = useDebouncedFunction(async (q: string) => {\n *     setState({\n *       loading: true,\n *       error: undefined,\n *       results: undefined,\n *     });\n *\n *     try {\n *       const response = await fetch('/search', {\n *         method: 'POST',\n *         headers: {\n *           'Content-Type': 'application/json',\n *         },\n *         body: JSON.stringify({ q }),\n *       });\n *       const json = await response.json();\n *\n *       if (!unmounted.current) {\n *         setState({\n *           loading: false,\n *           results: json,\n *         });\n *       }\n *     } catch (error) {\n *       if (!unmounted.current) {\n *         setState({\n *           error,\n *           loading: false,\n *         });\n *       }\n *     }\n *   }, 500);\n *\n *   return (\n *     <TextField\n *       type=\"search\"\n *       label=\"Search\"\n *       onChange={(event) => search(event.currentTarget.value)}\n *     />\n *   );\n * }\n * ```\n *\n * @see `useThrottledFunction` for throttle behavior instead. (Call a\n * function at most once every X milliseconds).\n * @remarks \\@since 6.0.0\n */\nexport function useDebouncedFunction<F extends AnyFunction>(\n  func: F,\n  wait: number\n): DebouncedFunction<F> {\n  const timeout = useRef<number | undefined>();\n  const funcRef = useRef(func);\n  useIsomorphicLayoutEffect(() => {\n    funcRef.current = func;\n  });\n\n  useEffect(() => {\n    return () => {\n      window.clearTimeout(timeout.current);\n    };\n  }, []);\n\n  return useCallback(\n    (...args) => {\n      window.clearTimeout(timeout.current);\n      timeout.current = window.setTimeout(() => {\n        funcRef.current(...args);\n      }, wait);\n    },\n    [wait]\n  );\n}\n"],"names":["useCallback","useEffect","useRef","useIsomorphicLayoutEffect","useDebouncedFunction","func","wait","timeout","funcRef","current","window","clearTimeout","args","setTimeout"],"mappings":"AAAA;AACA,SAASA,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,QAAQ;AAEvD,SAASC,yBAAyB,QAAQ,iCAAiC;AAS3E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4EC,GACD,OAAO,SAASC,qBACdC,IAAO,EACPC,IAAY;IAEZ,MAAMC,UAAUL;IAChB,MAAMM,UAAUN,OAAOG;IACvBF,0BAA0B;QACxBK,QAAQC,OAAO,GAAGJ;IACpB;IAEAJ,UAAU;QACR,OAAO;YACLS,OAAOC,YAAY,CAACJ,QAAQE,OAAO;QACrC;IACF,GAAG,EAAE;IAEL,OAAOT,YACL,CAAC,GAAGY;QACFF,OAAOC,YAAY,CAACJ,QAAQE,OAAO;QACnCF,QAAQE,OAAO,GAAGC,OAAOG,UAAU,CAAC;YAClCL,QAAQC,OAAO,IAAIG;QACrB,GAAGN;IACL,GACA;QAACA;KAAK;AAEV"}