@atom-learning/components 6.0.0-beta.38 → 6.0.0-beta.39

package/dist/components/badge/Badge.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Flex as f}from"../flex/Flex.js";import{Icon as v}from"../icon/Icon.js";import{styled as w,Theme as k}from"../../styled.js";import{useCallbackRefState as y}from"../../utilities/hooks/useCallbackRef.js";import{colorSchemes as C,badgeSemanticNames as E}from"./Badge.colorscheme.config.js";import{BadgeContext as B,BadgeProvider as O}from"./Badge.context.js";import{BadgeIcon as a}from"./BadgeIcon.js";import{BadgeText as n}from"./BadgeText.js";import{OptionalTooltipWrapper as z}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const T=w(f,{base:["justify-center","items-center","rounded-sm","min-w-0","border","border-white","font-body","*:not-last:mr-1"],variants:{emphasis:{white:["text-(--text-on-white)","bg-white"],subtle:["text-(--text-subtle)","bg-(--background-subtle)"],bold:["text-(--text-bold)","bg-(--background-bold)"]},size:{xs:["px-1","py-0"],sm:["px-1","py-0.5"],md:["px-2","py-1"]},isClickable:{true:["cursor-pointer"]},highlighted:{true:[]}},compoundVariants:[{isClickable:!0,emphasis:"white",class:["hover:text-(--text-on-white)","hover:bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]"]},{isClickable:!0,emphasis:"subtle",class:["hover:bg-(--background-subtle-hover)","hover:text-(--text-subtle-hover)"]},{isClickable:!0,emphasis:"bold",class:["hover:bg-(--background-bold-hover)","hover:text-(--text-bold)"]},{emphasis:"white",highlighted:!0,class:["text-(--text-on-white)","bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]"]},{emphasis:"subtle",highlighted:!0,class:["text-(--text-subtle-hover)","(--bg-background-subtle-hover)"]},{emphasis:"bold",highlighted:!0,class:["text-(--text-bold)","bg-(--background-bold-hover)"]}]},{enabledResponsiveVariants:!0}),j=e.forwardRef(({theme:s="info",emphasis:r="subtle",children:i,...o},b)=>{const{size:h,overflow:c,isOverflowing:d}=e.useContext(B),[l,p]=y();e.useImperativeHandle(b,()=>l);const g=l==null?void 0:l.textContent,u=E.includes(s),x=Object.keys(o).includes("onClick")||Object.keys(o).includes("href");return e.createElement(z,{hasTooltip:c==="ellipsis"&&d,label:g},e.createElement(k,{theme:C[s]},e.createElement(T,{role:"status",emphasis:r,size:h,...o,ref:p,isClickable:x&&!u},e.Children.map(i,t=>typeof t=="string"||typeof t=="number"?e.createElement(n,null,t):e.isValidElement(t)&&t.type===v?e.createElement(a,{...t.props}):t))))}),m=e.forwardRef(({size:s="sm",overflow:r="wrap",...i},o)=>e.createElement(O,{size:s,overflow:r},e.createElement(j,{...i,ref:o}))),I=Object.assign(m,{Icon:a,Text:n});m.displayName="Badge";export{I as Badge};
+import*as e from"react";import{Flex as v}from"../flex/Flex.js";import{Icon as w}from"../icon/Icon.js";import{styled as k}from"../../styled.js";import{useCallbackRefState as y}from"../../utilities/hooks/useCallbackRef.js";import{colorSchemes as C,badgeSemanticNames as E}from"./Badge.colorscheme.config.js";import{BadgeContext as B,BadgeProvider as O}from"./Badge.context.js";import{BadgeIcon as n}from"./BadgeIcon.js";import{BadgeText as m}from"./BadgeText.js";import{OptionalTooltipWrapper as z}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const j=k(v,{base:["justify-center","items-center","rounded-sm","min-w-0","border","border-white","font-body","*:not-last:mr-1"],variants:{emphasis:{white:["text-(--text-on-white)","bg-white"],subtle:["text-(--text-subtle)","bg-(--background-subtle)"],bold:["text-(--text-bold)","bg-(--background-bold)"]},size:{xs:["px-1","py-0"],sm:["px-1","py-0.5"],md:["px-2","py-1"]},isClickable:{true:["cursor-pointer"]},highlighted:{true:[]}},compoundVariants:[{isClickable:!0,emphasis:"white",class:["hover:text-(--text-on-white)","hover:bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]"]},{isClickable:!0,emphasis:"subtle",class:["hover:bg-(--background-subtle-hover)","hover:text-(--text-subtle-hover)"]},{isClickable:!0,emphasis:"bold",class:["hover:bg-(--background-bold-hover)","hover:text-(--text-bold)"]},{emphasis:"white",highlighted:!0,class:["text-(--text-on-white)","bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]"]},{emphasis:"subtle",highlighted:!0,class:["text-(--text-subtle-hover)","(--bg-background-subtle-hover)"]},{emphasis:"bold",highlighted:!0,class:["text-(--text-bold)","bg-(--background-bold-hover)"]}]},{enabledResponsiveVariants:!0}),I=e.forwardRef(({theme:o="info",emphasis:s="subtle",children:r,style:i,...l},h)=>{const{size:c,overflow:d,isOverflowing:p}=e.useContext(B),[a,g]=y();e.useImperativeHandle(h,()=>a);const u=a==null?void 0:a.textContent,x=E.includes(o),f=Object.keys(l).includes("onClick")||Object.keys(l).includes("href");return e.createElement(z,{hasTooltip:d==="ellipsis"&&p,label:u},e.createElement(j,{role:"status",emphasis:s,size:c,style:{...C[o],...i},...l,ref:g,isClickable:f&&!x},e.Children.map(r,t=>typeof t=="string"||typeof t=="number"?e.createElement(m,null,t):e.isValidElement(t)&&t.type===w?e.createElement(n,{...t.props}):t)))}),b=e.forwardRef(({size:o="sm",overflow:s="wrap",...r},i)=>e.createElement(O,{size:o,overflow:s},e.createElement(I,{...r,ref:i}))),R=Object.assign(b,{Icon:n,Text:m});b.displayName="Badge";export{R as Badge};
 //# sourceMappingURL=Badge.js.map

package/dist/components/badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { styled, Theme } from '~/styled'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\n\nimport {\n  colorSchemes as badgeColorSchemes,\n  badgeSemanticNames\n} from './Badge.colorscheme.config'\nimport { BadgeContext, BadgeProvider } from './Badge.context'\nimport { BadgeIcon } from './BadgeIcon'\nimport { BadgeText } from './BadgeText'\n\nconst StyledBadge = styled(\n  Flex,\n  {\n    base: [\n      'justify-center',\n      'items-center',\n      'rounded-sm',\n      'min-w-0',\n      'border',\n      'border-white',\n      'font-body',\n      '*:not-last:mr-1'\n    ],\n    variants: {\n      emphasis: {\n        white: ['text-(--text-on-white)', 'bg-white'],\n        subtle: ['text-(--text-subtle)', 'bg-(--background-subtle)'],\n        bold: ['text-(--text-bold)', 'bg-(--background-bold)']\n      },\n      size: {\n        xs: ['px-1', 'py-0'],\n        sm: ['px-1', 'py-0.5'],\n        md: ['px-2', 'py-1']\n      },\n      isClickable: {\n        true: ['cursor-pointer']\n      },\n      highlighted: {\n        true: []\n      }\n    },\n    compoundVariants: [\n      {\n        isClickable: true,\n        emphasis: 'white',\n        class: [\n          'hover:text-(--text-on-white)',\n          'hover:bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]'\n        ]\n      },\n      {\n        isClickable: true,\n        emphasis: 'subtle',\n        class: [\n          'hover:bg-(--background-subtle-hover)',\n          'hover:text-(--text-subtle-hover)'\n        ]\n      },\n      {\n        isClickable: true,\n        emphasis: 'bold',\n        class: [\n          'hover:bg-(--background-bold-hover)',\n          'hover:text-(--text-bold)'\n        ]\n      },\n      {\n        emphasis: 'white',\n        highlighted: true,\n        class: [\n          'text-(--text-on-white)',\n          'bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]'\n        ]\n      },\n      {\n        emphasis: 'subtle',\n        highlighted: true,\n        class: ['text-(--text-subtle-hover)', '(--bg-background-subtle-hover)']\n      },\n      {\n        emphasis: 'bold',\n        highlighted: true,\n        class: ['text-(--text-bold)', 'bg-(--background-bold-hover)']\n      }\n    ]\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport type TBadgeProps = React.ComponentProps<typeof StyledBadge> & {\n  theme?: keyof typeof badgeColorSchemes\n  overflow?: React.ComponentProps<typeof BadgeText>['overflow']\n}\n\ntype TBadgeInnerProps = Omit<TBadgeProps, 'size' | 'overflow'>\n\nconst BadgeInner = React.forwardRef<HTMLDivElement, TBadgeInnerProps>(\n  ({ theme = 'info', emphasis = 'subtle', children, ...rest }, ref) => {\n    const { size, overflow, isOverflowing } = React.useContext(BadgeContext)\n    const [badgeElRef, setBadgeElRef] = useCallbackRefState()\n    React.useImperativeHandle(ref, () => badgeElRef as HTMLDivElement)\n\n    const label = badgeElRef?.textContent\n\n    const isInfoOnly = badgeSemanticNames.includes(theme)\n\n    const isClickable =\n      Object.keys(rest).includes('onClick') ||\n      Object.keys(rest).includes('href')\n\n    return (\n      <OptionalTooltipWrapper\n        hasTooltip={overflow === 'ellipsis' && isOverflowing}\n        label={label}\n      >\n        <Theme theme={badgeColorSchemes[theme]}>\n          <StyledBadge\n            role=\"status\"\n            emphasis={emphasis}\n            size={size}\n            {...rest}\n            ref={setBadgeElRef}\n            isClickable={isClickable && !isInfoOnly}\n          >\n            {React.Children.map(children, (child) => {\n              if (typeof child === 'string' || typeof child === 'number') {\n                return <BadgeText>{child}</BadgeText>\n              }\n              if (React.isValidElement(child) && child.type === Icon) {\n                return <BadgeIcon {...child.props} />\n              }\n              return child\n            })}\n          </StyledBadge>\n        </Theme>\n      </OptionalTooltipWrapper>\n    )\n  }\n)\n\nconst BadgeComponent = React.forwardRef<HTMLDivElement, TBadgeProps>(\n  ({ size = 'sm', overflow = 'wrap', ...rest }, ref) => {\n    return (\n      <BadgeProvider size={size} overflow={overflow}>\n        <BadgeInner {...rest} ref={ref} />\n      </BadgeProvider>\n    )\n  }\n)\n\nexport const Badge = Object.assign(BadgeComponent, {\n  Icon: BadgeIcon,\n  Text: BadgeText\n})\n\nBadgeComponent.displayName = 'Badge'\n"],"names":["StyledBadge","styled","Flex","BadgeInner","React","theme","emphasis","children","rest","ref","size","overflow","isOverflowing","BadgeContext","badgeElRef","setBadgeElRef","useCallbackRefState","label","isInfoOnly","badgeSemanticNames","isClickable","OptionalTooltipWrapper","Theme","badgeColorSchemes","child","BadgeText","Icon","BadgeIcon","BadgeComponent","BadgeProvider","Badge"],"mappings":"okBAgBA,MAAMA,EAAcC,EAClBC,EACA,CACE,KAAM,CACJ,iBACA,eACA,aACA,UACA,SACA,eACA,YACA,iBACF,EACA,SAAU,CACR,SAAU,CACR,MAAO,CAAC,yBAA0B,UAAU,EAC5C,OAAQ,CAAC,uBAAwB,0BAA0B,EAC3D,KAAM,CAAC,qBAAsB,wBAAwB,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,OAAQ,MAAM,EACnB,GAAI,CAAC,OAAQ,QAAQ,EACrB,GAAI,CAAC,OAAQ,MAAM,CACrB,EACA,YAAa,CACX,KAAM,CAAC,gBAAgB,CACzB,EACA,YAAa,CACX,KAAM,CACR,CAAA,CACF,EACA,iBAAkB,CAChB,CACE,YAAa,GACb,SAAU,QACV,MAAO,CACL,+BACA,iEACF,CACF,EACA,CACE,YAAa,GACb,SAAU,SACV,MAAO,CACL,uCACA,kCACF,CACF,EACA,CACE,YAAa,GACb,SAAU,OACV,MAAO,CACL,qCACA,0BACF,CACF,EACA,CACE,SAAU,QACV,YAAa,GACb,MAAO,CACL,yBACA,2DACF,CACF,EACA,CACE,SAAU,SACV,YAAa,GACb,MAAO,CAAC,6BAA8B,gCAAgC,CACxE,EACA,CACE,SAAU,OACV,YAAa,GACb,MAAO,CAAC,qBAAsB,8BAA8B,CAC9D,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EASMC,EAAaC,EAAM,WACvB,CAAC,CAAE,MAAAC,EAAQ,OAAQ,SAAAC,EAAW,SAAU,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAAQ,CACnE,KAAM,CAAE,KAAAC,EAAM,SAAAC,EAAU,cAAAC,CAAc,EAAIR,EAAM,WAAWS,CAAY,EACjE,CAACC,EAAYC,CAAa,EAAIC,IACpCZ,EAAM,oBAAoBK,EAAK,IAAMK,CAA4B,EAEjE,MAAMG,EAAQH,GAAA,KAAA,OAAAA,EAAY,YAEpBI,EAAaC,EAAmB,SAASd,CAAK,EAE9Ce,EACJ,OAAO,KAAKZ,CAAI,EAAE,SAAS,SAAS,GACpC,OAAO,KAAKA,CAAI,EAAE,SAAS,MAAM,EAEnC,OACEJ,EAAA,cAACiB,EAAA,CACC,WAAYV,IAAa,YAAcC,EACvC,MAAOK,CAAAA,EAEPb,EAAA,cAACkB,EAAA,CAAM,MAAOC,EAAkBlB,CAAK,CACnCD,EAAAA,EAAA,cAACJ,EAAA,CACC,KAAK,SACL,SAAUM,EACV,KAAMI,EACL,GAAGF,EACJ,IAAKO,EACL,YAAaK,GAAe,CAACF,CAE5Bd,EAAAA,EAAM,SAAS,IAAIG,EAAWiB,GACzB,OAAOA,GAAU,UAAY,OAAOA,GAAU,SACzCpB,EAAA,cAACqB,EAAA,KAAWD,CAAM,EAEvBpB,EAAM,eAAeoB,CAAK,GAAKA,EAAM,OAASE,EACzCtB,EAAA,cAACuB,EAAA,CAAW,GAAGH,EAAM,KAAA,CAAO,EAE9BA,CACR,CACH,CACF,CACF,CAEJ,CACF,EAEMI,EAAiBxB,EAAM,WAC3B,CAAC,CAAE,KAAAM,EAAO,KAAM,SAAAC,EAAW,OAAQ,GAAGH,CAAK,EAAGC,IAE1CL,EAAA,cAACyB,EAAA,CAAc,KAAMnB,EAAM,SAAUC,GACnCP,EAAA,cAACD,EAAA,CAAY,GAAGK,EAAM,IAAKC,CAAAA,CAAK,CAClC,CAGN,EAEaqB,EAAQ,OAAO,OAAOF,EAAgB,CACjD,KAAMD,EACN,KAAMF,CACR,CAAC,EAEDG,EAAe,YAAc"}
+{"version":3,"file":"Badge.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/styled'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\n\nimport {\n  colorSchemes as badgeColorSchemes,\n  badgeSemanticNames\n} from './Badge.colorscheme.config'\nimport { BadgeContext, BadgeProvider } from './Badge.context'\nimport { BadgeIcon } from './BadgeIcon'\nimport { BadgeText } from './BadgeText'\n\nconst StyledBadge = styled(\n  Flex,\n  {\n    base: [\n      'justify-center',\n      'items-center',\n      'rounded-sm',\n      'min-w-0',\n      'border',\n      'border-white',\n      'font-body',\n      '*:not-last:mr-1'\n    ],\n    variants: {\n      emphasis: {\n        white: ['text-(--text-on-white)', 'bg-white'],\n        subtle: ['text-(--text-subtle)', 'bg-(--background-subtle)'],\n        bold: ['text-(--text-bold)', 'bg-(--background-bold)']\n      },\n      size: {\n        xs: ['px-1', 'py-0'],\n        sm: ['px-1', 'py-0.5'],\n        md: ['px-2', 'py-1']\n      },\n      isClickable: {\n        true: ['cursor-pointer']\n      },\n      highlighted: {\n        true: []\n      }\n    },\n    compoundVariants: [\n      {\n        isClickable: true,\n        emphasis: 'white',\n        class: [\n          'hover:text-(--text-on-white)',\n          'hover:bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]'\n        ]\n      },\n      {\n        isClickable: true,\n        emphasis: 'subtle',\n        class: [\n          'hover:bg-(--background-subtle-hover)',\n          'hover:text-(--text-subtle-hover)'\n        ]\n      },\n      {\n        isClickable: true,\n        emphasis: 'bold',\n        class: [\n          'hover:bg-(--background-bold-hover)',\n          'hover:text-(--text-bold)'\n        ]\n      },\n      {\n        emphasis: 'white',\n        highlighted: true,\n        class: [\n          'text-(--text-on-white)',\n          'bg-[color-mix(in_srgb,(--text-on-white),transparent_92%)]'\n        ]\n      },\n      {\n        emphasis: 'subtle',\n        highlighted: true,\n        class: ['text-(--text-subtle-hover)', '(--bg-background-subtle-hover)']\n      },\n      {\n        emphasis: 'bold',\n        highlighted: true,\n        class: ['text-(--text-bold)', 'bg-(--background-bold-hover)']\n      }\n    ]\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport type TBadgeProps = React.ComponentProps<typeof StyledBadge> & {\n  theme?: keyof typeof badgeColorSchemes\n  overflow?: React.ComponentProps<typeof BadgeText>['overflow']\n}\n\ntype TBadgeInnerProps = Omit<TBadgeProps, 'size' | 'overflow'>\n\nconst BadgeInner = React.forwardRef<HTMLDivElement, TBadgeInnerProps>(\n  ({ theme = 'info', emphasis = 'subtle', children, style, ...rest }, ref) => {\n    const { size, overflow, isOverflowing } = React.useContext(BadgeContext)\n    const [badgeElRef, setBadgeElRef] = useCallbackRefState()\n    React.useImperativeHandle(ref, () => badgeElRef as HTMLDivElement)\n\n    const label = badgeElRef?.textContent\n\n    const isInfoOnly = badgeSemanticNames.includes(theme)\n\n    const isClickable =\n      Object.keys(rest).includes('onClick') ||\n      Object.keys(rest).includes('href')\n\n    return (\n      <OptionalTooltipWrapper\n        hasTooltip={overflow === 'ellipsis' && isOverflowing}\n        label={label}\n      >\n        <StyledBadge\n          role=\"status\"\n          emphasis={emphasis}\n          size={size}\n          style={{\n            ...badgeColorSchemes[theme],\n            ...style\n          }}\n          {...rest}\n          ref={setBadgeElRef}\n          isClickable={isClickable && !isInfoOnly}\n        >\n          {React.Children.map(children, (child) => {\n            if (typeof child === 'string' || typeof child === 'number') {\n              return <BadgeText>{child}</BadgeText>\n            }\n            if (React.isValidElement(child) && child.type === Icon) {\n              return <BadgeIcon {...child.props} />\n            }\n            return child\n          })}\n        </StyledBadge>\n      </OptionalTooltipWrapper>\n    )\n  }\n)\n\nconst BadgeComponent = React.forwardRef<HTMLDivElement, TBadgeProps>(\n  ({ size = 'sm', overflow = 'wrap', ...rest }, ref) => {\n    return (\n      <BadgeProvider size={size} overflow={overflow}>\n        <BadgeInner {...rest} ref={ref} />\n      </BadgeProvider>\n    )\n  }\n)\n\nexport const Badge = Object.assign(BadgeComponent, {\n  Icon: BadgeIcon,\n  Text: BadgeText\n})\n\nBadgeComponent.displayName = 'Badge'\n"],"names":["StyledBadge","styled","Flex","BadgeInner","React","theme","emphasis","children","style","rest","ref","size","overflow","isOverflowing","BadgeContext","badgeElRef","setBadgeElRef","useCallbackRefState","label","isInfoOnly","badgeSemanticNames","isClickable","OptionalTooltipWrapper","badgeColorSchemes","child","BadgeText","Icon","BadgeIcon","BadgeComponent","BadgeProvider","Badge"],"mappings":"yjBAgBA,MAAMA,EAAcC,EAClBC,EACA,CACE,KAAM,CACJ,iBACA,eACA,aACA,UACA,SACA,eACA,YACA,iBACF,EACA,SAAU,CACR,SAAU,CACR,MAAO,CAAC,yBAA0B,UAAU,EAC5C,OAAQ,CAAC,uBAAwB,0BAA0B,EAC3D,KAAM,CAAC,qBAAsB,wBAAwB,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,OAAQ,MAAM,EACnB,GAAI,CAAC,OAAQ,QAAQ,EACrB,GAAI,CAAC,OAAQ,MAAM,CACrB,EACA,YAAa,CACX,KAAM,CAAC,gBAAgB,CACzB,EACA,YAAa,CACX,KAAM,CACR,CAAA,CACF,EACA,iBAAkB,CAChB,CACE,YAAa,GACb,SAAU,QACV,MAAO,CACL,+BACA,iEACF,CACF,EACA,CACE,YAAa,GACb,SAAU,SACV,MAAO,CACL,uCACA,kCACF,CACF,EACA,CACE,YAAa,GACb,SAAU,OACV,MAAO,CACL,qCACA,0BACF,CACF,EACA,CACE,SAAU,QACV,YAAa,GACb,MAAO,CACL,yBACA,2DACF,CACF,EACA,CACE,SAAU,SACV,YAAa,GACb,MAAO,CAAC,6BAA8B,gCAAgC,CACxE,EACA,CACE,SAAU,OACV,YAAa,GACb,MAAO,CAAC,qBAAsB,8BAA8B,CAC9D,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EASMC,EAAaC,EAAM,WACvB,CAAC,CAAE,MAAAC,EAAQ,OAAQ,SAAAC,EAAW,SAAU,SAAAC,EAAU,MAAAC,EAAO,GAAGC,CAAK,EAAGC,IAAQ,CAC1E,KAAM,CAAE,KAAAC,EAAM,SAAAC,EAAU,cAAAC,CAAc,EAAIT,EAAM,WAAWU,CAAY,EACjE,CAACC,EAAYC,CAAa,EAAIC,IACpCb,EAAM,oBAAoBM,EAAK,IAAMK,CAA4B,EAEjE,MAAMG,EAAQH,GAAA,KAAA,OAAAA,EAAY,YAEpBI,EAAaC,EAAmB,SAASf,CAAK,EAE9CgB,EACJ,OAAO,KAAKZ,CAAI,EAAE,SAAS,SAAS,GACpC,OAAO,KAAKA,CAAI,EAAE,SAAS,MAAM,EAEnC,OACEL,EAAA,cAACkB,EAAA,CACC,WAAYV,IAAa,YAAcC,EACvC,MAAOK,CAAAA,EAEPd,EAAA,cAACJ,EAAA,CACC,KAAK,SACL,SAAUM,EACV,KAAMK,EACN,MAAO,CACL,GAAGY,EAAkBlB,CAAK,EAC1B,GAAGG,CACL,EACC,GAAGC,EACJ,IAAKO,EACL,YAAaK,GAAe,CAACF,CAAAA,EAE5Bf,EAAM,SAAS,IAAIG,EAAWiB,GACzB,OAAOA,GAAU,UAAY,OAAOA,GAAU,SACzCpB,EAAA,cAACqB,EAAA,KAAWD,CAAM,EAEvBpB,EAAM,eAAeoB,CAAK,GAAKA,EAAM,OAASE,EACzCtB,EAAA,cAACuB,EAAA,CAAW,GAAGH,EAAM,MAAO,EAE9BA,CACR,CACH,CACF,CAEJ,CACF,EAEMI,EAAiBxB,EAAM,WAC3B,CAAC,CAAE,KAAAO,EAAO,KAAM,SAAAC,EAAW,OAAQ,GAAGH,CAAK,EAAGC,IAE1CN,EAAA,cAACyB,EAAA,CAAc,KAAMlB,EAAM,SAAUC,GACnCR,EAAA,cAACD,EAAA,CAAY,GAAGM,EAAM,IAAKC,CAAAA,CAAK,CAClC,CAGN,EAEaoB,EAAQ,OAAO,OAAOF,EAAgB,CACjD,KAAMD,EACN,KAAMF,CACR,CAAC,EAEDG,EAAe,YAAc"}

package/dist/components/data-table/DataTable.d.ts

@@ -57,7 +57,7 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
     }, "ref"> & import("react").RefAttributes<HTMLTableElement>, "children" | "numberOfStickyColumns"> & Partial<Pick<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
         ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
     }, "theme" | "isSticky"> & {
-        theme?: "primary" | "white" | "primaryDark" | "primaryLight" | "light" | undefined;
+        theme?: "primary" | "white" | "primaryDark" | "light" | "primaryLight" | undefined;
         isSticky?: boolean | undefined;
     } & {
         as?: import("react").ElementType;
@@ -111,7 +111,7 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
     Head: ({ sortable, theme, isSticky, stickyOffset, showTotalInFirstColumn, totalSuffix, style, className, ...props }: Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
         ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
     }, "theme" | "isSticky"> & {
-        theme?: "primary" | "white" | "primaryDark" | "primaryLight" | "light" | undefined;
+        theme?: "primary" | "white" | "primaryDark" | "light" | "primaryLight" | undefined;
         isSticky?: boolean | undefined;
     } & {
         as?: import("react").ElementType;

package/dist/components/field-wrapper/InlineFieldWrapper.js

@@ -1,2 +1,2 @@
-import l from"clsx";import*as e from"react";import{Checkbox as d}from"../checkbox/Checkbox.js";import{InlineMessage as f}from"../inline-message/InlineMessage.js";import{Label as v}from"../label/Label.js";import{RadioButton as N}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{Description as u}from"./FieldDescription.js";const o=({align:a="start",children:n,className:p,description:t,direction:r="row",error:m,label:c,required:s})=>e.createElement("div",{className:p},e.createElement(v,{align:a,direction:r,required:s,type:"inline"},e.Children.map(n,i=>e.createElement("div",{className:l(r==="reverse"&&"ml-3",r==="row"&&"mr-3",((i==null?void 0:i.type)===d||(i==null?void 0:i.type)===N)&&["translate-y-1"])},i)),c),m&&e.createElement(f,{className:"mt-2"},m),t&&e.createElement(u,{className:l("mt-2",r==="reverse"&&"mr-7",r==="row"&&"ml-7")},t));o.displayName="InlineFieldWrapper";export{o as InlineFieldWrapper};
+import o from"clsx";import*as r from"react";import{Checkbox as v}from"../checkbox/Checkbox.js";import{InlineMessage as u}from"../inline-message/InlineMessage.js";import{Label as f}from"../label/Label.js";import{RadioButton as N}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{Description as y}from"./FieldDescription.js";const a=({align:n="start",children:p,className:s,description:l,direction:i="row",error:t,label:c,required:d})=>r.createElement("div",{className:s},r.createElement(f,{align:n,direction:i,required:d,type:"inline"},r.Children.map(p,e=>{var m;return r.createElement("div",{className:o(i==="reverse"&&"ml-3",i==="row"&&"mr-3",((e==null?void 0:e.type)===v||(e==null?void 0:e.type)===N)&&((m=e==null?void 0:e.props)==null?void 0:m.size)!=="lg"&&"translate-y-1")},e)}),c),t&&r.createElement(u,{className:"mt-2"},t),l&&r.createElement(y,{className:o("mt-2",i==="reverse"&&"mr-7",i==="row"&&"ml-7")},l));a.displayName="InlineFieldWrapper";export{a as InlineFieldWrapper};
 //# sourceMappingURL=InlineFieldWrapper.js.map

package/dist/components/field-wrapper/InlineFieldWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineFieldWrapper.js","sources":["../../../src/components/field-wrapper/InlineFieldWrapper.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Checkbox } from '~/components/checkbox'\nimport { InlineMessage } from '~/components/inline-message'\nimport { Label } from '~/components/label'\nimport { RadioButton } from '~/components/radio-button'\n\nimport { Description } from './FieldDescription'\n\ntype InlineFieldWrapperProps = {\n  className?: string\n  error?: string\n  label: string\n  required?: boolean\n  align?: 'start' | 'center'\n  direction?: 'row' | 'reverse'\n  description?: string\n}\n\nexport const InlineFieldWrapper = ({\n  align = 'start',\n  children,\n  className,\n  description,\n  direction = 'row',\n  error,\n  label,\n  required\n}: React.PropsWithChildren<InlineFieldWrapperProps>) => (\n  <div className={className}>\n    <Label\n      align={align}\n      direction={direction}\n      required={required}\n      type=\"inline\"\n    >\n      {React.Children.map(children, (child: any) => (\n        <div\n          className={clsx(\n            direction === 'reverse' && 'ml-3',\n            direction === 'row' && 'mr-3',\n            (child?.type === Checkbox || child?.type === RadioButton) && [\n              'translate-y-1'\n            ]\n          )}\n        >\n          {child}\n        </div>\n      ))}\n      {label}\n    </Label>\n    {error && <InlineMessage className=\"mt-2\">{error}</InlineMessage>}\n    {description && (\n      <Description\n        className={clsx(\n          'mt-2',\n          direction === 'reverse' && 'mr-7',\n          direction === 'row' && 'ml-7'\n        )}\n      >\n        {description}\n      </Description>\n    )}\n  </div>\n)\n\nInlineFieldWrapper.displayName = 'InlineFieldWrapper'\n"],"names":["InlineFieldWrapper","align","children","className","description","direction","error","label","required","React","Label","child","clsx","Checkbox","RadioButton","InlineMessage","Description"],"mappings":"yWAoBO,MAAMA,EAAqB,CAAC,CACjC,MAAAC,EAAQ,QACR,SAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,MACZ,MAAAC,EACA,MAAAC,EACA,SAAAC,CACF,IACEC,EAAA,cAAC,MAAA,CAAI,UAAWN,CAAAA,EACdM,EAAA,cAACC,EAAA,CACC,MAAOT,EACP,UAAWI,EACX,SAAUG,EACV,KAAK,QAEJC,EAAAA,EAAM,SAAS,IAAIP,EAAWS,GAC7BF,EAAA,cAAC,MACC,CAAA,UAAWG,EACTP,IAAc,WAAa,OAC3BA,IAAc,OAAS,SACtBM,GAAA,KAAAA,OAAAA,EAAO,QAASE,IAAYF,GAAA,KAAA,OAAAA,EAAO,QAASG,IAAgB,CAC3D,eACF,CACF,GAECH,CACH,CACD,EACAJ,CACH,EACCD,GAASG,EAAA,cAACM,EAAA,CAAc,UAAU,MAAA,EAAQT,CAAM,EAChDF,GACCK,EAAA,cAACO,EAAA,CACC,UAAWJ,EACT,OACAP,IAAc,WAAa,OAC3BA,IAAc,OAAS,MACzB,CAECD,EAAAA,CACH,CAEJ,EAGFJ,EAAmB,YAAc"}
+{"version":3,"file":"InlineFieldWrapper.js","sources":["../../../src/components/field-wrapper/InlineFieldWrapper.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Checkbox } from '~/components/checkbox'\nimport { InlineMessage } from '~/components/inline-message'\nimport { Label } from '~/components/label'\nimport { RadioButton } from '~/components/radio-button'\n\nimport { Description } from './FieldDescription'\n\ntype InlineFieldWrapperProps = {\n  className?: string\n  error?: string\n  label: string\n  required?: boolean\n  align?: 'start' | 'center'\n  direction?: 'row' | 'reverse'\n  description?: string\n}\n\nexport const InlineFieldWrapper = ({\n  align = 'start',\n  children,\n  className,\n  description,\n  direction = 'row',\n  error,\n  label,\n  required\n}: React.PropsWithChildren<InlineFieldWrapperProps>) => (\n  <div className={className}>\n    <Label\n      align={align}\n      direction={direction}\n      required={required}\n      type=\"inline\"\n    >\n      {React.Children.map(children, (child: any) => (\n        <div\n          className={clsx(\n            direction === 'reverse' && 'ml-3',\n            direction === 'row' && 'mr-3',\n            (child?.type === Checkbox || child?.type === RadioButton) &&\n              child?.props?.size !== 'lg' &&\n              'translate-y-1'\n          )}\n        >\n          {child}\n        </div>\n      ))}\n      {label}\n    </Label>\n    {error && <InlineMessage className=\"mt-2\">{error}</InlineMessage>}\n    {description && (\n      <Description\n        className={clsx(\n          'mt-2',\n          direction === 'reverse' && 'mr-7',\n          direction === 'row' && 'ml-7'\n        )}\n      >\n        {description}\n      </Description>\n    )}\n  </div>\n)\n\nInlineFieldWrapper.displayName = 'InlineFieldWrapper'\n"],"names":["InlineFieldWrapper","align","children","className","description","direction","error","label","required","React","Label","child","_a","clsx","Checkbox","RadioButton","InlineMessage","Description"],"mappings":"yWAoBO,MAAMA,EAAqB,CAAC,CACjC,MAAAC,EAAQ,QACR,SAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,MACZ,MAAAC,EACA,MAAAC,EACA,SAAAC,CACF,IACEC,EAAA,cAAC,MAAA,CAAI,UAAWN,CAAAA,EACdM,EAAA,cAACC,EAAA,CACC,MAAOT,EACP,UAAWI,EACX,SAAUG,EACV,KAAK,QAEJC,EAAAA,EAAM,SAAS,IAAIP,EAAWS,GAAY,CArCjD,IAAAC,EAsCQ,OAAAH,EAAA,cAAC,MACC,CAAA,UAAWI,EACTR,IAAc,WAAa,OAC3BA,IAAc,OAAS,SACtBM,GAAA,KAAA,OAAAA,EAAO,QAASG,IAAYH,GAAA,KAAAA,OAAAA,EAAO,QAASI,MAC3CH,EAAAD,GAAA,KAAA,OAAAA,EAAO,QAAP,KAAAC,OAAAA,EAAc,QAAS,MACvB,eACJ,CAECD,EAAAA,CACH,CACD,CAAA,EACAJ,CACH,EACCD,GAASG,EAAA,cAACO,EAAA,CAAc,UAAU,MAAA,EAAQV,CAAM,EAChDF,GACCK,EAAA,cAACQ,EAAA,CACC,UAAWJ,EACT,OACAR,IAAc,WAAa,OAC3BA,IAAc,OAAS,MACzB,CAECD,EAAAA,CACH,CAEJ,EAGFJ,EAAmB,YAAc"}

package/dist/components/table/Table.d.ts

@@ -43,7 +43,7 @@ export declare const Table: React.ForwardRefExoticComponent<Omit<TableProps, "re
         ({ theme, isSticky, ...rest }: Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
             ref?: ((instance: HTMLTableSectionElement | null) => void) | React.RefObject<HTMLTableSectionElement> | null | undefined;
         }, "theme" | "isSticky"> & {
-            theme?: "primary" | "white" | "primaryDark" | "primaryLight" | "light" | undefined;
+            theme?: "primary" | "white" | "primaryDark" | "light" | "primaryLight" | undefined;
             isSticky?: boolean | undefined;
         } & {
             as?: React.ElementType;

package/dist/components/table/TableHeader.d.ts

@@ -9,7 +9,7 @@ export declare const TABLE_HEADER_THEMES: {
 declare const StyledTableHeader: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
     ref?: ((instance: HTMLTableSectionElement | null) => void) | React.RefObject<HTMLTableSectionElement> | null | undefined;
 }, "theme" | "isSticky"> & {
-    theme?: "primary" | "white" | "primaryDark" | "primaryLight" | "light" | undefined;
+    theme?: "primary" | "white" | "primaryDark" | "light" | "primaryLight" | undefined;
     isSticky?: boolean | undefined;
 } & {
     as?: React.ElementType;

package/dist/components/table/TableStickyColumnsContainer.js

@@ -1,2 +1,2 @@
-import c from"clsx";import e from"react";import{useStickyColumnsStyle as i}from"./useStickyColumnsCss.js";const d=({children:o,numberOfStickyColumns:t=0,className:n,...l})=>{const[_,f]=e.useState(!1),p=e.useRef(null),{columnsStyle:s}=i({numberOfStickyColumns:t,wrapperRef:p});return e.createElement("div",{onScroll:y=>{const h=y.currentTarget.scrollLeft>0;h!==_&&f(h)},role:"scrollbar",ref:p,style:s,className:c("overflow-auto","max-w-full","relative","overscroll-x-contain","[&_td,&_th]:bg-inherit",n,t===1&&["[&_td,&_th]:nth-of-type-[1]:sticky","[&_td,&_th]:nth-of-type-[1]:left-(--sticky-offset-left-1)","[&_td,&_th]:nth-of-type-[1]:width-(--sticky-column-width-1)","[&_td,&_th]:nth-of-type-[1]:z-2"],t===2&&["[&_td,&_th]:nth-of-type-[2]:sticky","[&_td,&_th]:nth-of-type-[2]:left-(--sticky-offset-left-2)","[&_td,&_th]:nth-of-type-[2]:width-(--sticky-column-width-2)","[&_td,&_th]:nth-of-type-[2]:z-2"],t===3&&["[&_td,&_th]:nth-of-type-[3]:sticky","[&_td,&_th]:nth-of-type-[3]:left-(--sticky-offset-left-3)","[&_td,&_th]:nth-of-type-[3]:width-(--sticky-column-width-3)","[&_td,&_th]:nth-of-type-[3]:z-2"],t===4&&["[&_td,&_th]:nth-of-type-[4]:sticky","[&_td,&_th]:nth-of-type-[4]:left-(--sticky-offset-left-4)","[&_td,&_th]:nth-of-type-[4]:width-(--sticky-column-width-4)","[&_td,&_th]:nth-of-type-[4]:z-2"],t===1&&_&&["[&_td,&_th]:nth-of-type-[1]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[1]:[clip-path:inset(0px_-10px_0px_0px)]"],t===2&&_&&["[&_td,&_th]:nth-of-type-[2]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[2]:[clip-path:inset(0px_-10px_0px_0px)]"],t===3&&_&&["[&_td,&_th]:nth-of-type-[3]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[3]:[clip-path:inset(0px_-10px_0px_0px)]"],t===4&&_&&["[&_td,&_th]:nth-of-type-[4]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[4]:[clip-path:inset(0px_-10px_0px_0px)]"]),...l},o)};export{d as TableStickyColumnsContainer};
+import c from"clsx";import e from"react";import{useStickyColumnsStyle as i}from"./useStickyColumnsCss.js";const r=({children:h,numberOfStickyColumns:t=0,className:n,...l})=>{const[_,f]=e.useState(!1),p=e.useRef(null),{columnsStyle:s}=i({numberOfStickyColumns:t,wrapperRef:p});return e.createElement("div",{onScroll:y=>{const o=y.currentTarget.scrollLeft>0;o!==_&&f(o)},role:"scrollbar",ref:p,style:s,className:c("overflow-auto","max-w-full","relative","overscroll-x-contain","[&_td,&_th]:bg-inherit",n,t===1&&["[&_td,&_th]:nth-of-type-[1]:sticky","[&_td,&_th]:nth-of-type-[1]:left-(--sticky-offset-left-1)","[&_td,&_th]:nth-of-type-[1]:w-(--sticky-column-width-1)","[&_td,&_th]:nth-of-type-[1]:z-2"],t===2&&["[&_td,&_th]:nth-of-type-[2]:sticky","[&_td,&_th]:nth-of-type-[2]:left-(--sticky-offset-left-2)","[&_td,&_th]:nth-of-type-[2]:w-(--sticky-column-width-2)","[&_td,&_th]:nth-of-type-[2]:z-2"],t===3&&["[&_td,&_th]:nth-of-type-[3]:sticky","[&_td,&_th]:nth-of-type-[3]:left-(--sticky-offset-left-3)","[&_td,&_th]:nth-of-type-[3]:w-(--sticky-column-width-3)","[&_td,&_th]:nth-of-type-[3]:z-2"],t===4&&["[&_td,&_th]:nth-of-type-[4]:sticky","[&_td,&_th]:nth-of-type-[4]:left-(--sticky-offset-left-4)","[&_td,&_th]:nth-of-type-[4]:w-(--sticky-column-width-4)","[&_td,&_th]:nth-of-type-[4]:z-2"],t===1&&_&&["[&_td,&_th]:nth-of-type-[1]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[1]:[clip-path:inset(0px_-10px_0px_0px)]"],t===2&&_&&["[&_td,&_th]:nth-of-type-[2]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[2]:[clip-path:inset(0px_-10px_0px_0px)]"],t===3&&_&&["[&_td,&_th]:nth-of-type-[3]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[3]:[clip-path:inset(0px_-10px_0px_0px)]"],t===4&&_&&["[&_td,&_th]:nth-of-type-[4]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]","[&_td,&_th]:nth-of-type-[4]:[clip-path:inset(0px_-10px_0px_0px)]"]),...l},h)};export{r as TableStickyColumnsContainer};
 //# sourceMappingURL=TableStickyColumnsContainer.js.map

package/dist/components/table/TableStickyColumnsContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableStickyColumnsContainer.js","sources":["../../../src/components/table/TableStickyColumnsContainer.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { useStickyColumnsStyle } from './useStickyColumnsCss'\n\nexport const TableStickyColumnsContainer = ({\n  children,\n  numberOfStickyColumns = 0,\n  className,\n  ...restProps\n}: React.PropsWithChildren<{\n  numberOfStickyColumns?: number\n  className?: string\n}>) => {\n  const [hasScroll, setHasScroll] = React.useState<boolean>(false)\n  const wrapperRef = React.useRef(null)\n  const { columnsStyle } = useStickyColumnsStyle({\n    numberOfStickyColumns,\n    wrapperRef\n  })\n\n  const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {\n    const newHasScroll = event.currentTarget.scrollLeft > 0\n    if (newHasScroll !== hasScroll) {\n      setHasScroll(newHasScroll)\n    }\n  }\n\n  return (\n    <div\n      onScroll={handleScroll}\n      // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n      role=\"scrollbar\"\n      ref={wrapperRef}\n      style={columnsStyle}\n      className={clsx(\n        'overflow-auto',\n        'max-w-full',\n        'relative',\n        'overscroll-x-contain',\n        '[&_td,&_th]:bg-inherit',\n        className,\n        numberOfStickyColumns === 1 && [\n          '[&_td,&_th]:nth-of-type-[1]:sticky',\n          '[&_td,&_th]:nth-of-type-[1]:left-(--sticky-offset-left-1)',\n          '[&_td,&_th]:nth-of-type-[1]:width-(--sticky-column-width-1)',\n          '[&_td,&_th]:nth-of-type-[1]:z-2'\n        ],\n        numberOfStickyColumns === 2 && [\n          '[&_td,&_th]:nth-of-type-[2]:sticky',\n          '[&_td,&_th]:nth-of-type-[2]:left-(--sticky-offset-left-2)',\n          '[&_td,&_th]:nth-of-type-[2]:width-(--sticky-column-width-2)',\n          '[&_td,&_th]:nth-of-type-[2]:z-2'\n        ],\n        numberOfStickyColumns === 3 && [\n          '[&_td,&_th]:nth-of-type-[3]:sticky',\n          '[&_td,&_th]:nth-of-type-[3]:left-(--sticky-offset-left-3)',\n          '[&_td,&_th]:nth-of-type-[3]:width-(--sticky-column-width-3)',\n          '[&_td,&_th]:nth-of-type-[3]:z-2'\n        ],\n        numberOfStickyColumns === 4 && [\n          '[&_td,&_th]:nth-of-type-[4]:sticky',\n          '[&_td,&_th]:nth-of-type-[4]:left-(--sticky-offset-left-4)',\n          '[&_td,&_th]:nth-of-type-[4]:width-(--sticky-column-width-4)',\n          '[&_td,&_th]:nth-of-type-[4]:z-2'\n        ],\n        numberOfStickyColumns === 1 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[1]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[1]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ],\n        numberOfStickyColumns === 2 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[2]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[2]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ],\n        numberOfStickyColumns === 3 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[3]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[3]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ],\n        numberOfStickyColumns === 4 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[4]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[4]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ]\n      )}\n      {...restProps}\n    >\n      {children}\n    </div>\n  )\n}\n"],"names":["TableStickyColumnsContainer","children","numberOfStickyColumns","className","restProps","hasScroll","setHasScroll","React","wrapperRef","columnsStyle","useStickyColumnsStyle","event","newHasScroll","clsx"],"mappings":"0GAKa,MAAAA,EAA8B,CAAC,CAC1C,SAAAC,EACA,sBAAAC,EAAwB,EACxB,UAAAC,EACA,GAAGC,CACL,IAGO,CACL,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzDC,EAAaD,EAAM,OAAO,IAAI,EAC9B,CAAE,aAAAE,CAAa,EAAIC,EAAsB,CAC7C,sBAAAR,EACA,WAAAM,CACF,CAAC,EASD,OACED,EAAA,cAAC,MAAA,CACC,SATkBI,GAAyC,CAC7D,MAAMC,EAAeD,EAAM,cAAc,WAAa,EAClDC,IAAiBP,GACnBC,EAAaM,CAAY,CAE7B,EAMI,KAAK,YACL,IAAKJ,EACL,MAAOC,EACP,UAAWI,EACT,gBACA,aACA,WACA,uBACA,yBACAV,EACAD,IAA0B,GAAK,CAC7B,qCACA,4DACA,8DACA,iCACF,EACAA,IAA0B,GAAK,CAC7B,qCACA,4DACA,8DACA,iCACF,EACAA,IAA0B,GAAK,CAC7B,qCACA,4DACA,8DACA,iCACF,EACAA,IAA0B,GAAK,CAC7B,qCACA,4DACA,8DACA,iCACF,EACAA,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,EACFH,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,EACFH,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,EACFH,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,CACJ,EACC,GAAGD,CAAAA,EAEHH,CACH,CAEJ"}
+{"version":3,"file":"TableStickyColumnsContainer.js","sources":["../../../src/components/table/TableStickyColumnsContainer.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { useStickyColumnsStyle } from './useStickyColumnsCss'\n\nexport const TableStickyColumnsContainer = ({\n  children,\n  numberOfStickyColumns = 0,\n  className,\n  ...restProps\n}: React.PropsWithChildren<{\n  numberOfStickyColumns?: number\n  className?: string\n}>) => {\n  const [hasScroll, setHasScroll] = React.useState<boolean>(false)\n  const wrapperRef = React.useRef(null)\n  const { columnsStyle } = useStickyColumnsStyle({\n    numberOfStickyColumns,\n    wrapperRef\n  })\n\n  const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {\n    const newHasScroll = event.currentTarget.scrollLeft > 0\n    if (newHasScroll !== hasScroll) {\n      setHasScroll(newHasScroll)\n    }\n  }\n\n  return (\n    <div\n      onScroll={handleScroll}\n      // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n      role=\"scrollbar\"\n      ref={wrapperRef}\n      style={columnsStyle}\n      className={clsx(\n        'overflow-auto',\n        'max-w-full',\n        'relative',\n        'overscroll-x-contain',\n        '[&_td,&_th]:bg-inherit',\n        className,\n        numberOfStickyColumns === 1 && [\n          '[&_td,&_th]:nth-of-type-[1]:sticky',\n          '[&_td,&_th]:nth-of-type-[1]:left-(--sticky-offset-left-1)',\n          '[&_td,&_th]:nth-of-type-[1]:w-(--sticky-column-width-1)',\n          '[&_td,&_th]:nth-of-type-[1]:z-2'\n        ],\n        numberOfStickyColumns === 2 && [\n          '[&_td,&_th]:nth-of-type-[2]:sticky',\n          '[&_td,&_th]:nth-of-type-[2]:left-(--sticky-offset-left-2)',\n          '[&_td,&_th]:nth-of-type-[2]:w-(--sticky-column-width-2)',\n          '[&_td,&_th]:nth-of-type-[2]:z-2'\n        ],\n        numberOfStickyColumns === 3 && [\n          '[&_td,&_th]:nth-of-type-[3]:sticky',\n          '[&_td,&_th]:nth-of-type-[3]:left-(--sticky-offset-left-3)',\n          '[&_td,&_th]:nth-of-type-[3]:w-(--sticky-column-width-3)',\n          '[&_td,&_th]:nth-of-type-[3]:z-2'\n        ],\n        numberOfStickyColumns === 4 && [\n          '[&_td,&_th]:nth-of-type-[4]:sticky',\n          '[&_td,&_th]:nth-of-type-[4]:left-(--sticky-offset-left-4)',\n          '[&_td,&_th]:nth-of-type-[4]:w-(--sticky-column-width-4)',\n          '[&_td,&_th]:nth-of-type-[4]:z-2'\n        ],\n        numberOfStickyColumns === 1 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[1]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[1]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ],\n        numberOfStickyColumns === 2 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[2]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[2]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ],\n        numberOfStickyColumns === 3 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[3]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[3]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ],\n        numberOfStickyColumns === 4 &&\n          hasScroll && [\n            '[&_td,&_th]:nth-of-type-[4]:shadow-[var(--color-alpha-200)_-2px_-3px_9px_1px]',\n            '[&_td,&_th]:nth-of-type-[4]:[clip-path:inset(0px_-10px_0px_0px)]'\n          ]\n      )}\n      {...restProps}\n    >\n      {children}\n    </div>\n  )\n}\n"],"names":["TableStickyColumnsContainer","children","numberOfStickyColumns","className","restProps","hasScroll","setHasScroll","React","wrapperRef","columnsStyle","useStickyColumnsStyle","event","newHasScroll","clsx"],"mappings":"0GAKa,MAAAA,EAA8B,CAAC,CAC1C,SAAAC,EACA,sBAAAC,EAAwB,EACxB,UAAAC,EACA,GAAGC,CACL,IAGO,CACL,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzDC,EAAaD,EAAM,OAAO,IAAI,EAC9B,CAAE,aAAAE,CAAa,EAAIC,EAAsB,CAC7C,sBAAAR,EACA,WAAAM,CACF,CAAC,EASD,OACED,EAAA,cAAC,MAAA,CACC,SATkBI,GAAyC,CAC7D,MAAMC,EAAeD,EAAM,cAAc,WAAa,EAClDC,IAAiBP,GACnBC,EAAaM,CAAY,CAE7B,EAMI,KAAK,YACL,IAAKJ,EACL,MAAOC,EACP,UAAWI,EACT,gBACA,aACA,WACA,uBACA,yBACAV,EACAD,IAA0B,GAAK,CAC7B,qCACA,4DACA,0DACA,iCACF,EACAA,IAA0B,GAAK,CAC7B,qCACA,4DACA,0DACA,iCACF,EACAA,IAA0B,GAAK,CAC7B,qCACA,4DACA,0DACA,iCACF,EACAA,IAA0B,GAAK,CAC7B,qCACA,4DACA,0DACA,iCACF,EACAA,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,EACFH,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,EACFH,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,EACFH,IAA0B,GACxBG,GAAa,CACX,gFACA,kEACF,CACJ,EACC,GAAGD,CAAAA,EAEHH,CACH,CAEJ"}