@accelint/design-system 0.1.0 → 0.2.0

package/dist/components/tooltip/tooltip.d.ts

@@ -0,0 +1,23 @@
+import { type ContextValue } from 'react-aria-components';
+import type { TooltipMapping, TooltipProps, TooltipTargetProps } from './types';
+export declare const TooltipContext: import("react").Context<ContextValue<TooltipProps, HTMLDivElement>>;
+export declare const Tooltip: (props: Omit<import("react-aria-components").TooltipProps, "className" | "style" | "UNSTABLE_portalContainer"> & {
+    classNames?: import("./types").TooltipClassNames;
+    mapping?: Partial<TooltipMapping>;
+} & {
+    children?: import("../..").RenderPropsChildren<import("./types").TooltipRenderProps>;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
+export declare const TooltipTargetContext: import("react").Context<ContextValue<TooltipTargetProps, HTMLDivElement>>;
+/**
+ * This target component is only needed if attempting to add a Tooltip
+ * to a non-focusable element/component
+ */
+export declare const TooltipTarget: (props: {
+    classNames?: import("./types").TooltipClassNames;
+    mapping?: Partial<TooltipMapping>;
+} & {
+    focusable?: boolean;
+    relative?: "parent" | "self";
+} & {
+    children?: import("react").ReactNode | undefined;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;

package/dist/components/tooltip/tooltip.js

@@ -0,0 +1,69 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useMemo, useCallback } from 'react';
+import { useFocusable } from 'react-aria';
+import { useContextProps, Tooltip as Tooltip$1 } from 'react-aria-components';
+import { inlineVars } from '../../utils/css.js';
+import { mergeClassNames, callRenderProps } from '../../utils/props.js';
+import { useDefaultProps } from '../../hooks/use-defaults/use-defaults.js';
+import { useTheme } from '../../hooks/use-theme/use-theme.js';
+import { bodies } from '../../styles/typography.vanilla.js';
+import { tooltipClassNames, tooltipStateVars, tooltipTargetStateVars } from './tooltip.vanilla.js';
+
+const defaultMapping = {
+  font: bodies.xs
+};
+const TooltipContext = createContext(null);
+const Tooltip = forwardRef(function Tooltip2(props, ref) {
+  [props, ref] = useContextProps(props, ref, TooltipContext);
+  props = useDefaultProps(props, "Tooltip");
+  const { children: childrenProp, classNames: classNamesProp, containerPadding, crossOffset, mapping: mappingProp, offset, ...rest } = props;
+  const theme = useTheme();
+  const mapping = useMemo(() => ({
+    ...defaultMapping,
+    ...mappingProp
+  }), [mappingProp]);
+  const classNames = useMemo(() => mergeClassNames(tooltipClassNames, theme.Tooltip, classNamesProp, {
+    tooltip: {
+      container: theme.className,
+      tooltip: mapping.font
+    }
+  }), [theme.Tooltip, classNamesProp, theme.className, mapping]);
+  const style = useCallback(({ state, ...renderProps }) => ({
+    ...theme.style,
+    ...inlineVars(tooltipStateVars, {
+      containerPadding,
+      crossOffset,
+      offset,
+      ...renderProps,
+      isOpen: state.isOpen
+    })
+  }), [theme.style, containerPadding, crossOffset, offset]);
+  const children = useCallback((renderProps) => jsx("div", { className: classNames?.tooltip?.tooltip, children: callRenderProps(childrenProp, {
+    ...renderProps,
+    isOpen: renderProps.state.isOpen
+  }) }), [classNames?.tooltip?.tooltip, childrenProp]);
+  return jsx(Tooltip$1, { ...rest, ref, className: classNames?.tooltip?.container, style, children });
+});
+const TooltipTargetContext = createContext(null);
+const TooltipTarget = forwardRef(function TooltipTarget2(props, ref) {
+  [props, ref] = useContextProps(props, ref, TooltipTargetContext);
+  props = useDefaultProps(props, "TooltipTarget");
+  const { children, classNames: classNamesProp, focusable = true, relative = "self" } = props;
+  const { focusableProps } = useFocusable({}, ref);
+  const theme = useTheme();
+  const classNames = useMemo(() => mergeClassNames(tooltipClassNames, theme.Tooltip, classNamesProp), [theme.Tooltip, classNamesProp]);
+  const style = useMemo(() => inlineVars(tooltipTargetStateVars, {
+    focusable,
+    relative
+  }), [focusable, relative]);
+  return jsx("div", { className: classNames?.target?.container, style, children: jsx("div", {
+    ...focusableProps,
+    ref,
+    className: classNames?.target?.target,
+    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
+    tabIndex: focusable ? 0 : void 0,
+    children
+  }) });
+});
+
+export { Tooltip, TooltipContext, TooltipTarget, TooltipTargetContext };

package/dist/components/tooltip/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.js","sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import {\n  type ForwardedRef,\n  createContext,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { useFocusable } from 'react-aria';\nimport {\n  type ContextValue,\n  Tooltip as RACTooltip,\n  type TooltipRenderProps,\n  useContextProps,\n} from 'react-aria-components';\nimport { useDefaultProps, useTheme } from '../../hooks';\nimport { bodies } from '../../styles';\nimport { callRenderProps, inlineVars, mergeClassNames } from '../../utils';\nimport {\n  tooltipClassNames,\n  tooltipStateVars,\n  tooltipTargetStateVars,\n} from './tooltip.css';\nimport type { TooltipMapping, TooltipProps, TooltipTargetProps } from './types';\n\nconst defaultMapping: TooltipMapping = {\n  font: bodies.xs,\n};\n\nexport const TooltipContext =\n  createContext<ContextValue<TooltipProps, HTMLDivElement>>(null);\n\nexport const Tooltip = forwardRef(function Tooltip(\n  props: TooltipProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TooltipContext);\n\n  props = useDefaultProps(props, 'Tooltip');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    containerPadding,\n    crossOffset,\n    mapping: mappingProp,\n    offset,\n    ...rest\n  } = props;\n\n  const theme = useTheme();\n\n  const mapping = useMemo(\n    () => ({\n      ...defaultMapping,\n      ...mappingProp,\n    }),\n    [mappingProp],\n  );\n\n  const classNames = useMemo(\n    () =>\n      mergeClassNames(tooltipClassNames, theme.Tooltip, classNamesProp, {\n        tooltip: {\n          container: theme.className,\n          tooltip: mapping.font,\n        },\n      }),\n    [theme.Tooltip, classNamesProp, theme.className, mapping],\n  );\n\n  const style = useCallback(\n    ({ state, ...renderProps }: TooltipRenderProps) => ({\n      ...theme.style,\n      ...inlineVars(tooltipStateVars, {\n        containerPadding,\n        crossOffset,\n        offset,\n        ...renderProps,\n        isOpen: state.isOpen,\n      }),\n    }),\n    [theme.style, containerPadding, crossOffset, offset],\n  );\n\n  const children = useCallback(\n    (renderProps: TooltipRenderProps) => (\n      <div className={classNames?.tooltip?.tooltip}>\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          isOpen: renderProps.state.isOpen,\n        })}\n      </div>\n    ),\n    [classNames?.tooltip?.tooltip, childrenProp],\n  );\n\n  return (\n    <RACTooltip\n      {...rest}\n      ref={ref}\n      className={classNames?.tooltip?.container}\n      style={style}\n    >\n      {children}\n    </RACTooltip>\n  );\n});\n\nexport const TooltipTargetContext =\n  createContext<ContextValue<TooltipTargetProps, HTMLDivElement>>(null);\n\n/**\n * This target component is only needed if attempting to add a Tooltip\n * to a non-focusable element/component\n */\nexport const TooltipTarget = forwardRef(function TooltipTarget(\n  props: TooltipTargetProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TooltipTargetContext);\n\n  props = useDefaultProps(props, 'TooltipTarget');\n\n  const {\n    children,\n    classNames: classNamesProp,\n    focusable = true,\n    relative = 'self',\n  } = props;\n\n  const { focusableProps } = useFocusable({}, ref);\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tooltipClassNames, theme.Tooltip, classNamesProp),\n    [theme.Tooltip, classNamesProp],\n  );\n\n  const style = useMemo(\n    () =>\n      inlineVars(tooltipTargetStateVars, {\n        focusable,\n        relative,\n      }),\n    [focusable, relative],\n  );\n\n  return (\n    <div className={classNames?.target?.container} style={style}>\n      <div\n        {...focusableProps}\n        ref={ref}\n        className={classNames?.target?.target}\n        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n        tabIndex={focusable ? 0 : undefined}\n      >\n        {children}\n      </div>\n    </div>\n  );\n});\n"],"names":["Tooltip","RACTooltip","TooltipTarget"],"mappings":"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"}

package/dist/components/tooltip/tooltip.vanilla.js

@@ -0,0 +1,8 @@
+
+var tooltipClassNames = { tooltip: { container: "tooltip_tooltipClassNames_tooltip_container__sg5iyrd", tooltip: "tooltip_tooltipClassNames_tooltip_tooltip__sg5iyre surfaces_proud__15mw6jf5 surfaces_flush__15mw6jf4" }, target: { container: "tooltip_tooltipClassNames_target_container__sg5iyrf", target: "tooltip_tooltipClassNames_target_target__sg5iyrg" } };
+var tooltipContainers = { tooltip: "tooltip_tooltipContainers_tooltip__sg5iyr0", target: "tooltip_tooltipContainers_target__sg5iyr1" };
+var tooltipSpaceVars = { x: "var(--x__sg5iyr2)", y: "var(--y__sg5iyr3)" };
+var tooltipStateVars = { containerPadding: "var(--containerPadding__sg5iyr4)", crossOffset: "var(--crossOffset__sg5iyr5)", offset: "var(--offset__sg5iyr6)", placement: "var(--placement__sg5iyr7)", isEntering: "var(--isEntering__sg5iyr8)", isExiting: "var(--isExiting__sg5iyr9)", isOpen: "var(--isOpen__sg5iyra)" };
+var tooltipTargetStateVars = { focusable: "var(--focusable__sg5iyrb)", relative: "var(--relative__sg5iyrc)" };
+
+export { tooltipClassNames, tooltipContainers, tooltipSpaceVars, tooltipStateVars, tooltipTargetStateVars };

package/dist/components/tooltip/tooltip.vanilla.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.vanilla.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/components/tooltip/types.d.ts

@@ -0,0 +1,39 @@
+import type { PropsWithChildren } from 'react';
+import type { TooltipProps as RACTooltipProps, TooltipRenderProps as RACTooltipRenderProps } from 'react-aria-components';
+import type { PartialDeep } from 'type-fest';
+import type { RenderPropsChildren } from '../../types';
+export type TooltipClassNames = PartialDeep<{
+    tooltip: {
+        container: string;
+        tooltip: string;
+    };
+    target: {
+        container: string;
+        target: string;
+    };
+}>;
+export type TooltipMapping = {
+    font: string;
+};
+export type TooltipRenderProps = RACTooltipRenderProps & {
+    /**
+     * If the tooltip is visible
+     */
+    isOpen: boolean;
+};
+type BaseProps = {
+    classNames?: TooltipClassNames;
+    mapping?: Partial<TooltipMapping>;
+};
+type BaseTooltipProps = BaseProps & {
+    children?: RenderPropsChildren<TooltipRenderProps>;
+};
+type BaseTooltipTargetProps = BaseProps & {
+    focusable?: boolean;
+    relative?: 'parent' | 'self';
+};
+export type TooltipState = Omit<TooltipRenderProps, 'state'> & Required<Pick<RACTooltipProps, 'containerPadding' | 'crossOffset' | 'offset'>>;
+export type TooltipTargetState = Required<Pick<BaseTooltipTargetProps, 'focusable' | 'relative'>>;
+export type TooltipProps = Omit<RACTooltipProps, 'className' | 'style' | 'UNSTABLE_portalContainer'> & BaseTooltipProps;
+export type TooltipTargetProps = PropsWithChildren<BaseTooltipTargetProps>;
+export {};

package/dist/components/tree/index.d.ts

@@ -0,0 +1,3 @@
+export { Tree, TreeGroup, TreeItem, TreeStateContext } from './tree';
+export { treeClassNames, treeColorVars, treeContainers, treeGroupStateVars, treeIndicatorStateVars, treeItemStateVars, treeSpaceVars, treeStateVars, } from './tree.css';
+export { type TreeClassNames, type TreeGroupProps, type TreeGroupRenderProps, type TreeGroupState, type TreeIndicatorRenderProps, type TreeIndicatorState, type TreeItemProps, type TreeItemRenderProps, type TreeItemState, type TreeMapping, type TreeProps, type TreeRenderProps, type TreeSizes, type TreeState, type TreeStateContextValue, } from './types';

package/dist/components/tree/tree.css.d.ts

@@ -0,0 +1,73 @@
+import type { TreeClassNames } from './types';
+export declare const treeContainers: {
+    tree: string;
+    group: string;
+    item: string;
+};
+export declare const treeColorVars: {
+    bar: {
+        background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+    indicator: {
+        background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+};
+export declare const treeSpaceVars: {
+    bar: {
+        x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+    description: {
+        x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+    empty: {
+        x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+};
+export declare const treeStateVars: {
+    allowsDragging: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    allowsExpansion: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    allowsVisibility: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    showTreeLines: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const treeGroupStateVars: {
+    count: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    layout: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDropTarget: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isEmpty: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const treeIndicatorStateVars: {
+    dropPosition: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDropTarget: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const treeItemStateVars: {
+    allowsDragging: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    count: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    index: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    selectionMode: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    selectionBehavior: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDragging: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDropTarget: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isExpanded: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFirstChild: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isGroup: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isHovered: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isLastChild: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isSelected: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isViewable: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const treeClassNames: TreeClassNames;

package/dist/components/tree/tree.d.ts

@@ -0,0 +1,5 @@
+import type { TreeGroupProps, TreeItemProps, TreeProps, TreeStateContextValue } from './types';
+export declare const TreeStateContext: import("react").Context<TreeStateContextValue<any>>;
+export declare function Tree<T>(props: TreeProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function TreeGroup<T>({ id, children, nodes, types, ...rest }: TreeGroupProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function TreeItem<T>({ children: childrenProp, index, mapping: mappingProp, node, isFirstChild, isLastChild, ...rest }: TreeItemProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/components/tree/tree.js

@@ -0,0 +1,337 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { noop } from 'lodash';
+import { createContext, useMemo, useCallback, useContext } from 'react';
+import { usePress } from 'react-aria';
+import { Provider, DropIndicator, useDragAndDrop, GridList, DEFAULT_SLOT, ButtonContext as ButtonContext$1, GridListItem } from 'react-aria-components';
+import { inlineVars } from '../../utils/css.js';
+import { mergeClassNames, callRenderProps } from '../../utils/props.js';
+import { useDefaultProps } from '../../hooks/use-defaults/use-defaults.js';
+import { useTheme } from '../../hooks/use-theme/use-theme.js';
+import { useTree } from '../../hooks/use-tree/use-tree.js';
+import { bodies } from '../../styles/typography.vanilla.js';
+import { AriaTextContext } from '../aria/aria.js';
+import { ToggleButtonContext, ButtonContext, Button } from '../button/button.js';
+import { CheckboxContext } from '../checkbox/checkbox.js';
+import { GroupContext } from '../group/group.js';
+import { Icon } from '../icon/icon.js';
+import { MergeProvider } from '../merge-provider/merge-provider.js';
+import { treeClassNames, treeStateVars, treeIndicatorStateVars, treeGroupStateVars, treeItemStateVars } from './tree.vanilla.js';
+import { createDragAndDropHandlers } from './utils.js';
+
+const emptyTree = {
+  key: "",
+  parentKey: "",
+  children: [],
+  value: { id: "", label: "" }
+};
+const defaultMapping = {
+  actions: {
+    sm: {},
+    lg: {}
+  },
+  button: {
+    sm: { size: "sm", variant: "icon" },
+    lg: { size: "md", variant: "icon" }
+  },
+  description: {
+    sm: bodies.sm,
+    lg: bodies.md
+  },
+  drag: {
+    sm: {},
+    lg: {}
+  },
+  expansion: {
+    sm: {},
+    lg: {}
+  },
+  visibility: {
+    sm: {},
+    lg: {}
+  }
+};
+const defaultSize = "lg";
+const TreeStateContext = createContext({
+  allowsDragging: true,
+  allowsExpansion: true,
+  allowsVisibility: false,
+  lookup: {},
+  selectedKeys: /* @__PURE__ */ new Set(),
+  selectionMode: "none",
+  tree: emptyTree,
+  actions: {
+    append: noop,
+    getItem: () => emptyTree,
+    insert: noop,
+    insertAfter: noop,
+    insertBefore: noop,
+    move: noop,
+    prepend: noop,
+    remove: noop,
+    removeSelectedItems: noop,
+    revertIsExpanded: noop,
+    setSelectedKeys: noop,
+    toggleIsExpanded: noop,
+    toggleIsSelected: noop,
+    toggleIsViewable: noop,
+    update: noop
+  }
+});
+function defaultRenderEmptyState({ isDropTarget }) {
+  return isDropTarget ? "Add to this group" : "Nothing to see here";
+}
+function Tree(props) {
+  props = useDefaultProps(props, "Tree");
+  const { children: childrenProp, allowsDragging = false, allowsExpansion = true, allowsVisibility = false, classNames: classNamesProps, disabledBehavior = "all", keyboardNavigationBehavior = "arrow", mapping: mappingProp, nodes, provider, renderDragPreview, renderEmptyState: renderEmptyStateProp = defaultRenderEmptyState, selectionBehavior = "replace", selectionMode = "none", showTreeLines = true, size = defaultSize, onAction, onScroll, onSelectionChange, onUpdate, ...rest } = props;
+  const state = useTree({
+    allowsExpansion,
+    allowsVisibility,
+    nodes,
+    selectionMode,
+    onSelectionChange,
+    onUpdate
+  });
+  const theme = useTheme();
+  const mapping = useMemo(() => ({
+    ...defaultMapping,
+    ...mappingProp
+  }), [mappingProp]);
+  const classNames = useMemo(() => mergeClassNames(treeClassNames, theme.Tree, classNamesProps, {
+    item: {
+      description: mapping.description[size]
+    }
+  }) ?? {}, [theme.Tree, classNamesProps, mapping, size]);
+  const renderEmptyState = useCallback((renderProps) => jsx("div", { className: classNames?.empty, children: renderEmptyStateProp(renderProps) }), [classNames?.empty, renderEmptyStateProp]);
+  const context = useMemo(() => [
+    [
+      TreeStateContext,
+      {
+        ...state,
+        allowsDragging,
+        classNames,
+        disabledBehavior,
+        keyboardNavigationBehavior,
+        renderDragPreview,
+        renderEmptyState,
+        selectionBehavior,
+        selectionMode,
+        showTreeLines,
+        size,
+        onAction,
+        onScroll
+      }
+    ]
+  ], [
+    state,
+    allowsDragging,
+    classNames,
+    disabledBehavior,
+    keyboardNavigationBehavior,
+    renderDragPreview,
+    renderEmptyState,
+    selectionBehavior,
+    selectionMode,
+    showTreeLines,
+    size,
+    onAction,
+    onScroll
+  ]);
+  const style = useMemo(() => inlineVars(treeStateVars, {
+    allowsDragging,
+    allowsExpansion: state.allowsExpansion,
+    allowsVisibility: state.allowsVisibility,
+    showTreeLines,
+    size
+  }), [
+    allowsDragging,
+    state.allowsExpansion,
+    state.allowsVisibility,
+    showTreeLines,
+    size
+  ]);
+  const children = useMemo(() => {
+    const treeGroupProps = {
+      ...rest,
+      id: state.tree.key,
+      nodes: state.tree.children
+    };
+    return provider ? callRenderProps(childrenProp, { ...state, treeGroupProps }) : jsx(TreeGroup, { ...treeGroupProps, children: childrenProp });
+  }, [rest, provider, childrenProp, state]);
+  return jsx(Provider, { values: context, children: jsx("div", { className: classNames?.tree?.container, style, children: jsx("div", { className: classNames?.tree?.tree, children }) }) });
+}
+function TreeGroup({ id, children, nodes, types = ["all"], ...rest }) {
+  const { actions, allowsDragging, classNames, disabledBehavior, keyboardNavigationBehavior, lookup, renderDragPreview, renderEmptyState, selectedKeys, selectionBehavior, selectionMode, onAction, onScroll } = useContext(TreeStateContext);
+  const acceptedDragTypes = useMemo(() => types.map((type) => `tree-${type}`), [types]);
+  const renderDropIndicator = useCallback((target) => jsx(DropIndicator, {
+    className: classNames?.indicator?.container,
+    // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop, react/jsx-no-bind
+    style: (renderProps) => inlineVars(treeIndicatorStateVars, {
+      ...renderProps,
+      dropPosition: "dropPosition" in target ? target.dropPosition : "root"
+    }),
+    target,
+    children: jsx("div", { className: classNames?.indicator?.indicator })
+  }), [classNames?.indicator?.container, classNames?.indicator?.indicator]);
+  const { dragAndDropHooks } = useDragAndDrop({
+    isDisabled: !allowsDragging,
+    renderDragPreview,
+    renderDropIndicator,
+    ...createDragAndDropHandlers(id, acceptedDragTypes, lookup, actions)
+  });
+  const style = useCallback((renderProps) => inlineVars(treeGroupStateVars, { ...renderProps, count: nodes.length }), [nodes.length]);
+  const indices = useMemo(() => nodes.reduce((acc, node, index) => {
+    acc[node.key] = index;
+    return acc;
+  }, {}), [nodes]);
+  return jsx(GridList, { ...rest, className: classNames?.group, disabledBehavior, dragAndDropHooks, items: nodes, keyboardNavigationBehavior, renderEmptyState, selectedKeys, selectionBehavior, selectionMode, style, onAction, onScroll, children: (item) => jsx(TreeItem, { index: indices[item.key] ?? -1, node: item, isFirstChild: indices[item.key] === 0, isLastChild: indices[item.key] === nodes.length - 1, children }) });
+}
+const contextBlocker = [
+  [ToggleButtonContext, null],
+  [AriaTextContext, null],
+  [GroupContext, null],
+  [CheckboxContext, null],
+  [ButtonContext, null],
+  [ButtonContext$1, null]
+];
+function TreeItem({ children: childrenProp, index, mapping: mappingProp, node, isFirstChild, isLastChild, ...rest }) {
+  const { actions, allowsExpansion, classNames, size: sizeProp } = useContext(TreeStateContext);
+  const mapping = useMemo(() => ({
+    ...defaultMapping,
+    ...mappingProp
+  }), [mappingProp]);
+  const selection = useMemo(() => /* @__PURE__ */ new Set([node.key]), [node.key]);
+  const handleToggleExpansion = useCallback(() => actions.toggleIsExpanded(selection), [actions, selection]);
+  const handleToggleSelection = useCallback(() => actions.toggleIsSelected(selection), [actions, selection]);
+  const handleToggleVisibility = useCallback(() => actions.toggleIsViewable(selection), [actions, selection]);
+  const { pressProps } = usePress({
+    onPress: handleToggleExpansion
+  });
+  const style = useCallback((renderProps) => inlineVars(treeItemStateVars, {
+    ...renderProps,
+    count: node.children.length,
+    index,
+    isExpanded: "nodes" in node.value ? !!node.value.isExpanded : false,
+    isFirstChild,
+    isGroup: "nodes" in node.value,
+    isLastChild,
+    isViewable: !!node.value.isViewable,
+    isVisible: !!node.value.isVisible
+  }), [node.children.length, node.value, index, isFirstChild, isLastChild]);
+  const context = useMemo(() => {
+    const size = sizeProp ?? defaultSize;
+    const buttonProps = mapping.button[size] ?? {};
+    return [
+      [
+        ToggleButtonContext,
+        {
+          slots: {
+            [DEFAULT_SLOT]: buttonProps,
+            expansion: {
+              ...buttonProps,
+              ...mapping.expansion[size],
+              classNames: classNames?.item?.expansion,
+              isSelected: "nodes" in node.value ? !!node.value.isExpanded : void 0,
+              onPress: handleToggleExpansion
+            },
+            visibility: {
+              ...buttonProps,
+              ...mapping.visibility[size],
+              classNames: classNames?.item?.visibility,
+              isSelected: !!node.value.isViewable,
+              onPress: handleToggleVisibility
+            }
+          }
+        }
+      ],
+      [
+        AriaTextContext,
+        {
+          slots: {
+            [DEFAULT_SLOT]: {},
+            description: {
+              ..."nodes" in node.value ? pressProps : {},
+              className: classNames?.item?.description,
+              children: node.value.label
+            }
+          }
+        }
+      ],
+      [
+        GroupContext,
+        {
+          slots: {
+            [DEFAULT_SLOT]: {},
+            actions: {
+              classNames: classNames?.item?.actions,
+              context: ButtonContext,
+              values: buttonProps
+            }
+          }
+        }
+      ],
+      [
+        CheckboxContext,
+        {
+          slots: {
+            [DEFAULT_SLOT]: {},
+            selection: {
+              classNames: classNames?.item?.selection,
+              onChange: handleToggleSelection
+            }
+          }
+        }
+      ],
+      [
+        ButtonContext,
+        {
+          slots: {
+            [DEFAULT_SLOT]: buttonProps,
+            drag: {
+              ...buttonProps,
+              ...mapping.drag[size],
+              classNames: classNames?.item?.drag
+            },
+            // We use a non-interactive Button for the lines to try and simplify the
+            // consistent use of space when rendered in alignment with other Buttons
+            lines: {
+              ...buttonProps,
+              classNames: classNames?.item?.lines,
+              isDisabled: true
+            }
+          }
+        }
+      ],
+      // Need to expand the RAC ButtonContext to allow for additional slots
+      [ButtonContext$1, { slots: { [DEFAULT_SLOT]: {}, lines: {} } }]
+    ];
+  }, [
+    classNames?.item?.lines,
+    classNames?.item?.expansion,
+    classNames?.item?.visibility,
+    classNames?.item?.description,
+    classNames?.item?.actions,
+    classNames?.item?.selection,
+    classNames?.item?.drag,
+    mapping,
+    node,
+    pressProps,
+    sizeProp,
+    handleToggleExpansion,
+    handleToggleSelection,
+    handleToggleVisibility
+  ]);
+  const children = useCallback((renderProps) => jsx(MergeProvider, { values: context, children: jsxs("div", { className: classNames?.item?.item, children: [node.parentKey && jsx(Button, { slot: "lines", children: jsx(Icon, {}) }), jsx("div", { className: classNames?.item?.bar, children: callRenderProps(childrenProp, {
+    ...renderProps,
+    node
+  }) }), "nodes" in node.value && (!allowsExpansion || node.value.isExpanded) && jsx(Provider, { values: contextBlocker, children: jsx(TreeGroup, { id: node.key, nodes: node.children, types: node.value.types, "aria-label": node.value.label, children: childrenProp }) })] }) }), [
+    context,
+    classNames?.item?.item,
+    classNames?.item?.bar,
+    node,
+    childrenProp,
+    allowsExpansion
+  ]);
+  return jsx(GridListItem, { ...rest, className: classNames?.item?.container, style, textValue: node.value.label, children });
+}
+
+export { Tree, TreeGroup, TreeItem, TreeStateContext };

package/dist/components/tree/tree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree.js","sources":["../../../src/components/tree/tree.tsx"],"sourcesContent":["import { noop } from 'lodash';\nimport { createContext, useCallback, useContext, useMemo } from 'react';\nimport { usePress, type Key } from 'react-aria';\nimport {\n  DEFAULT_SLOT,\n  DropIndicator,\n  GridList,\n  GridListItem,\n  Provider,\n  ButtonContext as RACButtonContext,\n  useDragAndDrop,\n  type ContextValue,\n  type DropTarget,\n  type GridListItemRenderProps,\n  type GridListRenderProps,\n  type ButtonProps as RACButtonProps,\n  type TextProps,\n} from 'react-aria-components';\nimport { useDefaultProps, useTheme, useTree } from '../../hooks';\nimport { bodies } from '../../styles';\nimport { callRenderProps, inlineVars, mergeClassNames } from '../../utils';\nimport { AriaTextContext } from '../aria';\nimport {\n  Button,\n  ButtonContext,\n  ToggleButtonContext,\n  type ButtonProps,\n  type ToggleButtonProps,\n} from '../button';\nimport { CheckboxContext, type CheckboxProps } from '../checkbox';\nimport { GroupContext, type GroupProps } from '../group';\nimport { Icon } from '../icon';\nimport { MergeProvider } from '../merge-provider';\nimport {\n  treeClassNames,\n  treeGroupStateVars,\n  treeIndicatorStateVars,\n  treeItemStateVars,\n  treeStateVars,\n} from './tree.css';\nimport type {\n  TreeGroupProps,\n  TreeIndicatorRenderProps,\n  TreeItemProps,\n  TreeMapping,\n  TreeProps,\n  TreeStateContextValue,\n} from './types';\nimport { createDragAndDropHandlers } from './utils';\n\nconst emptyTree = {\n  key: '',\n  parentKey: '',\n  children: [],\n  value: { id: '', label: '' },\n};\n\nconst defaultMapping: TreeMapping = {\n  actions: {\n    sm: {},\n    lg: {},\n  },\n  button: {\n    sm: { size: 'sm', variant: 'icon' },\n    lg: { size: 'md', variant: 'icon' },\n  },\n  description: {\n    sm: bodies.sm,\n    lg: bodies.md,\n  },\n  drag: {\n    sm: {},\n    lg: {},\n  },\n  expansion: {\n    sm: {},\n    lg: {},\n  },\n  visibility: {\n    sm: {},\n    lg: {},\n  },\n};\n\nconst defaultSize = 'lg';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const TreeStateContext = createContext<TreeStateContextValue<any>>({\n  allowsDragging: true,\n  allowsExpansion: true,\n  allowsVisibility: false,\n  lookup: {},\n  selectedKeys: new Set(),\n  selectionMode: 'none',\n  tree: emptyTree,\n  actions: {\n    append: noop,\n    getItem: () => emptyTree,\n    insert: noop,\n    insertAfter: noop,\n    insertBefore: noop,\n    move: noop,\n    prepend: noop,\n    remove: noop,\n    removeSelectedItems: noop,\n    revertIsExpanded: noop,\n    setSelectedKeys: noop,\n    toggleIsExpanded: noop,\n    toggleIsSelected: noop,\n    toggleIsViewable: noop,\n    update: noop,\n  },\n});\n\nfunction defaultRenderEmptyState({ isDropTarget }: GridListRenderProps) {\n  return isDropTarget ? 'Add to this group' : 'Nothing to see here';\n}\n\nexport function Tree<T>(props: TreeProps<T>) {\n  props = useDefaultProps(props as TreeProps<unknown>, 'Tree') as TreeProps<T>;\n\n  const {\n    children: childrenProp,\n    allowsDragging = false,\n    allowsExpansion = true,\n    allowsVisibility = false,\n    classNames: classNamesProps,\n    disabledBehavior = 'all',\n    keyboardNavigationBehavior = 'arrow',\n    mapping: mappingProp,\n    nodes,\n    provider,\n    renderDragPreview,\n    renderEmptyState: renderEmptyStateProp = defaultRenderEmptyState,\n    selectionBehavior = 'replace',\n    selectionMode = 'none',\n    showTreeLines = true,\n    size = defaultSize,\n    onAction,\n    onScroll,\n    onSelectionChange,\n    onUpdate,\n    ...rest\n  } = props;\n\n  const state = useTree({\n    allowsExpansion,\n    allowsVisibility,\n    nodes,\n    selectionMode,\n    onSelectionChange,\n    onUpdate,\n  });\n\n  const theme = useTheme();\n\n  const mapping = useMemo(\n    () => ({\n      ...defaultMapping,\n      ...mappingProp,\n    }),\n    [mappingProp],\n  );\n\n  const classNames = useMemo(\n    () =>\n      mergeClassNames(treeClassNames, theme.Tree, classNamesProps, {\n        item: {\n          description: mapping.description[size],\n        },\n      }) ?? {},\n    [theme.Tree, classNamesProps, mapping, size],\n  );\n\n  const renderEmptyState = useCallback(\n    (renderProps: GridListRenderProps) => (\n      <div className={classNames?.empty}>\n        {renderEmptyStateProp(renderProps)}\n      </div>\n    ),\n    [classNames?.empty, renderEmptyStateProp],\n  );\n\n  const context = useMemo<\n    [[typeof TreeStateContext, TreeStateContextValue<T>]]\n  >(\n    () => [\n      [\n        TreeStateContext,\n        {\n          ...state,\n          allowsDragging,\n          classNames,\n          disabledBehavior,\n          keyboardNavigationBehavior,\n          renderDragPreview,\n          renderEmptyState,\n          selectionBehavior,\n          selectionMode,\n          showTreeLines,\n          size,\n          onAction,\n          onScroll,\n        },\n      ],\n    ],\n    [\n      state,\n      allowsDragging,\n      classNames,\n      disabledBehavior,\n      keyboardNavigationBehavior,\n      renderDragPreview,\n      renderEmptyState,\n      selectionBehavior,\n      selectionMode,\n      showTreeLines,\n      size,\n      onAction,\n      onScroll,\n    ],\n  );\n\n  const style = useMemo(\n    () =>\n      inlineVars(treeStateVars, {\n        allowsDragging,\n        allowsExpansion: state.allowsExpansion,\n        allowsVisibility: state.allowsVisibility,\n        showTreeLines,\n        size,\n      }),\n    [\n      allowsDragging,\n      state.allowsExpansion,\n      state.allowsVisibility,\n      showTreeLines,\n      size,\n    ],\n  );\n\n  const children = useMemo(() => {\n    const treeGroupProps = {\n      ...rest,\n      id: state.tree.key,\n      nodes: state.tree.children,\n    };\n\n    return provider ? (\n      callRenderProps(childrenProp, { ...state, treeGroupProps })\n    ) : (\n      <TreeGroup {...treeGroupProps}>{childrenProp}</TreeGroup>\n    );\n  }, [rest, provider, childrenProp, state]);\n\n  return (\n    <Provider values={context}>\n      <div className={classNames?.tree?.container} style={style}>\n        <div className={classNames?.tree?.tree}>{children}</div>\n      </div>\n    </Provider>\n  );\n}\n\nexport function TreeGroup<T>({\n  id,\n  children,\n  nodes,\n  types = ['all'],\n  ...rest\n}: TreeGroupProps<T>) {\n  const {\n    actions,\n    allowsDragging,\n    classNames,\n    disabledBehavior,\n    keyboardNavigationBehavior,\n    lookup,\n    renderDragPreview,\n    renderEmptyState,\n    selectedKeys,\n    selectionBehavior,\n    selectionMode,\n    onAction,\n    onScroll,\n  } = useContext(TreeStateContext);\n\n  const acceptedDragTypes = useMemo(\n    () => types.map((type) => `tree-${type}`),\n    [types],\n  );\n\n  // This function cannot be treated as a component and will throw errors if implemented as one (with hooks)\n  const renderDropIndicator = useCallback(\n    (target: DropTarget) => (\n      <DropIndicator\n        className={classNames?.indicator?.container}\n        // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop, react/jsx-no-bind\n        style={(renderProps: TreeIndicatorRenderProps) =>\n          inlineVars(treeIndicatorStateVars, {\n            ...renderProps,\n            dropPosition:\n              'dropPosition' in target ? target.dropPosition : 'root',\n          })\n        }\n        target={target}\n      >\n        <div className={classNames?.indicator?.indicator} />\n      </DropIndicator>\n    ),\n    [classNames?.indicator?.container, classNames?.indicator?.indicator],\n  );\n\n  const { dragAndDropHooks } = useDragAndDrop({\n    isDisabled: !allowsDragging,\n    renderDragPreview,\n    renderDropIndicator,\n    ...createDragAndDropHandlers(id, acceptedDragTypes, lookup, actions),\n  });\n\n  const style = useCallback(\n    (renderProps: GridListRenderProps) =>\n      inlineVars(treeGroupStateVars, { ...renderProps, count: nodes.length }),\n    [nodes.length],\n  );\n\n  const indices = useMemo(\n    () =>\n      nodes.reduce<Record<Key, number>>((acc, node, index) => {\n        acc[node.key] = index;\n\n        return acc;\n      }, {}),\n    [nodes],\n  );\n\n  return (\n    <GridList\n      {...rest}\n      className={classNames?.group}\n      disabledBehavior={disabledBehavior}\n      dragAndDropHooks={dragAndDropHooks}\n      items={nodes}\n      keyboardNavigationBehavior={keyboardNavigationBehavior}\n      renderEmptyState={renderEmptyState}\n      selectedKeys={selectedKeys}\n      selectionBehavior={selectionBehavior}\n      selectionMode={selectionMode}\n      style={style}\n      onAction={onAction}\n      onScroll={onScroll}\n    >\n      {(item) => (\n        <TreeItem\n          index={indices[item.key] ?? -1}\n          node={item}\n          isFirstChild={indices[item.key] === 0}\n          isLastChild={indices[item.key] === nodes.length - 1}\n        >\n          {children}\n        </TreeItem>\n      )}\n    </GridList>\n  );\n}\n\ntype TreeItemContexts = [\n  [\n    typeof ToggleButtonContext,\n    ContextValue<ToggleButtonProps, HTMLButtonElement>,\n  ],\n  [typeof AriaTextContext, ContextValue<TextProps, HTMLSpanElement>],\n  [\n    typeof GroupContext,\n    ContextValue<GroupProps<ButtonProps, HTMLButtonElement>, HTMLDivElement>,\n  ],\n  [typeof CheckboxContext, ContextValue<CheckboxProps, HTMLLabelElement>],\n  [typeof ButtonContext, ContextValue<ButtonProps, HTMLButtonElement>],\n  [typeof RACButtonContext, ContextValue<RACButtonProps, HTMLButtonElement>],\n];\n\nconst contextBlocker: TreeItemContexts = [\n  [ToggleButtonContext, null],\n  [AriaTextContext, null],\n  [GroupContext, null],\n  [CheckboxContext, null],\n  [ButtonContext, null],\n  [RACButtonContext, null],\n];\n\nexport function TreeItem<T>({\n  children: childrenProp,\n  index,\n  mapping: mappingProp,\n  node,\n  isFirstChild,\n  isLastChild,\n  ...rest\n}: TreeItemProps<T>) {\n  const {\n    actions,\n    allowsExpansion,\n    classNames,\n    size: sizeProp,\n  } = useContext(TreeStateContext);\n\n  const mapping = useMemo(\n    () => ({\n      ...defaultMapping,\n      ...mappingProp,\n    }),\n    [mappingProp],\n  );\n\n  const selection = useMemo(() => new Set([node.key]), [node.key]);\n\n  const handleToggleExpansion = useCallback(\n    () => actions.toggleIsExpanded(selection),\n    [actions, selection],\n  );\n\n  const handleToggleSelection = useCallback(\n    () => actions.toggleIsSelected(selection),\n    [actions, selection],\n  );\n\n  const handleToggleVisibility = useCallback(\n    () => actions.toggleIsViewable(selection),\n    [actions, selection],\n  );\n\n  const { pressProps } = usePress({\n    onPress: handleToggleExpansion,\n  });\n\n  const style = useCallback(\n    (renderProps: GridListItemRenderProps) =>\n      inlineVars(treeItemStateVars, {\n        ...renderProps,\n        count: node.children.length,\n        index,\n        isExpanded: 'nodes' in node.value ? !!node.value.isExpanded : false,\n        isFirstChild,\n        isGroup: 'nodes' in node.value,\n        isLastChild,\n        isViewable: !!node.value.isViewable,\n        isVisible: !!node.value.isVisible,\n      }),\n    [node.children.length, node.value, index, isFirstChild, isLastChild],\n  );\n\n  const context = useMemo<TreeItemContexts>(() => {\n    const size = sizeProp ?? defaultSize;\n    const buttonProps = mapping.button[size] ?? {};\n\n    return [\n      [\n        ToggleButtonContext,\n        {\n          slots: {\n            [DEFAULT_SLOT]: buttonProps,\n            expansion: {\n              ...buttonProps,\n              ...mapping.expansion[size],\n              classNames: classNames?.item?.expansion,\n              isSelected:\n                'nodes' in node.value ? !!node.value.isExpanded : undefined,\n              onPress: handleToggleExpansion,\n            },\n            visibility: {\n              ...buttonProps,\n              ...mapping.visibility[size],\n              classNames: classNames?.item?.visibility,\n              isSelected: !!node.value.isViewable,\n              onPress: handleToggleVisibility,\n            },\n          },\n        },\n      ],\n      [\n        AriaTextContext,\n        {\n          slots: {\n            [DEFAULT_SLOT]: {},\n            description: {\n              ...('nodes' in node.value ? pressProps : {}),\n              className: classNames?.item?.description,\n              children: node.value.label,\n            },\n          },\n        },\n      ],\n      [\n        GroupContext,\n        {\n          slots: {\n            [DEFAULT_SLOT]: {},\n            actions: {\n              classNames: classNames?.item?.actions,\n              context: ButtonContext,\n              values: buttonProps,\n            },\n          },\n        },\n      ],\n      [\n        CheckboxContext,\n        {\n          slots: {\n            [DEFAULT_SLOT]: {},\n            selection: {\n              classNames: classNames?.item?.selection,\n              onChange: handleToggleSelection,\n            },\n          },\n        },\n      ],\n      [\n        ButtonContext,\n        {\n          slots: {\n            [DEFAULT_SLOT]: buttonProps,\n            drag: {\n              ...buttonProps,\n              ...mapping.drag[size],\n              classNames: classNames?.item?.drag,\n            },\n            // We use a non-interactive Button for the lines to try and simplify the\n            // consistent use of space when rendered in alignment with other Buttons\n            lines: {\n              ...buttonProps,\n              classNames: classNames?.item?.lines,\n              isDisabled: true,\n            },\n          },\n        },\n      ],\n      // Need to expand the RAC ButtonContext to allow for additional slots\n      [RACButtonContext, { slots: { [DEFAULT_SLOT]: {}, lines: {} } }],\n    ];\n  }, [\n    classNames?.item?.lines,\n    classNames?.item?.expansion,\n    classNames?.item?.visibility,\n    classNames?.item?.description,\n    classNames?.item?.actions,\n    classNames?.item?.selection,\n    classNames?.item?.drag,\n    mapping,\n    node,\n    pressProps,\n    sizeProp,\n    handleToggleExpansion,\n    handleToggleSelection,\n    handleToggleVisibility,\n  ]);\n\n  /**\n   * We need to block the above contexts from being passed into the TreeGroup\n   * so that each TreeItem has a distinct context. We only use MergeProvider\n   * for the above contexts because the GridListItem provides contexts that\n   * we need to merge with\n   */\n  const children = useCallback(\n    (renderProps: GridListItemRenderProps) => (\n      <MergeProvider values={context}>\n        <div className={classNames?.item?.item}>\n          {node.parentKey && (\n            <Button slot='lines'>\n              <Icon />\n            </Button>\n          )}\n          <div className={classNames?.item?.bar}>\n            {callRenderProps(childrenProp, {\n              ...renderProps,\n              node,\n            })}\n          </div>\n          {'nodes' in node.value &&\n            (!allowsExpansion || node.value.isExpanded) && (\n              <Provider values={contextBlocker}>\n                <TreeGroup\n                  id={node.key}\n                  nodes={node.children}\n                  types={node.value.types}\n                  aria-label={node.value.label}\n                >\n                  {childrenProp}\n                </TreeGroup>\n              </Provider>\n            )}\n        </div>\n      </MergeProvider>\n    ),\n    [\n      context,\n      classNames?.item?.item,\n      classNames?.item?.bar,\n      node,\n      childrenProp,\n      allowsExpansion,\n    ],\n  );\n\n  return (\n    <GridListItem\n      {...rest}\n      className={classNames?.item?.container}\n      style={style}\n      textValue={node.value.label}\n    >\n      {children}\n    </GridListItem>\n  );\n}\n"],"names":["RACButtonContext"],"mappings":"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"}