@atom-learning/components 5.13.0 → 6.0.0-beta.0

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{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"color2k";import{slideDownAndFade as s,slideLeftAndFade as l,slideUpAndFade as p,slideRightAndFade as f}from"../../utilities/style/keyframe-animations.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";const c=t(m,{backgroundColor:"$grey900",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,whiteSpace:"normal",px:"$3",py:"$2",zIndex:10,"@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="delayed-open"]':{'&[data-side="top"]':{animationName:s},'&[data-side="right"]':{animationName:l},'&[data-side="bottom"]':{animationName:p},'&[data-side="left"]':{animationName:f}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),g=t(r,{fill:"$grey900",'[data-align="end"] &':{mr:"$2"},'[data-align="start"] &':{ml:"$2"}}),h=({children:e,side:a="top",sideOffset:o=4,size:n="md",...d})=>i.createElement(c,{side:a,sideOffset:o,size:n,...d},e,i.createElement(g,null));export{h 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 { 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: 10,\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","slideDownAndFade","slideLeftAndFade","slideUpAndFade","slideRightAndFade","StyledArrow","Arrow","TooltipContent","children","side","sideOffset","size","remainingProps","React"],"mappings":"oZAWA,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,OAAQ,GACR,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,EAAcN,EAAOO,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,cAACf,EAAA,CACC,KAAMW,EACN,WAAYC,EACZ,KAAMC,EACL,GAAGC,GAEHJ,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 200ms 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 p}from"../../styled.js";import{useWindowScrollPosition as c}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}=c();return r.createElement(p,{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 200ms 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,4BACZ,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}\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.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,EAAM,GAAGC,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"}

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.ForwardRefExoticComponent<TreeProps> =\n  React.forwardRef(({ children, ...rest }, ref) => {\n    return (\n      <TreeList {...rest} ref={ref} role=\"tree\">\n        {children}\n      </TreeList>\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,EACXC,EAAM,WAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAErCH,EAAA,cAACI,EAAA,CAAU,GAAGF,EAAM,IAAKC,EAAK,KAAK,MAAA,EAChCF,CACH,CAEH,EAEUI,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 r 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=r.forwardRef(({children:o,...n},l)=>{const{triggerRef:e}=r.useContext(c);return r.createElement(p,{onKeyDown:t=>{e!=null&&e.current&&t.key==="Escape"&&(t.stopPropagation(),t.preventDefault(),e.current.focus(),e.current.click())},...n,asChild:!0},r.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.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":"2NAQA,MAAMA,EAA+BC,EAAOC,EAAS,CACnD,KAAM,CAAC,4BAA4B,CACrC,CAAC,EAOYC,EACXC,EAAM,WAAW,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAAqB,CAC5D,KAAM,CAAE,WAAAC,CAAW,EAAIJ,EAAM,WAAWK,CAAsB,EAY9D,OACEL,EAAA,cAACJ,EAAA,CACC,UAZqBU,GAAM,CACxBF,GAAA,MAAAA,EAAY,SACbE,EAAE,MAAQ,WACZA,EAAE,gBAAgB,EAClBA,EAAE,eAAA,EACFF,EAAW,QAAQ,MAAM,EACzBA,EAAW,QAAQ,QAEvB,EAKK,GAAGF,EACJ,QAAO,EAAA,EAEPF,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 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"../../stitches.js";import{TreeCollapsibleContext as d}from"./TreeCollapsible.js";import{TreeItemContent as u}from"./TreeItemContent.js";const C=i(u,{cursor:"pointer"}),v=i(f,{position:"absolute",left:0,top:0,pointerEvents:"none","& svg":{transition:"transform 300ms"},'&[data-state="closed"] > svg':{transform:"rotate(-90deg)"},'&[data-state="open"] > svg':{transform:"rotate(0deg)"}}),T=({children:a,label:s,...t})=>{const{setTriggerRef:m,triggerRef:r}=e.useContext(d);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(v,{size:"sm",ref:m,label:s,theme:"neutral",hasTooltip:!1,onClick:o=>o.stopPropagation()},e.createElement(g,{is:c}))),a)};export{T 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 } 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  '& svg': {\n    transition: 'transform 300ms'\n  },\n  '&[data-state=\"closed\"] > svg': {\n    transform: 'rotate(-90deg)'\n  },\n  '&[data-state=\"open\"] > svg': {\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","TreeCollapsibleTrigger","children","label","rest","setTriggerRef","triggerRef","React","TreeCollapsibleContext","event","_a","_b","Trigger","e","Icon","ChevronDown"],"mappings":"+XAWA,MAAMA,EAA+BC,EAAOC,EAAiB,CAC3D,OAAQ,SACV,CAAC,EAEKC,EAAmBF,EAAOG,EAAY,CAC1C,SAAU,WACV,KAAM,EACN,IAAK,EACL,cAAe,OACf,QAAS,CACP,WAAY,iBACd,EACA,+BAAgC,CAC9B,UAAW,gBACb,EACA,6BAA8B,CAC5B,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,cAACX,EAAA,CACE,GAAGQ,EACJ,QAAUK,GAAU,CA/C1B,IAAAC,EAAAC,GAgDQD,EAAAN,EAAK,UAAL,MAAAM,EAAA,KAAAN,EAAeK,CACfE,GAAAA,EAAAL,GAAA,KAAA,OAAAA,EAAY,UAAZ,MAAAK,EAAqB,OACvB,GAEAJ,EAAA,cAACK,EAAA,CAAQ,QAAO,EACdL,EAAAA,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"}
+{"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.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":"wGAKA,MAAMA,EAAaC,EAAOC,EAAM,CAC9B,KAAM,CAAC,SAAU,MAAO,MAAO,YAAa,aAAa,CAC3D,CAAC,EAIYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAGvBF,EAAA,cAACJ,EAAA,CAAW,GAAG,KAAK,IAAKM,EAAM,GAAGD,EAAO,UAAU,SAAS,CAC7D"}

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 d from"react-player/vimeo";import{Box as m}from"../box/Box.js";import{styled as p}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const f=p(d,{}),o=e.forwardRef(({id:r,ratio:t=9/16,css:i,...s},a)=>e.createElement(l,{css:i},e.createElement(m,{style:{"--ratio":`${t*100}%`},css:{borderRadius:"$0",position:"relative",paddingTop:"var(--ratio)",overflow:"hidden",height:0,width:"100%"}},e.createElement(f,{...s,role:"figure",url:`https://player.vimeo.com/video/${r}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:a}))));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        style={{ '--ratio': `${ratio * 100}%` }}\n        css={{\n          borderRadius: '$0',\n          position: 'relative',\n          paddingTop: 'var(--ratio)',\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,CAAE,CAAA,EAW7BC,EACXC,EAAM,WAAW,CAAC,CAAE,GAAAC,EAAI,MAAAC,EAAQ,EAAI,GAAI,IAAAC,KAAQC,CAAe,EAAGC,IAChEL,EAAA,cAACM,EAAA,CAAW,IAAKH,CACfH,EAAAA,EAAA,cAACO,EAAA,CACC,MAAO,CAAE,UAAW,GAAGL,EAAQ,MAAO,EACtC,IAAK,CACH,aAAc,KACd,SAAU,WACV,WAAY,eACZ,SAAU,SACV,OAAQ,EACR,MAAO,MACT,GAEAF,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.ForwardRefExoticComponent<VideoProps> =\n  React.forwardRef(\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,EACXC,EAAM,WACJ,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,EAEFN,EAAM,YAAc"}

package/dist/experiments/color-scheme/ColorScheme.config.js

@@ -0,0 +1,2 @@
+const m=({prefix:e,colorName:o,color0:l=""})=>{const r={};let c=1;l&&(r["--".concat(e,"-").concat(c)]="var(--color-".concat(l,")"),c++);let t=1;for(c;c<=11;c++)r["--".concat(e,"-").concat(c)]="var(--color-".concat(o,"-").concat(t*100,")"),t++;for(let n in r)r[n]===void 0&&delete r[n];return r},a={};a["interactive-loContrast"]={"--interactive-foreground":"var(--foreground)","--interactive-1":"var(--accent-1)","--interactive-2":"var(--accent-2)","--interactive-3":"var(--accent-3)"},a["interactive-hiContrast"]={"--interactive-foreground":"var(--foreground-7-plus)","--interactive-1":"var(--accent-9)","--interactive-2":"var(--accent-10)","--interactive-3":"var(--accent-11)"};const i={primary1:{colorName:"primary",color0:"white"},primary2:{colorName:"primary"},grey1:{colorName:"grey",color0:"white"},grey2:{colorName:"grey"},blue1:{colorName:"blue",color0:"white"},blue2:{colorName:"blue"},pink1:{colorName:"pink",color0:"white"},pink2:{colorName:"pink"},purple1:{colorName:"purple",color0:"white"},purple2:{colorName:"purple"},cyan1:{colorName:"cyan",color0:"white"},cyan2:{colorName:"cyan"},green1:{colorName:"green",color0:"white"},green2:{colorName:"green"},magenta1:{colorName:"magenta",color0:"white"},magenta2:{colorName:"magenta"},red1:{colorName:"red",color0:"white"},red2:{colorName:"red"},teal1:{colorName:"teal",color0:"white"},teal2:{colorName:"teal"},orange1:{colorName:"orange",color0:"white"},orange2:{colorName:"orange"},yellow1:{colorName:"yellow",color0:"white"},yellow2:{colorName:"yellow"},lime1:{colorName:"lime",color0:"white"},lime2:{colorName:"lime"}},N={primary1:{colorName:"primary",color0:"white"},primary2:{colorName:"primary"},grey1:{colorName:"grey",color0:"white"},grey2:{colorName:"grey"},blue1:{colorName:"blue",color0:"white"},blue2:{colorName:"blue"},pink1:{colorName:"pink",color0:"white"},pink2:{colorName:"pink"},purple1:{colorName:"purple",color0:"white"},purple2:{colorName:"purple"},cyan1:{colorName:"cyan",color0:"white"},cyan2:{colorName:"cyan"},green1:{colorName:"green",color0:"white"},green2:{colorName:"green"},magenta1:{colorName:"magenta",color0:"white"},magenta2:{colorName:"magenta"},red1:{colorName:"red",color0:"white"},red2:{colorName:"red"},teal1:{colorName:"teal",color0:"white"},teal2:{colorName:"teal"},orange1:{colorName:"orange",color0:"white"},orange2:{colorName:"orange"},yellow1:{colorName:"yellow",color0:"white"},yellow2:{colorName:"yellow"},lime1:{colorName:"lime",color0:"white"},lime2:{colorName:"lime"}};Object.entries(i).forEach(([e,o])=>{const l="base-".concat(e);a[l]={"--foreground":"var(--color-grey-1000)","--foreground-7-plus":"var(--color-white)",...m({prefix:"base",colorName:o.colorName,color0:o.color0})}}),Object.entries(N).forEach(([e,o])=>{a["accent-".concat(e)]=m({prefix:"accent",colorName:o.colorName,color0:o.color0})});export{N as accents,i as bases,a as colorSchemes};
+//# sourceMappingURL=ColorScheme.config.js.map

package/dist/experiments/color-scheme/ColorScheme.config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorScheme.config.js","sources":["../../../src/experiments/color-scheme/ColorScheme.config.ts"],"sourcesContent":["type ColorSchemeKeys = 'interactive' | 'base' | 'accent' | 'foreground'\n\ntype ColorScheme = Partial<\n  Record<\n    `--${ColorSchemeKeys}` | `--${ColorSchemeKeys}-${string}`,\n    `var(${string})`\n  >\n>\n\ntype ColorSchemeConfig = { colorName: string; color0?: string }\n\nconst generateColors = ({\n  prefix,\n  colorName,\n  color0 = ''\n}: {\n  prefix: ColorSchemeKeys\n  colorName: string\n  color0?: string\n}): ColorScheme => {\n  const colors: ColorScheme = {}\n  let i = 1\n  if (color0) {\n    colors[`--${prefix}-${i}`] = `var(--color-${color0})`\n    i++\n  }\n  let k = 1\n  for (i; i <= 11; i++) {\n    colors[`--${prefix}-${i}`] = `var(--color-${colorName}-${k * 100})`\n    k++\n  }\n  for (let key in colors) {\n    if (colors[key] === undefined) {\n      delete colors[key]\n    }\n  }\n  return colors as Required<ColorScheme>\n}\n\nexport const colorSchemes: Record<string, ColorScheme> = {}\n\ncolorSchemes['interactive-loContrast'] = {\n  '--interactive-foreground': 'var(--foreground)',\n  '--interactive-1': 'var(--accent-1)',\n  '--interactive-2': 'var(--accent-2)',\n  '--interactive-3': 'var(--accent-3)'\n}\n\ncolorSchemes['interactive-hiContrast'] = {\n  '--interactive-foreground': 'var(--foreground-7-plus)',\n  '--interactive-1': 'var(--accent-9)',\n  '--interactive-2': 'var(--accent-10)',\n  '--interactive-3': 'var(--accent-11)'\n}\n\nexport const bases = {\n  primary1: { colorName: 'primary', color0: 'white' },\n  primary2: { colorName: 'primary' },\n  grey1: { colorName: 'grey', color0: 'white' },\n  grey2: { colorName: 'grey' },\n  blue1: { colorName: 'blue', color0: 'white' },\n  blue2: { colorName: 'blue' },\n  pink1: { colorName: 'pink', color0: 'white' },\n  pink2: { colorName: 'pink' },\n  purple1: { colorName: 'purple', color0: 'white' },\n  purple2: { colorName: 'purple' },\n  cyan1: { colorName: 'cyan', color0: 'white' },\n  cyan2: { colorName: 'cyan' },\n  green1: { colorName: 'green', color0: 'white' },\n  green2: { colorName: 'green' },\n  magenta1: { colorName: 'magenta', color0: 'white' },\n  magenta2: { colorName: 'magenta' },\n  red1: { colorName: 'red', color0: 'white' },\n  red2: { colorName: 'red' },\n  teal1: { colorName: 'teal', color0: 'white' },\n  teal2: { colorName: 'teal' },\n  orange1: { colorName: 'orange', color0: 'white' },\n  orange2: { colorName: 'orange' },\n  yellow1: { colorName: 'yellow', color0: 'white' },\n  yellow2: { colorName: 'yellow' },\n  lime1: { colorName: 'lime', color0: 'white' },\n  lime2: { colorName: 'lime' }\n} satisfies Record<string, ColorSchemeConfig>\n\nexport const accents = {\n  primary1: { colorName: 'primary', color0: 'white' },\n  primary2: { colorName: 'primary' },\n  grey1: { colorName: 'grey', color0: 'white' },\n  grey2: { colorName: 'grey' },\n  blue1: { colorName: 'blue', color0: 'white' },\n  blue2: { colorName: 'blue' },\n  pink1: { colorName: 'pink', color0: 'white' },\n  pink2: { colorName: 'pink' },\n  purple1: { colorName: 'purple', color0: 'white' },\n  purple2: { colorName: 'purple' },\n  cyan1: { colorName: 'cyan', color0: 'white' },\n  cyan2: { colorName: 'cyan' },\n  green1: { colorName: 'green', color0: 'white' },\n  green2: { colorName: 'green' },\n  magenta1: { colorName: 'magenta', color0: 'white' },\n  magenta2: { colorName: 'magenta' },\n  red1: { colorName: 'red', color0: 'white' },\n  red2: { colorName: 'red' },\n  teal1: { colorName: 'teal', color0: 'white' },\n  teal2: { colorName: 'teal' },\n  orange1: { colorName: 'orange', color0: 'white' },\n  orange2: { colorName: 'orange' },\n  yellow1: { colorName: 'yellow', color0: 'white' },\n  yellow2: { colorName: 'yellow' },\n  lime1: { colorName: 'lime', color0: 'white' },\n  lime2: { colorName: 'lime' }\n} satisfies Record<string, ColorSchemeConfig>\n;(() => {\n  Object.entries(bases).forEach(\n    ([name, config]: [string, ColorSchemeConfig]) => {\n      const themeName = `base-${name}`\n      colorSchemes[themeName] = {\n        '--foreground': 'var(--color-grey-1000)',\n        '--foreground-7-plus': 'var(--color-white)',\n        ...generateColors({\n          prefix: 'base',\n          colorName: config.colorName,\n          color0: config.color0\n        })\n      }\n    }\n  )\n\n  Object.entries(accents).forEach(\n    ([name, config]: [string, ColorSchemeConfig]) => {\n      colorSchemes[`accent-${name}`] = generateColors({\n        prefix: 'accent',\n        colorName: config.colorName,\n        color0: config.color0\n      })\n    }\n  )\n})()\n"],"names":["generateColors","prefix","colorName","color0","colors","i","k","key","colorSchemes","bases","accents","name","config","themeName"],"mappings":"AAWA,MAAMA,EAAiB,CAAC,CACtB,OAAAC,EACA,UAAAC,EACA,OAAAC,EAAS,EACX,IAImB,CACjB,MAAMC,EAAsB,CAAA,EAC5B,IAAIC,EAAI,EACJF,IACFC,EAAO,KAAK,OAAAH,EAAM,GAAI,EAAA,OAAAI,CAAG,CAAA,EAAI,eAAe,OAAAF,EAAM,GAClDE,EAAAA,KAEF,IAAIC,EAAI,EACR,IAAKD,EAAGA,GAAK,GAAIA,IACfD,EAAO,KAAK,OAAAH,EAAM,GAAI,EAAA,OAAAI,CAAG,CAAA,EAAI,eAAe,OAAAH,EAAS,GAAA,EAAI,OAAAI,EAAI,IAAG,GAAA,EAChEA,IAEF,QAASC,KAAOH,EACVA,EAAOG,CAAG,IAAM,QAClB,OAAOH,EAAOG,CAAG,EAGrB,OAAOH,CACT,EAEaI,EAA4C,CAEzD,EAAAA,EAAa,wBAAwB,EAAI,CACvC,2BAA4B,oBAC5B,kBAAmB,kBACnB,kBAAmB,kBACnB,kBAAmB,iBACrB,EAEAA,EAAa,wBAAwB,EAAI,CACvC,2BAA4B,2BAC5B,kBAAmB,kBACnB,kBAAmB,mBACnB,kBAAmB,kBACrB,EAEO,MAAMC,EAAQ,CACnB,SAAU,CAAE,UAAW,UAAW,OAAQ,OAAQ,EAClD,SAAU,CAAE,UAAW,SAAU,EACjC,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,QAAS,CAAE,UAAW,SAAU,OAAQ,OAAQ,EAChD,QAAS,CAAE,UAAW,QAAS,EAC/B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,OAAQ,CAAE,UAAW,QAAS,OAAQ,OAAQ,EAC9C,OAAQ,CAAE,UAAW,OAAQ,EAC7B,SAAU,CAAE,UAAW,UAAW,OAAQ,OAAQ,EAClD,SAAU,CAAE,UAAW,SAAU,EACjC,KAAM,CAAE,UAAW,MAAO,OAAQ,OAAQ,EAC1C,KAAM,CAAE,UAAW,KAAM,EACzB,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,QAAS,CAAE,UAAW,SAAU,OAAQ,OAAQ,EAChD,QAAS,CAAE,UAAW,QAAS,EAC/B,QAAS,CAAE,UAAW,SAAU,OAAQ,OAAQ,EAChD,QAAS,CAAE,UAAW,QAAS,EAC/B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,CAC7B,EAEaC,EAAU,CACrB,SAAU,CAAE,UAAW,UAAW,OAAQ,OAAQ,EAClD,SAAU,CAAE,UAAW,SAAU,EACjC,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,QAAS,CAAE,UAAW,SAAU,OAAQ,OAAQ,EAChD,QAAS,CAAE,UAAW,QAAS,EAC/B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,OAAQ,CAAE,UAAW,QAAS,OAAQ,OAAQ,EAC9C,OAAQ,CAAE,UAAW,OAAQ,EAC7B,SAAU,CAAE,UAAW,UAAW,OAAQ,OAAQ,EAClD,SAAU,CAAE,UAAW,SAAU,EACjC,KAAM,CAAE,UAAW,MAAO,OAAQ,OAAQ,EAC1C,KAAM,CAAE,UAAW,KAAM,EACzB,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,EAC3B,QAAS,CAAE,UAAW,SAAU,OAAQ,OAAQ,EAChD,QAAS,CAAE,UAAW,QAAS,EAC/B,QAAS,CAAE,UAAW,SAAU,OAAQ,OAAQ,EAChD,QAAS,CAAE,UAAW,QAAS,EAC/B,MAAO,CAAE,UAAW,OAAQ,OAAQ,OAAQ,EAC5C,MAAO,CAAE,UAAW,MAAO,CAC7B,EAEE,OAAO,QAAQD,CAAK,EAAE,QACpB,CAAC,CAACE,EAAMC,CAAM,IAAmC,CAC/C,MAAMC,EAAY,QAAQ,OAAAF,CAC1B,EAAAH,EAAaK,CAAS,EAAI,CACxB,eAAgB,yBAChB,sBAAuB,qBACvB,GAAGb,EAAe,CAChB,OAAQ,OACR,UAAWY,EAAO,UAClB,OAAQA,EAAO,MACjB,CAAC,CACH,CACF,CACF,EAEA,OAAO,QAAQF,CAAO,EAAE,QACtB,CAAC,CAACC,EAAMC,CAAM,IAAmC,CAC/CJ,EAAa,UAAU,OAAAG,CAAM,CAAA,EAAIX,EAAe,CAC9C,OAAQ,SACR,UAAWY,EAAO,UAClB,OAAQA,EAAO,MACjB,CAAC,CACH,CACF"}

package/dist/experiments/color-scheme/ColorScheme.js

@@ -1,2 +1,2 @@
-import{Slot as f}from"@radix-ui/react-slot";import*as o from"react";import{styled as p}from"../../stitches.js";import{colorSchemes as e}from"./stitches.colorscheme.config.js";const d=p("div"),r=o.forwardRef(({base:t="",accent:a="",interactive:c="",className:m,asChild:i=!1,...s},l)=>{const n=[m,e[`interactive-${c}`],e[`accent-${a}`],e[`base-${t}`]].filter(Boolean).join(" ");return o.createElement(i?f:d,{ref:l,className:n,...s})});r.displayName="ColorScheme";export{r as ColorScheme};
+import{Slot as l}from"@radix-ui/react-slot";import*as o from"react";import{colorSchemes as e}from"./ColorScheme.config.js";const c=o.forwardRef(({base:t="",accent:r="",interactive:a="",asChild:m=!1,...i},n)=>o.createElement(m?l:"div",{...i,ref:n,style:{...e["interactive-".concat(a)],...e["accent-".concat(r)],...e["base-".concat(t)]}}));c.displayName="ColorScheme";export{c as ColorScheme};
 //# sourceMappingURL=ColorScheme.js.map

package/dist/experiments/color-scheme/ColorScheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorScheme.js","sources":["../../../src/experiments/color-scheme/ColorScheme.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { accents, bases, colorSchemes } from './stitches.colorscheme.config'\n\nexport type TcolorScheme = {\n  base?: keyof typeof bases\n  accent?: keyof typeof accents\n  interactive?: 'loContrast' | 'hiContrast'\n}\n\ntype TColorSchemeOwnProps = TcolorScheme & {\n  asChild?: boolean\n}\n\nconst StyledColorScheme = styled('div')\n\ntype TColorSchemeProps = React.ComponentProps<typeof StyledColorScheme> &\n  TColorSchemeOwnProps\n\n/**\n * @experimental Component has not been finalised. Further design input required. Use with caution.\n */\nexport const ColorScheme: React.ForwardRefExoticComponent<TColorSchemeProps> =\n  React.forwardRef(\n    (\n      {\n        base = '',\n        accent = '',\n        interactive = '',\n        className,\n        asChild = false,\n        ...rest\n      },\n      ref\n    ) => {\n      const c = [\n        className,\n        colorSchemes[`interactive-${interactive}`],\n        colorSchemes[`accent-${accent}`],\n        colorSchemes[`base-${base}`]\n      ]\n        .filter(Boolean)\n        .join(' ')\n\n      const Component = asChild ? Slot : StyledColorScheme\n      return <Component ref={ref} className={c} {...rest} />\n    }\n  )\n\nColorScheme.displayName = 'ColorScheme'\n"],"names":["StyledColorScheme","styled","ColorScheme","React","base","accent","interactive","className","asChild","rest","ref","c","colorSchemes","Slot"],"mappings":"+KAiBA,MAAMA,EAAoBC,EAAO,KAAK,EAQzBC,EACXC,EAAM,WACJ,CACE,CACE,KAAAC,EAAO,GACP,OAAAC,EAAS,GACT,YAAAC,EAAc,GACd,UAAAC,EACA,QAAAC,EAAU,MACPC,CACL,EACAC,IACG,CACH,MAAMC,EAAI,CACRJ,EACAK,EAAa,eAAeN,KAC5BM,EAAa,UAAUP,KACvBO,EAAa,QAAQR,IACvB,EACG,OAAO,OAAO,EACd,KAAK,GAAG,EAGX,OAAOD,EAAA,cADWK,EAAUK,EAAOb,EAC3B,CAAU,IAAKU,EAAK,UAAWC,EAAI,GAAGF,CAAAA,CAAM,CACtD,CACF,EAEFP,EAAY,YAAc"}
+{"version":3,"file":"ColorScheme.js","sources":["../../../src/experiments/color-scheme/ColorScheme.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { accents, bases, colorSchemes } from './ColorScheme.config'\n\nexport type TcolorScheme = {\n  base?: keyof typeof bases\n  accent?: keyof typeof accents\n  interactive?: 'loContrast' | 'hiContrast'\n}\n\ntype TColorSchemeOwnProps = TcolorScheme & {\n  asChild?: boolean\n}\n\ntype TColorSchemeProps = React.HTMLAttributes<HTMLDivElement> &\n  TColorSchemeOwnProps\n\n/**\n * @experimental Component has not been finalised. Further design input required. Use with caution.\n */\nexport const ColorScheme: React.ForwardRefExoticComponent<TColorSchemeProps> =\n  React.forwardRef(\n    (\n      { base = '', accent = '', interactive = '', asChild = false, ...rest },\n      ref\n    ) => {\n      const Component = asChild ? Slot : 'div'\n      return (\n        <Component\n          {...rest}\n          ref={ref}\n          style={{\n            ...colorSchemes[`interactive-${interactive}`],\n            ...colorSchemes[`accent-${accent}`],\n            ...colorSchemes[`base-${base}`]\n          }}\n        />\n      )\n    }\n  )\n\nColorScheme.displayName = 'ColorScheme'\n"],"names":["ColorScheme","React","base","accent","interactive","asChild","rest","ref","Slot","colorSchemes"],"mappings":"2HAqBa,MAAAA,EACXC,EAAM,WACJ,CACE,CAAE,KAAAC,EAAO,GAAI,OAAAC,EAAS,GAAI,YAAAC,EAAc,GAAI,QAAAC,EAAU,GAAO,GAAGC,CAAK,EACrEC,IAIEN,EAAA,cAFgBI,EAAUG,EAAO,MAEhC,CACE,GAAGF,EACJ,IAAKC,EACL,MAAO,CACL,GAAGE,EAAa,eAAe,OAAAL,CAAa,CAAA,EAC5C,GAAGK,EAAa,UAAU,OAAAN,CAAQ,CAAA,EAClC,GAAGM,EAAa,QAAQ,OAAAP,CAAAA,CAAM,CAChC,CAAA,CACF,CAGN,EAEFF,EAAY,YAAc"}