@atom-learning/components 6.0.0-beta.4 → 6.0.0-beta.6

package/dist/components/toggle-group/ToggleGroupRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleGroupRoot.js","sources":["../../../src/components/toggle-group/ToggleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/stitches'\nimport { ToggleGroup } from '~/utilities/radix-overrides/toggle-group'\n\nimport { StyledItem } from './ToggleGroupItem'\n\ntype RootType = {\n  orientation?: 'horizontal' | 'vertical'\n  isFullWidth?: boolean\n}\n\nexport const StyledRoot = styled(ToggleGroup.Root, {\n  width: 'fit-content',\n  variants: {\n    isFullWidth: {\n      true: {\n        width: '100%',\n        [`& ${StyledItem}`]: {\n          flexBasis: 0,\n          flexGrow: 1\n        }\n      },\n      false: {\n        width: 'auto'\n      }\n    },\n    hasGap: {\n      true: {\n        [`& ${StyledItem}`]: {\n          borderRadius: '$0'\n        }\n      },\n      false: {\n        borderRadius: '$1',\n        [`& ${StyledItem}`]: {\n          position: 'relative',\n          '&:not(:last-child)::before': {\n            content: '',\n            position: 'absolute'\n          }\n        }\n      }\n    },\n    direction: {\n      column: {},\n      row: {}\n    },\n    theme: {\n      standard: {},\n      modern: { bg: '$grey200' }\n    }\n  },\n  compoundVariants: [\n    {\n      hasGap: false,\n      direction: 'row',\n      theme: 'standard',\n      css: {\n        [`& ${StyledItem}`]: {\n          '&:not(:last-child)::before': {\n            top: '-1px',\n            height: 'calc(100% + 2px)',\n            width: '1px',\n            right: '0',\n            transform: 'translateX(150%)'\n          },\n          '&:not(:first-child)': {\n            borderLeftColor: 'transparent'\n          },\n          '&:not(:last-child)': {\n            borderRightColor: 'transparent'\n          },\n          '&:first-child': {\n            borderTopLeftRadius: '$1',\n            borderBottomLeftRadius: '$1'\n          },\n          '&:last-child': {\n            borderTopRightRadius: '$1',\n            borderBottomRightRadius: '$1'\n          }\n        }\n      }\n    },\n    {\n      hasGap: false,\n      direction: 'column',\n      theme: 'standard',\n      css: {\n        [`& ${StyledItem}`]: {\n          '&:not(:last-child)::before': {\n            bottom: 0,\n            left: '-1px',\n            height: '1px',\n            width: 'calc(100% + 2px)',\n            transform: 'translateY(150%)'\n          },\n          '&:first-child': {\n            borderTopLeftRadius: '$0',\n            borderTopRightRadius: '$0'\n          },\n          '&:last-child': {\n            borderBottomLeftRadius: '$0',\n            borderBottomRightRadius: '$0'\n          },\n          '&:not(:first-child)': {\n            borderTopColor: 'transparent'\n          },\n          '&:not(:last-child)': {\n            borderBottomColor: 'transparent'\n          }\n        }\n      }\n    },\n    {\n      hasGap: false,\n      theme: 'modern',\n      css: {}\n    },\n    {\n      hasGap: false,\n      theme: 'standard',\n      css: {\n        bg: 'white',\n        [`& ${StyledItem}`]: {\n          bg: 'transparent',\n          borderRadius: 0\n        }\n      }\n    }\n  ]\n})\n\nconst orientationToDirection = (orientation) =>\n  orientation === 'horizontal' ? 'row' : 'column'\n\nexport const ToggleGroupRoot: React.ForwardRefExoticComponent<\n  Pick<React.ComponentProps<typeof Flex>, 'gap' | 'wrap'> &\n    React.ComponentProps<typeof StyledRoot> &\n    RootType\n> = React.forwardRef(\n  (\n    {\n      orientation = 'horizontal',\n      gap,\n      isFullWidth,\n      children,\n      theme = 'standard',\n      wrap,\n      ...rest\n    },\n    ref\n  ) => {\n    const hasGap = typeof gap === 'number'\n    const direction = orientationToDirection(orientation)\n    return (\n      <StyledRoot\n        ref={ref}\n        direction={direction}\n        hasGap={hasGap}\n        isFullWidth={isFullWidth}\n        orientation={orientation}\n        theme={theme}\n        {...rest}\n      >\n        <Flex\n          direction={direction}\n          gap={hasGap ? gap : undefined}\n          wrap={wrap || 'nowrap'}\n        >\n          {\n            React.Children.toArray(children).map((child) => {\n              if (React.isValidElement(child)) {\n                return React.cloneElement(child, { ...child.props, theme })\n              }\n              return child\n            }) as React.ReactElement[]\n          }\n        </Flex>\n      </StyledRoot>\n    )\n  }\n)\n"],"names":["StyledRoot","styled","ToggleGroup","StyledItem","orientationToDirection","orientation","ToggleGroupRoot","React","gap","isFullWidth","children","theme","wrap","rest","ref","hasGap","direction","Flex","child"],"mappings":"gPAaO,MAAMA,EAAaC,EAAOC,EAAY,KAAM,CACjD,MAAO,cACP,SAAU,CACR,YAAa,CACX,KAAM,CACJ,MAAO,OACP,CAAC,KAAKC,KAAe,CACnB,UAAW,EACX,SAAU,CACZ,CACF,EACA,MAAO,CACL,MAAO,MACT,CACF,EACA,OAAQ,CACN,KAAM,CACJ,CAAC,KAAKA,KAAe,CACnB,aAAc,IAChB,CACF,EACA,MAAO,CACL,aAAc,KACd,CAAC,KAAKA,KAAe,CACnB,SAAU,WACV,6BAA8B,CAC5B,QAAS,GACT,SAAU,UACZ,CACF,CACF,CACF,EACA,UAAW,CACT,OAAQ,GACR,IAAK,CAAA,CACP,EACA,MAAO,CACL,SAAU,CAAC,EACX,OAAQ,CAAE,GAAI,UAAW,CAC3B,CACF,EACA,iBAAkB,CAChB,CACE,OAAQ,GACR,UAAW,MACX,MAAO,WACP,IAAK,CACH,CAAC,KAAKA,KAAe,CACnB,6BAA8B,CAC5B,IAAK,OACL,OAAQ,mBACR,MAAO,MACP,MAAO,IACP,UAAW,kBACb,EACA,sBAAuB,CACrB,gBAAiB,aACnB,EACA,qBAAsB,CACpB,iBAAkB,aACpB,EACA,gBAAiB,CACf,oBAAqB,KACrB,uBAAwB,IAC1B,EACA,eAAgB,CACd,qBAAsB,KACtB,wBAAyB,IAC3B,CACF,CACF,CACF,EACA,CACE,OAAQ,GACR,UAAW,SACX,MAAO,WACP,IAAK,CACH,CAAC,KAAKA,KAAe,CACnB,6BAA8B,CAC5B,OAAQ,EACR,KAAM,OACN,OAAQ,MACR,MAAO,mBACP,UAAW,kBACb,EACA,gBAAiB,CACf,oBAAqB,KACrB,qBAAsB,IACxB,EACA,eAAgB,CACd,uBAAwB,KACxB,wBAAyB,IAC3B,EACA,sBAAuB,CACrB,eAAgB,aAClB,EACA,qBAAsB,CACpB,kBAAmB,aACrB,CACF,CACF,CACF,EACA,CACE,OAAQ,GACR,MAAO,SACP,IAAK,CACP,CAAA,EACA,CACE,OAAQ,GACR,MAAO,WACP,IAAK,CACH,GAAI,QACJ,CAAC,KAAKA,KAAe,CACnB,GAAI,cACJ,aAAc,CAChB,CACF,CACF,CACF,CACF,CAAC,EAEKC,EAA0BC,GAC9BA,IAAgB,aAAe,MAAQ,SAE5BC,EAITC,EAAM,WACR,CACE,CACE,YAAAF,EAAc,aACd,IAAAG,EACA,YAAAC,EACA,SAAAC,EACA,MAAAC,EAAQ,WACR,KAAAC,KACGC,CACL,EACAC,IACG,CACH,MAAMC,EAAS,OAAOP,GAAQ,SACxBQ,EAAYZ,EAAuBC,CAAW,EACpD,OACEE,EAAA,cAACP,EACC,CAAA,IAAKc,EACL,UAAWE,EACX,OAAQD,EACR,YAAaN,EACb,YAAaJ,EACb,MAAOM,EACN,GAAGE,CAAAA,EAEJN,EAAA,cAACU,EAAA,CACC,UAAWD,EACX,IAAKD,EAASP,EAAM,OACpB,KAAMI,GAAQ,QAAA,EAGZL,EAAM,SAAS,QAAQG,CAAQ,EAAE,IAAKQ,GAChCX,EAAM,eAAeW,CAAK,EACrBX,EAAM,aAAaW,EAAO,CAAE,GAAGA,EAAM,MAAO,MAAAP,CAAM,CAAC,EAErDO,CACR,CAEL,CACF,CAEJ,CACF"}
+{"version":3,"file":"ToggleGroupRoot.js","sources":["../../../src/components/toggle-group/ToggleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/styled'\nimport { ToggleGroup } from '~/utilities/radix-overrides/toggle-group'\n\ntype RootType = {\n  orientation?: 'horizontal' | 'vertical'\n  isFullWidth?: boolean\n}\n\nexport const StyledRoot = styled(ToggleGroup.Root, {\n  base: ['w-fit'],\n  variants: {\n    isFullWidth: {\n      true: [\n        '**:data-radix-collection-item:basis-0',\n        '**:data-radix-collection-item:grow',\n        'w-full'\n      ],\n      false: ['w-auto']\n    },\n    hasGap: {\n      true: ['**:data-radix-collection-item:rounded-md'],\n      false: [\n        '**:data-radix-collection-item:not-last:before:absolute',\n        \"**:data-radix-collection-item:not-last:before:content-['']\",\n        '**:data-radix-collection-item:relative',\n        'rounded-md'\n      ]\n    },\n    direction: {\n      column: [],\n      row: []\n    },\n    theme: {\n      standard: [],\n      modern: ['bg-grey-200']\n    }\n  },\n  compoundVariants: [\n    {\n      hasGap: false,\n      direction: 'row',\n      theme: 'standard',\n      class: [\n        '**:data-radix-collection-item:first:rounded-l-md',\n        '**:data-radix-collection-item:last:rounded-r-md',\n        '**:data-radix-collection-item:not-first:border-l-transparent',\n        '**:data-radix-collection-item:not-last:before:h-[calc(100%+2px)]',\n        '**:data-radix-collection-item:not-last:before:right-0',\n        '**:data-radix-collection-item:not-last:before:-top-px',\n        '**:data-radix-collection-item:not-last:before:translate-x-3/2',\n        '**:data-radix-collection-item:not-last:before:w-px',\n        '**:data-radix-collection-item:not-last:border-r-transparent',\n        '**:data-radix-collection-item:rounded-none'\n      ]\n    },\n    {\n      hasGap: false,\n      direction: 'column',\n      theme: 'standard',\n      class: [\n        '**:data-radix-collection-item:first:rounded-t-sm',\n        '**:data-radix-collection-item:last:rounded-b-sm',\n        '**:data-radix-collection-item:not-first:border-t-transparent',\n        '**:data-radix-collection-item:not-last:before:bottom-0',\n        '**:data-radix-collection-item:not-last:before:h-px',\n        '**:data-radix-collection-item:not-last:before:-left-px',\n        '**:data-radix-collection-item:not-last:before:translate-y-3/2',\n        '**:data-radix-collection-item:not-last:before:w-[calc(100%+2px)]',\n        '**:data-radix-collection-item:not-last:border-b-transparent'\n      ]\n    },\n    {\n      hasGap: false,\n      theme: 'modern',\n      class: []\n    },\n    {\n      hasGap: false,\n      theme: 'standard',\n      class: [\n        '**:data-radix-collection-item:bg-transparent',\n        '**:data-radix-collection-item:rounded-none',\n        'bg-white'\n      ]\n    }\n  ]\n})\n\nconst orientationToDirection = (orientation) =>\n  orientation === 'horizontal' ? 'row' : 'column'\n\nexport const ToggleGroupRoot = React.forwardRef<\n  HTMLDivElement,\n  Pick<React.ComponentProps<typeof Flex>, 'gap' | 'wrap'> &\n    React.ComponentProps<typeof StyledRoot> &\n    RootType\n>(\n  (\n    {\n      orientation = 'horizontal',\n      gap,\n      isFullWidth,\n      children,\n      theme = 'standard',\n      wrap,\n      ...rest\n    },\n    ref\n  ) => {\n    const hasGap = typeof gap === 'number'\n    const direction = orientationToDirection(orientation)\n\n    return (\n      <StyledRoot\n        ref={ref}\n        direction={direction}\n        hasGap={hasGap}\n        isFullWidth={isFullWidth}\n        orientation={orientation}\n        theme={theme}\n        {...rest}\n      >\n        <Flex\n          direction={direction}\n          gap={hasGap ? gap : undefined}\n          wrap={wrap || 'nowrap'}\n        >\n          {\n            React.Children.toArray(children).map((child) => {\n              if (React.isValidElement(child)) {\n                return React.cloneElement(child, { ...child.props, theme })\n              }\n              return child\n            }) as React.ReactElement[]\n          }\n        </Flex>\n      </StyledRoot>\n    )\n  }\n)\n"],"names":["StyledRoot","styled","ToggleGroup","orientationToDirection","orientation","ToggleGroupRoot","React","gap","isFullWidth","children","theme","wrap","rest","ref","hasGap","direction","Flex","child"],"mappings":"4LAWa,MAAAA,EAAaC,EAAOC,EAAY,KAAM,CACjD,KAAM,CAAC,OAAO,EACd,SAAU,CACR,YAAa,CACX,KAAM,CACJ,wCACA,qCACA,QACF,EACA,MAAO,CAAC,QAAQ,CAClB,EACA,OAAQ,CACN,KAAM,CAAC,0CAA0C,EACjD,MAAO,CACL,yDACA,6DACA,yCACA,YACF,CACF,EACA,UAAW,CACT,OAAQ,CAAC,EACT,IAAK,CAAA,CACP,EACA,MAAO,CACL,SAAU,CAAC,EACX,OAAQ,CAAC,aAAa,CACxB,CACF,EACA,iBAAkB,CAChB,CACE,OAAQ,GACR,UAAW,MACX,MAAO,WACP,MAAO,CACL,mDACA,kDACA,+DACA,mEACA,wDACA,wDACA,gEACA,qDACA,8DACA,4CACF,CACF,EACA,CACE,OAAQ,GACR,UAAW,SACX,MAAO,WACP,MAAO,CACL,mDACA,kDACA,+DACA,yDACA,qDACA,yDACA,gEACA,mEACA,6DACF,CACF,EACA,CACE,OAAQ,GACR,MAAO,SACP,MAAO,EACT,EACA,CACE,OAAQ,GACR,MAAO,WACP,MAAO,CACL,+CACA,6CACA,UACF,CACF,CACF,CACF,CAAC,EAEKC,EAA0BC,GAC9BA,IAAgB,aAAe,MAAQ,SAE5BC,EAAkBC,EAAM,WAMnC,CACE,CACE,YAAAF,EAAc,aACd,IAAAG,EACA,YAAAC,EACA,SAAAC,EACA,MAAAC,EAAQ,WACR,KAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAAS,OAAOP,GAAQ,SACxBQ,EAAYZ,EAAuBC,CAAW,EAEpD,OACEE,EAAA,cAACN,EACC,CAAA,IAAKa,EACL,UAAWE,EACX,OAAQD,EACR,YAAaN,EACb,YAAaJ,EACb,MAAOM,EACN,GAAGE,CAAAA,EAEJN,EAAA,cAACU,EAAA,CACC,UAAWD,EACX,IAAKD,EAASP,EAAM,OACpB,KAAMI,GAAQ,QAAA,EAGZL,EAAM,SAAS,QAAQG,CAAQ,EAAE,IAAKQ,GAChCX,EAAM,eAAeW,CAAK,EACrBX,EAAM,aAAaW,EAAO,CAAE,GAAGA,EAAM,MAAO,MAAAP,CAAM,CAAC,EAErDO,CACR,CAEL,CACF,CAEJ,CACF"}

package/dist/components/toggle-group/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/toggle-group/index.ts"],"sourcesContent":["import { ToggleGroupButton as Button } from './ToggleGroupButton'\nimport { ToggleGroupItem as Item } from './ToggleGroupItem'\nimport { ToggleGroupRoot as Root } from './ToggleGroupRoot'\nexport const ToggleGroup = { Item, Button, Root }\n"],"names":["ToggleGroup","Item","Button","Root"],"mappings":"yKAGO,MAAMA,EAAc,CAAE,KAAAC,EAAM,OAAAC,EAAQ,KAAAC,CAAK"}
+{"version":3,"file":"index.js","sources":["../../../src/components/toggle-group/index.ts"],"sourcesContent":["import { ToggleGroupButton as Button } from './ToggleGroupButton'\nimport { ToggleGroupItem as Item } from './ToggleGroupItem'\nimport { ToggleGroupRoot as Root } from './ToggleGroupRoot'\n\nexport const ToggleGroup = { Item, Button, Root }\n"],"names":["ToggleGroup","Item","Button","Root"],"mappings":"yKAIO,MAAMA,EAAc,CAAE,KAAAC,EAAM,OAAAC,EAAQ,KAAAC,CAAK"}

package/dist/components/tooltip/Tooltip.js

@@ -1,2 +1,2 @@
-import{Trigger as i,Portal as a,Provider as l,Root as n}from"@radix-ui/react-tooltip";import*as m from"react";import{styled as p}from"../../stitches.js";import{TooltipContent as d}from"./TooltipContent.js";const o=({children:r,delayDuration:t=350,...e})=>m.createElement(n,{delayDuration:t,...e},r),s=Object.assign(o,{Content:d,Trigger:p(i,{}),Portal:a,Provider:l});o.displayName="Tooltip";export{s as Tooltip};
+import{Trigger as i,Portal as a,Provider as n,Root as l}from"@radix-ui/react-tooltip";import*as m from"react";import{TooltipContent as p}from"./TooltipContent.js";const o=({children:r,delayDuration:t=350,...e})=>m.createElement(l,{delayDuration:t,...e},r),d=Object.assign(o,{Content:p,Trigger:i,Portal:a,Provider:n});o.displayName="Tooltip";export{d as Tooltip};
 //# sourceMappingURL=Tooltip.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import { Portal, Provider, Root, Trigger } from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { TooltipContent } from './TooltipContent'\n\ntype TooltipProps = React.ComponentProps<typeof Root>\n\nconst TooltipComponent = ({\n  children,\n  delayDuration = 350,\n  ...remainingProps\n}: TooltipProps) => (\n  <Root delayDuration={delayDuration} {...remainingProps}>\n    {children}\n  </Root>\n)\n\nexport const Tooltip = Object.assign(TooltipComponent, {\n  Content: TooltipContent,\n  Trigger: styled(Trigger, {}),\n  Portal: Portal,\n  Provider: Provider\n})\n\nTooltipComponent.displayName = 'Tooltip'\n"],"names":["TooltipComponent","children","delayDuration","remainingProps","React","Root","Tooltip","TooltipContent","styled","Trigger","Portal","Provider"],"mappings":"8MASA,MAAMA,EAAmB,CAAC,CACxB,SAAAC,EACA,cAAAC,EAAgB,OACbC,CACL,IACEC,EAAA,cAACC,EAAA,CAAK,cAAeH,EAAgB,GAAGC,CAAAA,EACrCF,CACH,EAGWK,EAAU,OAAO,OAAON,EAAkB,CACrD,QAASO,EACT,QAASC,EAAOC,EAAS,CAAA,CAAE,EAC3B,OAAQC,EACR,SAAUC,CACZ,CAAC,EAEDX,EAAiB,YAAc"}
+{"version":3,"file":"Tooltip.js","sources":["../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import { Portal, Provider, Root, Trigger } from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { TooltipContent } from './TooltipContent'\n\ntype TooltipProps = React.ComponentProps<typeof Root>\n\nconst TooltipComponent = ({\n  children,\n  delayDuration = 350,\n  ...remainingProps\n}: TooltipProps) => (\n  <Root delayDuration={delayDuration} {...remainingProps}>\n    {children}\n  </Root>\n)\n\nexport const Tooltip = Object.assign(TooltipComponent, {\n  Content: TooltipContent,\n  Trigger: Trigger,\n  Portal: Portal,\n  Provider: Provider\n})\n\nTooltipComponent.displayName = 'Tooltip'\n"],"names":["TooltipComponent","children","delayDuration","remainingProps","React","Root","Tooltip","TooltipContent","Trigger","Portal","Provider"],"mappings":"mKAOA,MAAMA,EAAmB,CAAC,CACxB,SAAAC,EACA,cAAAC,EAAgB,IAChB,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAK,cAAeH,EAAgB,GAAGC,CAAAA,EACrCF,CACH,EAGWK,EAAU,OAAO,OAAON,EAAkB,CACrD,QAASO,EACT,QAASC,EACT,OAAQC,EACR,SAAUC,CACZ,CAAC,EAEDV,EAAiB,YAAc"}

package/dist/components/tooltip/TooltipContent.js

@@ -1,2 +1,2 @@
-import{Content as m,Arrow as r}from"@radix-ui/react-tooltip";import*as i from"react";import{TOOLTIP_Z_INDEX as s}from"../../constants/zIndices.js";import{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{slideDownAndFade as l,slideLeftAndFade as p,slideUpAndFade as f,slideRightAndFade as c}from"../../utilities/style/keyframe-animations.js";const g=t(m,{backgroundColor:"$grey900",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,whiteSpace:"normal",px:"$3",py:"$2",zIndex:s,"@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="delayed-open"]':{'&[data-side="top"]':{animationName:l},'&[data-side="right"]':{animationName:p},'&[data-side="bottom"]':{animationName:f},'&[data-side="left"]':{animationName:c}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),h=t(r,{fill:"$grey900",'[data-align="end"] &':{mr:"$2"},'[data-align="start"] &':{ml:"$2"}}),x=({children:a,side:e="top",sideOffset:o=4,size:n="md",...d})=>i.createElement(g,{side:e,sideOffset:o,size:n,...d},a,i.createElement(h,null));export{x as TooltipContent};
+import{Content as n,Arrow as l}from"@radix-ui/react-tooltip";import*as e from"react";import{styled as t}from"../../styled.js";const r=t(n,{base:["bg-grey-900","rounded-sm","shadow-sm","text-white","font-body","text-sm","leading-normal","whitespace-normal","px-3","py-2","z-10","will-change-transform","will-change-[opacity]","[--slide-opacity-out:0]","data-[side=top]:[--slide-direction-out-y:-4px]","data-[side=right]:[--slide-direction-out-x:4px]","data-[side=bottom]:[--slide-direction-out-y:4px]","data-[side=left]:[--slide-direction-out-x:-4px]","motion-safe:data-[state=delayed-open]:animate-slide-direction-in","motion-safe:data-[state=closed]:animate-slide-direction-out"],variants:{size:{sm:["max-w-25"],md:["max-w-[250px]"],lg:["max-w-100"]}}}),m=t(l,{base:["fill-grey-900","in-data-[align=end]:mr-2","in-data-[align=start]:ml-2"]}),p=({children:i,side:a="top",sideOffset:o=4,size:d="md",...s})=>e.createElement(r,{side:a,sideOffset:o,size:d,...s},i,e.createElement(m,null));export{p as TooltipContent};
 //# sourceMappingURL=TooltipContent.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TooltipContent.js","sources":["../../../src/components/tooltip/TooltipContent.tsx"],"sourcesContent":["import { Arrow, Content } from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { TOOLTIP_Z_INDEX } from '~/constants/zIndices'\nimport { styled } from '~/stitches'\nimport {\n  slideDownAndFade,\n  slideLeftAndFade,\n  slideRightAndFade,\n  slideUpAndFade\n} from '~/utilities'\n\nconst StyledContent = styled(Content, {\n  backgroundColor: '$grey900',\n  borderRadius: '$0',\n  boxShadow: '$0',\n  color: 'white',\n  fontFamily: '$body',\n  fontSize: '$sm',\n  lineHeight: 1.5,\n  whiteSpace: 'normal',\n  px: '$3',\n  py: '$2',\n  zIndex: TOOLTIP_Z_INDEX,\n  '@allowMotion': {\n    animationDuration: '75ms',\n    animationTimingFunction: 'cubic-bezier(0.16, 1, 0.3, 1)',\n    willChange: 'transform, opacity',\n    '&[data-state=\"delayed-open\"]': {\n      '&[data-side=\"top\"]': { animationName: slideDownAndFade },\n      '&[data-side=\"right\"]': { animationName: slideLeftAndFade },\n      '&[data-side=\"bottom\"]': { animationName: slideUpAndFade },\n      '&[data-side=\"left\"]': { animationName: slideRightAndFade }\n    }\n  },\n  variants: {\n    size: {\n      sm: { maxWidth: '100px' },\n      md: { maxWidth: '250px' },\n      lg: { maxWidth: '400px' }\n    }\n  }\n})\n\nconst StyledArrow = styled(Arrow, {\n  fill: '$grey900',\n  '[data-align=\"end\"] &': { mr: '$2' },\n  '[data-align=\"start\"] &': { ml: '$2' }\n})\n\ntype TooltipContentProps = React.ComponentProps<typeof StyledContent> &\n  React.ComponentProps<typeof Content>\n\nexport const TooltipContent = ({\n  children,\n  side = 'top',\n  sideOffset = 4,\n  size = 'md',\n  ...remainingProps\n}: TooltipContentProps) => (\n  <StyledContent\n    side={side}\n    sideOffset={sideOffset}\n    size={size}\n    {...remainingProps}\n  >\n    {children}\n    <StyledArrow />\n  </StyledContent>\n)\n"],"names":["StyledContent","styled","Content","TOOLTIP_Z_INDEX","slideDownAndFade","slideLeftAndFade","slideUpAndFade","slideRightAndFade","StyledArrow","Arrow","TooltipContent","children","side","sideOffset","size","remainingProps","React"],"mappings":"kdAYA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,gBAAiB,WACjB,aAAc,KACd,UAAW,KACX,MAAO,QACP,WAAY,QACZ,SAAU,MACV,WAAY,IACZ,WAAY,SACZ,GAAI,KACJ,GAAI,KACJ,OAAQC,EACR,eAAgB,CACd,kBAAmB,OACnB,wBAAyB,gCACzB,WAAY,qBACZ,+BAAgC,CAC9B,qBAAsB,CAAE,cAAeC,CAAiB,EACxD,uBAAwB,CAAE,cAAeC,CAAiB,EAC1D,wBAAyB,CAAE,cAAeC,CAAe,EACzD,sBAAuB,CAAE,cAAeC,CAAkB,CAC5D,CACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAE,SAAU,OAAQ,EACxB,GAAI,CAAE,SAAU,OAAQ,EACxB,GAAI,CAAE,SAAU,OAAQ,CAC1B,CACF,CACF,CAAC,EAEKC,EAAcP,EAAOQ,EAAO,CAChC,KAAM,WACN,uBAAwB,CAAE,GAAI,IAAK,EACnC,yBAA0B,CAAE,GAAI,IAAK,CACvC,CAAC,EAKYC,EAAiB,CAAC,CAC7B,SAAAC,EACA,KAAAC,EAAO,MACP,WAAAC,EAAa,EACb,KAAAC,EAAO,QACJC,CACL,IACEC,EAAA,cAAChB,EAAA,CACC,KAAMY,EACN,WAAYC,EACZ,KAAMC,EACL,GAAGC,CAEHJ,EAAAA,EACDK,EAAA,cAACR,EAAA,IAAY,CACf"}
+{"version":3,"file":"TooltipContent.js","sources":["../../../src/components/tooltip/TooltipContent.tsx"],"sourcesContent":["import { Arrow, Content } from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledContent = styled(Content, {\n  base: [\n    'bg-grey-900',\n    'rounded-sm',\n    'shadow-sm',\n    'text-white',\n    'font-body',\n    'text-sm',\n    'leading-normal',\n    'whitespace-normal',\n    'px-3',\n    'py-2',\n    'z-10',\n    'will-change-transform',\n    'will-change-[opacity]',\n    '[--slide-opacity-out:0]',\n    'data-[side=top]:[--slide-direction-out-y:-4px]',\n    'data-[side=right]:[--slide-direction-out-x:4px]',\n    'data-[side=bottom]:[--slide-direction-out-y:4px]',\n    'data-[side=left]:[--slide-direction-out-x:-4px]',\n    'motion-safe:data-[state=delayed-open]:animate-slide-direction-in',\n    'motion-safe:data-[state=closed]:animate-slide-direction-out'\n  ],\n  variants: {\n    size: {\n      sm: ['max-w-25'],\n      md: ['max-w-[250px]'],\n      lg: ['max-w-100']\n    }\n  }\n})\n\nconst StyledArrow = styled(Arrow, {\n  base: [\n    'fill-grey-900',\n    'in-data-[align=end]:mr-2',\n    'in-data-[align=start]:ml-2'\n  ]\n})\n\ntype TooltipContentProps = React.ComponentProps<typeof StyledContent> &\n  React.ComponentProps<typeof Content>\n\nexport const TooltipContent = ({\n  children,\n  side = 'top',\n  sideOffset = 4,\n  size = 'md',\n  ...remainingProps\n}: TooltipContentProps) => (\n  <StyledContent\n    side={side}\n    sideOffset={sideOffset}\n    size={size}\n    {...remainingProps}\n  >\n    {children}\n    <StyledArrow />\n  </StyledContent>\n)\n"],"names":["StyledContent","styled","Content","StyledArrow","Arrow","TooltipContent","children","side","sideOffset","size","remainingProps","React"],"mappings":"8HAKA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,KAAM,CACJ,cACA,aACA,YACA,aACA,YACA,UACA,iBACA,oBACA,OACA,OACA,OACA,wBACA,wBACA,0BACA,iDACA,kDACA,mDACA,kDACA,mEACA,6DACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAU,EACf,GAAI,CAAC,eAAe,EACpB,GAAI,CAAC,WAAW,CAClB,CACF,CACF,CAAC,EAEKC,EAAcF,EAAOG,EAAO,CAChC,KAAM,CACJ,gBACA,2BACA,4BACF,CACF,CAAC,EAKYC,EAAiB,CAAC,CAC7B,SAAAC,EACA,KAAAC,EAAO,MACP,WAAAC,EAAa,EACb,KAAAC,EAAO,KACP,GAAGC,CACL,IACEC,EAAA,cAACX,EAAA,CACC,KAAMO,EACN,WAAYC,EACZ,KAAMC,EACL,GAAGC,CAAAA,EAEHJ,EACDK,EAAA,cAACR,EAAA,IAAY,CACf"}

package/dist/components/top-bar/TopBar.colorscheme.config.js

@@ -0,0 +1,2 @@
+const o={"--background":"white","--divider":"var(--color-grey-200)","--border-bottom":"var(--color-grey-200)"},r={light:o};export{r as colorSchemes};
+//# sourceMappingURL=TopBar.colorscheme.config.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar.colorscheme.config.js","sources":["../../../src/components/top-bar/TopBar.colorscheme.config.ts"],"sourcesContent":["const light = {\n  '--background': 'white',\n  '--divider': 'var(--color-grey-200)',\n  '--border-bottom': 'var(--color-grey-200)'\n}\n\nexport const colorSchemes = {\n  light\n}\n"],"names":["light","colorSchemes"],"mappings":"AAAA,MAAMA,EAAQ,CACZ,eAAgB,QAChB,YAAa,wBACb,kBAAmB,uBACrB,EAEaC,EAAe,CAC1B,MAAAD,CACF"}

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

@@ -1,2 +1,2 @@
-import*as r from"react";import{styled as o}from"../../stitches.js";import{useWindowScrollPosition as p}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as m}from"../divider/Divider.js";import{Flex as c}from"../flex/Flex.js";import{colorSchemes as l}from"./stitches.topBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as x,TopBarBrandName as g}from"./TopBarBrand.js";const b=()=>r.createElement(m,{orientation:"vertical",css:{height:"$2",bg:"$divider"}}),u=o("div",{bg:"$background",position:"sticky",display:"flex",alignItems:"center",zIndex:1,transition:"box-shadow .2s ease-out",variants:{hasScrolled:{true:{boxShadow:"0px 4px 4px -2px rgba(31, 31, 31, 0.1)"}},size:{md:{height:"$6"},lg:{height:"$7"}},diffused:{true:{"@supports (background-color: color-mix(in hsl, white 50%, transparent))":{bg:"color-mix(in hsl, $background 70%, transparent)",backdropFilter:"blur(8px)"}}},appearance:{standard:{width:"100vw",maxWidth:"100%",top:"0",borderBottom:"1px solid $borderBottom"},rounded:{width:"100%",top:"$2",p:"$2",border:"1px solid #ffffff",borderRadius:"$round"}}}}),B=o(c,{alignItems:"center",height:"$4",mx:"$4",width:"100%","@md":{mx:"$5"}}),e=({size:t="md",diffused:a,className:i=l.light,appearance:d="standard",...n})=>{const{y:s}=p();return r.createElement(u,{className:i,hasScrolled:!!s,diffused:a,appearance:d,size:t},r.createElement(B,{...n}))},$=Object.assign(e,{Brand:h,BrandLogo:x,BrandName:g,ActionIcon:f,Divider:b});e.displayName="TopBar";export{$ as TopBar};
+import*as r from"react";import{styled as e,Theme as c}from"../../styled.js";import{useWindowScrollPosition as p}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as l}from"../divider/Divider.js";import{Flex as b}from"../flex/Flex.js";import{colorSchemes as u}from"./TopBar.colorscheme.config.js";import{TopBarActionIcon as h}from"./TopBarActionIcon.js";import{TopBarBrand as f,TopBarBrandLogo as x,TopBarBrandName as g}from"./TopBarBrand.js";const B=()=>r.createElement(l,{orientation:"vertical",className:"bg-divider h-6"}),w=e("div",{base:["bg-(--background)","sticky","flex","items-center","z-1","transition-shadow","duration-200","ease-out"],variants:{hasScrolled:{true:["shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]"]},size:{md:["h-16"],lg:["h-24"]},diffused:{true:["[@supports(background-color:color-mix(in_hsl,white_50%,transparent))]:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]","[@supports(background-color:color-mix(in_hsl,white_50%,transparent))]:backdrop-blur-sm]"]},appearance:{standard:["w-screen","max-w-full","top-0","border-b","border-b-(--border-bottom)"],rounded:["w-full","top-2","p-2","border","border-white","rounded-round"]}}}),_=e(b,{base:["items-center","h-10","mx-4","w-full","md:mx-8"]}),o=({size:a="md",diffused:t,theme:n,className:s,appearance:i="standard",...d})=>{const{y:m}=p();return r.createElement(c,{theme:n||u.light},r.createElement(w,{className:s,hasScrolled:!!m,diffused:t,appearance:i,size:a},r.createElement(_,{...d})))},T=Object.assign(o,{Brand:f,BrandLogo:x,BrandName:g,ActionIcon:h,Divider:B});o.displayName="TopBar";export{T as TopBar};
 //# sourceMappingURL=TopBar.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './stitches.topBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" css={{ height: '$2', bg: '$divider' }} />\n)\n\nconst StyledRoot = styled('div', {\n  bg: '$background',\n  position: 'sticky',\n  display: 'flex',\n  alignItems: 'center',\n\n  zIndex: 1,\n  transition: 'box-shadow .2s ease-out',\n  variants: {\n    hasScrolled: {\n      true: { boxShadow: '0px 4px 4px -2px rgba(31, 31, 31, 0.1)' }\n    },\n    size: {\n      md: { height: '$6' },\n      lg: { height: '$7' }\n    },\n    diffused: {\n      true: {\n        '@supports (background-color: color-mix(in hsl, white 50%, transparent))':\n          {\n            bg: 'color-mix(in hsl, $background 70%, transparent)',\n            backdropFilter: 'blur(8px)'\n          }\n      }\n    },\n    appearance: {\n      standard: {\n        width: '100vw',\n        maxWidth: '100%',\n        top: '0',\n        borderBottom: '1px solid $borderBottom'\n      },\n      rounded: {\n        width: '100%',\n        top: '$2',\n        p: '$2',\n        border: '1px solid #ffffff',\n        borderRadius: '$round'\n      }\n    }\n  }\n})\n\nconst Container = styled(Flex, {\n  alignItems: 'center',\n  height: '$4',\n  mx: '$4',\n  width: '100%',\n  '@md': {\n    mx: '$5'\n  }\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n  css?: CSS\n  className?: string\n}\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  className = topBarColorSchemes['light'],\n  appearance = 'standard',\n  ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <StyledRoot\n      className={className}\n      hasScrolled={!!scrollPositionY}\n      diffused={diffused}\n      appearance={appearance}\n      size={size}\n    >\n      <Container {...props} />\n    </StyledRoot>\n  )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","className","topBarColorSchemes","appearance","props","scrollPositionY","useWindowScrollPosition","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,IAAK,CAAE,OAAQ,KAAM,GAAI,UAAW,CAAA,CAAG,EAGnEC,EAAaC,EAAO,MAAO,CAC/B,GAAI,cACJ,SAAU,SACV,QAAS,OACT,WAAY,SAEZ,OAAQ,EACR,WAAY,0BACZ,SAAU,CACR,YAAa,CACX,KAAM,CAAE,UAAW,wCAAyC,CAC9D,EACA,KAAM,CACJ,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,CACrB,EACA,SAAU,CACR,KAAM,CACJ,0EACE,CACE,GAAI,kDACJ,eAAgB,WAClB,CACJ,CACF,EACA,WAAY,CACV,SAAU,CACR,MAAO,QACP,SAAU,OACV,IAAK,IACL,aAAc,yBAChB,EACA,QAAS,CACP,MAAO,OACP,IAAK,KACL,EAAG,KACH,OAAQ,oBACR,aAAc,QAChB,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,WAAY,SACZ,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,MAAO,CACL,GAAI,IACN,CACF,CAAC,EASKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,UAAAC,EAAYC,EAAmB,MAC/B,WAAAC,EAAa,cACVC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAAwB,EAEvD,OACEd,EAAA,cAACE,EAAA,CACC,UAAWO,EACX,YAAa,CAAC,CAACI,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,CAENP,EAAAA,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAAA,CAAO,CACxB,CAEJ,EAEaG,EAAS,OAAO,OAAOT,EAAiB,CACnD,MAAOU,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAASpB,CACX,CAAC,EAEDO,EAAgB,YAAc"}
+{"version":3,"file":"TopBar.js","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'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\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('div', {\n  base: [\n    'bg-(--background)',\n    'sticky',\n    'flex',\n    'items-center',\n    'z-1',\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(background-color:color-mix(in_hsl,white_50%,transparent))]:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n        '[@supports(background-color:color-mix(in_hsl,white_50%,transparent))]: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-round'\n      ]\n    }\n  }\n})\n\nconst Container = styled(Flex, {\n  base: ['items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n  className?: string\n} & React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  theme,\n  className,\n  appearance = 'standard',\n  ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <Theme theme={theme || topBarColorSchemes['light']}>\n      <StyledRoot\n        className={className}\n        hasScrolled={!!scrollPositionY}\n        diffused={diffused}\n        appearance={appearance}\n        size={size}\n      >\n        <Container {...props} />\n      </StyledRoot>\n    </Theme>\n  )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","theme","className","appearance","props","scrollPositionY","useWindowScrollPosition","Theme","topBarColorSchemes","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,gBAAA,CAAiB,EAGvDC,EAAaC,EAAO,MAAO,CAC/B,KAAM,CACJ,oBACA,SACA,OACA,eACA,MACA,oBACA,eACA,UACF,EACA,SAAU,CACR,YAAa,CACX,KAAM,CAAC,8CAA8C,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,MAAM,EACX,GAAI,CAAC,MAAM,CACb,EACA,SAAU,CACR,KAAM,CACJ,0HACA,yFACF,CACF,EACA,WAAY,CACV,SAAU,CACR,WACA,aACA,QACA,WACA,4BACF,EACA,QAAS,CACP,SACA,QACA,MACA,SACA,eACA,eACF,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,KAAM,CAAC,eAAgB,OAAQ,OAAQ,SAAU,SAAS,CAC5D,CAAC,EAQKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,MAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,WACb,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAE/B,EAAA,OACEd,EAAA,cAACe,EAAA,CAAM,MAAON,GAASO,EAAmB,KAAA,EACxChB,EAAA,cAACE,EAAA,CACC,UAAWQ,EACX,YAAa,CAAC,CAACG,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAO,CAAA,CACxB,CACF,CAEJ,EAEaK,EAAS,OAAO,OAAOX,EAAiB,CACnD,MAAOY,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAAStB,CACX,CAAC,EAEDO,EAAgB,YAAc"}

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

@@ -1 +1 @@
-{"version":3,"file":"TopBarActionIcon.js","sources":["../../../src/components/top-bar/TopBarActionIcon.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ActionIcon } from '../action-icon'\nimport { Icon } from '../icon'\n\ntype TopBarActionIconProps = Omit<\n  React.ComponentProps<typeof ActionIcon>,\n  'size' | 'children'\n> & { icon: React.FC<React.SVGProps<SVGSVGElement>>; label: string }\n\nexport const TopBarActionIcon: React.ForwardRefExoticComponent<TopBarActionIconProps> =\n  React.forwardRef(({ icon, ...rest }, forwardedRef) => {\n    return (\n      <ActionIcon\n        size=\"md\"\n        appearance=\"simple\"\n        theme=\"neutral\"\n        ref={forwardedRef}\n        {...rest}\n      >\n        <Icon is={icon} />\n      </ActionIcon>\n    )\n  })\n"],"names":["TopBarActionIcon","React","icon","rest","forwardedRef","ActionIcon","Icon"],"mappings":"sHAUa,MAAAA,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,KAASC,CAAK,EAAGC,IAEjCH,EAAA,cAACI,EAAA,CACC,KAAK,KACL,WAAW,SACX,MAAM,UACN,IAAKD,EACJ,GAAGD,CAAAA,EAEJF,EAAA,cAACK,EAAA,CAAK,GAAIJ,CAAAA,CAAM,CAClB,CAEH"}
+{"version":3,"file":"TopBarActionIcon.js","sources":["../../../src/components/top-bar/TopBarActionIcon.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ActionIcon } from '../action-icon'\nimport { Icon } from '../icon'\n\ntype TopBarActionIconProps = Omit<\n  React.ComponentProps<typeof ActionIcon>,\n  'size' | 'children'\n> & { icon: React.FC<React.SVGProps<SVGSVGElement>>; label: string }\n\nexport const TopBarActionIcon = React.forwardRef<\n  HTMLButtonElement,\n  TopBarActionIconProps\n>(({ icon, ...rest }, forwardedRef) => {\n  return (\n    <ActionIcon\n      size=\"md\"\n      appearance=\"simple\"\n      theme=\"neutral\"\n      ref={forwardedRef}\n      {...rest}\n    >\n      <Icon is={icon} />\n    </ActionIcon>\n  )\n})\n"],"names":["TopBarActionIcon","React","icon","rest","forwardedRef","ActionIcon","Icon"],"mappings":"sHAUa,MAAAA,EAAmBC,EAAM,WAGpC,CAAC,CAAE,KAAAC,EAAM,GAAGC,CAAK,EAAGC,IAElBH,EAAA,cAACI,EAAA,CACC,KAAK,KACL,WAAW,SACX,MAAM,UACN,IAAKD,EACJ,GAAGD,CAAAA,EAEJF,EAAA,cAACK,EAAA,CAAK,GAAIJ,CAAAA,CAAM,CAClB,CAEH"}

package/dist/components/top-bar/TopBarBrand.js

@@ -1,2 +1,2 @@
-import a from"react";import{styled as o}from"../../stitches.js";import{Image as n}from"../image/Image.js";import{Text as m}from"../text/Text.js";const c=({src:r,alt:e="Atom Learning logo",css:t})=>a.createElement(n,{src:r,alt:e,css:{height:"$3",mr:"$3",width:"auto",...t}}),i=o(m,{color:"$grey800"}),l=o("a",{display:"flex",alignItems:"center",textDecoration:"none",color:"$grey800","&:hover, &:focus":{textDecoration:"none"}});export{l as TopBarBrand,c as TopBarBrandLogo,i as TopBarBrandName};
+import a from"clsx";import m from"react";import{styled as e}from"../../styled.js";import{Image as n}from"../image/Image.js";import{Text as l}from"../text/Text.js";const s=({src:r,alt:o="Atom Learning logo",className:t})=>m.createElement(n,{src:r,alt:o,className:a("h-8","mr-3","w-auto",t)}),i=e(l,{base:["text-grey-800"]}),p=e("a",{base:["flex","items-center","no-underline","text-grey-800","hover:no-underline","focus:no-underline"]});export{p as TopBarBrand,s as TopBarBrandLogo,i as TopBarBrandName};
 //# sourceMappingURL=TopBarBrand.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TopBarBrand.js","sources":["../../../src/components/top-bar/TopBarBrand.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\nexport const TopBarBrandLogo = ({\n  src,\n  alt = 'Atom Learning logo',\n  css\n}: Pick<\n  React.ComponentProps<typeof Image>,\n  'src' | 'alt' | 'css'\n>): JSX.Element => {\n  return (\n    <Image\n      src={src}\n      alt={alt}\n      css={{\n        height: '$3',\n        mr: '$3',\n        width: 'auto',\n        ...css\n      }}\n    />\n  )\n}\n\nexport const TopBarBrandName = styled(Text, {\n  color: '$grey800'\n})\n\nexport const TopBarBrand = styled('a', {\n  display: 'flex',\n  alignItems: 'center',\n  textDecoration: 'none',\n  color: '$grey800',\n  '&:hover, &:focus': { textDecoration: 'none' }\n})\n"],"names":["TopBarBrandLogo","src","alt","css","React","Image","TopBarBrandName","styled","Text","TopBarBrand"],"mappings":"iJAOa,MAAAA,EAAkB,CAAC,CAC9B,IAAAC,EACA,IAAAC,EAAM,qBACN,IAAAC,CACF,IAKIC,EAAA,cAACC,EAAA,CACC,IAAKJ,EACL,IAAKC,EACL,IAAK,CACH,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,GAAGC,CACL,CACF,CAAA,EAISG,EAAkBC,EAAOC,EAAM,CAC1C,MAAO,UACT,CAAC,EAEYC,EAAcF,EAAO,IAAK,CACrC,QAAS,OACT,WAAY,SACZ,eAAgB,OAChB,MAAO,WACP,mBAAoB,CAAE,eAAgB,MAAO,CAC/C,CAAC"}
+{"version":3,"file":"TopBarBrand.js","sources":["../../../src/components/top-bar/TopBarBrand.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\nexport const TopBarBrandLogo = ({\n  src,\n  alt = 'Atom Learning logo',\n  className\n}: Pick<React.ComponentProps<typeof Image>, 'src' | 'alt'> & {\n  className?: string\n}): JSX.Element => {\n  return (\n    <Image\n      src={src}\n      alt={alt}\n      className={clsx('h-8', 'mr-3', 'w-auto', className)}\n    />\n  )\n}\n\nexport const TopBarBrandName = styled(Text, {\n  base: ['text-grey-800']\n})\n\nexport const TopBarBrand = styled('a', {\n  base: [\n    'flex',\n    'items-center',\n    'no-underline',\n    'text-grey-800',\n    'hover:no-underline',\n    'focus:no-underline'\n  ]\n})\n"],"names":["TopBarBrandLogo","src","alt","className","React","Image","clsx","TopBarBrandName","styled","Text","TopBarBrand"],"mappings":"mKAQO,MAAMA,EAAkB,CAAC,CAC9B,IAAAC,EACA,IAAAC,EAAM,qBACN,UAAAC,CACF,IAIIC,EAAA,cAACC,EAAA,CACC,IAAKJ,EACL,IAAKC,EACL,UAAWI,EAAK,MAAO,OAAQ,SAAUH,CAAS,CACpD,CAAA,EAISI,EAAkBC,EAAOC,EAAM,CAC1C,KAAM,CAAC,eAAe,CACxB,CAAC,EAEYC,EAAcF,EAAO,IAAK,CACrC,KAAM,CACJ,OACA,eACA,eACA,gBACA,qBACA,oBACF,CACF,CAAC"}

package/dist/components/tree/Tree.js

@@ -1,2 +1,2 @@
-import e from"react";import{styled as m}from"../../stitches.js";import{TreeCollapsible as i}from"./TreeCollapsible.js";import{TreeCollapsibleContent as p}from"./TreeCollapsibleContent.js";import{TreeCollapsibleTrigger as f}from"./TreeCollapsibleTrigger.js";import{TreeIcon as T}from"./TreeIcon.js";import{TreeItem as s}from"./TreeItem.js";import{TreeList as a}from"./TreeList.js";import{TreeText as n}from"./TreeText.js";const C=m(a,{}),r=e.forwardRef(({children:o,...t},l)=>e.createElement(C,{...t,ref:l,role:"tree"},o)),b=Object.assign(r,{Collapsible:i,CollapsibleContent:p,CollapsibleTrigger:f,Item:s,Icon:T,Text:n});export{b as Tree,r as TreeRoot};
+import e from"react";import{TreeCollapsible as i}from"./TreeCollapsible.js";import{TreeCollapsibleContent as m}from"./TreeCollapsibleContent.js";import{TreeCollapsibleTrigger as p}from"./TreeCollapsibleTrigger.js";import{TreeIcon as T}from"./TreeIcon.js";import{TreeItem as f}from"./TreeItem.js";import{TreeList as a}from"./TreeList.js";import{TreeText as n}from"./TreeText.js";const r=e.forwardRef(({children:o,...t},l)=>e.createElement(a,{...t,ref:l,role:"tree"},o)),s=Object.assign(r,{Collapsible:i,CollapsibleContent:m,CollapsibleTrigger:p,Item:f,Icon:T,Text:n});export{s as Tree,r as TreeRoot};
 //# sourceMappingURL=Tree.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tree.js","sources":["../../../src/components/tree/Tree.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { TreeCollapsible } from './TreeCollapsible'\nimport { TreeCollapsibleContent } from './TreeCollapsibleContent'\nimport { TreeCollapsibleTrigger } from './TreeCollapsibleTrigger'\nimport { TreeIcon } from './TreeIcon'\nimport { TreeItem } from './TreeItem'\nimport { TreeList } from './TreeList'\nimport { TreeText } from './TreeText'\n\nconst StyledRoot = styled(TreeList, {})\n\ntype TreeProps = React.ComponentProps<typeof StyledRoot>\n\nexport const TreeRoot: React.ForwardRefExoticComponent<TreeProps> =\n  React.forwardRef(({ children, ...rest }, ref) => {\n    return (\n      <StyledRoot {...rest} ref={ref} role=\"tree\">\n        {children}\n      </StyledRoot>\n    )\n  })\n\nexport const Tree = Object.assign(TreeRoot, {\n  Collapsible: TreeCollapsible,\n  CollapsibleContent: TreeCollapsibleContent,\n  CollapsibleTrigger: TreeCollapsibleTrigger,\n  Item: TreeItem,\n  Icon: TreeIcon,\n  Text: TreeText\n})\n"],"names":["StyledRoot","styled","TreeList","TreeRoot","React","children","rest","ref","Tree","TreeCollapsible","TreeCollapsibleContent","TreeCollapsibleTrigger","TreeItem","TreeIcon","TreeText"],"mappings":"qaAYA,MAAMA,EAAaC,EAAOC,EAAU,CAAE,CAAA,EAIzBC,EACXC,EAAM,WAAW,CAAC,CAAE,SAAAC,KAAaC,CAAK,EAAGC,IAErCH,EAAA,cAACJ,EAAA,CAAY,GAAGM,EAAM,IAAKC,EAAK,KAAK,MAAA,EAClCF,CACH,CAEH,EAEUG,EAAO,OAAO,OAAOL,EAAU,CAC1C,YAAaM,EACb,mBAAoBC,EACpB,mBAAoBC,EACpB,KAAMC,EACN,KAAMC,EACN,KAAMC,CACR,CAAC"}
+{"version":3,"file":"Tree.js","sources":["../../../src/components/tree/Tree.tsx"],"sourcesContent":["import React from 'react'\n\nimport { TreeCollapsible } from './TreeCollapsible'\nimport { TreeCollapsibleContent } from './TreeCollapsibleContent'\nimport { TreeCollapsibleTrigger } from './TreeCollapsibleTrigger'\nimport { TreeIcon } from './TreeIcon'\nimport { TreeItem } from './TreeItem'\nimport { TreeList } from './TreeList'\nimport { TreeText } from './TreeText'\n\ntype TreeProps = React.ComponentProps<typeof TreeList>\n\nexport const TreeRoot = React.forwardRef<HTMLElement, TreeProps>(\n  ({ children, ...rest }, ref) => {\n    return (\n      <TreeList {...rest} ref={ref} role=\"tree\">\n        {children}\n      </TreeList>\n    )\n  }\n)\n\nexport const Tree = Object.assign(TreeRoot, {\n  Collapsible: TreeCollapsible,\n  CollapsibleContent: TreeCollapsibleContent,\n  CollapsibleTrigger: TreeCollapsibleTrigger,\n  Item: TreeItem,\n  Icon: TreeIcon,\n  Text: TreeText\n})\n"],"names":["TreeRoot","React","children","rest","ref","TreeList","Tree","TreeCollapsible","TreeCollapsibleContent","TreeCollapsibleTrigger","TreeItem","TreeIcon","TreeText"],"mappings":"0XAYO,MAAMA,EAAWC,EAAM,WAC5B,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAEpBH,EAAA,cAACI,EAAA,CAAU,GAAGF,EAAM,IAAKC,EAAK,KAAK,MAAA,EAChCF,CACH,CAGN,EAEaI,EAAO,OAAO,OAAON,EAAU,CAC1C,YAAaO,EACb,mBAAoBC,EACpB,mBAAoBC,EACpB,KAAMC,EACN,KAAMC,EACN,KAAMC,CACR,CAAC"}

package/dist/components/tree/TreeCollapsible.js

@@ -1,2 +1,2 @@
-import{Root as m}from"@radix-ui/react-collapsible";import*as e from"react";import{styled as n}from"../../stitches.js";import{useCallbackRef as a}from"../../utilities/hooks/useCallbackRef.js";import{TreeListItem as i}from"./TreeListItem.js";const o=e.createContext({}),c=({children:r})=>{const[t,l]=a();return e.createElement(o.Provider,{value:{triggerRef:t,setTriggerRef:l}},r)},f=n(m,{width:"100%"}),s=e.forwardRef((r,t)=>e.createElement(i,{ref:t},e.createElement(c,null,e.createElement(f,{...r}))));export{s as TreeCollapsible,o as TreeCollapsibleContext};
+import{Root as m}from"@radix-ui/react-collapsible";import*as e from"react";import{styled as a}from"../../styled.js";import{useCallbackRef as n}from"../../utilities/hooks/useCallbackRef.js";import{TreeListItem as f}from"./TreeListItem.js";const o=e.createContext({}),i=({children:r})=>{const[t,l]=n();return e.createElement(o.Provider,{value:{triggerRef:t,setTriggerRef:l}},r)},s=a(m,{base:["w-full"]}),c=e.forwardRef((r,t)=>e.createElement(f,{ref:t},e.createElement(i,null,e.createElement(s,{...r}))));export{c as TreeCollapsible,o as TreeCollapsibleContext};
 //# sourceMappingURL=TreeCollapsible.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeCollapsible.js","sources":["../../../src/components/tree/TreeCollapsible.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { useCallbackRef } from '~/utilities/hooks/useCallbackRef'\n\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 = styled(Root, {\n  width: '100%'\n})\n\ntype TreeCollapsibleProps = React.ComponentProps<typeof Root> &\n  React.ComponentProps<typeof StyledCollapsibleTreeItemRoot>\nexport const TreeCollapsible = React.forwardRef(\n  (\n    props: TreeCollapsibleProps,\n    ref: React.ForwardedRef<HTMLLIElement>\n  ): JSX.Element => {\n    return (\n      <TreeListItem ref={ref}>\n        <TreeCollapsibleProvider>\n          <StyledCollapsibleTreeItemRoot {...props} />\n        </TreeCollapsibleProvider>\n      </TreeListItem>\n    )\n  }\n)\n"],"names":["TreeCollapsibleContext","React","TreeCollapsibleProvider","children","triggerRef","setTriggerRef","useCallbackRef","StyledCollapsibleTreeItemRoot","styled","Root","TreeCollapsible","props","ref","TreeListItem"],"mappings":"sPAYaA,EACXC,EAAM,cAA2C,CAAE,CAAA,EAC/CC,EAA0B,CAAC,CAAE,SAAAC,CAAS,IAAM,CAChD,KAAM,CAACC,EAAYC,CAAa,EAAIC,IACpC,OACEL,EAAA,cAACD,EAAuB,SAAvB,CAAgC,MAAO,CAAE,WAAAI,EAAY,cAAAC,CAAc,GACjEF,CACH,CAEJ,EAEMI,EAAgCC,EAAOC,EAAM,CACjD,MAAO,MACT,CAAC,EAIYC,EAAkBT,EAAM,WACnC,CACEU,EACAC,IAGEX,EAAA,cAACY,EAAA,CAAa,IAAKD,GACjBX,EAAA,cAACC,EAAA,KACCD,EAAA,cAACM,EAAA,CAA+B,GAAGI,CAAO,CAAA,CAC5C,CACF,CAGN"}
+{"version":3,"file":"TreeCollapsible.js","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'\n\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 = styled(Root, {\n  base: ['w-full']\n})\n\ntype TreeCollapsibleProps = React.ComponentProps<typeof Root> &\n  React.ComponentProps<typeof StyledCollapsibleTreeItemRoot>\nexport const TreeCollapsible = React.forwardRef(\n  (\n    props: TreeCollapsibleProps,\n    ref: React.ForwardedRef<HTMLLIElement>\n  ): JSX.Element => {\n    return (\n      <TreeListItem ref={ref}>\n        <TreeCollapsibleProvider>\n          <StyledCollapsibleTreeItemRoot {...props} />\n        </TreeCollapsibleProvider>\n      </TreeListItem>\n    )\n  }\n)\n"],"names":["TreeCollapsibleContext","React","TreeCollapsibleProvider","children","triggerRef","setTriggerRef","useCallbackRef","StyledCollapsibleTreeItemRoot","styled","Root","TreeCollapsible","props","ref","TreeListItem"],"mappings":"oPAYaA,EACXC,EAAM,cAA2C,CAAE,CAAA,EAC/CC,EAA0B,CAAC,CAAE,SAAAC,CAAS,IAAM,CAChD,KAAM,CAACC,EAAYC,CAAa,EAAIC,IACpC,OACEL,EAAA,cAACD,EAAuB,SAAvB,CAAgC,MAAO,CAAE,WAAAI,EAAY,cAAAC,CAAc,CACjEF,EAAAA,CACH,CAEJ,EAEMI,EAAgCC,EAAOC,EAAM,CACjD,KAAM,CAAC,QAAQ,CACjB,CAAC,EAIYC,EAAkBT,EAAM,WACnC,CACEU,EACAC,IAGEX,EAAA,cAACY,EAAA,CAAa,IAAKD,GACjBX,EAAA,cAACC,EAAA,KACCD,EAAA,cAACM,EAAA,CAA+B,GAAGI,CAAO,CAAA,CAC5C,CACF,CAGN"}

package/dist/components/tree/TreeCollapsibleContent.js

@@ -1,2 +1,2 @@
-import{Content as a}from"@radix-ui/react-collapsible";import t from"react";import{styled as s}from"../../stitches.js";import{TreeCollapsibleContext as p}from"./TreeCollapsible.js";import{TreeList as c}from"./TreeList.js";const i=s(a,{'&[data-state="open"]':{},'&[data-state="closed"]':{display:"none"}}),f=t.forwardRef(({children:o,...n},l)=>{const{triggerRef:e}=t.useContext(p);return t.createElement(i,{onKeyDown:r=>{!(e!=null&&e.current)||r.key==="Escape"&&(r.stopPropagation(),r.preventDefault(),e.current.focus(),e.current.click())},...n,asChild:!0},t.createElement(c,{ref:l,role:"group"},o))});export{f as TreeCollapsibleContent};
+import{Content as a}from"@radix-ui/react-collapsible";import t from"react";import{styled as s}from"../../styled.js";import{TreeCollapsibleContext as c}from"./TreeCollapsible.js";import{TreeList as i}from"./TreeList.js";const p=s(a,{base:["data-[state=closed]:hidden"]}),f=t.forwardRef(({children:o,...n},l)=>{const{triggerRef:e}=t.useContext(c);return t.createElement(p,{onKeyDown:r=>{e!=null&&e.current&&r.key==="Escape"&&(r.stopPropagation(),r.preventDefault(),e.current.focus(),e.current.click())},...n,asChild:!0},t.createElement(i,{ref:l,role:"group"},o))});export{f as TreeCollapsibleContent};
 //# sourceMappingURL=TreeCollapsibleContent.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeCollapsibleContent.js","sources":["../../../src/components/tree/TreeCollapsibleContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-collapsible'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeList } from './TreeList'\n\nconst StyledTreeCollapsibleContent = styled(Content, {\n  '&[data-state=\"open\"]': {},\n  '&[data-state=\"closed\"]': {\n    display: 'none'\n  }\n})\n\ntype TreeCollapsibleContentProps = React.ComponentProps<\n  typeof StyledTreeCollapsibleContent\n> &\n  React.ComponentProps<typeof TreeList>\n\nexport const TreeCollapsibleContent: React.ForwardRefExoticComponent<TreeCollapsibleContentProps> =\n  React.forwardRef(({ children, ...rest }, ref): JSX.Element => {\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      <StyledTreeCollapsibleContent\n        onKeyDown={handleOnKeydown}\n        {...rest}\n        asChild\n      >\n        <TreeList ref={ref} role=\"group\">\n          {children}\n        </TreeList>\n      </StyledTreeCollapsibleContent>\n    )\n  })\n"],"names":["StyledTreeCollapsibleContent","styled","Content","TreeCollapsibleContent","React","children","rest","ref","triggerRef","TreeCollapsibleContext","e","TreeList"],"mappings":"6NAQA,MAAMA,EAA+BC,EAAOC,EAAS,CACnD,uBAAwB,CAAA,EACxB,yBAA0B,CACxB,QAAS,MACX,CACF,CAAC,EAOYC,EACXC,EAAM,WAAW,CAAC,CAAE,SAAAC,KAAaC,CAAK,EAAGC,IAAqB,CAC5D,KAAM,CAAE,WAAAC,CAAW,EAAIJ,EAAM,WAAWK,CAAsB,EAY9D,OACEL,EAAA,cAACJ,EAAA,CACC,UAZqBU,GAAM,CACzB,EAACF,GAAA,MAAAA,EAAY,UACbE,EAAE,MAAQ,WACZA,EAAE,gBAAA,EACFA,EAAE,iBACFF,EAAW,QAAQ,QACnBA,EAAW,QAAQ,MAEvB,EAAA,EAKK,GAAGF,EACJ,QAAO,EAAA,EAEPF,EAAA,cAACO,EAAA,CAAS,IAAKJ,EAAK,KAAK,OACtBF,EAAAA,CACH,CACF,CAEJ,CAAC"}
+{"version":3,"file":"TreeCollapsibleContent.js","sources":["../../../src/components/tree/TreeCollapsibleContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-collapsible'\nimport React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeList } from './TreeList'\n\nconst StyledTreeCollapsibleContent = styled(Content, {\n  base: ['data-[state=closed]:hidden']\n})\n\ntype TreeCollapsibleContentProps = React.ComponentProps<\n  typeof StyledTreeCollapsibleContent\n> &\n  React.ComponentProps<typeof TreeList>\n\nexport const TreeCollapsibleContent = React.forwardRef<\n  HTMLElement,\n  TreeCollapsibleContentProps\n>(({ children, ...rest }, ref): JSX.Element => {\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    <StyledTreeCollapsibleContent onKeyDown={handleOnKeydown} {...rest} asChild>\n      <TreeList ref={ref} role=\"group\">\n        {children}\n      </TreeList>\n    </StyledTreeCollapsibleContent>\n  )\n})\n"],"names":["StyledTreeCollapsibleContent","styled","Content","TreeCollapsibleContent","React","children","rest","ref","triggerRef","TreeCollapsibleContext","e","TreeList"],"mappings":"2NAQA,MAAMA,EAA+BC,EAAOC,EAAS,CACnD,KAAM,CAAC,4BAA4B,CACrC,CAAC,EAOYC,EAAyBC,EAAM,WAG1C,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAAqB,CAC7C,KAAM,CAAE,WAAAC,CAAW,EAAIJ,EAAM,WAAWK,CAAsB,EAY9D,OACEL,EAAA,cAACJ,EAAA,CAA6B,UAXPU,GAAM,CACxBF,GAAA,MAAAA,EAAY,SACbE,EAAE,MAAQ,WACZA,EAAE,gBAAgB,EAClBA,EAAE,eAAA,EACFF,EAAW,QAAQ,MAAM,EACzBA,EAAW,QAAQ,QAEvB,EAG6D,GAAGF,EAAM,QAAO,EAAA,EACzEF,EAAA,cAACO,EAAA,CAAS,IAAKJ,EAAK,KAAK,OACtBF,EAAAA,CACH,CACF,CAEJ,CAAC"}

package/dist/components/tree/TreeCollapsibleTrigger.js

@@ -1,2 +1,2 @@
-import{ChevronDown as p}from"@atom-learning/icons";import{Trigger as f}from"@radix-ui/react-collapsible";import e from"react";import{ActionIcon as d}from"../action-icon/ActionIcon.js";import{StyledIcon as r,Icon as g}from"../icon/Icon.js";import{styled as a}from"../../stitches.js";import{TreeCollapsibleContext as u}from"./TreeCollapsible.js";import{TreeItemContent as C}from"./TreeItemContent.js";const T=a(C,{cursor:"pointer"}),b=a(d,{position:"absolute",left:0,top:0,pointerEvents:"none",[`${r}`]:{transition:"transform 300ms"},[`&[data-state="closed"] > ${r}`]:{transform:"rotate(-90deg)"},[`&[data-state="open"] > ${r}`]:{transform:"rotate(0deg)"}}),h=({children:m,label:s,...t})=>{const{setTriggerRef:c,triggerRef:n}=e.useContext(u);return e.createElement(T,{...t,onClick:o=>{var l,i;(l=t.onClick)==null||l.call(t,o),(i=n==null?void 0:n.current)==null||i.click()}},e.createElement(f,{asChild:!0},e.createElement(b,{size:"sm",ref:c,label:s,theme:"neutral",hasTooltip:!1,onClick:o=>o.stopPropagation()},e.createElement(g,{is:p}))),m)};export{h as TreeCollapsibleTrigger};
+import{ChevronDown as c}from"@atom-learning/icons";import{Trigger as p}from"@radix-ui/react-collapsible";import e from"react";import{ActionIcon as f}from"../action-icon/ActionIcon.js";import{Icon as g}from"../icon/Icon.js";import{styled as i}from"../../styled.js";import{TreeCollapsibleContext as u}from"./TreeCollapsible.js";import{TreeItemContent as d}from"./TreeItemContent.js";const C=i(d,{base:["cursor-pointer"]}),b=i(f,{base:["absolute","left-0","top-0","pointer-events-none","[&_svg]:duration-300","[&_svg]:transition-transform","[&[data-state=closed]>svg]:-rotate-90","[&[data-state=open]>svg]:rotate-0"]}),v=({children:a,label:s,...t})=>{const{setTriggerRef:m,triggerRef:r}=e.useContext(u);return e.createElement(C,{...t,onClick:o=>{var n,l;(n=t.onClick)==null||n.call(t,o),(l=r==null?void 0:r.current)==null||l.click()}},e.createElement(p,{asChild:!0},e.createElement(b,{size:"sm",ref:m,label:s,theme:"neutral",hasTooltip:!1,onClick:o=>o.stopPropagation()},e.createElement(g,{is:c}))),a)};export{v as TreeCollapsibleTrigger};
 //# sourceMappingURL=TreeCollapsibleTrigger.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeCollapsibleTrigger.js","sources":["../../../src/components/tree/TreeCollapsibleTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Icon, StyledIcon } from '~/components/icon'\nimport { styled } from '~/stitches'\n\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeItemContent } from './TreeItemContent'\n\nconst StyledTreeCollapsibleTrigger = styled(TreeItemContent, {\n  cursor: 'pointer'\n})\n\nconst StyledActionIcon = styled(ActionIcon, {\n  position: 'absolute',\n  left: 0,\n  top: 0,\n  pointerEvents: 'none',\n  [`${StyledIcon}`]: {\n    transition: 'transform 300ms'\n  },\n  [`&[data-state=\"closed\"] > ${StyledIcon}`]: {\n    transform: 'rotate(-90deg)'\n  },\n  [`&[data-state=\"open\"] > ${StyledIcon}`]: {\n    transform: 'rotate(0deg)'\n  }\n})\n\ntype TNavigationMenuCollapsibleTriggerProps = React.ComponentProps<\n  typeof TreeItemContent\n> & {\n  label: string\n}\n\nexport const TreeCollapsibleTrigger = ({\n  children,\n  label,\n  ...rest\n}: TNavigationMenuCollapsibleTriggerProps) => {\n  const { setTriggerRef, triggerRef } = React.useContext(TreeCollapsibleContext)\n\n  return (\n    <StyledTreeCollapsibleTrigger\n      {...rest}\n      onClick={(event) => {\n        rest.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: PointerEvent) => e.stopPropagation()}\n        >\n          <Icon is={ChevronDown} />\n        </StyledActionIcon>\n      </Trigger>\n      {children}\n    </StyledTreeCollapsibleTrigger>\n  )\n}\n"],"names":["StyledTreeCollapsibleTrigger","styled","TreeItemContent","StyledActionIcon","ActionIcon","StyledIcon","TreeCollapsibleTrigger","children","label","rest","setTriggerRef","triggerRef","React","TreeCollapsibleContext","event","_a","_b","Trigger","e","Icon","ChevronDown"],"mappings":"+YAWA,MAAMA,EAA+BC,EAAOC,EAAiB,CAC3D,OAAQ,SACV,CAAC,EAEKC,EAAmBF,EAAOG,EAAY,CAC1C,SAAU,WACV,KAAM,EACN,IAAK,EACL,cAAe,OACf,CAAC,GAAGC,KAAe,CACjB,WAAY,iBACd,EACA,CAAC,4BAA4BA,KAAe,CAC1C,UAAW,gBACb,EACA,CAAC,0BAA0BA,KAAe,CACxC,UAAW,cACb,CACF,CAAC,EAQYC,EAAyB,CAAC,CACrC,SAAAC,EACA,MAAAC,KACGC,CACL,IAA8C,CAC5C,KAAM,CAAE,cAAAC,EAAe,WAAAC,CAAW,EAAIC,EAAM,WAAWC,CAAsB,EAE7E,OACED,EAAA,cAACZ,EAAA,CACE,GAAGS,EACJ,QAAUK,GAAU,CA/C1B,IAAAC,EAAAC,GAgDQD,EAAAN,EAAK,UAAL,MAAAM,EAAA,KAAAN,EAAeK,CACfE,GAAAA,EAAAL,GAAA,KAAAA,OAAAA,EAAY,UAAZ,MAAAK,EAAqB,MACvB,CAAA,CAAA,EAEAJ,EAAA,cAACK,EAAA,CAAQ,QAAO,EACdL,EAAAA,EAAA,cAACT,EAAA,CACC,KAAK,KACL,IAAKO,EACL,MAAOF,EACP,MAAM,UACN,WAAY,GACZ,QAAUU,GAAoBA,EAAE,iBAEhCN,EAAAA,EAAA,cAACO,EAAA,CAAK,GAAIC,CAAAA,CAAa,CACzB,CACF,EACCb,CACH,CAEJ"}
+{"version":3,"file":"TreeCollapsibleTrigger.js","sources":["../../../src/components/tree/TreeCollapsibleTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/styled'\n\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeItemContent } from './TreeItemContent'\n\nconst StyledTreeCollapsibleTrigger = styled(TreeItemContent, {\n  base: ['cursor-pointer']\n})\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 TNavigationMenuCollapsibleTriggerProps = React.ComponentProps<\n  typeof TreeItemContent\n> & {\n  label: string\n}\n\nexport const TreeCollapsibleTrigger = ({\n  children,\n  label,\n  ...rest\n}: TNavigationMenuCollapsibleTriggerProps) => {\n  const { setTriggerRef, triggerRef } = React.useContext(TreeCollapsibleContext)\n\n  return (\n    <StyledTreeCollapsibleTrigger\n      {...rest}\n      onClick={(event) => {\n        rest.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: PointerEvent) => e.stopPropagation()}\n        >\n          <Icon is={ChevronDown} />\n        </StyledActionIcon>\n      </Trigger>\n      {children}\n    </StyledTreeCollapsibleTrigger>\n  )\n}\n"],"names":["StyledTreeCollapsibleTrigger","styled","TreeItemContent","StyledActionIcon","ActionIcon","TreeCollapsibleTrigger","children","label","rest","setTriggerRef","triggerRef","React","TreeCollapsibleContext","event","_a","_b","Trigger","e","Icon","ChevronDown"],"mappings":"6XAWA,MAAMA,EAA+BC,EAAOC,EAAiB,CAC3D,KAAM,CAAC,gBAAgB,CACzB,CAAC,EAEKC,EAAmBF,EAAOG,EAAY,CAC1C,KAAM,CACJ,WACA,SACA,QACA,sBACA,uBACA,+BACA,wCACA,mCACF,CACF,CAAC,EAQYC,EAAyB,CAAC,CACrC,SAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IAA8C,CAC5C,KAAM,CAAE,cAAAC,EAAe,WAAAC,CAAW,EAAIC,EAAM,WAAWC,CAAsB,EAE7E,OACED,EAAA,cAACX,EAAA,CACE,GAAGQ,EACJ,QAAUK,GAAU,CA5C1B,IAAAC,EAAAC,GA6CQD,EAAAN,EAAK,UAAL,MAAAM,EAAA,KAAAN,EAAeK,CAAAA,GACfE,EAAAL,GAAA,KAAA,OAAAA,EAAY,UAAZ,MAAAK,EAAqB,MAAA,CACvB,CAEAJ,EAAAA,EAAA,cAACK,EAAA,CAAQ,QAAO,IACdL,EAAA,cAACR,EAAA,CACC,KAAK,KACL,IAAKM,EACL,MAAOF,EACP,MAAM,UACN,WAAY,GACZ,QAAUU,GAAoBA,EAAE,mBAEhCN,EAAA,cAACO,EAAA,CAAK,GAAIC,CAAa,CAAA,CACzB,CACF,EACCb,CACH,CAEJ"}

package/dist/components/tree/TreeIcon.js

@@ -1,2 +1,2 @@
-import*as o from"react";import{Icon as r}from"../icon/Icon.js";import{styled as t}from"../../stitches.js";const m=t(r,{flexShrink:0,alignSelf:"start",my:"$1"}),n=e=>o.createElement(m,{size:"md",...e});export{n as TreeIcon};
+import*as o from"react";import{Icon as r}from"../icon/Icon.js";import{styled as t}from"../../styled.js";const m=t(r,{base:["shrink-0","self-start","my-1"]}),s=e=>o.createElement(m,{size:"md",...e});export{s as TreeIcon};
 //# sourceMappingURL=TreeIcon.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeIcon.js","sources":["../../../src/components/tree/TreeIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/stitches'\n\nconst StyledTreeIcon = styled(Icon, {\n  flexShrink: 0,\n  alignSelf: 'start',\n  my: '$1'\n})\nexport const TreeIcon = (\n  props: React.ComponentProps<typeof StyledTreeIcon>\n): JSX.Element => <StyledTreeIcon size=\"md\" {...props} />\n"],"names":["StyledTreeIcon","styled","Icon","TreeIcon","props","React"],"mappings":"0GAKA,MAAMA,EAAiBC,EAAOC,EAAM,CAClC,WAAY,EACZ,UAAW,QACX,GAAI,IACN,CAAC,EACYC,EACXC,GACgBC,EAAA,cAACL,EAAA,CAAe,KAAK,KAAM,GAAGI,CAAO,CAAA"}
+{"version":3,"file":"TreeIcon.js","sources":["../../../src/components/tree/TreeIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/styled'\n\nconst StyledTreeIcon = styled(Icon, {\n  base: ['shrink-0', 'self-start', 'my-1']\n})\n\nexport const TreeIcon = (\n  props: React.ComponentProps<typeof StyledTreeIcon>\n): JSX.Element => <StyledTreeIcon size=\"md\" {...props} />\n"],"names":["StyledTreeIcon","styled","Icon","TreeIcon","props","React"],"mappings":"wGAKA,MAAMA,EAAiBC,EAAOC,EAAM,CAClC,KAAM,CAAC,WAAY,aAAc,MAAM,CACzC,CAAC,EAEYC,EACXC,GACgBC,EAAA,cAACL,EAAA,CAAe,KAAK,KAAM,GAAGI,CAAO,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"TreeItem.js","sources":["../../../src/components/tree/TreeItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { TreeItemContent } from './TreeItemContent'\nimport { TreeListItem } from './TreeListItem'\n\ntype TreeItemProps = React.ComponentProps<typeof TreeItemContent>\n\nexport const TreeItem = ({ children, ...rest }: TreeItemProps): JSX.Element => {\n  return (\n    <TreeListItem>\n      <TreeItemContent {...rest}>{children}</TreeItemContent>\n    </TreeListItem>\n  )\n}\n"],"names":["TreeItem","children","rest","React","TreeListItem","TreeItemContent"],"mappings":"6HAOa,MAAAA,EAAW,CAAC,CAAE,SAAAC,KAAaC,CAAK,IAEzCC,EAAA,cAACC,EAAA,KACCD,EAAA,cAACE,EAAA,CAAiB,GAAGH,CAAAA,EAAOD,CAAS,CACvC"}
+{"version":3,"file":"TreeItem.js","sources":["../../../src/components/tree/TreeItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { TreeItemContent } from './TreeItemContent'\nimport { TreeListItem } from './TreeListItem'\n\ntype TreeItemProps = React.ComponentProps<typeof TreeItemContent>\n\nexport const TreeItem = ({ children, ...rest }: TreeItemProps): JSX.Element => {\n  return (\n    <TreeListItem>\n      <TreeItemContent {...rest}>{children}</TreeItemContent>\n    </TreeListItem>\n  )\n}\n"],"names":["TreeItem","children","rest","React","TreeListItem","TreeItemContent"],"mappings":"6HAOa,MAAAA,EAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,IAEzCC,EAAA,cAACC,EAAA,KACCD,EAAA,cAACE,EAAA,CAAiB,GAAGH,CAAAA,EAAOD,CAAS,CACvC"}

package/dist/components/tree/TreeItemContent.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Flex as n}from"../flex/Flex.js";import{Icon as i}from"../icon/Icon.js";import{styled as p}from"../../stitches.js";import{TreeIcon as l}from"./TreeIcon.js";import{TreeText as a}from"./TreeText.js";const f=p(n,{width:"100%",position:"relative",minHeight:"$3",pl:"$6"}),c=t.forwardRef(({children:r,...o},m)=>t.createElement(f,{gap:2,align:"center",ref:m,...o},t.Children.map(r,e=>typeof e=="string"||typeof e=="number"?t.createElement(a,null,e):t.isValidElement(e)&&e.type===i?t.createElement(l,{...e.props}):e)));export{c as TreeItemContent};
+import*as r from"react";import{Flex as n}from"../flex/Flex.js";import{Icon as l}from"../icon/Icon.js";import{styled as i}from"../../styled.js";import{TreeIcon as p}from"./TreeIcon.js";import{TreeText as f}from"./TreeText.js";const a=i(n,{base:["w-full","relative","min-h-8","pl-10"]}),c=r.forwardRef(({children:t,...o},m)=>r.createElement(a,{gap:2,align:"center",ref:m,...o},r.Children.map(t,e=>typeof e=="string"||typeof e=="number"?r.createElement(f,null,e):r.isValidElement(e)&&e.type===l?r.createElement(p,{...e.props}):e)));export{c as TreeItemContent};
 //# sourceMappingURL=TreeItemContent.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeItemContent.js","sources":["../../../src/components/tree/TreeItemContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/stitches'\n\nimport { TreeIcon } from './TreeIcon'\nimport { TreeText } from './TreeText'\n\nconst StyledItemContent = styled(Flex, {\n  width: '100%',\n  position: 'relative',\n  minHeight: '$3',\n  pl: '$6'\n})\n\ntype TreeItemContentProps = React.ComponentProps<typeof Flex>\n\nexport const TreeItemContent = React.forwardRef(\n  (\n    { children, ...rest }: TreeItemContentProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ): JSX.Element => {\n    return (\n      <StyledItemContent gap={2} align=\"center\" ref={ref} {...rest}>\n        {\n          React.Children.map(children, (child) => {\n            if (typeof child === 'string' || typeof child === 'number') {\n              return <TreeText>{child}</TreeText>\n            }\n            if (React.isValidElement(child) && child.type === Icon) {\n              return <TreeIcon {...child.props} />\n            }\n            return child\n          }) as React.ReactElement[]\n        }\n      </StyledItemContent>\n    )\n  }\n)\n"],"names":["StyledItemContent","styled","Flex","TreeItemContent","React","children","rest","ref","child","TreeText","Icon","TreeIcon"],"mappings":"mOASA,MAAMA,EAAoBC,EAAOC,EAAM,CACrC,MAAO,OACP,SAAU,WACV,UAAW,KACX,GAAI,IACN,CAAC,EAIYC,EAAkBC,EAAM,WACnC,CACE,CAAE,SAAAC,KAAaC,CAAK,EACpBC,IAGEH,EAAA,cAACJ,EAAA,CAAkB,IAAK,EAAG,MAAM,SAAS,IAAKO,EAAM,GAAGD,GAEpDF,EAAM,SAAS,IAAIC,EAAWG,GACxB,OAAOA,GAAU,UAAY,OAAOA,GAAU,SACzCJ,EAAA,cAACK,EAAA,KAAUD,CAAM,EAEtBJ,EAAM,eAAeI,CAAK,GAAKA,EAAM,OAASE,EACzCN,EAAA,cAACO,EAAA,CAAU,GAAGH,EAAM,KAAO,CAAA,EAE7BA,CACR,CAEL,CAGN"}
+{"version":3,"file":"TreeItemContent.js","sources":["../../../src/components/tree/TreeItemContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/styled'\n\nimport { TreeIcon } from './TreeIcon'\nimport { TreeText } from './TreeText'\n\nconst StyledItemContent = styled(Flex, {\n  base: ['w-full', 'relative', 'min-h-8', 'pl-10']\n})\n\ntype TreeItemContentProps = React.ComponentProps<typeof Flex>\n\nexport const TreeItemContent = React.forwardRef(\n  (\n    { children, ...rest }: TreeItemContentProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ): JSX.Element => {\n    return (\n      <StyledItemContent gap={2} align=\"center\" ref={ref} {...rest}>\n        {\n          React.Children.map(children, (child) => {\n            if (typeof child === 'string' || typeof child === 'number') {\n              return <TreeText>{child}</TreeText>\n            }\n            if (React.isValidElement(child) && child.type === Icon) {\n              return <TreeIcon {...child.props} />\n            }\n            return child\n          }) as React.ReactElement[]\n        }\n      </StyledItemContent>\n    )\n  }\n)\n"],"names":["StyledItemContent","styled","Flex","TreeItemContent","React","children","rest","ref","child","TreeText","Icon","TreeIcon"],"mappings":"iOASA,MAAMA,EAAoBC,EAAOC,EAAM,CACrC,KAAM,CAAC,SAAU,WAAY,UAAW,OAAO,CACjD,CAAC,EAIYC,EAAkBC,EAAM,WACnC,CACE,CAAE,SAAAC,EAAU,GAAGC,CAAK,EACpBC,IAGEH,EAAA,cAACJ,EAAA,CAAkB,IAAK,EAAG,MAAM,SAAS,IAAKO,EAAM,GAAGD,GAEpDF,EAAM,SAAS,IAAIC,EAAWG,GACxB,OAAOA,GAAU,UAAY,OAAOA,GAAU,SACzCJ,EAAA,cAACK,EAAA,KAAUD,CAAM,EAEtBJ,EAAM,eAAeI,CAAK,GAAKA,EAAM,OAASE,EACzCN,EAAA,cAACO,EAAA,CAAU,GAAGH,EAAM,KAAO,CAAA,EAE7BA,CACR,CAEL,CAGN"}

package/dist/components/tree/TreeList.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Flex as r}from"../flex/Flex.js";import{styled as m}from"../../stitches.js";const i=m(r,{width:"100%",p:0,m:0,listStyle:"none","& &":{pl:"$space$4"}}),l=e.forwardRef((t,o)=>e.createElement(i,{as:"ul",ref:o,...t,direction:"column"}));export{l as TreeList};
+import*as e from"react";import{Flex as t}from"../flex/Flex.js";import{styled as l}from"../../styled.js";const m=l(t,{base:["w-full","p-0","m-0","list-none","in-[&]:pl-4"]}),s=e.forwardRef((o,r)=>e.createElement(m,{as:"ul",ref:r,...o,direction:"column"}));export{s as TreeList};
 //# sourceMappingURL=TreeList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeList.js","sources":["../../../src/components/tree/TreeList.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/stitches'\n\nconst StyledList = styled(Flex, {\n  width: '100%',\n  p: 0,\n  m: 0,\n  listStyle: 'none',\n  '& &': {\n    pl: '$space$4'\n  }\n})\n\ntype TreeListProps = Omit<React.ComponentProps<typeof Flex>, 'direction'>\n\nexport const TreeList: React.ForwardRefExoticComponent<TreeListProps> =\n  React.forwardRef((props, ref) => (\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore: Stitches polymorphic components issue due to `as=\"ul\"`\n    <StyledList as=\"ul\" ref={ref} {...props} direction=\"column\" />\n  ))\n"],"names":["StyledList","styled","Flex","TreeList","React","props","ref"],"mappings":"0GAKA,MAAMA,EAAaC,EAAOC,EAAM,CAC9B,MAAO,OACP,EAAG,EACH,EAAG,EACH,UAAW,OACX,MAAO,CACL,GAAI,UACN,CACF,CAAC,EAIYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAGvBF,EAAA,cAACJ,EAAA,CAAW,GAAG,KAAK,IAAKM,EAAM,GAAGD,EAAO,UAAU,QAAA,CAAS,CAC7D"}
+{"version":3,"file":"TreeList.js","sources":["../../../src/components/tree/TreeList.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/styled'\n\nconst StyledList = styled(Flex, {\n  base: ['w-full', 'p-0', 'm-0', 'list-none', 'in-[&]:pl-4']\n})\n\ntype TreeListProps = Omit<React.ComponentProps<typeof Flex>, 'direction'>\n\nexport const TreeList = React.forwardRef<HTMLElement, TreeListProps>(\n  (props, ref) => (\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore: Stitches polymorphic components issue due to `as=\"ul\"`\n    <StyledList as=\"ul\" ref={ref} {...props} direction=\"column\" />\n  )\n)\n"],"names":["StyledList","styled","Flex","TreeList","React","props","ref"],"mappings":"wGAKA,MAAMA,EAAaC,EAAOC,EAAM,CAC9B,KAAM,CAAC,SAAU,MAAO,MAAO,YAAa,aAAa,CAC3D,CAAC,EAIYC,EAAWC,EAAM,WAC5B,CAACC,EAAOC,IAGNF,EAAA,cAACJ,EAAA,CAAW,GAAG,KAAK,IAAKM,EAAM,GAAGD,EAAO,UAAU,SAAS,CAEhE"}

package/dist/components/tree/TreeListItem.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Flex as o}from"../flex/Flex.js";import{styled as i}from"../../stitches.js";const m=i(o,{"&:not(:first-child)":{mt:"$0"}}),f=e.forwardRef((t,r)=>e.createElement(m,{as:"li",gap:2,align:"center",...t,ref:r,role:"treeitem"}));export{f as TreeListItem};
+import*as e from"react";import{Flex as o}from"../flex/Flex.js";import{styled as m}from"../../styled.js";const i=m(o,{base:["not-first:mt-0.5"]}),s=e.forwardRef((t,r)=>e.createElement(i,{as:"li",gap:2,align:"center",...t,ref:r,role:"treeitem"}));export{s as TreeListItem};
 //# sourceMappingURL=TreeListItem.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeListItem.js","sources":["../../../src/components/tree/TreeListItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/stitches'\n\ntype TreeListItemProps = React.ComponentProps<typeof Flex>\n\nconst StyledTreeListItem = styled(Flex, {\n  '&:not(:first-child)': {\n    mt: '$0'\n  }\n})\n\nexport const TreeListItem = React.forwardRef(\n  (\n    props: TreeListItemProps,\n    ref: React.ForwardedRef<HTMLLIElement>\n  ): JSX.Element => {\n    return (\n      <StyledTreeListItem\n        as=\"li\"\n        gap={2}\n        align=\"center\"\n        {...props}\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore: Stitches polymorphic components issue due to `as=\"li\"`\n        ref={ref}\n        role=\"treeitem\"\n      />\n    )\n  }\n)\n"],"names":["StyledTreeListItem","styled","Flex","TreeListItem","React","props","ref"],"mappings":"0GAOA,MAAMA,EAAqBC,EAAOC,EAAM,CACtC,sBAAuB,CACrB,GAAI,IACN,CACF,CAAC,EAEYC,EAAeC,EAAM,WAChC,CACEC,EACAC,IAGEF,EAAA,cAACJ,EAAA,CACC,GAAG,KACH,IAAK,EACL,MAAM,SACL,GAAGK,EAGJ,IAAKC,EACL,KAAK,UAAA,CACP,CAGN"}
+{"version":3,"file":"TreeListItem.js","sources":["../../../src/components/tree/TreeListItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { styled } from '~/styled'\n\ntype TreeListItemProps = React.ComponentProps<typeof Flex>\n\nconst StyledTreeListItem = styled(Flex, {\n  base: ['not-first:mt-0.5']\n})\n\nexport const TreeListItem = React.forwardRef(\n  (\n    props: TreeListItemProps,\n    ref: React.ForwardedRef<HTMLLIElement>\n  ): JSX.Element => {\n    return (\n      <StyledTreeListItem\n        as=\"li\"\n        gap={2}\n        align=\"center\"\n        {...props}\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore: Stitches polymorphic components issue due to `as=\"li\"`\n        ref={ref}\n        role=\"treeitem\"\n      />\n    )\n  }\n)\n"],"names":["StyledTreeListItem","styled","Flex","TreeListItem","React","props","ref"],"mappings":"wGAOA,MAAMA,EAAqBC,EAAOC,EAAM,CACtC,KAAM,CAAC,kBAAkB,CAC3B,CAAC,EAEYC,EAAeC,EAAM,WAChC,CACEC,EACAC,IAGEF,EAAA,cAACJ,EAAA,CACC,GAAG,KACH,IAAK,EACL,MAAM,SACL,GAAGK,EAGJ,IAAKC,EACL,KAAK,WACP,CAGN"}

package/dist/components/tree/TreeText.js

@@ -1,2 +1,2 @@
-import o from"react";import{Text as t}from"../text/Text.js";import{styled as r}from"../../stitches.js";const i=r.withConfig({shouldForwardStitchesProp:e=>["as"].includes(e)})(t,{py:"$0",whiteSpace:"nowrap",overflowX:"hidden",textOverflow:"ellipsis"}),s=e=>o.createElement(i,{size:"md",as:"span",...e,noCapsize:!0});export{s as TreeText};
+import t from"react";import{Text as o}from"../text/Text.js";import{styled as p}from"../../styled.js";const r=p(o,{base:["py-0.5","whitespace-nowrap","overflow-x-hidden","text-ellipsis"]}),s=e=>t.createElement(r,{size:"md",as:"span",...e,noCapsize:!0});export{s as TreeText};
 //# sourceMappingURL=TreeText.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TreeText.js","sources":["../../../src/components/tree/TreeText.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '~/components/text'\nimport { styled } from '~/stitches'\n\ntype TStyledTreeTextProps = React.ComponentProps<typeof Text>\n\nconst StyledTreeText = styled.withConfig({\n  shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Text, {\n  py: '$0',\n  whiteSpace: 'nowrap',\n  overflowX: 'hidden',\n  textOverflow: 'ellipsis'\n})\n\nexport const TreeText = (props: TStyledTreeTextProps): JSX.Element => {\n  return <StyledTreeText size=\"md\" as=\"span\" {...props} noCapsize />\n}\n"],"names":["StyledTreeText","styled","propName","Text","TreeText","props","React"],"mappings":"uGAOA,MAAMA,EAAiBC,EAAO,WAAW,CACvC,0BAA4BC,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAAM,CACP,GAAI,KACJ,WAAY,SACZ,UAAW,SACX,aAAc,UAChB,CAAC,EAEYC,EAAYC,GAChBC,EAAA,cAACN,EAAA,CAAe,KAAK,KAAK,GAAG,OAAQ,GAAGK,EAAO,UAAS,EAAC,CAAA"}
+{"version":3,"file":"TreeText.js","sources":["../../../src/components/tree/TreeText.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '~/components/text'\nimport { styled } from '~/styled'\n\ntype TStyledTreeTextProps = React.ComponentProps<typeof Text>\n\nconst StyledTreeText = styled(Text, {\n  base: ['py-0.5', 'whitespace-nowrap', 'overflow-x-hidden', 'text-ellipsis']\n})\n\nexport const TreeText = (props: TStyledTreeTextProps): JSX.Element => {\n  return <StyledTreeText size=\"md\" as=\"span\" {...props} noCapsize />\n}\n"],"names":["StyledTreeText","styled","Text","TreeText","props","React"],"mappings":"qGAOA,MAAMA,EAAiBC,EAAOC,EAAM,CAClC,KAAM,CAAC,SAAU,oBAAqB,oBAAqB,eAAe,CAC5E,CAAC,EAEYC,EAAYC,GAChBC,EAAA,cAACL,EAAA,CAAe,KAAK,KAAK,GAAG,OAAQ,GAAGI,EAAO,UAAS,EAAC,CAAA"}

package/dist/components/video/Video.js

@@ -1,2 +1,2 @@
-import*as e from"react";import m from"react-player/vimeo";import{Box as p}from"../box/Box.js";import{styled as a}from"../../stitches.js";import{CSSWrapper as f}from"../../utilities/css-wrapper/CSSWrapper.js";const l=a(m,{}),o=e.forwardRef(({id:r,ratio:t=9/16,css:i,...s},d)=>e.createElement(f,{css:i},e.createElement(p,{css:{borderRadius:"$0",position:"relative",paddingTop:`${t*100}%`,overflow:"hidden",height:0,width:"100%"}},e.createElement(l,{...s,role:"figure",url:`https://player.vimeo.com/video/${r}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:d}))));o.displayName="Video";export{o as Video};
+import*as e from"react";import m from"react-player/vimeo";import{CSSWrapper as s}from"../../utilities/css-wrapper/CSSWrapper.js";const t=e.forwardRef(({id:o,ratio:r=9/16,className:a,...i},l)=>e.createElement(s,{className:a},e.createElement("div",{style:{"--ratio":"".concat(r*100,"%")},className:"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)"},e.createElement(m,{...i,role:"figure",url:"https://player.vimeo.com/video/".concat(o),height:"100%",width:"100%",ref:l,className:"absolute top-0 left-0"}))));t.displayName="Video";export{t as Video};
 //# sourceMappingURL=Video.js.map

package/dist/components/video/Video.js.map

@@ -1 +1 @@
-{"version":3,"file":"Video.js","sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size  https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo'\n\nimport { Box } from '~/components/box'\nimport { CSS, styled } from '~/stitches'\nimport { CSSWrapper } from '~/utilities/css-wrapper'\nimport { Override } from '~/utilities/types'\n\nconst StyledVideo = styled(ReactPlayer, {})\n\ntype VideoProps = Override<\n  React.ComponentProps<typeof StyledVideo>,\n  {\n    id: string\n    ratio?: number\n    css?: CSS\n  }\n>\n\nexport const Video: React.ForwardRefExoticComponent<VideoProps> =\n  React.forwardRef(({ id, ratio = 9 / 16, css, ...remainingProps }, ref) => (\n    <CSSWrapper css={css}>\n      <Box\n        css={{\n          borderRadius: '$0',\n          position: 'relative',\n          paddingTop: `${ratio * 100}%`,\n          overflow: 'hidden',\n          height: 0,\n          width: '100%'\n        }}\n      >\n        <StyledVideo\n          {...remainingProps}\n          role=\"figure\"\n          url={`https://player.vimeo.com/video/${id}`}\n          height=\"100%\"\n          width=\"100%\"\n          css={{ position: 'absolute', top: 0, left: 0 }}\n          ref={ref}\n        />\n      </Box>\n    </CSSWrapper>\n  ))\n\nVideo.displayName = 'Video'\n"],"names":["StyledVideo","styled","ReactPlayer","Video","React","id","ratio","css","remainingProps","ref","CSSWrapper","Box"],"mappings":"gNASA,MAAMA,EAAcC,EAAOC,EAAa,CAAA,CAAE,EAW7BC,EACXC,EAAM,WAAW,CAAC,CAAE,GAAAC,EAAI,MAAAC,EAAQ,EAAI,GAAI,IAAAC,KAAQC,CAAe,EAAGC,IAChEL,EAAA,cAACM,EAAA,CAAW,IAAKH,CAAAA,EACfH,EAAA,cAACO,EAAA,CACC,IAAK,CACH,aAAc,KACd,SAAU,WACV,WAAY,GAAGL,EAAQ,OACvB,SAAU,SACV,OAAQ,EACR,MAAO,MACT,CAAA,EAEAF,EAAA,cAACJ,EAAA,CACE,GAAGQ,EACJ,KAAK,SACL,IAAK,kCAAkCH,IACvC,OAAO,OACP,MAAM,OACN,IAAK,CAAE,SAAU,WAAY,IAAK,EAAG,KAAM,CAAE,EAC7C,IAAKI,CAAAA,CACP,CACF,CACF,CACD,EAEHN,EAAM,YAAc"}
+{"version":3,"file":"Video.js","sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size  https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo'\n\nimport { CSSWrapper } from '~/utilities/css-wrapper'\nimport { Override } from '~/utilities/types'\n\ntype VideoProps = Override<\n  React.ComponentProps<typeof ReactPlayer>,\n  {\n    id: string\n    ratio?: number\n    className?: string\n  }\n>\n\nexport const Video = React.forwardRef<any, VideoProps>(\n  ({ id, ratio = 9 / 16, className, ...remainingProps }, ref) => (\n    <CSSWrapper className={className}>\n      <div\n        style={{ '--ratio': `${ratio * 100}%` }}\n        className=\"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)\"\n      >\n        <ReactPlayer\n          {...remainingProps}\n          role=\"figure\"\n          url={`https://player.vimeo.com/video/${id}`}\n          height=\"100%\"\n          width=\"100%\"\n          ref={ref}\n          className=\"absolute top-0 left-0\"\n        />\n      </div>\n    </CSSWrapper>\n  )\n)\n\nVideo.displayName = 'Video'\n"],"names":["Video","React","id","ratio","className","remainingProps","ref","CSSWrapper","ReactPlayer"],"mappings":"uIAgBaA,EAAQC,EAAM,WACzB,CAAC,CAAE,GAAAC,EAAI,MAAAC,EAAQ,EAAI,GAAI,UAAAC,EAAW,GAAGC,CAAe,EAAGC,IACrDL,EAAA,cAACM,EAAA,CAAW,UAAWH,CAAAA,EACrBH,EAAA,cAAC,MAAA,CACC,MAAO,CAAE,UAAW,GAAG,OAAAE,EAAQ,IAAG,GAAI,CAAA,EACtC,UAAU,6DAAA,EAEVF,EAAA,cAACO,EAAA,CACE,GAAGH,EACJ,KAAK,SACL,IAAK,kCAAkC,OAAAH,CAAAA,EACvC,OAAO,OACP,MAAM,OACN,IAAKI,EACL,UAAU,wBACZ,CACF,CACF,CAEJ,EAEAN,EAAM,YAAc"}