@atom-learning/components 9.0.0-beta.5 → 10.0.0

package/dist/components/top-bar/TopBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopBar.js","names":[],"sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, Theme } from '../../styled'\nimport { useWindowScrollPosition } from '../../utilities/hooks/useWindowScrollPosition'\nimport { Divider } from '../divider/Divider'\nimport { colorSchemes as topBarColorSchemes } from './TopBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" className=\"bg-divider h-6\" />\n)\n\nconst StyledRoot = styled(\n  'header',\n  {\n    base: [\n      'bg-(--background)',\n      'sticky',\n      'flex',\n      'items-center',\n      'z-15',\n      'transition-shadow',\n      'duration-200',\n      'ease-out'\n    ],\n    variants: {\n      hasScrolled: {\n        true: ['shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]']\n      },\n      size: {\n        md: ['h-16'],\n        lg: ['h-24']\n      },\n      diffused: {\n        true: [\n          'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n          'supports-color-mix:backdrop-blur-sm'\n        ]\n      },\n      appearance: {\n        standard: [\n          'w-screen',\n          'max-w-full',\n          'top-0',\n          'border-b',\n          'border-b-(--border-bottom)'\n        ],\n        rounded: [\n          'w-full',\n          'top-2',\n          'p-2',\n          'border',\n          'border-white',\n          'rounded-full'\n        ]\n      }\n    }\n  },\n  {\n    enableResponsiveVariants: true\n  }\n)\n\nconst Container = styled('div', {\n  base: ['flex', 'items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype TopBarProps = React.ComponentProps<typeof StyledRoot> &\n  React.ComponentProps<typeof Container> &\n  React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  theme,\n  appearance = 'standard',\n  ...rest\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <Theme theme={theme || topBarColorSchemes['light']}>\n      <StyledRoot\n        hasScrolled={!!scrollPositionY}\n        diffused={diffused}\n        appearance={appearance}\n        size={size}\n      >\n        <Container {...rest} />\n      </StyledRoot>\n    </Theme>\n  )\n}\n\nexport const TopBar = /* @__PURE__ */ Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"mappings":";;;;;;;;;AASA,IAAM,sBACJ,oBAAC,SAAD;CAAS,aAAY;CAAW,WAAU;AAAkB,CAAA;AAG9D,IAAM,aAAa,OACjB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,aAAa,EACX,MAAM,CAAC,8CAA8C,EACvD;EACA,MAAM;GACJ,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,MAAM;EACb;EACA,UAAU,EACR,MAAM,CACJ,wEACA,qCACF,EACF;EACA,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;GACF;GACA,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;GACF;EACF;CACF;AACF,GACA,EACE,0BAA0B,KAC5B,CACF;AAEA,IAAM,YAAY,OAAO,OAAO,EAC9B,MAAM;CAAC;CAAQ;CAAgB;CAAQ;CAAQ;CAAU;AAAS,EACpE,CAAC;AAMD,IAAM,mBAAmB,EACvB,OAAO,MACP,UACA,OACA,aAAa,YACb,GAAG,WACuC;CAC1C,MAAM,EAAE,GAAG,oBAAoB,wBAAwB;CAEvD,OACE,oBAAC,OAAD;EAAO,OAAO,SAAS,aAAmB;YACxC,oBAAC,YAAD;GACE,aAAa,CAAC,CAAC;GACL;GACE;GACN;aAEN,oBAAC,WAAD,EAAW,GAAI,KAAO,CAAA;EACZ,CAAA;CACP,CAAA;AAEX;AAEA,IAAa,SAAyB,uBAAO,OAAO,iBAAiB;CACnE,OAAO;CACP,WAAW;CACX,WAAW;CACX,YAAY;CACZ,SAAS;AACX,CAAC;AAED,gBAAgB,cAAc"}
+{"version":3,"file":"TopBar.js","names":[],"sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, Theme } from '../../styled'\nimport { useWindowScrollPosition } from '../../utilities/hooks/useWindowScrollPosition'\nimport { Divider } from '../divider/Divider'\nimport { colorSchemes as topBarColorSchemes } from './TopBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" className=\"bg-divider h-6\" />\n)\n\nconst StyledRoot = styled(\n  'header',\n  {\n    base: [\n      'bg-(--background)',\n      'sticky',\n      'flex',\n      'items-center',\n      'z-15',\n      'transition-shadow',\n      'duration-200',\n      'ease-out'\n    ],\n    variants: {\n      hasScrolled: {\n        true: ['shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]']\n      },\n      size: {\n        md: ['h-safe-offset-top-16', 'pt-safe'],\n        lg: ['h-safe-offset-top-24', 'pt-safe']\n      },\n      diffused: {\n        true: [\n          'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n          'supports-color-mix:backdrop-blur-sm'\n        ]\n      },\n      appearance: {\n        standard: [\n          'w-screen',\n          'max-w-full',\n          'top-safe',\n          'border-b',\n          'border-b-(--border-bottom)'\n        ],\n        rounded: [\n          'w-full',\n          'top-safe-offset-2',\n          'p-2',\n          'border',\n          'border-white',\n          'rounded-full'\n        ]\n      }\n    }\n  },\n  {\n    enableResponsiveVariants: true\n  }\n)\n\nconst Container = styled('div', {\n  base: ['flex', 'items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype TopBarProps = React.ComponentProps<typeof StyledRoot> &\n  React.ComponentProps<typeof Container> &\n  React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  theme,\n  appearance = 'standard',\n  ...rest\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <Theme theme={theme || topBarColorSchemes['light']}>\n      <StyledRoot\n        hasScrolled={!!scrollPositionY}\n        diffused={diffused}\n        appearance={appearance}\n        size={size}\n      >\n        <Container {...rest} />\n      </StyledRoot>\n    </Theme>\n  )\n}\n\nexport const TopBar = /* @__PURE__ */ Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"mappings":";;;;;;;;;AASA,IAAM,sBACJ,oBAAC,SAAD;CAAS,aAAY;CAAW,WAAU;AAAkB,CAAA;AAG9D,IAAM,aAAa,OACjB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,aAAa,EACX,MAAM,CAAC,8CAA8C,EACvD;EACA,MAAM;GACJ,IAAI,CAAC,wBAAwB,SAAS;GACtC,IAAI,CAAC,wBAAwB,SAAS;EACxC;EACA,UAAU,EACR,MAAM,CACJ,wEACA,qCACF,EACF;EACA,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;GACF;GACA,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;GACF;EACF;CACF;AACF,GACA,EACE,0BAA0B,KAC5B,CACF;AAEA,IAAM,YAAY,OAAO,OAAO,EAC9B,MAAM;CAAC;CAAQ;CAAgB;CAAQ;CAAQ;CAAU;AAAS,EACpE,CAAC;AAMD,IAAM,mBAAmB,EACvB,OAAO,MACP,UACA,OACA,aAAa,YACb,GAAG,WACuC;CAC1C,MAAM,EAAE,GAAG,oBAAoB,wBAAwB;CAEvD,OACE,oBAAC,OAAD;EAAO,OAAO,SAAS,aAAmB;YACxC,oBAAC,YAAD;GACE,aAAa,CAAC,CAAC;GACL;GACE;GACN;aAEN,oBAAC,WAAD,EAAW,GAAI,KAAO,CAAA;EACZ,CAAA;CACP,CAAA;AAEX;AAEA,IAAa,SAAyB,uBAAO,OAAO,iBAAiB;CACnE,OAAO;CACP,WAAW;CACX,WAAW;CACX,YAAY;CACZ,SAAS;AACX,CAAC;AAED,gBAAgB,cAAc"}

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

@@ -1,8 +1,8 @@
 import { Root } from '@radix-ui/react-collapsible';
 import * as React from 'react';
 type TreeCollapsibleContextValue = {
-    triggerRef?: React.MutableRefObject<HTMLElement | null>;
-    setTriggerRef?: (HTMLElement: any) => void;
+    triggerRef?: React.RefObject<HTMLElement | null>;
+    setTriggerRef?: (el: HTMLElement | null) => void | (() => void);
 };
 export declare const TreeCollapsibleContext: React.Context<TreeCollapsibleContextValue>;
 declare const StyledCollapsibleTreeItemRoot: import("../..").PolymorphicComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-collapsible").CollapsibleProps & React.RefAttributes<HTMLDivElement>>, unknown>;

package/dist/components/tree/TreeCollapsible.js

@@ -8,11 +8,11 @@ import { Root } from "@radix-ui/react-collapsible";
 var TreeCollapsibleContext = React$1.createContext({});
 var TreeCollapsibleProvider = ({ children }) => {
 	const [triggerRef, setTriggerRef] = useCallbackRef();
-	return /* @__PURE__ */ jsx(TreeCollapsibleContext.Provider, {
-		value: {
+	return /* @__PURE__ */ jsx(TreeCollapsibleContext, {
+		value: React$1.useMemo(() => ({
 			triggerRef,
 			setTriggerRef
-		},
+		}), [triggerRef, setTriggerRef]),
 		children
 	});
 };

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

@@ -1 +1 @@
-{"version":3,"file":"TreeCollapsible.js","names":[],"sources":["../../../src/components/tree/TreeCollapsible.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { useCallbackRef } from '../../utilities/hooks/useCallbackRef'\nimport { TreeListItem } from './TreeListItem'\n\ntype TreeCollapsibleContextValue = {\n  triggerRef?: React.MutableRefObject<HTMLElement | null>\n  setTriggerRef?: (HTMLElement) => void\n}\nexport const TreeCollapsibleContext =\n  React.createContext<TreeCollapsibleContextValue>({})\nconst TreeCollapsibleProvider = ({ children }) => {\n  const [triggerRef, setTriggerRef] = useCallbackRef()\n  return (\n    <TreeCollapsibleContext.Provider value={{ triggerRef, setTriggerRef }}>\n      {children}\n    </TreeCollapsibleContext.Provider>\n  )\n}\n\nconst StyledCollapsibleTreeItemRoot = /* @__PURE__ */ styled(Root, {\n  base: ['w-full']\n})\n\ntype TreeCollapsibleProps = React.ComponentProps<typeof Root> &\n  React.ComponentProps<typeof StyledCollapsibleTreeItemRoot>\nexport const TreeCollapsible = ({\n  ref,\n  ...props\n}: TreeCollapsibleProps & {\n  ref?: React.Ref<HTMLLIElement>\n}) => (\n  <TreeListItem ref={ref}>\n    <TreeCollapsibleProvider>\n      <StyledCollapsibleTreeItemRoot {...props} />\n    </TreeCollapsibleProvider>\n  </TreeListItem>\n)\n"],"mappings":";;;;;;;AAWA,IAAa,yBACX,QAAM,cAA2C,CAAC,CAAC;AACrD,IAAM,2BAA2B,EAAE,eAAe;CAChD,MAAM,CAAC,YAAY,iBAAiB,eAAe;CACnD,OACE,oBAAC,uBAAuB,UAAxB;EAAiC,OAAO;GAAE;GAAY;EAAc;EACjE;CAC8B,CAAA;AAErC;AAEA,IAAM,gCAAgD,uBAAO,MAAM,EACjE,MAAM,CAAC,QAAQ,EACjB,CAAC;AAID,IAAa,mBAAmB,EAC9B,KACA,GAAG,YAIH,oBAAC,cAAD;CAAmB;WACjB,oBAAC,yBAAD,EAAA,UACE,oBAAC,+BAAD,EAA+B,GAAI,MAAQ,CAAA,EACpB,CAAA;AACb,CAAA"}
+{"version":3,"file":"TreeCollapsible.js","names":[],"sources":["../../../src/components/tree/TreeCollapsible.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { useCallbackRef } from '../../utilities/hooks/useCallbackRef'\nimport { TreeListItem } from './TreeListItem'\n\ntype TreeCollapsibleContextValue = {\n  triggerRef?: React.RefObject<HTMLElement | null>\n  setTriggerRef?: (el: HTMLElement | null) => void | (() => void)\n}\nexport const TreeCollapsibleContext =\n  React.createContext<TreeCollapsibleContextValue>({})\nconst TreeCollapsibleProvider = ({ children }) => {\n  const [triggerRef, setTriggerRef] = useCallbackRef()\n  const value = React.useMemo(\n    () => ({ triggerRef, setTriggerRef }),\n    [triggerRef, setTriggerRef]\n  )\n  return (\n    <TreeCollapsibleContext value={value}>{children}</TreeCollapsibleContext>\n  )\n}\n\nconst StyledCollapsibleTreeItemRoot = /* @__PURE__ */ styled(Root, {\n  base: ['w-full']\n})\n\ntype TreeCollapsibleProps = React.ComponentProps<typeof Root> &\n  React.ComponentProps<typeof StyledCollapsibleTreeItemRoot>\nexport const TreeCollapsible = ({\n  ref,\n  ...props\n}: TreeCollapsibleProps & {\n  ref?: React.Ref<HTMLLIElement>\n}) => (\n  <TreeListItem ref={ref}>\n    <TreeCollapsibleProvider>\n      <StyledCollapsibleTreeItemRoot {...props} />\n    </TreeCollapsibleProvider>\n  </TreeListItem>\n)\n"],"mappings":";;;;;;;AAWA,IAAa,yBACX,QAAM,cAA2C,CAAC,CAAC;AACrD,IAAM,2BAA2B,EAAE,eAAe;CAChD,MAAM,CAAC,YAAY,iBAAiB,eAAe;CAKnD,OACE,oBAAC,wBAAD;EAA+B,OALnB,QAAM,eACX;GAAE;GAAY;EAAc,IACnC,CAAC,YAAY,aAAa,CAGK;EAAQ;CAAiC,CAAA;AAE5E;AAEA,IAAM,gCAAgD,uBAAO,MAAM,EACjE,MAAM,CAAC,QAAQ,EACjB,CAAC;AAID,IAAa,mBAAmB,EAC9B,KACA,GAAG,YAIH,oBAAC,cAAD;CAAmB;WACjB,oBAAC,yBAAD,EAAA,UACE,oBAAC,+BAAD,EAA+B,GAAI,MAAQ,CAAA,EACpB,CAAA;AACb,CAAA"}

package/dist/components/tree/TreeCollapsibleContent.js

@@ -6,7 +6,7 @@ import { jsx } from "react/jsx-runtime";
 import { Content } from "@radix-ui/react-collapsible";
 //#region src/components/tree/TreeCollapsibleContent.tsx
 var TreeCollapsibleContent = ({ ref, children, className, ...rest }) => {
-	const { triggerRef } = React$1.useContext(TreeCollapsibleContext);
+	const { triggerRef } = React$1.use(TreeCollapsibleContext);
 	const handleOnKeydown = (e) => {
 		if (!triggerRef?.current) return;
 		if (e.key === "Escape") {

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

@@ -1 +1 @@
-{"version":3,"file":"TreeCollapsibleContent.js","names":[],"sources":["../../../src/components/tree/TreeCollapsibleContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { cn } from '../../styled'\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeList } from './TreeList'\n\ntype TreeCollapsibleContentProps = React.ComponentProps<typeof Content> &\n  React.ComponentProps<typeof TreeList> & {\n    ref?: React.Ref<HTMLUListElement>\n  }\n\nexport const TreeCollapsibleContent = ({\n  ref,\n  children,\n  className,\n  ...rest\n}: TreeCollapsibleContentProps) => {\n  const { triggerRef } = React.useContext(TreeCollapsibleContext)\n\n  const handleOnKeydown = (e) => {\n    if (!triggerRef?.current) return\n    if (e.key === 'Escape') {\n      e.stopPropagation()\n      e.preventDefault()\n      triggerRef.current.focus()\n      triggerRef.current.click()\n    }\n  }\n\n  return (\n    <Content\n      className={cn('data-[state=closed]:hidden', className)}\n      onKeyDown={handleOnKeydown}\n      {...rest}\n      asChild\n    >\n      <TreeList ref={ref} role=\"group\">\n        {children}\n      </TreeList>\n    </Content>\n  )\n}\n"],"mappings":";;;;;;;AAYA,IAAa,0BAA0B,EACrC,KACA,UACA,WACA,GAAG,WAC8B;CACjC,MAAM,EAAE,eAAe,QAAM,WAAW,sBAAsB;CAE9D,MAAM,mBAAmB,MAAM;EAC7B,IAAI,CAAC,YAAY,SAAS;EAC1B,IAAI,EAAE,QAAQ,UAAU;GACtB,EAAE,gBAAgB;GAClB,EAAE,eAAe;GACjB,WAAW,QAAQ,MAAM;GACzB,WAAW,QAAQ,MAAM;EAC3B;CACF;CAEA,OACE,oBAAC,SAAD;EACE,WAAW,GAAG,8BAA8B,SAAS;EACrD,WAAW;EACX,GAAI;EACJ,SAAA;YAEA,oBAAC,UAAD;GAAe;GAAK,MAAK;GACtB;EACO,CAAA;CACH,CAAA;AAEb"}
+{"version":3,"file":"TreeCollapsibleContent.js","names":[],"sources":["../../../src/components/tree/TreeCollapsibleContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { cn } from '../../styled'\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeList } from './TreeList'\n\ntype TreeCollapsibleContentProps = React.ComponentProps<typeof Content> &\n  React.ComponentProps<typeof TreeList> & {\n    ref?: React.Ref<HTMLUListElement>\n  }\n\nexport const TreeCollapsibleContent = ({\n  ref,\n  children,\n  className,\n  ...rest\n}: TreeCollapsibleContentProps) => {\n  const { triggerRef } = React.use(TreeCollapsibleContext)\n\n  const handleOnKeydown = (e) => {\n    if (!triggerRef?.current) return\n    if (e.key === 'Escape') {\n      e.stopPropagation()\n      e.preventDefault()\n      triggerRef.current.focus()\n      triggerRef.current.click()\n    }\n  }\n\n  return (\n    <Content\n      className={cn('data-[state=closed]:hidden', className)}\n      onKeyDown={handleOnKeydown}\n      {...rest}\n      asChild\n    >\n      <TreeList ref={ref} role=\"group\">\n        {children}\n      </TreeList>\n    </Content>\n  )\n}\n"],"mappings":";;;;;;;AAYA,IAAa,0BAA0B,EACrC,KACA,UACA,WACA,GAAG,WAC8B;CACjC,MAAM,EAAE,eAAe,QAAM,IAAI,sBAAsB;CAEvD,MAAM,mBAAmB,MAAM;EAC7B,IAAI,CAAC,YAAY,SAAS;EAC1B,IAAI,EAAE,QAAQ,UAAU;GACtB,EAAE,gBAAgB;GAClB,EAAE,eAAe;GACjB,WAAW,QAAQ,MAAM;GACzB,WAAW,QAAQ,MAAM;EAC3B;CACF;CAEA,OACE,oBAAC,SAAD;EACE,WAAW,GAAG,8BAA8B,SAAS;EACrD,WAAW;EACX,GAAI;EACJ,SAAA;YAEA,oBAAC,UAAD;GAAe;GAAK,MAAK;GACtB;EACO,CAAA;CACH,CAAA;AAEb"}

package/dist/components/tree/TreeCollapsibleTrigger.js

@@ -19,7 +19,7 @@ var StyledActionIcon = styled(ActionIcon, { base: [
 	"[&[data-state=open]>svg]:rotate-0"
 ] });
 var TreeCollapsibleTrigger = ({ children, label, className, onClick, ...rest }) => {
-	const { setTriggerRef, triggerRef } = React$1.useContext(TreeCollapsibleContext);
+	const { setTriggerRef, triggerRef } = React$1.use(TreeCollapsibleContext);
 	return /* @__PURE__ */ jsxs(TreeItemContent, {
 		...rest,
 		className: cn("cursor-pointer", className),

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

@@ -1 +1 @@
-{"version":3,"file":"TreeCollapsibleTrigger.js","names":[],"sources":["../../../src/components/tree/TreeCollapsibleTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { styled, cn } from '../../styled'\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeItemContent } from './TreeItemContent'\n\nconst StyledActionIcon = styled(ActionIcon, {\n  base: [\n    'absolute',\n    'left-0',\n    'top-0',\n    'pointer-events-none',\n    '[&_svg]:duration-300',\n    '[&_svg]:transition-transform',\n    '[&[data-state=closed]>svg]:-rotate-90',\n    '[&[data-state=open]>svg]:rotate-0'\n  ]\n})\n\ntype NavigationMenuCollapsibleTriggerProps = React.ComponentProps<\n  typeof TreeItemContent\n> & {\n  label: string\n}\n\nexport const TreeCollapsibleTrigger = ({\n  children,\n  label,\n  className,\n  onClick,\n  ...rest\n}: NavigationMenuCollapsibleTriggerProps) => {\n  const { setTriggerRef, triggerRef } = React.useContext(TreeCollapsibleContext)\n\n  return (\n    <TreeItemContent\n      {...rest}\n      className={cn('cursor-pointer', className)}\n      onClick={(event) => {\n        onClick?.(event)\n        triggerRef?.current?.click()\n      }}\n    >\n      <Trigger asChild>\n        <StyledActionIcon\n          size=\"sm\"\n          ref={setTriggerRef}\n          label={label}\n          theme=\"neutral\"\n          hasTooltip={false}\n          onClick={(e) => e.stopPropagation()}\n        >\n          <Icon is={ChevronDown} />\n        </StyledActionIcon>\n      </Trigger>\n      {children}\n    </TreeItemContent>\n  )\n}\n"],"mappings":";;;;;;;;;;AAUA,IAAM,mBAAmB,OAAO,YAAY,EAC1C,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAQD,IAAa,0BAA0B,EACrC,UACA,OACA,WACA,SACA,GAAG,WACwC;CAC3C,MAAM,EAAE,eAAe,eAAe,QAAM,WAAW,sBAAsB;CAE7E,OACE,qBAAC,iBAAD;EACE,GAAI;EACJ,WAAW,GAAG,kBAAkB,SAAS;EACzC,UAAU,UAAU;GAClB,UAAU,KAAK;GACf,YAAY,SAAS,MAAM;EAC7B;YANF,CAQE,oBAAC,SAAD;GAAS,SAAA;aACP,oBAAC,kBAAD;IACE,MAAK;IACL,KAAK;IACE;IACP,OAAM;IACN,YAAY;IACZ,UAAU,MAAM,EAAE,gBAAgB;cAElC,oBAAC,MAAD,EAAM,IAAI,YAAc,CAAA;GACR,CAAA;EACX,CAAA,GACR,QACc;;AAErB"}
+{"version":3,"file":"TreeCollapsibleTrigger.js","names":[],"sources":["../../../src/components/tree/TreeCollapsibleTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { styled, cn } from '../../styled'\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeItemContent } from './TreeItemContent'\n\nconst StyledActionIcon = styled(ActionIcon, {\n  base: [\n    'absolute',\n    'left-0',\n    'top-0',\n    'pointer-events-none',\n    '[&_svg]:duration-300',\n    '[&_svg]:transition-transform',\n    '[&[data-state=closed]>svg]:-rotate-90',\n    '[&[data-state=open]>svg]:rotate-0'\n  ]\n})\n\ntype NavigationMenuCollapsibleTriggerProps = React.ComponentProps<\n  typeof TreeItemContent\n> & {\n  label: string\n}\n\nexport const TreeCollapsibleTrigger = ({\n  children,\n  label,\n  className,\n  onClick,\n  ...rest\n}: NavigationMenuCollapsibleTriggerProps) => {\n  const { setTriggerRef, triggerRef } = React.use(TreeCollapsibleContext)\n\n  return (\n    <TreeItemContent\n      {...rest}\n      className={cn('cursor-pointer', className)}\n      onClick={(event) => {\n        onClick?.(event)\n        triggerRef?.current?.click()\n      }}\n    >\n      <Trigger asChild>\n        <StyledActionIcon\n          size=\"sm\"\n          ref={setTriggerRef}\n          label={label}\n          theme=\"neutral\"\n          hasTooltip={false}\n          onClick={(e) => e.stopPropagation()}\n        >\n          <Icon is={ChevronDown} />\n        </StyledActionIcon>\n      </Trigger>\n      {children}\n    </TreeItemContent>\n  )\n}\n"],"mappings":";;;;;;;;;;AAUA,IAAM,mBAAmB,OAAO,YAAY,EAC1C,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAQD,IAAa,0BAA0B,EACrC,UACA,OACA,WACA,SACA,GAAG,WACwC;CAC3C,MAAM,EAAE,eAAe,eAAe,QAAM,IAAI,sBAAsB;CAEtE,OACE,qBAAC,iBAAD;EACE,GAAI;EACJ,WAAW,GAAG,kBAAkB,SAAS;EACzC,UAAU,UAAU;GAClB,UAAU,KAAK;GACf,YAAY,SAAS,MAAM;EAC7B;YANF,CAQE,oBAAC,SAAD;GAAS,SAAA;aACP,oBAAC,kBAAD;IACE,MAAK;IACL,KAAK;IACE;IACP,OAAM;IACN,YAAY;IACZ,UAAU,MAAM,EAAE,gBAAgB;cAElC,oBAAC,MAAD,EAAM,IAAI,YAAc,CAAA;GACR,CAAA;EACX,CAAA,GACR,QACc;;AAErB"}