@atom-learning/components 6.0.0-beta.28 → 6.0.0-beta.29

package/dist/components/action-icon/ActionIcon.js

@@ -1,2 +1,2 @@
-import d from"invariant";import*as e from"react";import{styled as y}from"../../styled.js";import{getExternalAnchorProps as f}from"../../utilities/uri/index.js";import{Icon as i}from"../icon/Icon.js";import{ActionIconSizeMap as g}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as x}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const w=y("button",{base:["items-center","appearance-none","bg-white","border-[unset]","rounded-md","box-border","cursor-pointer","flex","shrink-0","justify-center","px-[unset]","py-[unset]","transition-all","duration-100","ease-out","disabled:cursor-not-allowed","disabled:opacity-30"],variants:{theme:{neutral:["[--base:var(--color-grey-700)]","[--interact:var(--color-primary-900)]","[--active:var(--color-primary-1100)]"],primary:["[--base:var(--color-primary-800)]","[--interact:var(--color-primary-900)]","[--active:var(--color-primary-1000)]"],primaryDark:["[--base:var(--color-primary-1000)]","[--interact:var(--color-primary-1100)]","[--active:var(--color-primary-1200)]"],success:["[--base:var(--color-success)]","[--interact:var(--color-success-mid)]","[--active:var(--color-success-dark)]"],warning:["[--base:var(--color-warning)]","[--interact:var(--color-warning-mid)]","[--active:var(--color-warning-dark)]"],danger:["[--base:var(--color-danger)]","[--interact:var(--color-danger-mid)]","[--active:var(--color-danger-dark)]"],white:["[--base:var(--color-white)]","[--interact:var(--color-white)]","[--active:var(--color-white)]"]},appearance:{simple:["bg-transparent","text-(--base)","not-disabled:hover:text-(--interact)","not-disabled:focus:text-(--interact)","not-disabled:active:text-(--active)"],outline:["bg-unset","border","border-current","text-(--base)","not-disabled:hover:text-(--interact)","not-disabled:focus:text-(--interact)","not-disabled:active:text-(--active)"],solid:["bg-(--base)","text-white","not-disabled:hover:bg-(--interact)","not-disabled:hover:text-white","not-disabled:focus:bg-(--interact)","not-disabled:focus:text-white","not-disabled:active:bg-(--active)"]},size:{xs:["size-6"],sm:["size-8"],md:["size-10"],lg:["size-12"]},isRounded:{true:["rounded-full"]}}},{enabledResponsiveVariants:!0}),a=e.forwardRef(({children:n,theme:p="primary",appearance:m="simple",size:c="sm",label:s,href:t,disabled:o,hasTooltip:b=!0,tooltipSide:v,...u},h)=>{const l="A single ".concat(i.displayName," component is permitted as a child of ").concat(a.displayName);return d(e.Children.count(n)===1,l),e.createElement(x,{hasTooltip:b,label:s,tooltipSide:v},e.createElement(w,{...t?{as:"a",href:o?void 0:t,onClick:void 0,"aria-disabled":!!o}:{type:"button"},...f(t),...u,"aria-label":s,theme:p,appearance:m,size:c,ref:h,disabled:o},e.Children.map(n,r=>{if(!e.isValidElement(r))throw new Error(l);return d(r.type===i,"Children of type ".concat(r==null?void 0:r.type," aren't permitted. Only an ").concat(i.displayName," component is allowed in ").concat(a.displayName)),e.cloneElement(r,{size:g[c]})})))});a.displayName="ActionIcon";export{a as ActionIcon};
+import d from"invariant";import*as e from"react";import{styled as y}from"../../styled.js";import{getExternalAnchorProps as f}from"../../utilities/uri/index.js";import{Icon as i}from"../icon/Icon.js";import{ActionIconSizeMap as g}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as x}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const w=y("button",{base:["items-center","appearance-none","bg-white","border-[unset]","rounded-md","box-border","cursor-pointer","flex","shrink-0","justify-center","px-[unset]","py-[unset]","transition-all","duration-100","ease-out","disabled:cursor-not-allowed","disabled:opacity-30"],variants:{theme:{neutral:["[--base:var(--color-grey-700)]","[--interact:var(--color-primary-900)]","[--active:var(--color-primary-1100)]"],primary:["[--base:var(--color-primary-800)]","[--interact:var(--color-primary-900)]","[--active:var(--color-primary-1000)]"],primaryDark:["[--base:var(--color-primary-1000)]","[--interact:var(--color-primary-1100)]","[--active:var(--color-primary-1200)]"],success:["[--base:var(--color-success)]","[--interact:var(--color-success-mid)]","[--active:var(--color-success-dark)]"],warning:["[--base:var(--color-warning)]","[--interact:var(--color-warning-mid)]","[--active:var(--color-warning-dark)]"],danger:["[--base:var(--color-danger)]","[--interact:var(--color-danger-mid)]","[--active:var(--color-danger-dark)]"],white:["[--base:var(--color-white)]","[--interact:var(--color-white)]","[--active:var(--color-white)]"]},appearance:{simple:["bg-transparent","text-(--base)","not-disabled:hover:text-(--interact)","not-disabled:focus:text-(--interact)","not-disabled:active:text-(--active)"],outline:["bg-unset","border","border-current","text-(--base)","not-disabled:hover:text-(--interact)","not-disabled:focus:text-(--interact)","not-disabled:active:text-(--active)"],solid:["bg-(--base)","text-white","not-disabled:hover:bg-(--interact)","not-disabled:hover:text-white","not-disabled:focus:bg-(--interact)","not-disabled:focus:text-white","not-disabled:active:bg-(--active)"]},size:{xs:["size-6"],sm:["size-8"],md:["size-10"],lg:["size-12"]},isRounded:{true:["rounded-full"]}}},{enabledResponsiveVariants:!0}),a=e.forwardRef(({children:n,theme:p="primary",appearance:m="simple",size:s="sm",label:c,href:t,disabled:o,hasTooltip:b=!0,tooltipSide:v,...u},h)=>{const l=`A single ${i.displayName} component is permitted as a child of ${a.displayName}`;return d(e.Children.count(n)===1,l),e.createElement(x,{hasTooltip:b,label:c,tooltipSide:v},e.createElement(w,{...t?{as:"a",href:o?void 0:t,onClick:void 0,"aria-disabled":!!o}:{type:"button"},...f(t),...u,"aria-label":c,theme:p,appearance:m,size:s,ref:h,disabled:o},e.Children.map(n,r=>{if(!e.isValidElement(r))throw new Error(l);return d(r.type===i,`Children of type ${r==null?void 0:r.type} aren't permitted. Only an ${i.displayName} component is allowed in ${a.displayName}`),e.cloneElement(r,{size:g[s]})})))});a.displayName="ActionIcon";export{a as ActionIcon};
 //# sourceMappingURL=ActionIcon.js.map

package/dist/components/action-icon/ActionIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types'\nimport { Override } from '~/utilities'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst StyledButton = styled(\n  'button',\n  {\n    base: [\n      'items-center',\n      'appearance-none',\n      'bg-white',\n      'border-[unset]',\n      'rounded-md',\n      'box-border',\n      'cursor-pointer',\n      'flex',\n      'shrink-0',\n      'justify-center',\n      'px-[unset]',\n      'py-[unset]',\n      'transition-all',\n      'duration-100',\n      'ease-out',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30'\n    ],\n    variants: {\n      theme: {\n        neutral: [\n          '[--base:var(--color-grey-700)]',\n          '[--interact:var(--color-primary-900)]',\n          '[--active:var(--color-primary-1100)]'\n        ],\n        primary: [\n          '[--base:var(--color-primary-800)]',\n          '[--interact:var(--color-primary-900)]',\n          '[--active:var(--color-primary-1000)]'\n        ],\n        primaryDark: [\n          '[--base:var(--color-primary-1000)]',\n          '[--interact:var(--color-primary-1100)]',\n          '[--active:var(--color-primary-1200)]'\n        ],\n        success: [\n          '[--base:var(--color-success)]',\n          '[--interact:var(--color-success-mid)]',\n          '[--active:var(--color-success-dark)]'\n        ],\n        warning: [\n          '[--base:var(--color-warning)]',\n          '[--interact:var(--color-warning-mid)]',\n          '[--active:var(--color-warning-dark)]'\n        ],\n        danger: [\n          '[--base:var(--color-danger)]',\n          '[--interact:var(--color-danger-mid)]',\n          '[--active:var(--color-danger-dark)]'\n        ],\n        white: [\n          '[--base:var(--color-white)]',\n          '[--interact:var(--color-white)]',\n          '[--active:var(--color-white)]'\n        ]\n      },\n      appearance: {\n        simple: [\n          'bg-transparent',\n          'text-(--base)',\n          'not-disabled:hover:text-(--interact)',\n          'not-disabled:focus:text-(--interact)',\n          'not-disabled:active:text-(--active)'\n        ],\n        outline: [\n          'bg-unset',\n          'border',\n          'border-current',\n          'text-(--base)',\n          'not-disabled:hover:text-(--interact)',\n          'not-disabled:focus:text-(--interact)',\n          'not-disabled:active:text-(--active)'\n        ],\n        solid: [\n          'bg-(--base)',\n          'text-white',\n          'not-disabled:hover:bg-(--interact)',\n          'not-disabled:hover:text-white',\n          'not-disabled:focus:bg-(--interact)',\n          'not-disabled:focus:text-white',\n          'not-disabled:active:bg-(--active)'\n        ]\n      },\n      size: {\n        xs: ['size-6'],\n        sm: ['size-8'],\n        md: ['size-10'],\n        lg: ['size-12']\n      },\n      isRounded: {\n        true: ['rounded-full']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\ntype ActionIconProps = Override<\n  React.ComponentProps<typeof StyledButton>,\n  {\n    children: React.ReactNode\n    label: string\n  } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n    NavigatorActions\n>\n\nexport const ActionIcon = React.forwardRef<HTMLButtonElement, ActionIconProps>(\n  (\n    {\n      children,\n      theme = 'primary',\n      appearance = 'simple',\n      size = 'sm',\n      label,\n      href,\n      disabled,\n      hasTooltip = true,\n      tooltipSide,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`\n\n    invariant(React.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE)\n\n    // Polymorphic props: can be either button or anchor element\n    // Type assertion needed due to TypeScript limitations with polymorphic components\n    const optionalLinkProps = href\n      ? ({\n          as: 'a',\n          href: disabled ? undefined : href,\n          onClick: undefined,\n          'aria-disabled': !!disabled\n        } as const)\n      : ({ type: 'button' } as const)\n\n    return (\n      <OptionalTooltipWrapper\n        hasTooltip={hasTooltip}\n        label={label}\n        tooltipSide={tooltipSide}\n      >\n        <StyledButton\n          {...(optionalLinkProps as any)}\n          {...getExternalAnchorProps(href)}\n          {...remainingProps}\n          aria-label={label}\n          theme={theme}\n          appearance={appearance}\n          size={size}\n          ref={ref as any}\n          disabled={disabled}\n        >\n          {React.Children.map(children, (child) => {\n            // TS needs this check for any following code to access child.type\n            // even with optional chaining\n            if (!React.isValidElement(child)) {\n              throw new Error(INVALID_CHILDREN_MESSAGE)\n            }\n\n            invariant(\n              child.type === Icon,\n              `Children of type ${child?.type} aren't permitted. Only an ${Icon.displayName} component is allowed in ${ActionIcon.displayName}`\n            )\n\n            return React.cloneElement(\n              child as React.ReactElement<React.ComponentProps<typeof Icon>>,\n              {\n                size: ActionIconSizeMap[size as string]\n              }\n            )\n          })}\n        </StyledButton>\n      </OptionalTooltipWrapper>\n    )\n  }\n)\n\nActionIcon.displayName = 'ActionIcon'\n"],"names":["StyledButton","styled","ActionIcon","React","children","theme","appearance","size","label","href","disabled","hasTooltip","tooltipSide","remainingProps","ref","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"iXAaA,MAAMA,EAAeC,EACnB,SACA,CACE,KAAM,CACJ,eACA,kBACA,WACA,iBACA,aACA,aACA,iBACA,OACA,WACA,iBACA,aACA,aACA,iBACA,eACA,WACA,8BACA,qBACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CACP,iCACA,wCACA,sCACF,EACA,QAAS,CACP,oCACA,wCACA,sCACF,EACA,YAAa,CACX,qCACA,yCACA,sCACF,EACA,QAAS,CACP,gCACA,wCACA,sCACF,EACA,QAAS,CACP,gCACA,wCACA,sCACF,EACA,OAAQ,CACN,+BACA,uCACA,qCACF,EACA,MAAO,CACL,8BACA,kCACA,+BACF,CACF,EACA,WAAY,CACV,OAAQ,CACN,iBACA,gBACA,uCACA,uCACA,qCACF,EACA,QAAS,CACP,WACA,SACA,iBACA,gBACA,uCACA,uCACA,qCACF,EACA,MAAO,CACL,cACA,aACA,qCACA,gCACA,qCACA,gCACA,mCACF,CACF,EACA,KAAM,CACJ,GAAI,CAAC,QAAQ,EACb,GAAI,CAAC,QAAQ,EACb,GAAI,CAAC,SAAS,EACd,GAAI,CAAC,SAAS,CAChB,EACA,UAAW,CACT,KAAM,CAAC,cAAc,CACvB,CACF,CACF,EACA,CACE,0BAA2B,EAC7B,CACF,EAWaC,EAAaC,EAAM,WAC9B,CACE,CACE,SAAAC,EACA,MAAAC,EAAQ,UACR,WAAAC,EAAa,SACb,KAAAC,EAAO,KACP,MAAAC,EACA,KAAAC,EACA,SAAAC,EACA,WAAAC,EAAa,GACb,YAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAA2B,YAAY,OAAAC,EAAK,YAAW,wCAAA,EAAyC,SAAW,WAEjH,EAAA,OAAAC,EAAUd,EAAM,SAAS,MAAMC,CAAQ,IAAM,EAAGW,CAAwB,EActEZ,EAAA,cAACe,EAAA,CACC,WAAYP,EACZ,MAAOH,EACP,YAAaI,CAEbT,EAAAA,EAAA,cAACH,EAAA,CACE,GAhBmBS,EACrB,CACC,GAAI,IACJ,KAAMC,EAAW,OAAYD,EAC7B,QAAS,OACT,gBAAiB,CAAC,CAACC,CACrB,EACC,CAAE,KAAM,QAAS,EAUf,GAAGS,EAAuBV,CAAI,EAC9B,GAAGI,EACJ,aAAYL,EACZ,MAAOH,EACP,WAAYC,EACZ,KAAMC,EACN,IAAKO,EACL,SAAUJ,CAETP,EAAAA,EAAM,SAAS,IAAIC,EAAWgB,GAAU,CAGvC,GAAI,CAACjB,EAAM,eAAeiB,CAAK,EAC7B,MAAM,IAAI,MAAML,CAAwB,EAG1C,OAAAE,EACEG,EAAM,OAASJ,EACf,oBAAoB,OAAAI,GAAA,KAAA,OAAAA,EAAO,KAAI,6BAAA,EAA8B,OAAAJ,EAAK,YAAW,2BAA4B,EAAA,OAAAd,EAAW,WACtH,CAAA,EAEOC,EAAM,aACXiB,EACA,CACE,KAAMC,EAAkBd,CAAc,CACxC,CACF,CACF,CAAC,CACH,CACF,CAEJ,CACF,EAEAL,EAAW,YAAc"}
+{"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types'\nimport { Override } from '~/utilities'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst StyledButton = styled(\n  'button',\n  {\n    base: [\n      'items-center',\n      'appearance-none',\n      'bg-white',\n      'border-[unset]',\n      'rounded-md',\n      'box-border',\n      'cursor-pointer',\n      'flex',\n      'shrink-0',\n      'justify-center',\n      'px-[unset]',\n      'py-[unset]',\n      'transition-all',\n      'duration-100',\n      'ease-out',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30'\n    ],\n    variants: {\n      theme: {\n        neutral: [\n          '[--base:var(--color-grey-700)]',\n          '[--interact:var(--color-primary-900)]',\n          '[--active:var(--color-primary-1100)]'\n        ],\n        primary: [\n          '[--base:var(--color-primary-800)]',\n          '[--interact:var(--color-primary-900)]',\n          '[--active:var(--color-primary-1000)]'\n        ],\n        primaryDark: [\n          '[--base:var(--color-primary-1000)]',\n          '[--interact:var(--color-primary-1100)]',\n          '[--active:var(--color-primary-1200)]'\n        ],\n        success: [\n          '[--base:var(--color-success)]',\n          '[--interact:var(--color-success-mid)]',\n          '[--active:var(--color-success-dark)]'\n        ],\n        warning: [\n          '[--base:var(--color-warning)]',\n          '[--interact:var(--color-warning-mid)]',\n          '[--active:var(--color-warning-dark)]'\n        ],\n        danger: [\n          '[--base:var(--color-danger)]',\n          '[--interact:var(--color-danger-mid)]',\n          '[--active:var(--color-danger-dark)]'\n        ],\n        white: [\n          '[--base:var(--color-white)]',\n          '[--interact:var(--color-white)]',\n          '[--active:var(--color-white)]'\n        ]\n      },\n      appearance: {\n        simple: [\n          'bg-transparent',\n          'text-(--base)',\n          'not-disabled:hover:text-(--interact)',\n          'not-disabled:focus:text-(--interact)',\n          'not-disabled:active:text-(--active)'\n        ],\n        outline: [\n          'bg-unset',\n          'border',\n          'border-current',\n          'text-(--base)',\n          'not-disabled:hover:text-(--interact)',\n          'not-disabled:focus:text-(--interact)',\n          'not-disabled:active:text-(--active)'\n        ],\n        solid: [\n          'bg-(--base)',\n          'text-white',\n          'not-disabled:hover:bg-(--interact)',\n          'not-disabled:hover:text-white',\n          'not-disabled:focus:bg-(--interact)',\n          'not-disabled:focus:text-white',\n          'not-disabled:active:bg-(--active)'\n        ]\n      },\n      size: {\n        xs: ['size-6'],\n        sm: ['size-8'],\n        md: ['size-10'],\n        lg: ['size-12']\n      },\n      isRounded: {\n        true: ['rounded-full']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\ntype ActionIconProps = Override<\n  React.ComponentProps<typeof StyledButton>,\n  {\n    children: React.ReactNode\n    label: string\n  } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n    NavigatorActions\n>\n\nexport const ActionIcon = React.forwardRef<HTMLButtonElement, ActionIconProps>(\n  (\n    {\n      children,\n      theme = 'primary',\n      appearance = 'simple',\n      size = 'sm',\n      label,\n      href,\n      disabled,\n      hasTooltip = true,\n      tooltipSide,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`\n\n    invariant(React.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE)\n\n    // Polymorphic props: can be either button or anchor element\n    // Type assertion needed due to TypeScript limitations with polymorphic components\n    const optionalLinkProps = href\n      ? ({\n          as: 'a',\n          href: disabled ? undefined : href,\n          onClick: undefined,\n          'aria-disabled': !!disabled\n        } as const)\n      : ({ type: 'button' } as const)\n\n    return (\n      <OptionalTooltipWrapper\n        hasTooltip={hasTooltip}\n        label={label}\n        tooltipSide={tooltipSide}\n      >\n        <StyledButton\n          {...(optionalLinkProps as any)}\n          {...getExternalAnchorProps(href)}\n          {...remainingProps}\n          aria-label={label}\n          theme={theme}\n          appearance={appearance}\n          size={size}\n          ref={ref as any}\n          disabled={disabled}\n        >\n          {React.Children.map(children, (child) => {\n            // TS needs this check for any following code to access child.type\n            // even with optional chaining\n            if (!React.isValidElement(child)) {\n              throw new Error(INVALID_CHILDREN_MESSAGE)\n            }\n\n            invariant(\n              child.type === Icon,\n              `Children of type ${child?.type} aren't permitted. Only an ${Icon.displayName} component is allowed in ${ActionIcon.displayName}`\n            )\n\n            return React.cloneElement(\n              child as React.ReactElement<React.ComponentProps<typeof Icon>>,\n              {\n                size: ActionIconSizeMap[size as string]\n              }\n            )\n          })}\n        </StyledButton>\n      </OptionalTooltipWrapper>\n    )\n  }\n)\n\nActionIcon.displayName = 'ActionIcon'\n"],"names":["StyledButton","styled","ActionIcon","React","children","theme","appearance","size","label","href","disabled","hasTooltip","tooltipSide","remainingProps","ref","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"iXAaA,MAAMA,EAAeC,EACnB,SACA,CACE,KAAM,CACJ,eACA,kBACA,WACA,iBACA,aACA,aACA,iBACA,OACA,WACA,iBACA,aACA,aACA,iBACA,eACA,WACA,8BACA,qBACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CACP,iCACA,wCACA,sCACF,EACA,QAAS,CACP,oCACA,wCACA,sCACF,EACA,YAAa,CACX,qCACA,yCACA,sCACF,EACA,QAAS,CACP,gCACA,wCACA,sCACF,EACA,QAAS,CACP,gCACA,wCACA,sCACF,EACA,OAAQ,CACN,+BACA,uCACA,qCACF,EACA,MAAO,CACL,8BACA,kCACA,+BACF,CACF,EACA,WAAY,CACV,OAAQ,CACN,iBACA,gBACA,uCACA,uCACA,qCACF,EACA,QAAS,CACP,WACA,SACA,iBACA,gBACA,uCACA,uCACA,qCACF,EACA,MAAO,CACL,cACA,aACA,qCACA,gCACA,qCACA,gCACA,mCACF,CACF,EACA,KAAM,CACJ,GAAI,CAAC,QAAQ,EACb,GAAI,CAAC,QAAQ,EACb,GAAI,CAAC,SAAS,EACd,GAAI,CAAC,SAAS,CAChB,EACA,UAAW,CACT,KAAM,CAAC,cAAc,CACvB,CACF,CACF,EACA,CACE,0BAA2B,EAC7B,CACF,EAWaC,EAAaC,EAAM,WAC9B,CACE,CACE,SAAAC,EACA,MAAAC,EAAQ,UACR,WAAAC,EAAa,SACb,KAAAC,EAAO,KACP,MAAAC,EACA,KAAAC,EACA,SAAAC,EACA,WAAAC,EAAa,GACb,YAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAA2B,YAAYC,EAAK,WAAW,yCAAyCd,EAAW,WAAW,GAE5H,OAAAe,EAAUd,EAAM,SAAS,MAAMC,CAAQ,IAAM,EAAGW,CAAwB,EActEZ,EAAA,cAACe,EAAA,CACC,WAAYP,EACZ,MAAOH,EACP,YAAaI,CAAAA,EAEbT,EAAA,cAACH,EAAA,CACE,GAhBmBS,EACrB,CACC,GAAI,IACJ,KAAMC,EAAW,OAAYD,EAC7B,QAAS,OACT,gBAAiB,CAAC,CAACC,CACrB,EACC,CAAE,KAAM,QAAS,EAUf,GAAGS,EAAuBV,CAAI,EAC9B,GAAGI,EACJ,aAAYL,EACZ,MAAOH,EACP,WAAYC,EACZ,KAAMC,EACN,IAAKO,EACL,SAAUJ,CAAAA,EAETP,EAAM,SAAS,IAAIC,EAAWgB,GAAU,CAGvC,GAAI,CAACjB,EAAM,eAAeiB,CAAK,EAC7B,MAAM,IAAI,MAAML,CAAwB,EAG1C,OAAAE,EACEG,EAAM,OAASJ,EACf,oBAAoBI,GAAA,KAAA,OAAAA,EAAO,IAAI,8BAA8BJ,EAAK,WAAW,4BAA4Bd,EAAW,WAAW,EACjI,EAEOC,EAAM,aACXiB,EACA,CACE,KAAMC,EAAkBd,CAAc,CACxC,CACF,CACF,CAAC,CACH,CACF,CAEJ,CACF,EAEAL,EAAW,YAAc"}

package/dist/components/banner/banner-regular/BannerRegularActions.js

@@ -1,2 +1,2 @@
-import i from"invariant";import*as n from"react";import{overrideStyledVariantValue as m}from"../../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";import{Flex as y}from"../../flex/Flex.js";import{useBannerContext as f}from"../BannerContext.js";import{BannerRegularButton as a}from"./BannerRegularButton.js";const l=2,h={sm:2,md:4},N={sm:"column",md:"row"},o=({children:r,...c})=>{const{size:t}=f(),p=n.useMemo(()=>m(t,e=>h[e]),[t]),s=n.useMemo(()=>m(t,e=>N[e]),[t]);return i(n.Children.count(r)<=l,"A maximum of ".concat(l," ").concat(a.displayName," component(s) are permitted as children of ").concat(o.displayName)),n.createElement(y,{gap:p,direction:s,...c},n.Children.map(r,(e,d)=>{if(e==null)return e;if(!n.isValidElement(e))throw new Error("Child passed to ".concat(o.displayName," is not a valid element"));i(e.type===a,"Children of type ".concat(e==null?void 0:e.type," aren't permitted. Only an ").concat(a.displayName," component is allowed in ").concat(o.displayName));const u={appearance:d>0?"outline":void 0};return n.cloneElement(e,u)}))};o.displayName="BannerRegularActions";export{o as BannerRegularActions};
+import a from"invariant";import*as n from"react";import{overrideStyledVariantValue as m}from"../../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";import{Flex as y}from"../../flex/Flex.js";import{useBannerContext as f}from"../BannerContext.js";import{BannerRegularButton as t}from"./BannerRegularButton.js";const l=2,h={sm:2,md:4},N={sm:"column",md:"row"},r=({children:i,...p})=>{const{size:o}=f(),s=n.useMemo(()=>m(o,e=>h[e]),[o]),d=n.useMemo(()=>m(o,e=>N[e]),[o]);return a(n.Children.count(i)<=l,`A maximum of ${l} ${t.displayName} component(s) are permitted as children of ${r.displayName}`),n.createElement(y,{gap:s,direction:d,...p},n.Children.map(i,(e,c)=>{if(e==null)return e;if(!n.isValidElement(e))throw new Error(`Child passed to ${r.displayName} is not a valid element`);a(e.type===t,`Children of type ${e==null?void 0:e.type} aren't permitted. Only an ${t.displayName} component is allowed in ${r.displayName}`);const u={appearance:c>0?"outline":void 0};return n.cloneElement(e,u)}))};r.displayName="BannerRegularActions";export{r as BannerRegularActions};
 //# sourceMappingURL=BannerRegularActions.js.map

package/dist/components/banner/banner-regular/BannerRegularActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularActions.js","sources":["../../../../src/components/banner/banner-regular/BannerRegularActions.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Flex } from '../../flex'\nimport { useBannerContext } from '../BannerContext'\nimport { BannerRegularButton } from './BannerRegularButton'\n\nconst MAX_ALLOWED_CHILDREN = 2\n\nconst toGap = {\n  sm: 2,\n  md: 4\n}\n\nconst toDirection = {\n  sm: 'column',\n  md: 'row'\n}\n\nexport const BannerRegularActions = ({\n  children,\n  ...props\n}: React.ComponentProps<typeof Flex>) => {\n  const { size } = useBannerContext()\n\n  const gap = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toGap[s]),\n    [size]\n  )\n\n  const direction = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toDirection[s]),\n    [size]\n  )\n\n  invariant(\n    React.Children.count(children) <= MAX_ALLOWED_CHILDREN,\n    `A maximum of ${MAX_ALLOWED_CHILDREN} ${BannerRegularButton.displayName} component(s) are permitted as children of ${BannerRegularActions.displayName}`\n  )\n\n  return (\n    <Flex gap={gap} direction={direction} {...props}>\n      {React.Children.map(children, (child, index) => {\n        // if child is undefined or null, React.isValidElement returns false and hence error is thrown.\n        // This line will prevent that from happening\n        if (child == null) return child\n\n        if (!React.isValidElement(child)) {\n          throw new Error(\n            `Child passed to ${BannerRegularActions.displayName} is not a valid element`\n          )\n        }\n\n        invariant(\n          child.type === BannerRegularButton,\n          `Children of type ${child?.type} aren't permitted. Only an ${BannerRegularButton.displayName} component is allowed in ${BannerRegularActions.displayName}`\n        )\n\n        const propsToInject: Partial<\n          React.ComponentProps<typeof BannerRegularButton>\n        > = {\n          // Override button appearance - make the second button outlined\n          appearance: index > 0 ? 'outline' : undefined\n        }\n\n        return React.cloneElement(\n          child as React.ReactElement<\n            React.ComponentProps<typeof BannerRegularButton>\n          >,\n          propsToInject\n        )\n      })}\n    </Flex>\n  )\n}\n\nBannerRegularActions.displayName = 'BannerRegularActions'\n"],"names":["MAX_ALLOWED_CHILDREN","toGap","toDirection","BannerRegularActions","children","props","size","useBannerContext","gap","React","overrideStyledVariantValue","s","direction","invariant","BannerRegularButton","Flex","child","index","propsToInject"],"mappings":"6UASA,MAAMA,EAAuB,EAEvBC,EAAQ,CACZ,GAAI,EACJ,GAAI,CACN,EAEMC,EAAc,CAClB,GAAI,SACJ,GAAI,KACN,EAEaC,EAAuB,CAAC,CACnC,SAAAC,EACA,GAAGC,CACL,IAAyC,CACvC,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAAA,EAEXC,EAAMC,EAAM,QAChB,IAAMC,EAA2BJ,EAAOK,GAAMV,EAAMU,CAAC,CAAC,EACtD,CAACL,CAAI,CACP,EAEMM,EAAYH,EAAM,QACtB,IAAMC,EAA2BJ,EAAOK,GAAMT,EAAYS,CAAC,CAAC,EAC5D,CAACL,CAAI,CACP,EAEA,OAAAO,EACEJ,EAAM,SAAS,MAAML,CAAQ,GAAKJ,EAClC,gBAAgB,OAAAA,EAAoB,GAAA,EAAI,OAAAc,EAAoB,YAAW,+CAA8C,OAAqBX,EAAA,WAAA,CAC5I,EAGEM,EAAA,cAACM,EAAA,CAAK,IAAKP,EAAK,UAAWI,EAAY,GAAGP,CAAAA,EACvCI,EAAM,SAAS,IAAIL,EAAU,CAACY,EAAOC,IAAU,CAG9C,GAAID,GAAS,KAAM,OAAOA,EAE1B,GAAI,CAACP,EAAM,eAAeO,CAAK,EAC7B,MAAM,IAAI,MACR,mBAAmB,SAAqB,YAAW,yBAAA,CACrD,EAGFH,EACEG,EAAM,OAASF,EACf,oBAAoB,OAAAE,GAAA,KAAA,OAAAA,EAAO,KAAI,6BAAA,EAA8B,OAAAF,EAAoB,YAAW,6BAA4B,OAAqBX,EAAA,WAAA,CAC/I,EAEA,MAAMe,EAEF,CAEF,WAAYD,EAAQ,EAAI,UAAY,MACtC,EAEA,OAAOR,EAAM,aACXO,EAGAE,CACF,CACF,CAAC,CACH,CAEJ,EAEAf,EAAqB,YAAc"}
+{"version":3,"file":"BannerRegularActions.js","sources":["../../../../src/components/banner/banner-regular/BannerRegularActions.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Flex } from '../../flex'\nimport { useBannerContext } from '../BannerContext'\nimport { BannerRegularButton } from './BannerRegularButton'\n\nconst MAX_ALLOWED_CHILDREN = 2\n\nconst toGap = {\n  sm: 2,\n  md: 4\n}\n\nconst toDirection = {\n  sm: 'column',\n  md: 'row'\n}\n\nexport const BannerRegularActions = ({\n  children,\n  ...props\n}: React.ComponentProps<typeof Flex>) => {\n  const { size } = useBannerContext()\n\n  const gap = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toGap[s]),\n    [size]\n  )\n\n  const direction = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toDirection[s]),\n    [size]\n  )\n\n  invariant(\n    React.Children.count(children) <= MAX_ALLOWED_CHILDREN,\n    `A maximum of ${MAX_ALLOWED_CHILDREN} ${BannerRegularButton.displayName} component(s) are permitted as children of ${BannerRegularActions.displayName}`\n  )\n\n  return (\n    <Flex gap={gap} direction={direction} {...props}>\n      {React.Children.map(children, (child, index) => {\n        // if child is undefined or null, React.isValidElement returns false and hence error is thrown.\n        // This line will prevent that from happening\n        if (child == null) return child\n\n        if (!React.isValidElement(child)) {\n          throw new Error(\n            `Child passed to ${BannerRegularActions.displayName} is not a valid element`\n          )\n        }\n\n        invariant(\n          child.type === BannerRegularButton,\n          `Children of type ${child?.type} aren't permitted. Only an ${BannerRegularButton.displayName} component is allowed in ${BannerRegularActions.displayName}`\n        )\n\n        const propsToInject: Partial<\n          React.ComponentProps<typeof BannerRegularButton>\n        > = {\n          // Override button appearance - make the second button outlined\n          appearance: index > 0 ? 'outline' : undefined\n        }\n\n        return React.cloneElement(\n          child as React.ReactElement<\n            React.ComponentProps<typeof BannerRegularButton>\n          >,\n          propsToInject\n        )\n      })}\n    </Flex>\n  )\n}\n\nBannerRegularActions.displayName = 'BannerRegularActions'\n"],"names":["MAX_ALLOWED_CHILDREN","toGap","toDirection","BannerRegularActions","children","props","size","useBannerContext","gap","React","overrideStyledVariantValue","s","direction","invariant","BannerRegularButton","Flex","child","index","propsToInject"],"mappings":"6UASA,MAAMA,EAAuB,EAEvBC,EAAQ,CACZ,GAAI,EACJ,GAAI,CACN,EAEMC,EAAc,CAClB,GAAI,SACJ,GAAI,KACN,EAEaC,EAAuB,CAAC,CACnC,SAAAC,EACA,GAAGC,CACL,IAAyC,CACvC,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAAA,EAEXC,EAAMC,EAAM,QAChB,IAAMC,EAA2BJ,EAAOK,GAAMV,EAAMU,CAAC,CAAC,EACtD,CAACL,CAAI,CACP,EAEMM,EAAYH,EAAM,QACtB,IAAMC,EAA2BJ,EAAOK,GAAMT,EAAYS,CAAC,CAAC,EAC5D,CAACL,CAAI,CACP,EAEA,OAAAO,EACEJ,EAAM,SAAS,MAAML,CAAQ,GAAKJ,EAClC,gBAAgBA,CAAoB,IAAIc,EAAoB,WAAW,8CAA8CX,EAAqB,WAAW,EACvJ,EAGEM,EAAA,cAACM,EAAA,CAAK,IAAKP,EAAK,UAAWI,EAAY,GAAGP,GACvCI,EAAM,SAAS,IAAIL,EAAU,CAACY,EAAOC,IAAU,CAG9C,GAAID,GAAS,KAAM,OAAOA,EAE1B,GAAI,CAACP,EAAM,eAAeO,CAAK,EAC7B,MAAM,IAAI,MACR,mBAAmBb,EAAqB,WAAW,yBACrD,EAGFU,EACEG,EAAM,OAASF,EACf,oBAAoBE,GAAA,KAAA,OAAAA,EAAO,IAAI,8BAA8BF,EAAoB,WAAW,4BAA4BX,EAAqB,WAAW,EAC1J,EAEA,MAAMe,EAEF,CAEF,WAAYD,EAAQ,EAAI,UAAY,MACtC,EAEA,OAAOR,EAAM,aACXO,EAGAE,CACF,CACF,CAAC,CACH,CAEJ,EAEAf,EAAqB,YAAc"}

package/dist/components/calendar/Calendar.js

@@ -1,2 +1,2 @@
-import{ChevronLeft as G,ChevronRight as H}from"@atom-learning/icons";import J from"clsx";import{useDayzed as K}from"dayzed";import*as e from"react";import{ActionIcon as D}from"../action-icon/ActionIcon.js";import{Button as N}from"../button/Button.js";import{Flex as w}from"../flex/Flex.js";import{Icon as Y}from"../icon/Icon.js";import{Text as Q}from"../text/Text.js";import{styled as F}from"../../styled.js";import{monthNamesShort as V,weekdayNamesShort as X,DEFAULT_LABELS as Z}from"./constants.js";import{Day as $}from"./Day.js";const g=F("div",{base:["grid","grid-cols-[repeat(7,1fr)]","gap-x-2","gap-y-1"]}),ee=F(N,{base:["text-grey-1000","p-3","w-16"],variants:{selected:{false:["disabled:bg-white!","font-normal","hover:bg-grey-200!","hover:text-grey-1000!","text-grey-1000!"]}}}),te=(m,i)=>{const u=m.slice(0,i);return m.slice(i).concat(u)},C=({className:m,refDateSelected:i,refDateToday:u,firstDayOfWeek:f=0,monthNames:S=V,weekdayNames:z=X,labels:h=Z,date:o=new Date,minDate:n,maxDate:c,setYear:L,...O})=>{const[r,E]=e.useState(!1),[s,b]=e.useState(o==null?void 0:o.getFullYear()),A=t=>{const a=o;a.setFullYear(t),L(a),E(!1)},B=n&&s-16<=n.getFullYear(),M=c&&s>=c.getFullYear(),T=Array.from({length:16},(t,a)=>{const l=s-a;return c&&l>c.getFullYear()||n&&l<n.getFullYear()?0:l}),{calendars:d,getBackProps:I,getForwardProps:P,getDateProps:j}=K({firstDayOfWeek:f,showOutsideDays:!0,date:o,minDate:n,maxDate:c,...O});return d.length?e.createElement("div",{className:J("relative","w-min","-mt-1",m)},e.createElement(w,{className:"absolute top-0 -right-1"},e.createElement(D,{label:h[r?"previousYear":"previous"],theme:"neutral",size:"md",...!r&&I({calendars:d}),...r&&{onClick:()=>b(s-16)},disabled:r&&B},e.createElement(Y,{is:G})),e.createElement(D,{label:h[r?"nextYear":"next"],theme:"neutral",size:"md",...!r&&P({calendars:d}),...r&&{onClick:()=>b(s+16)},disabled:r&&M},e.createElement(Y,{is:H}))),r&&e.createElement(g,{className:"grid-cols-[repeat(4,1fr)] gap-x-1 gap-y-3 pt-12 [direction:rtl]"},T.map((t,a)=>{const l=t===o.getFullYear();return t?e.createElement(ee,{key:"".concat(t).concat(a),theme:l?"primary":"neutral",onClick:()=>A(t),selected:l},t):e.createElement("div",{key:a,className:"h-10 w-16"})})),!r&&d.map(({month:t,year:a,weeks:l})=>e.createElement("div",{key:"".concat(t).concat(a)},e.createElement(w,{className:"mb-4 h-10 items-center"},e.createElement(N,{theme:"neutral",onClick:()=>E(!0),className:"text-grey-1000 px-0"},S[t]," ",a)),e.createElement(g,{className:"mb-3"},te(z,f).map(p=>e.createElement(Q,{as:"span",size:"sm",weight:"bold",key:"".concat(t).concat(a).concat(p),className:"text-center"},p))),e.createElement(g,null,l.map((p,R)=>p.map((y,U)=>{const x="".concat(t).concat(a).concat(R).concat(U);if(!y)return e.createElement("div",{key:x});const{date:W,selected:k,today:v,prevMonth:_,nextMonth:q}=y;return e.createElement($,{isOutsideMonth:_||q,isSelected:k,isToday:v,key:x,ref:k?i:v?u:null,...j({dateObj:y}),type:"button"},W.getDate())})))))):null};C.displayName="Calendar";export{C as Calendar};
+import{ChevronLeft as q,ChevronRight as G}from"@atom-learning/icons";import H from"clsx";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as D}from"../action-icon/ActionIcon.js";import{Button as N}from"../button/Button.js";import{Flex as w}from"../flex/Flex.js";import{Icon as Y}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{styled as $}from"../../styled.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const g=$("div",{base:["grid","grid-cols-[repeat(7,1fr)]","gap-x-2","gap-y-1"]}),ee=$(N,{base:["text-grey-1000","p-3","w-16"],variants:{selected:{false:["disabled:bg-white!","font-normal","hover:bg-grey-200!","hover:text-grey-1000!","text-grey-1000!"]}}}),te=(c,i)=>{const u=c.slice(0,i);return c.slice(i).concat(u)},F=({className:c,refDateSelected:i,refDateToday:u,firstDayOfWeek:f=0,monthNames:C=Q,weekdayNames:S=V,labels:h=X,date:s=new Date,minDate:m,maxDate:o,setYear:z,...L})=>{const[r,E]=e.useState(!1),[n,b]=e.useState(s==null?void 0:s.getFullYear()),O=t=>{const a=s;a.setFullYear(t),z(a),E(!1)},A=m&&n-16<=m.getFullYear(),B=o&&n>=o.getFullYear(),M=Array.from({length:16},(t,a)=>{const l=n-a;return o&&l>o.getFullYear()||m&&l<m.getFullYear()?0:l}),{calendars:d,getBackProps:T,getForwardProps:I,getDateProps:P}=J({firstDayOfWeek:f,showOutsideDays:!0,date:s,minDate:m,maxDate:o,...L});return d.length?e.createElement("div",{className:H("relative","w-min","-mt-1",c)},e.createElement(w,{className:"absolute top-0 -right-1"},e.createElement(D,{label:h[r?"previousYear":"previous"],theme:"neutral",size:"md",...!r&&T({calendars:d}),...r&&{onClick:()=>b(n-16)},disabled:r&&A},e.createElement(Y,{is:q})),e.createElement(D,{label:h[r?"nextYear":"next"],theme:"neutral",size:"md",...!r&&I({calendars:d}),...r&&{onClick:()=>b(n+16)},disabled:r&&B},e.createElement(Y,{is:G}))),r&&e.createElement(g,{className:"grid-cols-[repeat(4,1fr)] gap-x-1 gap-y-3 pt-12 [direction:rtl]"},M.map((t,a)=>{const l=t===s.getFullYear();return t?e.createElement(ee,{key:`${t}${a}`,theme:l?"primary":"neutral",onClick:()=>O(t),selected:l},t):e.createElement("div",{key:a,className:"h-10 w-16"})})),!r&&d.map(({month:t,year:a,weeks:l})=>e.createElement("div",{key:`${t}${a}`},e.createElement(w,{className:"mb-4 h-10 items-center"},e.createElement(N,{theme:"neutral",onClick:()=>E(!0),className:"text-grey-1000 px-0"},C[t]," ",a)),e.createElement(g,{className:"mb-3"},te(S,f).map(p=>e.createElement(K,{as:"span",size:"sm",weight:"bold",key:`${t}${a}${p}`,className:"text-center"},p))),e.createElement(g,null,l.map((p,j)=>p.map((y,R)=>{const x=`${t}${a}${j}${R}`;if(!y)return e.createElement("div",{key:x});const{date:U,selected:k,today:v,prevMonth:W,nextMonth:_}=y;return e.createElement(Z,{isOutsideMonth:W||_,isSelected:k,isToday:v,key:x,ref:k?i:v?u:null,...P({dateObj:y}),type:"button"},U.getDate())})))))):null};F.displayName="Calendar";export{F as Calendar};
 //# sourceMappingURL=Calendar.js.map

package/dist/components/calendar/Calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","sources":["../../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport { useDayzed } from 'dayzed'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Button } from '~/components/button'\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { Text } from '~/components/text'\nimport { styled } from '~/styled'\n\nimport { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from './constants'\nimport { Day } from './Day'\n\nconst Grid = styled('div', {\n  base: ['grid', 'grid-cols-[repeat(7,1fr)]', 'gap-x-2', 'gap-y-1']\n})\n\nconst StyledButton = styled(Button, {\n  base: ['text-grey-1000', 'p-3', 'w-16'],\n  variants: {\n    selected: {\n      false: [\n        'disabled:bg-white!',\n        'font-normal',\n        'hover:bg-grey-200!',\n        'hover:text-grey-1000!',\n        'text-grey-1000!'\n      ]\n    }\n  }\n})\n\nexport type CalendarTranslationProps = {\n  monthNames?: string[]\n  weekdayNames?: string[]\n  labels?: {\n    open: string\n    next: string\n    previous: string\n    nextYear: string\n    previousYear: string\n  }\n}\n\ntype CalendarProps = DayzedInterface &\n  CalendarTranslationProps & {\n    refDateToday?: React.RefObject<HTMLButtonElement>\n    refDateSelected?: React.RefObject<HTMLButtonElement>\n    setYear: (date: Date) => Promise<void>\n    className?: string\n  }\n\nconst offsetWeekdayNames = (\n  weekdayNames: string[],\n  firstDayOfWeek: number\n): string[] => {\n  const start = weekdayNames.slice(0, firstDayOfWeek)\n  const end = weekdayNames.slice(firstDayOfWeek)\n  return end.concat(start)\n}\n\nexport const Calendar = ({\n  className,\n  refDateSelected,\n  refDateToday,\n  firstDayOfWeek = 0,\n  monthNames = monthNamesShort,\n  weekdayNames = weekdayNamesShort,\n  labels = DEFAULT_LABELS,\n  date = new Date(),\n  minDate,\n  maxDate,\n  setYear,\n  ...remainingProps\n}: CalendarProps) => {\n  const [showYears, setShowYears] = React.useState<boolean>(false)\n  const [currentYear, setCurrentYear] = React.useState<number>(\n    date?.getFullYear()\n  )\n\n  const handleSetYear = (year: number): void => {\n    const newDate = date\n    newDate.setFullYear(year)\n    setYear(newDate)\n    setShowYears(false)\n  }\n\n  const isAtMinYear = minDate && currentYear - 16 <= minDate.getFullYear()\n  const isAtMaxYear = maxDate && currentYear >= maxDate.getFullYear()\n\n  const yearList = Array.from({ length: 16 }, (_, i) => {\n    const year = currentYear - i\n    if (\n      (maxDate && year > maxDate.getFullYear()) ||\n      (minDate && year < minDate.getFullYear())\n    )\n      return 0\n    return year\n  })\n\n  const { calendars, getBackProps, getForwardProps, getDateProps } = useDayzed({\n    firstDayOfWeek,\n    showOutsideDays: true,\n    date,\n    minDate,\n    maxDate,\n    ...remainingProps\n  })\n\n  if (!calendars.length) return null\n\n  return (\n    <div className={clsx('relative', 'w-min', '-mt-1', className)}>\n      <Flex className=\"absolute top-0 -right-1\">\n        <ActionIcon\n          label={labels[showYears ? 'previousYear' : 'previous']}\n          theme=\"neutral\"\n          size=\"md\"\n          {...(!showYears && getBackProps({ calendars }))}\n          {...(showYears && {\n            onClick: () => setCurrentYear(currentYear - 16)\n          })}\n          disabled={showYears && isAtMinYear}\n        >\n          <Icon is={ChevronLeft} />\n        </ActionIcon>\n        <ActionIcon\n          label={labels[showYears ? 'nextYear' : 'next']}\n          theme=\"neutral\"\n          size=\"md\"\n          {...(!showYears && getForwardProps({ calendars }))}\n          {...(showYears && {\n            onClick: () => setCurrentYear(currentYear + 16)\n          })}\n          disabled={showYears && isAtMaxYear}\n        >\n          <Icon is={ChevronRight} />\n        </ActionIcon>\n      </Flex>\n      {showYears && (\n        <Grid className=\"grid-cols-[repeat(4,1fr)] gap-x-1 gap-y-3 pt-12 [direction:rtl]\">\n          {yearList.map((year, i) => {\n            const isCurrentYear = year === date.getFullYear()\n            if (!year) return <div key={i} className=\"h-10 w-16\" />\n\n            return (\n              <StyledButton\n                key={`${year}${i}`}\n                theme={isCurrentYear ? 'primary' : 'neutral'}\n                onClick={() => handleSetYear(year)}\n                selected={isCurrentYear}\n              >\n                {year}\n              </StyledButton>\n            )\n          })}\n        </Grid>\n      )}\n      {!showYears &&\n        calendars.map(({ month, year, weeks }) => (\n          <div key={`${month}${year}`}>\n            <Flex className=\"mb-4 h-10 items-center\">\n              <Button\n                theme=\"neutral\"\n                onClick={() => setShowYears(true)}\n                className=\"text-grey-1000 px-0\"\n              >\n                {monthNames[month]} {year}\n              </Button>\n            </Flex>\n            <Grid className=\"mb-3\">\n              {offsetWeekdayNames(weekdayNames, firstDayOfWeek).map(\n                (weekday) => (\n                  <Text\n                    as=\"span\"\n                    size=\"sm\"\n                    weight=\"bold\"\n                    key={`${month}${year}${weekday}`}\n                    className=\"text-center\"\n                  >\n                    {weekday}\n                  </Text>\n                )\n              )}\n            </Grid>\n            <Grid>\n              {weeks.map((week, weekIndex) =>\n                week.map((dateObj, index) => {\n                  const key = `${month}${year}${weekIndex}${index}`\n\n                  if (!dateObj) return <div key={key} />\n\n                  const { date, selected, today, prevMonth, nextMonth } =\n                    dateObj\n\n                  return (\n                    <Day\n                      isOutsideMonth={prevMonth || nextMonth}\n                      isSelected={selected}\n                      isToday={today}\n                      key={key}\n                      ref={\n                        selected ? refDateSelected : today ? refDateToday : null\n                      }\n                      {...getDateProps({ dateObj })}\n                      type=\"button\"\n                    >\n                      {date.getDate()}\n                    </Day>\n                  )\n                })\n              )}\n            </Grid>\n          </div>\n        ))}\n    </div>\n  )\n}\n\nCalendar.displayName = 'Calendar'\n"],"names":["Grid","styled","StyledButton","Button","offsetWeekdayNames","weekdayNames","firstDayOfWeek","start","Calendar","className","refDateSelected","refDateToday","monthNames","monthNamesShort","weekdayNamesShort","labels","DEFAULT_LABELS","date","minDate","maxDate","setYear","remainingProps","showYears","setShowYears","React","currentYear","setCurrentYear","handleSetYear","year","newDate","isAtMinYear","isAtMaxYear","yearList","_","i","calendars","getBackProps","getForwardProps","getDateProps","useDayzed","clsx","Flex","ActionIcon","Icon","ChevronLeft","ChevronRight","isCurrentYear","month","weeks","weekday","Text","week","weekIndex","dateObj","index","key","selected","today","prevMonth","nextMonth","Day"],"mappings":"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"}
+{"version":3,"file":"Calendar.js","sources":["../../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport { useDayzed } from 'dayzed'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Button } from '~/components/button'\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { Text } from '~/components/text'\nimport { styled } from '~/styled'\n\nimport { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from './constants'\nimport { Day } from './Day'\n\nconst Grid = styled('div', {\n  base: ['grid', 'grid-cols-[repeat(7,1fr)]', 'gap-x-2', 'gap-y-1']\n})\n\nconst StyledButton = styled(Button, {\n  base: ['text-grey-1000', 'p-3', 'w-16'],\n  variants: {\n    selected: {\n      false: [\n        'disabled:bg-white!',\n        'font-normal',\n        'hover:bg-grey-200!',\n        'hover:text-grey-1000!',\n        'text-grey-1000!'\n      ]\n    }\n  }\n})\n\nexport type CalendarTranslationProps = {\n  monthNames?: string[]\n  weekdayNames?: string[]\n  labels?: {\n    open: string\n    next: string\n    previous: string\n    nextYear: string\n    previousYear: string\n  }\n}\n\ntype CalendarProps = DayzedInterface &\n  CalendarTranslationProps & {\n    refDateToday?: React.RefObject<HTMLButtonElement>\n    refDateSelected?: React.RefObject<HTMLButtonElement>\n    setYear: (date: Date) => Promise<void>\n    className?: string\n  }\n\nconst offsetWeekdayNames = (\n  weekdayNames: string[],\n  firstDayOfWeek: number\n): string[] => {\n  const start = weekdayNames.slice(0, firstDayOfWeek)\n  const end = weekdayNames.slice(firstDayOfWeek)\n  return end.concat(start)\n}\n\nexport const Calendar = ({\n  className,\n  refDateSelected,\n  refDateToday,\n  firstDayOfWeek = 0,\n  monthNames = monthNamesShort,\n  weekdayNames = weekdayNamesShort,\n  labels = DEFAULT_LABELS,\n  date = new Date(),\n  minDate,\n  maxDate,\n  setYear,\n  ...remainingProps\n}: CalendarProps) => {\n  const [showYears, setShowYears] = React.useState<boolean>(false)\n  const [currentYear, setCurrentYear] = React.useState<number>(\n    date?.getFullYear()\n  )\n\n  const handleSetYear = (year: number): void => {\n    const newDate = date\n    newDate.setFullYear(year)\n    setYear(newDate)\n    setShowYears(false)\n  }\n\n  const isAtMinYear = minDate && currentYear - 16 <= minDate.getFullYear()\n  const isAtMaxYear = maxDate && currentYear >= maxDate.getFullYear()\n\n  const yearList = Array.from({ length: 16 }, (_, i) => {\n    const year = currentYear - i\n    if (\n      (maxDate && year > maxDate.getFullYear()) ||\n      (minDate && year < minDate.getFullYear())\n    )\n      return 0\n    return year\n  })\n\n  const { calendars, getBackProps, getForwardProps, getDateProps } = useDayzed({\n    firstDayOfWeek,\n    showOutsideDays: true,\n    date,\n    minDate,\n    maxDate,\n    ...remainingProps\n  })\n\n  if (!calendars.length) return null\n\n  return (\n    <div className={clsx('relative', 'w-min', '-mt-1', className)}>\n      <Flex className=\"absolute top-0 -right-1\">\n        <ActionIcon\n          label={labels[showYears ? 'previousYear' : 'previous']}\n          theme=\"neutral\"\n          size=\"md\"\n          {...(!showYears && getBackProps({ calendars }))}\n          {...(showYears && {\n            onClick: () => setCurrentYear(currentYear - 16)\n          })}\n          disabled={showYears && isAtMinYear}\n        >\n          <Icon is={ChevronLeft} />\n        </ActionIcon>\n        <ActionIcon\n          label={labels[showYears ? 'nextYear' : 'next']}\n          theme=\"neutral\"\n          size=\"md\"\n          {...(!showYears && getForwardProps({ calendars }))}\n          {...(showYears && {\n            onClick: () => setCurrentYear(currentYear + 16)\n          })}\n          disabled={showYears && isAtMaxYear}\n        >\n          <Icon is={ChevronRight} />\n        </ActionIcon>\n      </Flex>\n      {showYears && (\n        <Grid className=\"grid-cols-[repeat(4,1fr)] gap-x-1 gap-y-3 pt-12 [direction:rtl]\">\n          {yearList.map((year, i) => {\n            const isCurrentYear = year === date.getFullYear()\n            if (!year) return <div key={i} className=\"h-10 w-16\" />\n\n            return (\n              <StyledButton\n                key={`${year}${i}`}\n                theme={isCurrentYear ? 'primary' : 'neutral'}\n                onClick={() => handleSetYear(year)}\n                selected={isCurrentYear}\n              >\n                {year}\n              </StyledButton>\n            )\n          })}\n        </Grid>\n      )}\n      {!showYears &&\n        calendars.map(({ month, year, weeks }) => (\n          <div key={`${month}${year}`}>\n            <Flex className=\"mb-4 h-10 items-center\">\n              <Button\n                theme=\"neutral\"\n                onClick={() => setShowYears(true)}\n                className=\"text-grey-1000 px-0\"\n              >\n                {monthNames[month]} {year}\n              </Button>\n            </Flex>\n            <Grid className=\"mb-3\">\n              {offsetWeekdayNames(weekdayNames, firstDayOfWeek).map(\n                (weekday) => (\n                  <Text\n                    as=\"span\"\n                    size=\"sm\"\n                    weight=\"bold\"\n                    key={`${month}${year}${weekday}`}\n                    className=\"text-center\"\n                  >\n                    {weekday}\n                  </Text>\n                )\n              )}\n            </Grid>\n            <Grid>\n              {weeks.map((week, weekIndex) =>\n                week.map((dateObj, index) => {\n                  const key = `${month}${year}${weekIndex}${index}`\n\n                  if (!dateObj) return <div key={key} />\n\n                  const { date, selected, today, prevMonth, nextMonth } =\n                    dateObj\n\n                  return (\n                    <Day\n                      isOutsideMonth={prevMonth || nextMonth}\n                      isSelected={selected}\n                      isToday={today}\n                      key={key}\n                      ref={\n                        selected ? refDateSelected : today ? refDateToday : null\n                      }\n                      {...getDateProps({ dateObj })}\n                      type=\"button\"\n                    >\n                      {date.getDate()}\n                    </Day>\n                  )\n                })\n              )}\n            </Grid>\n          </div>\n        ))}\n    </div>\n  )\n}\n\nCalendar.displayName = 'Calendar'\n"],"names":["Grid","styled","StyledButton","Button","offsetWeekdayNames","weekdayNames","firstDayOfWeek","start","Calendar","className","refDateSelected","refDateToday","monthNames","monthNamesShort","weekdayNamesShort","labels","DEFAULT_LABELS","date","minDate","maxDate","setYear","remainingProps","showYears","setShowYears","React","currentYear","setCurrentYear","handleSetYear","year","newDate","isAtMinYear","isAtMaxYear","yearList","_","i","calendars","getBackProps","getForwardProps","getDateProps","useDayzed","clsx","Flex","ActionIcon","Icon","ChevronLeft","ChevronRight","isCurrentYear","month","weeks","weekday","Text","week","weekIndex","dateObj","index","key","selected","today","prevMonth","nextMonth","Day"],"mappings":"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"}

package/dist/components/carousel/Carousel.d.ts

@@ -32,12 +32,9 @@ export declare const Carousel: {
         className?: string;
         index: number;
     }) => React.JSX.Element;
-    Slider: React.ForwardRefExoticComponent<Omit<(import("pure-react-carousel").SliderProps & React.RefAttributes<React.Component<import("pure-react-carousel").SliderProps, any, any>>) | (import("pure-react-carousel").SliderProps & {
-        children?: React.ReactNode | undefined;
-    }), "overflow"> & {
-        overflow?: boolean | undefined;
-    } & {
-        as?: React.ElementType;
-    }>;
+    Slider: ({ children, className, overflow, ...rest }: React.PropsWithChildren<{
+        className?: string;
+        overflow: boolean;
+    }>) => React.JSX.Element;
 };
 export {};

package/dist/components/carousel/CarouselSlider.d.ts

@@ -1,7 +1,5 @@
-export declare const CarouselSlider: import("react").ForwardRefExoticComponent<Omit<(import("pure-react-carousel").SliderProps & import("react").RefAttributes<import("react").Component<import("pure-react-carousel").SliderProps, any, any>>) | (import("pure-react-carousel").SliderProps & {
-    children?: import("react").ReactNode | undefined;
-}), "overflow"> & {
-    overflow?: boolean | undefined;
-} & {
-    as?: import("react").ElementType;
-}>;
+import * as React from 'react';
+export declare const CarouselSlider: ({ children, className, overflow, ...rest }: React.PropsWithChildren<{
+    className?: string;
+    overflow: boolean;
+}>) => React.JSX.Element;

package/dist/components/carousel/CarouselSlider.js

@@ -1,2 +1,2 @@
-import{Slider as s}from"pure-react-carousel";import{styled as r}from"../../styled.js";const e=r(s,{base:["cursor-grab","ml-[50%]","overflow-hidden","-translate-x-1/2","**:[[class*=sliderTray\\_]]:duration-500","**:[[class*=sliderTray\\_]]:ease-[cubic-bezier(.645,.045,.355,1)]","**:[[class*=sliderTray\\_]]:m-[unset]","**:[[class*=sliderTray\\_]]:p-[unset]","**:[[class*=sliderTray\\_]]:transition-transform","**:[[class*=slide\\_]]:float-left","**:[[class*=slide\\_]]:pb-0!","**:[[class*=slideInner]]:flex","**:[[class*=slideInner]]:justify-center"],variants:{overflow:{true:["overflow-visible"]}}});export{e as CarouselSlider};
+import a from"clsx";import{Slider as i}from"pure-react-carousel";import*as o from"react";const t=({children:e,className:r,overflow:s,...l})=>o.createElement(i,{...l,className:String.raw`ml-[50%] -translate-x-1/2 cursor-grab overflow-hidden **:[[class*=slideInner]]:flex **:[[class*=slideInner]]:justify-center **:[[class*=slide\_]]:float-left **:[[class*=slide\_]]:pb-0! **:[[class*=sliderTray\_]]:transition-transform **:[[class*=sliderTray\_]]:duration-500 **:[[class*=sliderTray\_]]:ease-[cubic-bezier(.645,.045,.355,1)] `+a(s&&"overflow-visible",r)},e);export{t as CarouselSlider};
 //# sourceMappingURL=CarouselSlider.js.map

package/dist/components/carousel/CarouselSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselSlider.js","sources":["../../../src/components/carousel/CarouselSlider.tsx"],"sourcesContent":["import { Slider as BaseSlider } from 'pure-react-carousel'\n\nimport { styled } from '~/styled'\n\nexport const CarouselSlider = styled(BaseSlider, {\n  base: [\n    'cursor-grab',\n    'ml-[50%]',\n    'overflow-hidden',\n    '-translate-x-1/2',\n    '**:[[class*=sliderTray\\\\_]]:duration-500',\n    '**:[[class*=sliderTray\\\\_]]:ease-[cubic-bezier(.645,.045,.355,1)]',\n    '**:[[class*=sliderTray\\\\_]]:m-[unset]',\n    '**:[[class*=sliderTray\\\\_]]:p-[unset]',\n    '**:[[class*=sliderTray\\\\_]]:transition-transform',\n    '**:[[class*=slide\\\\_]]:float-left',\n    '**:[[class*=slide\\\\_]]:pb-0!',\n    '**:[[class*=slideInner]]:flex',\n    '**:[[class*=slideInner]]:justify-center'\n  ],\n  variants: {\n    overflow: {\n      true: ['overflow-visible']\n    }\n  }\n})\n"],"names":["CarouselSlider","styled","BaseSlider"],"mappings":"sFAIO,MAAMA,EAAiBC,EAAOC,EAAY,CAC/C,KAAM,CACJ,cACA,WACA,kBACA,mBACA,2CACA,oEACA,wCACA,wCACA,mDACA,oCACA,+BACA,gCACA,yCACF,EACA,SAAU,CACR,SAAU,CACR,KAAM,CAAC,kBAAkB,CAC3B,CACF,CACF,CAAC"}
+{"version":3,"file":"CarouselSlider.js","sources":["../../../src/components/carousel/CarouselSlider.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { Slider as BaseSlider } from 'pure-react-carousel'\nimport * as React from 'react'\n\nexport const CarouselSlider = ({\n  children,\n  className,\n  overflow,\n  ...rest\n}: React.PropsWithChildren<{\n  className?: string\n  overflow: boolean\n}>) => (\n  <BaseSlider\n    {...rest}\n    className={\n      String.raw`ml-[50%] -translate-x-1/2 cursor-grab overflow-hidden **:[[class*=slideInner]]:flex **:[[class*=slideInner]]:justify-center **:[[class*=slide\\_]]:float-left **:[[class*=slide\\_]]:pb-0! **:[[class*=sliderTray\\_]]:transition-transform **:[[class*=sliderTray\\_]]:duration-500 **:[[class*=sliderTray\\_]]:ease-[cubic-bezier(.645,.045,.355,1)] ` +\n      clsx(overflow && 'overflow-visible', className)\n    }\n  >\n    {children}\n  </BaseSlider>\n)\n"],"names":["CarouselSlider","children","className","overflow","rest","React","BaseSlider","clsx"],"mappings":"yFAIO,MAAMA,EAAiB,CAAC,CAC7B,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAIEC,EAAA,cAACC,EAAA,CACE,GAAGF,EACJ,UACE,OAAO,wVACPG,EAAKJ,GAAY,mBAAoBD,CAAS,GAG/CD,CACH"}

package/dist/components/checkbox-group/CheckboxGroupItem.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Checkbox as d}from"../checkbox/Checkbox.js";import{CheckboxGroupMountedContext as l}from"./context/CheckboxGroupMounted.context.js";import{CheckboxGroupCheckedContext as k}from"./context/CheckboxGroupChecked.context.js";const a=({value:e,title:n,onCheckedChange:C,...r})=>{const{checked:h,handleItemCheckedChange:m}=t.useContext(k),{handleItemMountedChange:o}=t.useContext(l),u=c=>{m(c,e),C==null||C(c)};return t.useEffect(()=>(o(!0,e),()=>{o(!1,e)}),[o,e]),t.createElement(d,{onCheckedChange:u,checked:h.includes(e),title:n!=null?n:String(e),...r})};export{a as CheckboxGroupItem};
+import*as t from"react";import{Checkbox as u}from"../checkbox/Checkbox.js";import{CheckboxGroupMountedContext as k}from"./context/CheckboxGroupMounted.context.js";import{CheckboxGroupCheckedContext as a}from"./context/CheckboxGroupChecked.context.js";const l=({value:e,title:C,onCheckedChange:n,...h})=>{const{checked:r,handleItemCheckedChange:m}=t.useContext(a),{handleItemMountedChange:o}=t.useContext(k),d=c=>{m(c,e),n==null||n(c)};return t.useEffect(()=>(o(!0,e),()=>{o(!1,e)}),[o,e]),t.createElement(u,{onCheckedChange:d,checked:r.includes(e),title:C??String(e),...h})};export{l as CheckboxGroupItem};
 //# sourceMappingURL=CheckboxGroupItem.js.map

package/dist/components/checkbox-group/CheckboxGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupItem.js","sources":["../../../src/components/checkbox-group/CheckboxGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Checkbox } from '../checkbox'\nimport {\n  CheckboxGroupCheckedContext,\n  CheckboxGroupMountedContext\n} from './CheckboxGroup.context'\n\ntype CheckboxGroupItemProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  'onCheckedChange' | 'checked' | 'defaultChecked'\n> & {\n  onCheckedChange?: (newChecked: boolean) => void\n}\n\nexport const CheckboxGroupItem = ({\n  value,\n  title,\n  onCheckedChange,\n  ...rest\n}: CheckboxGroupItemProps): JSX.Element => {\n  const {\n    checked: checkedItems,\n    handleItemCheckedChange: handleItemCheckedChangeContext\n  } = React.useContext(CheckboxGroupCheckedContext)\n  const { handleItemMountedChange } = React.useContext(\n    CheckboxGroupMountedContext\n  )\n\n  const handleItemCheckedChange = (newChecked) => {\n    handleItemCheckedChangeContext(newChecked, value)\n    onCheckedChange?.(newChecked)\n  }\n\n  React.useEffect(() => {\n    handleItemMountedChange(true, value)\n    return () => {\n      handleItemMountedChange(false, value)\n    }\n  }, [handleItemMountedChange, value])\n\n  return (\n    <Checkbox\n      onCheckedChange={handleItemCheckedChange}\n      checked={checkedItems.includes(value)}\n      title={title ?? String(value)}\n      {...rest}\n    />\n  )\n}\n"],"names":["CheckboxGroupItem","value","title","onCheckedChange","rest","checkedItems","handleItemCheckedChangeContext","React","CheckboxGroupCheckedContext","handleItemMountedChange","CheckboxGroupMountedContext","handleItemCheckedChange","newChecked","Checkbox"],"mappings":"2PAeO,MAAMA,EAAoB,CAAC,CAChC,MAAAC,EACA,MAAAC,EACA,gBAAAC,EACA,GAAGC,CACL,IAA2C,CACzC,KAAM,CACJ,QAASC,EACT,wBAAyBC,CAC3B,EAAIC,EAAM,WAAWC,CAA2B,EAC1C,CAAE,wBAAAC,CAAwB,EAAIF,EAAM,WACxCG,CACF,EAEMC,EAA2BC,GAAe,CAC9CN,EAA+BM,EAAYX,CAAK,EAChDE,GAAA,MAAAA,EAAkBS,CACpB,CAAA,EAEA,OAAAL,EAAM,UAAU,KACdE,EAAwB,GAAMR,CAAK,EAC5B,IAAM,CACXQ,EAAwB,GAAOR,CAAK,CACtC,GACC,CAACQ,EAAyBR,CAAK,CAAC,EAGjCM,EAAA,cAACM,EAAA,CACC,gBAAiBF,EACjB,QAASN,EAAa,SAASJ,CAAK,EACpC,MAAOC,GAAA,KAAAA,EAAS,OAAOD,CAAK,EAC3B,GAAGG,CAAAA,CACN,CAEJ"}
+{"version":3,"file":"CheckboxGroupItem.js","sources":["../../../src/components/checkbox-group/CheckboxGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Checkbox } from '../checkbox'\nimport {\n  CheckboxGroupCheckedContext,\n  CheckboxGroupMountedContext\n} from './CheckboxGroup.context'\n\ntype CheckboxGroupItemProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  'onCheckedChange' | 'checked' | 'defaultChecked'\n> & {\n  onCheckedChange?: (newChecked: boolean) => void\n}\n\nexport const CheckboxGroupItem = ({\n  value,\n  title,\n  onCheckedChange,\n  ...rest\n}: CheckboxGroupItemProps): JSX.Element => {\n  const {\n    checked: checkedItems,\n    handleItemCheckedChange: handleItemCheckedChangeContext\n  } = React.useContext(CheckboxGroupCheckedContext)\n  const { handleItemMountedChange } = React.useContext(\n    CheckboxGroupMountedContext\n  )\n\n  const handleItemCheckedChange = (newChecked) => {\n    handleItemCheckedChangeContext(newChecked, value)\n    onCheckedChange?.(newChecked)\n  }\n\n  React.useEffect(() => {\n    handleItemMountedChange(true, value)\n    return () => {\n      handleItemMountedChange(false, value)\n    }\n  }, [handleItemMountedChange, value])\n\n  return (\n    <Checkbox\n      onCheckedChange={handleItemCheckedChange}\n      checked={checkedItems.includes(value)}\n      title={title ?? String(value)}\n      {...rest}\n    />\n  )\n}\n"],"names":["CheckboxGroupItem","value","title","onCheckedChange","rest","checkedItems","handleItemCheckedChangeContext","React","CheckboxGroupCheckedContext","handleItemMountedChange","CheckboxGroupMountedContext","handleItemCheckedChange","newChecked","Checkbox"],"mappings":"2PAeO,MAAMA,EAAoB,CAAC,CAChC,MAAAC,EACA,MAAAC,EACA,gBAAAC,EACA,GAAGC,CACL,IAA2C,CACzC,KAAM,CACJ,QAASC,EACT,wBAAyBC,CAC3B,EAAIC,EAAM,WAAWC,CAA2B,EAC1C,CAAE,wBAAAC,CAAwB,EAAIF,EAAM,WACxCG,CACF,EAEMC,EAA2BC,GAAe,CAC9CN,EAA+BM,EAAYX,CAAK,EAChDE,GAAA,MAAAA,EAAkBS,CAAAA,CACpB,EAEA,OAAAL,EAAM,UAAU,KACdE,EAAwB,GAAMR,CAAK,EAC5B,IAAM,CACXQ,EAAwB,GAAOR,CAAK,CACtC,GACC,CAACQ,EAAyBR,CAAK,CAAC,EAGjCM,EAAA,cAACM,EAAA,CACC,gBAAiBF,EACjB,QAASN,EAAa,SAASJ,CAAK,EACpC,MAAOC,GAAS,OAAOD,CAAK,EAC3B,GAAGG,CAAAA,CACN,CAEJ"}

package/dist/components/chip/Chip.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Icon as l}from"../icon/Icon.js";import{styled as m}from"../../styled.js";import{overrideStyledVariantValue as x}from"../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";const c=m("span",{base:["inline-flex","items-center","px-1","grow","overflow-hidden","text-ellipsis","whitespace-nowrap","*:not-last:mr-1"]}),f={sm:"sm",md:"sm",lg:"md"},r=t=>{const i=e.useContext(a),{size:n}=i,s=e.useMemo(()=>x(n,o=>f[o]),[n]);return e.createElement(l,{...t,size:s})},C=({children:t,...i})=>{const n=e.Children.toArray(t),s=n.length<=1;return e.createElement(c,{...i},n.map((o,y)=>!s&&typeof o=="string"?e.createElement("span",{key:o,className:"overflow-hidden text-ellipsis whitespace-nowrap"},o):e.isValidElement(o)&&o.type===l?e.createElement(r,{key:"icon-".concat(y),...o.props}):o))},d=m("div",{base:["px-2","border","rounded-md","items-center","font-body","max-w-full","border-primary-800","text-primary-900","bg-primary-100","disabled:opacity-30","disabled:pointer-events-none"],variants:{size:{sm:["h-6","text-sm","leading-[1.53]","capsize-[0.4056]"],md:["h-8","text-sm","leading-[1.53]","capsize-[0.4056]"],lg:["h-10","text-md","leading-normal","capsize-[0.3864]"]}}}),a=e.createContext({}),p=({size:t,children:i})=>{const n=e.useMemo(()=>({size:t}),[t]);return e.createElement(a.Provider,{value:n},i)},h=e.forwardRef(({size:t="md",...i},n)=>e.createElement(p,{size:t},e.createElement(d,{ref:n,size:t,...i}))),z=Object.assign(h,{Content:C,Icon:r});h.displayName="Chip";export{z as Chip,r as ChipIcon,a as ChipRootContext,p as ChipRootProvider,c as StyledChipContent,d as StyledRoot};
+import*as e from"react";import{Icon as l}from"../icon/Icon.js";import{styled as m}from"../../styled.js";import{overrideStyledVariantValue as x}from"../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";const d=m("span",{base:["inline-flex","items-center","px-1","grow","overflow-hidden","text-ellipsis","whitespace-nowrap","*:not-last:mr-1"]}),f={sm:"sm",md:"sm",lg:"md"},r=t=>{const o=e.useContext(a),{size:n}=o,s=e.useMemo(()=>x(n,i=>f[i]),[n]);return e.createElement(l,{...t,size:s})},C=({children:t,...o})=>{const n=e.Children.toArray(t),s=n.length<=1;return e.createElement(d,{...o},n.map((i,y)=>!s&&typeof i=="string"?e.createElement("span",{key:i,className:"overflow-hidden text-ellipsis whitespace-nowrap"},i):e.isValidElement(i)&&i.type===l?e.createElement(r,{key:`icon-${y}`,...i.props}):i))},p=m("div",{base:["px-2","border","rounded-md","items-center","font-body","max-w-full","border-primary-800","text-primary-900","bg-primary-100","disabled:opacity-30","disabled:pointer-events-none"],variants:{size:{sm:["h-6","text-sm","leading-[1.53]","capsize-[0.4056]"],md:["h-8","text-sm","leading-[1.53]","capsize-[0.4056]"],lg:["h-10","text-md","leading-normal","capsize-[0.3864]"]}}}),a=e.createContext({}),c=({size:t,children:o})=>{const n=e.useMemo(()=>({size:t}),[t]);return e.createElement(a.Provider,{value:n},o)},h=e.forwardRef(({size:t="md",...o},n)=>e.createElement(c,{size:t},e.createElement(p,{ref:n,size:t,...o}))),z=Object.assign(h,{Content:C,Icon:r});h.displayName="Chip";export{z as Chip,r as ChipIcon,a as ChipRootContext,c as ChipRootProvider,d as StyledChipContent,p as StyledRoot};
 //# sourceMappingURL=Chip.js.map

package/dist/components/chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sources":["../../../src/components/chip/Chip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nexport const StyledChipContent = styled('span', {\n  base: [\n    'inline-flex',\n    'items-center',\n    'px-1',\n    'grow',\n    'overflow-hidden',\n    'text-ellipsis',\n    'whitespace-nowrap',\n    '*:not-last:mr-1'\n  ]\n})\n\nconst toIconSize = { sm: 'sm', md: 'sm', lg: 'md' }\n\nexport const ChipIcon = (props: React.ComponentProps<typeof Icon>) => {\n  const rootContext = React.useContext(ChipRootContext)\n  const { size } = rootContext\n  const iconSize = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toIconSize[s]),\n    [size]\n  )\n  return <Icon {...props} size={iconSize} />\n}\n\nconst ChipContent = ({ children, ...rest }) => {\n  const childrenArray = React.Children.toArray(children)\n  const isSingleChild = childrenArray.length <= 1\n  return (\n    <StyledChipContent {...rest}>\n      {\n        childrenArray.map((child, index) => {\n          if (!isSingleChild && typeof child === 'string')\n            return (\n              <span\n                key={child}\n                className=\"overflow-hidden text-ellipsis whitespace-nowrap\"\n              >\n                {child}\n              </span>\n            )\n          if (React.isValidElement(child) && child.type === Icon) {\n            return <ChipIcon key={`icon-${index}`} {...child.props} />\n          }\n          return child\n        }) as React.ReactElement[]\n      }\n    </StyledChipContent>\n  )\n}\n\nexport const StyledRoot = styled('div', {\n  base: [\n    'px-2',\n    'border',\n    'rounded-md',\n    'items-center',\n    'font-body',\n    'max-w-full',\n    'border-primary-800',\n    'text-primary-900',\n    'bg-primary-100',\n    'disabled:opacity-30',\n    'disabled:pointer-events-none'\n  ],\n  variants: {\n    size: {\n      sm: ['h-6', 'text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      md: ['h-8', 'text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      lg: ['h-10', 'text-md', 'leading-normal', 'capsize-[0.3864]']\n    }\n  }\n})\n\nexport type TChipRootContext = React.ComponentProps<typeof StyledRoot>\nexport type TChipRootProviderProps = TChipRootContext\n\nexport const ChipRootContext = React.createContext<TChipRootContext>({})\n\nexport const ChipRootProvider = ({\n  size,\n  children\n}: TChipRootProviderProps) => {\n  const value = React.useMemo<TChipRootContext>(() => ({ size }), [size])\n  return (\n    <ChipRootContext.Provider value={value}>\n      {children}\n    </ChipRootContext.Provider>\n  )\n}\n\nexport type TChipRootProps = TChipRootProviderProps\n\nconst ChipRoot = React.forwardRef<HTMLDivElement, TChipRootProps>(\n  ({ size = 'md', ...rest }, ref) => {\n    return (\n      <ChipRootProvider size={size}>\n        <StyledRoot ref={ref} size={size} {...rest} />\n      </ChipRootProvider>\n    )\n  }\n)\n\nexport const Chip = Object.assign(ChipRoot, {\n  Content: ChipContent,\n  Icon: ChipIcon\n})\n\nChipRoot.displayName = 'Chip'\n"],"names":["StyledChipContent","styled","toIconSize","ChipIcon","props","rootContext","React","ChipRootContext","size","iconSize","overrideStyledVariantValue","s","Icon","ChipContent","children","rest","childrenArray","isSingleChild","child","index","StyledRoot","ChipRootProvider","value","ChipRoot","ref","Chip"],"mappings":"iOAMO,MAAMA,EAAoBC,EAAO,OAAQ,CAC9C,KAAM,CACJ,cACA,eACA,OACA,OACA,kBACA,gBACA,oBACA,iBACF,CACF,CAAC,EAEKC,EAAa,CAAE,GAAI,KAAM,GAAI,KAAM,GAAI,IAAK,EAErCC,EAAYC,GAA6C,CACpE,MAAMC,EAAcC,EAAM,WAAWC,CAAe,EAC9C,CAAE,KAAAC,CAAK,EAAIH,EACXI,EAAWH,EAAM,QACrB,IAAMI,EAA2BF,EAAOG,GAAMT,EAAWS,CAAC,CAAC,EAC3D,CAACH,CAAI,CACP,EACA,OAAOF,EAAA,cAACM,EAAA,CAAM,GAAGR,EAAO,KAAMK,CAAAA,CAAU,CAC1C,EAEMI,EAAc,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,IAAM,CAC7C,MAAMC,EAAgBV,EAAM,SAAS,QAAQQ,CAAQ,EAC/CG,EAAgBD,EAAc,QAAU,EAC9C,OACEV,EAAA,cAACN,EAAA,CAAmB,GAAGe,CAAAA,EAEnBC,EAAc,IAAI,CAACE,EAAOC,IACpB,CAACF,GAAiB,OAAOC,GAAU,SAEnCZ,EAAA,cAAC,OACC,CAAA,IAAKY,EACL,UAAU,iDAETA,EAAAA,CACH,EAEAZ,EAAM,eAAeY,CAAK,GAAKA,EAAM,OAASN,EACzCN,EAAA,cAACH,EAAS,CAAA,IAAK,QAAQ,OAAAgB,CAAU,EAAA,GAAGD,EAAM,KAAA,CAAO,EAEnDA,CACR,CAEL,CAEJ,EAEaE,EAAanB,EAAO,MAAO,CACtC,KAAM,CACJ,OACA,SACA,aACA,eACA,YACA,aACA,qBACA,mBACA,iBACA,sBACA,8BACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,MAAO,UAAW,iBAAkB,kBAAkB,EAC3D,GAAI,CAAC,MAAO,UAAW,iBAAkB,kBAAkB,EAC3D,GAAI,CAAC,OAAQ,UAAW,iBAAkB,kBAAkB,CAC9D,CACF,CACF,CAAC,EAKYM,EAAkBD,EAAM,cAAgC,CAAE,CAAA,EAE1De,EAAmB,CAAC,CAC/B,KAAAb,EACA,SAAAM,CACF,IAA8B,CAC5B,MAAMQ,EAAQhB,EAAM,QAA0B,KAAO,CAAE,KAAAE,CAAK,GAAI,CAACA,CAAI,CAAC,EACtE,OACEF,EAAA,cAACC,EAAgB,SAAhB,CAAyB,MAAOe,CAAAA,EAC9BR,CACH,CAEJ,EAIMS,EAAWjB,EAAM,WACrB,CAAC,CAAE,KAAAE,EAAO,KAAM,GAAGO,CAAK,EAAGS,IAEvBlB,EAAA,cAACe,GAAiB,KAAMb,CAAAA,EACtBF,EAAA,cAACc,EAAW,CAAA,IAAKI,EAAK,KAAMhB,EAAO,GAAGO,CAAAA,CAAM,CAC9C,CAGN,EAEaU,EAAO,OAAO,OAAOF,EAAU,CAC1C,QAASV,EACT,KAAMV,CACR,CAAC,EAEDoB,EAAS,YAAc"}
+{"version":3,"file":"Chip.js","sources":["../../../src/components/chip/Chip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nexport const StyledChipContent = styled('span', {\n  base: [\n    'inline-flex',\n    'items-center',\n    'px-1',\n    'grow',\n    'overflow-hidden',\n    'text-ellipsis',\n    'whitespace-nowrap',\n    '*:not-last:mr-1'\n  ]\n})\n\nconst toIconSize = { sm: 'sm', md: 'sm', lg: 'md' }\n\nexport const ChipIcon = (props: React.ComponentProps<typeof Icon>) => {\n  const rootContext = React.useContext(ChipRootContext)\n  const { size } = rootContext\n  const iconSize = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => toIconSize[s]),\n    [size]\n  )\n  return <Icon {...props} size={iconSize} />\n}\n\nconst ChipContent = ({ children, ...rest }) => {\n  const childrenArray = React.Children.toArray(children)\n  const isSingleChild = childrenArray.length <= 1\n  return (\n    <StyledChipContent {...rest}>\n      {\n        childrenArray.map((child, index) => {\n          if (!isSingleChild && typeof child === 'string')\n            return (\n              <span\n                key={child}\n                className=\"overflow-hidden text-ellipsis whitespace-nowrap\"\n              >\n                {child}\n              </span>\n            )\n          if (React.isValidElement(child) && child.type === Icon) {\n            return <ChipIcon key={`icon-${index}`} {...child.props} />\n          }\n          return child\n        }) as React.ReactElement[]\n      }\n    </StyledChipContent>\n  )\n}\n\nexport const StyledRoot = styled('div', {\n  base: [\n    'px-2',\n    'border',\n    'rounded-md',\n    'items-center',\n    'font-body',\n    'max-w-full',\n    'border-primary-800',\n    'text-primary-900',\n    'bg-primary-100',\n    'disabled:opacity-30',\n    'disabled:pointer-events-none'\n  ],\n  variants: {\n    size: {\n      sm: ['h-6', 'text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      md: ['h-8', 'text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n      lg: ['h-10', 'text-md', 'leading-normal', 'capsize-[0.3864]']\n    }\n  }\n})\n\nexport type TChipRootContext = React.ComponentProps<typeof StyledRoot>\nexport type TChipRootProviderProps = TChipRootContext\n\nexport const ChipRootContext = React.createContext<TChipRootContext>({})\n\nexport const ChipRootProvider = ({\n  size,\n  children\n}: TChipRootProviderProps) => {\n  const value = React.useMemo<TChipRootContext>(() => ({ size }), [size])\n  return (\n    <ChipRootContext.Provider value={value}>\n      {children}\n    </ChipRootContext.Provider>\n  )\n}\n\nexport type TChipRootProps = TChipRootProviderProps\n\nconst ChipRoot = React.forwardRef<HTMLDivElement, TChipRootProps>(\n  ({ size = 'md', ...rest }, ref) => {\n    return (\n      <ChipRootProvider size={size}>\n        <StyledRoot ref={ref} size={size} {...rest} />\n      </ChipRootProvider>\n    )\n  }\n)\n\nexport const Chip = Object.assign(ChipRoot, {\n  Content: ChipContent,\n  Icon: ChipIcon\n})\n\nChipRoot.displayName = 'Chip'\n"],"names":["StyledChipContent","styled","toIconSize","ChipIcon","props","rootContext","React","ChipRootContext","size","iconSize","overrideStyledVariantValue","s","Icon","ChipContent","children","rest","childrenArray","isSingleChild","child","index","StyledRoot","ChipRootProvider","value","ChipRoot","ref","Chip"],"mappings":"iOAMO,MAAMA,EAAoBC,EAAO,OAAQ,CAC9C,KAAM,CACJ,cACA,eACA,OACA,OACA,kBACA,gBACA,oBACA,iBACF,CACF,CAAC,EAEKC,EAAa,CAAE,GAAI,KAAM,GAAI,KAAM,GAAI,IAAK,EAErCC,EAAYC,GAA6C,CACpE,MAAMC,EAAcC,EAAM,WAAWC,CAAe,EAC9C,CAAE,KAAAC,CAAK,EAAIH,EACXI,EAAWH,EAAM,QACrB,IAAMI,EAA2BF,EAAOG,GAAMT,EAAWS,CAAC,CAAC,EAC3D,CAACH,CAAI,CACP,EACA,OAAOF,EAAA,cAACM,EAAA,CAAM,GAAGR,EAAO,KAAMK,CAAAA,CAAU,CAC1C,EAEMI,EAAc,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAK,IAAM,CAC7C,MAAMC,EAAgBV,EAAM,SAAS,QAAQQ,CAAQ,EAC/CG,EAAgBD,EAAc,QAAU,EAC9C,OACEV,EAAA,cAACN,EAAA,CAAmB,GAAGe,CAAAA,EAEnBC,EAAc,IAAI,CAACE,EAAOC,IACpB,CAACF,GAAiB,OAAOC,GAAU,SAEnCZ,EAAA,cAAC,OACC,CAAA,IAAKY,EACL,UAAU,iDAETA,EAAAA,CACH,EAEAZ,EAAM,eAAeY,CAAK,GAAKA,EAAM,OAASN,EACzCN,EAAA,cAACH,EAAS,CAAA,IAAK,QAAQgB,CAAK,GAAK,GAAGD,EAAM,KAAA,CAAO,EAEnDA,CACR,CAEL,CAEJ,EAEaE,EAAanB,EAAO,MAAO,CACtC,KAAM,CACJ,OACA,SACA,aACA,eACA,YACA,aACA,qBACA,mBACA,iBACA,sBACA,8BACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,MAAO,UAAW,iBAAkB,kBAAkB,EAC3D,GAAI,CAAC,MAAO,UAAW,iBAAkB,kBAAkB,EAC3D,GAAI,CAAC,OAAQ,UAAW,iBAAkB,kBAAkB,CAC9D,CACF,CACF,CAAC,EAKYM,EAAkBD,EAAM,cAAgC,CAAE,CAAA,EAE1De,EAAmB,CAAC,CAC/B,KAAAb,EACA,SAAAM,CACF,IAA8B,CAC5B,MAAMQ,EAAQhB,EAAM,QAA0B,KAAO,CAAE,KAAAE,CAAK,GAAI,CAACA,CAAI,CAAC,EACtE,OACEF,EAAA,cAACC,EAAgB,SAAhB,CAAyB,MAAOe,CAAAA,EAC9BR,CACH,CAEJ,EAIMS,EAAWjB,EAAM,WACrB,CAAC,CAAE,KAAAE,EAAO,KAAM,GAAGO,CAAK,EAAGS,IAEvBlB,EAAA,cAACe,GAAiB,KAAMb,CAAAA,EACtBF,EAAA,cAACc,EAAW,CAAA,IAAKI,EAAK,KAAMhB,EAAO,GAAGO,CAAAA,CAAM,CAC9C,CAGN,EAEaU,EAAO,OAAO,OAAOF,EAAU,CAC1C,QAASV,EACT,KAAMV,CACR,CAAC,EAEDoB,EAAS,YAAc"}

package/dist/components/data-table/DataTableContext.js

@@ -1,2 +1,2 @@
-import{v4 as Z}from"@lukeed/uuid";import{useReactTable as q,getCoreRowModel as H,getPaginationRowModel as K,getSortedRowModel as Q,getFilteredRowModel as W,getExpandedRowModel as X}from"@tanstack/react-table";import*as e from"react";import Y from"use-deep-compare-effect";import{AsyncDataState as i}from"./DataTable.types.js";import{getNewAsyncData as _}from"./getNewAsyncData.js";import{usePagination as $}from"./usePagination.js";import{useSortByColumn as ee}from"./useSorting.js";const F=e.createContext(null),te=({columns:l,data:o=[],getAsyncData:n,defaultSort:T,initialState:g=void 0,disabledRows:x,enableRowSelection:u,onRowSelectionChange:C,children:I})=>{var P;const D=e.useRef(Z()),[d,c]=e.useState({results:o!=null?o:[],total:(P=o==null?void 0:o.length)!=null?P:0}),[S,N]=e.useState({}),[L,A]=e.useState({}),[G,z]=e.useState({top:null,bottom:null,offsetTop:0,isVisible:!0}),{isPaginated:r,applyPagination:v,paginationState:a,setPaginationState:O}=$(g==null?void 0:g.pagination),[y,b]=e.useState(i.NONE),[w,j]=e.useState(""),{setIsSortable:k,isSortable:m,sorting:s,setSorting:B}=ee(T),p=e.useCallback(async t=>{if(n)try{b(i.PENDING);const f=await _(n,t,a,s,w);c(f),b(i.FULFILLED)}catch{b(i.REJECTED)}},[n,a==null?void 0:a.pageIndex,a==null?void 0:a.pageSize,s,w]);e.useEffect(()=>{p({})},[p]),Y(()=>{o&&c({results:o,total:o.length})},[o]);const R=()=>d.total;Object.keys(S||{}).length>0;const E=q({columns:l,data:d.results,pageCount:a?Math.ceil(R()/a.pageSize):-1,initialState:g,state:{sorting:s,globalFilter:w,pagination:a,rowSelection:S,expanded:L},manualPagination:n&&r,manualSorting:n&&r,enableSorting:y!==i.PENDING,enableGlobalFilter:!n,enableRowSelection:u,onExpandedChange:A,getSubRows:t=>t.subRows,onRowSelectionChange:t=>{C&&C(t),N(t)},getCoreRowModel:H(),getPaginationRowModel:r?K():void 0,getSortedRowModel:m||s.length?Q():void 0,getFilteredRowModel:W(),getExpandedRowModel:X(),onPaginationChange:r?O:void 0,onSortingChange:B,onGlobalFilterChange:j,globalFilterFn:(t,f,V)=>{const M=U=>U.toLowerCase().includes(V.toLowerCase());if(t.depth>0)return!0;const h=t.getValue(f);switch(typeof h){case"string":return M(h);case"boolean":case"number":return M(String(h));default:return!1}}}),J=e.useMemo(()=>({...E,columns:l,data:d,setData:c,setIsSortable:k,applyPagination:v,getTotalRows:R,isSortable:m,asyncDataState:y,runAsyncData:p,disabledRows:x,enableRowSelection:u,rowSelection:S,tablePosition:G,setTablePosition:z,tableId:D.current}),[E,v,R,m,u,D]);return e.createElement(F.Provider,{value:J},I)},oe=()=>{const l=e.useContext(F);if(!l)throw new Error("useDataTable can only be called from inside a DataTableProvider");return l};export{te as DataTableProvider,oe as useDataTable};
+import{v4 as U}from"@lukeed/uuid";import{useReactTable as Y,getCoreRowModel as q,getPaginationRowModel as H,getSortedRowModel as K,getFilteredRowModel as Q,getExpandedRowModel as W}from"@tanstack/react-table";import*as e from"react";import X from"use-deep-compare-effect";import{AsyncDataState as i}from"./DataTable.types.js";import{getNewAsyncData as Z}from"./getNewAsyncData.js";import{usePagination as _}from"./usePagination.js";import{useSortByColumn as $}from"./useSorting.js";const M=e.createContext(null),ee=({columns:l,data:a=[],getAsyncData:n,defaultSort:T,initialState:g=void 0,disabledRows:x,enableRowSelection:u,onRowSelectionChange:C,children:F})=>{const P=e.useRef(U()),[d,c]=e.useState({results:a??[],total:(a==null?void 0:a.length)??0}),[S,I]=e.useState({}),[N,L]=e.useState({}),[A,G]=e.useState({top:null,bottom:null,offsetTop:0,isVisible:!0}),{isPaginated:s,applyPagination:D,paginationState:o,setPaginationState:k}=_(g==null?void 0:g.pagination),[y,b]=e.useState(i.NONE),[w,z]=e.useState(""),{setIsSortable:O,isSortable:p,sorting:r,setSorting:j}=$(T),m=e.useCallback(async t=>{if(n)try{b(i.PENDING);const f=await Z(n,t,o,r,w);c(f),b(i.FULFILLED)}catch{b(i.REJECTED)}},[n,o==null?void 0:o.pageIndex,o==null?void 0:o.pageSize,r,w]);e.useEffect(()=>{m({})},[m]),X(()=>{a&&c({results:a,total:a.length})},[a]);const R=()=>d.total;Object.keys(S||{}).length>0;const E=Y({columns:l,data:d.results,pageCount:o?Math.ceil(R()/o.pageSize):-1,initialState:g,state:{sorting:r,globalFilter:w,pagination:o,rowSelection:S,expanded:N},manualPagination:n&&s,manualSorting:n&&s,enableSorting:y!==i.PENDING,enableGlobalFilter:!n,enableRowSelection:u,onExpandedChange:L,getSubRows:t=>t.subRows,onRowSelectionChange:t=>{C&&C(t),I(t)},getCoreRowModel:q(),getPaginationRowModel:s?H():void 0,getSortedRowModel:p||r.length?K():void 0,getFilteredRowModel:Q(),getExpandedRowModel:W(),onPaginationChange:s?k:void 0,onSortingChange:j,onGlobalFilterChange:z,globalFilterFn:(t,f,V)=>{const v=B=>B.toLowerCase().includes(V.toLowerCase());if(t.depth>0)return!0;const h=t.getValue(f);switch(typeof h){case"string":return v(h);case"boolean":case"number":return v(String(h));default:return!1}}}),J=e.useMemo(()=>({...E,columns:l,data:d,setData:c,setIsSortable:O,applyPagination:D,getTotalRows:R,isSortable:p,asyncDataState:y,runAsyncData:m,disabledRows:x,enableRowSelection:u,rowSelection:S,tablePosition:A,setTablePosition:G,tableId:P.current}),[E,D,R,p,u,P]);return e.createElement(M.Provider,{value:J},F)},te=()=>{const l=e.useContext(M);if(!l)throw new Error("useDataTable can only be called from inside a DataTableProvider");return l};export{ee as DataTableProvider,te as useDataTable};
 //# sourceMappingURL=DataTableContext.js.map

package/dist/components/data-table/DataTableContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableContext.js","sources":["../../../src/components/data-table/DataTableContext.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  OnChangeFn,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  DataTableContextType,\n  InitialState,\n  TableData,\n  TablePosition,\n  TAsyncDataOptions,\n  TAsyncDataResult,\n  TDefaultSort,\n  TGetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: TDefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  onRowSelectionChange?: OnChangeFn<RowSelectionState>\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: TGetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  disabledRows,\n  enableRowSelection,\n  onRowSelectionChange,\n  children\n}: DataTableProviderProps): JSX.Element => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<TAsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const [tablePosition, setTablePosition] = React.useState<TablePosition>({\n    top: null,\n    bottom: null,\n    offsetTop: 0,\n    isVisible: true\n  })\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<TAsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as TAsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const hasSelectedRows = Object.keys(rowSelection || {}).length > 0\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount: paginationState\n      ? Math.ceil(getTotalRows() / paginationState.pageSize)\n      : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row: Row<unknown>) => row.subRows,\n    onRowSelectionChange: (updaterOrValue) => {\n      if (onRowSelectionChange) onRowSelectionChange(updaterOrValue)\n      setRowSelection(updaterOrValue)\n    },\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated ? setPaginationState : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const isSubRow = row.depth > 0\n\n      if (isSubRow) return true\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      disabledRows,\n      enableRowSelection,\n      rowSelection,\n      tablePosition,\n      setTablePosition,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"names":["DataTableContext","React","DataTableProvider","columns","dataProp","getAsyncData","defaultSort","initialState","disabledRows","enableRowSelection","onRowSelectionChange","children","_a","tableId","uuid","data","setData","rowSelection","setRowSelection","expanded","setExpanded","tablePosition","setTablePosition","isPaginated","applyPagination","paginationState","setPaginationState","usePagination","asyncDataState","setAsyncDataState","AsyncDataState","globalFilter","setGlobalFilter","setIsSortable","isSortable","sorting","setSorting","useSortByColumn","runAsyncData","overrideAsyncDataOptions","newData","getNewAsyncData","useDeepCompareEffect","getTotalRows","table","useReactTable","row","updaterOrValue","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel","getExpandedRowModel","columnId","filterValue","checkFilterMatchesCell","cellValue","value","useDataTable","context"],"mappings":"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"}
+{"version":3,"file":"DataTableContext.js","sources":["../../../src/components/data-table/DataTableContext.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  OnChangeFn,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  DataTableContextType,\n  InitialState,\n  TableData,\n  TablePosition,\n  TAsyncDataOptions,\n  TAsyncDataResult,\n  TDefaultSort,\n  TGetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: TDefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  onRowSelectionChange?: OnChangeFn<RowSelectionState>\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: TGetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  disabledRows,\n  enableRowSelection,\n  onRowSelectionChange,\n  children\n}: DataTableProviderProps): JSX.Element => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<TAsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const [tablePosition, setTablePosition] = React.useState<TablePosition>({\n    top: null,\n    bottom: null,\n    offsetTop: 0,\n    isVisible: true\n  })\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<TAsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as TAsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const hasSelectedRows = Object.keys(rowSelection || {}).length > 0\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount: paginationState\n      ? Math.ceil(getTotalRows() / paginationState.pageSize)\n      : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row: Row<unknown>) => row.subRows,\n    onRowSelectionChange: (updaterOrValue) => {\n      if (onRowSelectionChange) onRowSelectionChange(updaterOrValue)\n      setRowSelection(updaterOrValue)\n    },\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated ? setPaginationState : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const isSubRow = row.depth > 0\n\n      if (isSubRow) return true\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      disabledRows,\n      enableRowSelection,\n      rowSelection,\n      tablePosition,\n      setTablePosition,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"names":["DataTableContext","React","DataTableProvider","columns","dataProp","getAsyncData","defaultSort","initialState","disabledRows","enableRowSelection","onRowSelectionChange","children","tableId","uuid","data","setData","rowSelection","setRowSelection","expanded","setExpanded","tablePosition","setTablePosition","isPaginated","applyPagination","paginationState","setPaginationState","usePagination","asyncDataState","setAsyncDataState","AsyncDataState","globalFilter","setGlobalFilter","setIsSortable","isSortable","sorting","setSorting","useSortByColumn","runAsyncData","overrideAsyncDataOptions","newData","getNewAsyncData","useDeepCompareEffect","getTotalRows","table","useReactTable","row","updaterOrValue","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel","getExpandedRowModel","columnId","filterValue","checkFilterMatchesCell","cellValue","value","useDataTable","context"],"mappings":"keAkCA,MAAMA,EACJC,EAAM,cAAoD,IAAI,EAenDC,GAAoB,CAAC,CAChC,QAAAC,EACA,KAAMC,EAAW,CAAA,EACjB,aAAAC,EACA,YAAAC,EACA,aAAAC,EAAe,OACf,aAAAC,EACA,mBAAAC,EACA,qBAAAC,EACA,SAAAC,CACF,IAA2C,CACzC,MAAMC,EAAUX,EAAM,OAAOY,EAAAA,CAAM,EAE7B,CAACC,EAAMC,CAAO,EAAId,EAAM,SAA2B,CACvD,QAASG,GAAY,CACrB,EAAA,OAAOA,GAAA,KAAA,OAAAA,EAAU,SAAU,CAC7B,CAAC,EAEK,CAACY,EAAcC,CAAe,EAAIhB,EAAM,SAA4B,EAAE,EACtE,CAACiB,EAAUC,CAAW,EAAIlB,EAAM,SAAwB,EAAE,EAE1D,CAACmB,EAAeC,CAAgB,EAAIpB,EAAM,SAAwB,CACtE,IAAK,KACL,OAAQ,KACR,UAAW,EACX,UAAW,EACb,CAAC,EAEK,CAAE,YAAAqB,EAAa,gBAAAC,EAAiB,gBAAAC,EAAiB,mBAAAC,CAAmB,EACxEC,EAAcnB,GAAA,KAAA,OAAAA,EAAc,UAAU,EAElC,CAACoB,EAAgBC,CAAiB,EAAI3B,EAAM,SAChD4B,EAAe,IACjB,EAEM,CAACC,EAAcC,CAAe,EAAI9B,EAAM,SAAiB,EAAE,EAE3D,CAAE,cAAA+B,EAAe,WAAAC,EAAY,QAAAC,EAAS,WAAAC,CAAW,EACrDC,EAAgB9B,CAAW,EAEvB+B,EAAepC,EAAM,YACzB,MAAOqC,GAAyD,CAC9D,GAAKjC,EAEL,GAAI,CACFuB,EAAkBC,EAAe,OAAO,EAExC,MAAMU,EAAU,MAAMC,EACpBnC,EACAiC,EACAd,EACAU,EACAJ,CACF,EAEAf,EAAQwB,CAA2B,EACnCX,EAAkBC,EAAe,SAAS,CAC5C,MAAgB,CACdD,EAAkBC,EAAe,QAAQ,CAC3C,CACF,EACA,CACExB,EACAmB,GAAA,KAAA,OAAAA,EAAiB,UACjBA,GAAA,KAAA,OAAAA,EAAiB,SACjBU,EACAJ,CACF,CACF,EAEA7B,EAAM,UAAU,IAAM,CACpBoC,EAAa,CAAA,CAAE,CACjB,EAAG,CAACA,CAAY,CAAC,EAEjBI,EAAqB,IAAM,CACpBrC,GAELW,EAAQ,CAAE,QAASX,EAAU,MAAOA,EAAS,MAAO,CAAC,CACvD,EAAG,CAACA,CAAQ,CAAC,EAEPsC,MAAAA,EAAe,IAAM5B,EAAK,MAER,OAAO,KAAKE,GAAgB,CAAA,CAAE,EAAE,OAAS,EAE3D2B,MAAAA,EAAQC,EAAuB,CACnC,QAAAzC,EACA,KAAMW,EAAK,QACX,UAAWU,EACP,KAAK,KAAKkB,EAAa,EAAIlB,EAAgB,QAAQ,EACnD,GACJ,aAAcjB,EACd,MAAO,CACL,QAAA2B,EACA,aAAAJ,EACA,WAAYN,EACZ,aAAAR,EACA,SAAAE,CACF,EACA,iBAAkBb,GAAgBiB,EAClC,cAAejB,GAAgBiB,EAC/B,cAAeK,IAAmBE,EAAe,QACjD,mBAAoB,CAACxB,EACrB,mBAAAI,EACA,iBAAkBU,EAClB,WAAa0B,GAAsBA,EAAI,QACvC,qBAAuBC,GAAmB,CACpCpC,GAAsBA,EAAqBoC,CAAc,EAC7D7B,EAAgB6B,CAAc,CAChC,EACA,gBAAiBC,EAAgB,EACjC,sBAAuBzB,EAAc0B,EAAsB,EAAI,OAC/D,kBACEf,GAAcC,EAAQ,OAASe,EAAAA,EAAsB,OACvD,oBAAqBC,EAAAA,EACrB,oBAAqBC,EAAoB,EACzC,mBAAoB7B,EAAcG,EAAqB,OACvD,gBAAiBU,EACjB,qBAAsBJ,EACtB,eAAgB,CAACc,EAAKO,EAAUC,IAAgB,CAC9C,MAAMC,EAA0BC,GAC9BA,EAAU,YAAA,EAAc,SAASF,EAAY,YAAa,CAAA,EAI5D,GAFiBR,EAAI,MAAQ,EAEf,MAAO,GAErB,MAAMW,EAAQX,EAAI,SAASO,CAAQ,EACnC,OAAQ,OAAOI,GACb,IAAK,SACH,OAAOF,EAAuBE,CAAK,EACrC,IAAK,UACL,IAAK,SACH,OAAOF,EAAuB,OAAOE,CAAK,CAAC,EAC7C,QACE,MAAO,EACX,CACF,CACF,CAAC,EAEKA,EAA8BvD,EAAM,QAAQ,KACzC,CACL,GAAG0C,EACH,QAAAxC,EACA,KAAAW,EACA,QAAAC,EACA,cAAAiB,EACA,gBAAAT,EACA,aAAAmB,EACA,WAAAT,EACA,eAAAN,EACA,aAAAU,EACA,aAAA7B,EACA,mBAAAC,EACA,aAAAO,EACA,cAAAI,EACA,iBAAAC,EACA,QAAST,EAAQ,OACnB,GACC,CACD+B,EACApB,EACAmB,EACAT,EACAxB,EACAG,CACF,CAAC,EAED,OACEX,EAAA,cAACD,EAAiB,SAAjB,CAA0B,MAAOwD,CAC/B7C,EAAAA,CACH,CAEJ,EAEa8C,GAAe,IAAyC,CACnE,MAAMC,EAAUzD,EAAM,WAAWD,CAAgB,EAEjD,GAAI,CAAC0D,EACH,MAAM,IAAI,MACR,iEACF,EAEF,OAAOA,CACT"}

package/dist/components/data-table/DataTableHead.js

@@ -1,2 +1,2 @@
-import h from"clsx";import*as t from"react";import{Table as n}from"../table/Table.js";import{DataTableSelectAllRowsCheckbox as D}from"./DataTableSelectAllRowsCheckbox.js";import{useDataTable as N}from"./DataTableContext.js";import{DataTable as A}from"./DataTable.js";const F=({sortable:c=!0,theme:p="light",isSticky:s=!1,stickyOffset:a=0,showTotalInFirstColumn:y,totalSuffix:v,style:E,className:S,...T})=>{var u;const{getHeaderGroups:_,setIsSortable:f,enableRowSelection:w,getCanSomeRowsExpand:R,tablePosition:e,setTablePosition:g}=N();t.useEffect(()=>{f(c)},[c,f]);const o=t.useRef(null),i=t.useRef(null),x=t.useRef(0),[m,C]=t.useState(0),[H,d]=t.useState(!1),b=(u=o==null?void 0:o.current)==null?void 0:u.closest("thead");if(b&&(e==null?void 0:e.offsetTop)===null){const l=b.getBoundingClientRect().height,r=a+l;e&&g({...e,offsetTop:r||0})}return t.useEffect(()=>{if(s&&(!i.current&&o.current&&(i.current=o.current.closest("table")),i.current&&(e==null?void 0:e.top)!==null&&(e==null?void 0:e.bottom)!==null)){const l=(e==null?void 0:e.top)!=null&&(e==null?void 0:e.bottom)!=null&&e.top<a&&e.bottom>100?-e.top+a:0;l!==0&&d(!0),x.current=l,C(l),requestAnimationFrame(()=>{d(!1)})}},[s,a,e]),t.createElement(n.Header,{theme:p,style:{...E,"--header-offset":"".concat(m,"px")},...T,className:h("relative","z-3","[&_tr:not(:last-child)>th]:border-b-none","[&_tr:not(:first-child)>th]:rounded-none!",S)},_().map(l=>t.createElement(n.Row,{key:l.id,ref:o,className:s&&m!==0?h("translate-y-(--header-offset)",H?"delay-0ms opacity-0 transition-none":"delay-150ms opacity-100 transition-opacity duration-100","[&_th]:last:before:absolute","[&_th]:last:before:bottom-0","[&_th]:last:before:pointer-events-none","[&_th]:last:before:right-0","[&_th]:last:before:shadow-sm","[&_th]:last:before:top-0","[&_th]:last:before:w-full"):void 0},R()&&t.createElement(n.HeaderCell,{className:"w-10"}),w&&t.createElement(n.HeaderCell,{className:"w-10"},t.createElement(D,null)),l.headers.map((r,k)=>t.createElement(A.HeaderCell,{header:r,key:r.id,includeTotal:k===0&&y,totalSuffix:v})))))};export{F as DataTableHead};
+import h from"clsx";import*as t from"react";import{Table as n}from"../table/Table.js";import{DataTableSelectAllRowsCheckbox as D}from"./DataTableSelectAllRowsCheckbox.js";import{useDataTable as N}from"./DataTableContext.js";import{DataTable as A}from"./DataTable.js";const F=({sortable:u=!0,theme:p="light",isSticky:s=!1,stickyOffset:a=0,showTotalInFirstColumn:y,totalSuffix:v,style:E,className:S,...T})=>{var c;const{getHeaderGroups:_,setIsSortable:f,enableRowSelection:w,getCanSomeRowsExpand:R,tablePosition:e,setTablePosition:g}=N();t.useEffect(()=>{f(u)},[u,f]);const o=t.useRef(null),i=t.useRef(null),x=t.useRef(0),[m,C]=t.useState(0),[H,d]=t.useState(!1),b=(c=o==null?void 0:o.current)==null?void 0:c.closest("thead");if(b&&(e==null?void 0:e.offsetTop)===null){const l=b.getBoundingClientRect().height,r=a+l;e&&g({...e,offsetTop:r||0})}return t.useEffect(()=>{if(s&&(!i.current&&o.current&&(i.current=o.current.closest("table")),i.current&&(e==null?void 0:e.top)!==null&&(e==null?void 0:e.bottom)!==null)){const l=(e==null?void 0:e.top)!=null&&(e==null?void 0:e.bottom)!=null&&e.top<a&&e.bottom>100?-e.top+a:0;l!==0&&d(!0),x.current=l,C(l),requestAnimationFrame(()=>{d(!1)})}},[s,a,e]),t.createElement(n.Header,{theme:p,style:{...E,"--header-offset":`${m}px`},...T,className:h("relative","z-3","[&_tr:not(:last-child)>th]:border-b-none","[&_tr:not(:first-child)>th]:rounded-none!",S)},_().map(l=>t.createElement(n.Row,{key:l.id,ref:o,className:s&&m!==0?h("translate-y-(--header-offset)",H?"delay-0ms opacity-0 transition-none":"delay-150ms opacity-100 transition-opacity duration-100","[&_th]:last:before:absolute","[&_th]:last:before:bottom-0","[&_th]:last:before:pointer-events-none","[&_th]:last:before:right-0","[&_th]:last:before:shadow-sm","[&_th]:last:before:top-0","[&_th]:last:before:w-full"):void 0},R()&&t.createElement(n.HeaderCell,{className:"w-10"}),w&&t.createElement(n.HeaderCell,{className:"w-10"},t.createElement(D,null)),l.headers.map((r,k)=>t.createElement(A.HeaderCell,{header:r,key:r.id,includeTotal:k===0&&y,totalSuffix:v})))))};export{F as DataTableHead};
 //# sourceMappingURL=DataTableHead.js.map

package/dist/components/data-table/DataTableHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableHead.js","sources":["../../../src/components/data-table/DataTableHead.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Table } from '../table'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\nimport { DataTable, useDataTable } from './index'\n\ntype DataTableHeadProps = Omit<\n  React.ComponentProps<typeof Table.Header>,\n  'children'\n> & {\n  sortable?: boolean\n  isSticky?: boolean\n  stickyOffset?: number\n  showTotalInFirstColumn?: boolean\n  totalSuffix?: string\n}\n\nexport const DataTableHead = ({\n  sortable = true,\n  theme = 'light',\n  isSticky = false,\n  stickyOffset = 0,\n  showTotalInFirstColumn,\n  totalSuffix,\n  style,\n  className,\n  ...props\n}: DataTableHeadProps): React.ReactElement => {\n  const {\n    getHeaderGroups,\n    setIsSortable,\n    enableRowSelection,\n    getCanSomeRowsExpand,\n    tablePosition,\n    setTablePosition\n  } = useDataTable()\n\n  React.useEffect(() => {\n    setIsSortable(sortable)\n  }, [sortable, setIsSortable])\n\n  const tableHeaderRowRef = React.useRef<HTMLTableRowElement>(null)\n  const tableRef = React.useRef<HTMLTableElement | null>(null)\n  const headerOffsetRef = React.useRef(0)\n\n  const [headerOffset, setHeaderOffset] = React.useState<number>(0)\n  const [headerHide, setHeaderHide] = React.useState<boolean>(false)\n\n  const tableHeadElement = tableHeaderRowRef?.current?.closest('thead')\n\n  if (tableHeadElement && tablePosition?.offsetTop === null) {\n    const tableHeadHeight = tableHeadElement.getBoundingClientRect().height\n    const intersectionOffset = stickyOffset + tableHeadHeight\n    if (tablePosition) {\n      setTablePosition({ ...tablePosition, offsetTop: intersectionOffset || 0 })\n    }\n  }\n\n  React.useEffect(() => {\n    if (!isSticky) return\n\n    if (!tableRef.current && tableHeaderRowRef.current) {\n      tableRef.current = tableHeaderRowRef.current.closest(\n        'table'\n      ) as HTMLTableElement | null\n    }\n\n    if (tableRef.current) {\n      if (tablePosition?.top !== null && tablePosition?.bottom !== null) {\n        const newOffset =\n          tablePosition?.top != null &&\n          tablePosition?.bottom != null &&\n          tablePosition.top < stickyOffset &&\n          tablePosition.bottom > 100\n            ? -tablePosition.top + stickyOffset\n            : 0\n\n        if (newOffset !== 0) setHeaderHide(true)\n\n        headerOffsetRef.current = newOffset\n        setHeaderOffset(newOffset)\n\n        requestAnimationFrame(() => {\n          setHeaderHide(false)\n        })\n      }\n    }\n  }, [isSticky, stickyOffset, tablePosition])\n\n  return (\n    <Table.Header\n      theme={theme}\n      style={{\n        ...style,\n        '--header-offset': `${headerOffset}px`\n      }}\n      {...props}\n      className={clsx(\n        'relative',\n        'z-3',\n        '[&_tr:not(:last-child)>th]:border-b-none',\n        '[&_tr:not(:first-child)>th]:rounded-none!',\n        className\n      )}\n    >\n      {getHeaderGroups().map((headerGroup) => {\n        return (\n          <Table.Row\n            key={headerGroup.id}\n            ref={tableHeaderRowRef}\n            className={\n              isSticky && headerOffset !== 0\n                ? clsx(\n                    'translate-y-(--header-offset)',\n                    headerHide\n                      ? 'delay-0ms opacity-0 transition-none'\n                      : 'delay-150ms opacity-100 transition-opacity duration-100',\n                    '[&_th]:last:before:absolute',\n                    '[&_th]:last:before:bottom-0',\n                    '[&_th]:last:before:pointer-events-none',\n                    '[&_th]:last:before:right-0',\n                    '[&_th]:last:before:shadow-sm',\n                    '[&_th]:last:before:top-0',\n                    '[&_th]:last:before:w-full'\n                  )\n                : undefined\n            }\n          >\n            {getCanSomeRowsExpand() && <Table.HeaderCell className=\"w-10\" />}\n            {enableRowSelection && (\n              <Table.HeaderCell className=\"w-10\">\n                <DataTableSelectAllRowsCheckbox />\n              </Table.HeaderCell>\n            )}\n            {headerGroup.headers.map((header, index) => (\n              <DataTable.HeaderCell\n                header={header}\n                key={header.id}\n                includeTotal={index === 0 && showTotalInFirstColumn}\n                totalSuffix={totalSuffix}\n              />\n            ))}\n          </Table.Row>\n        )\n      })}\n    </Table.Header>\n  )\n}\n"],"names":["DataTableHead","sortable","theme","isSticky","stickyOffset","showTotalInFirstColumn","totalSuffix","style","className","props","_a","getHeaderGroups","setIsSortable","enableRowSelection","getCanSomeRowsExpand","tablePosition","setTablePosition","useDataTable","React","tableHeaderRowRef","tableRef","headerOffsetRef","headerOffset","setHeaderOffset","headerHide","setHeaderHide","tableHeadElement","tableHeadHeight","intersectionOffset","newOffset","Table","clsx","headerGroup","DataTableSelectAllRowsCheckbox","header","index","DataTable"],"mappings":"2QAkBa,MAAAA,EAAgB,CAAC,CAC5B,SAAAC,EAAW,GACX,MAAAC,EAAQ,QACR,SAAAC,EAAW,GACX,aAAAC,EAAe,EACf,uBAAAC,EACA,YAAAC,EACA,MAAAC,EACA,UAAAC,EACA,GAAGC,CACL,IAA8C,CA5B9C,IAAAC,EA6BE,KAAM,CACJ,gBAAAC,EACA,cAAAC,EACA,mBAAAC,EACA,qBAAAC,EACA,cAAAC,EACA,iBAAAC,CACF,EAAIC,EAEJC,EAAAA,EAAM,UAAU,IAAM,CACpBN,EAAcX,CAAQ,CACxB,EAAG,CAACA,EAAUW,CAAa,CAAC,EAE5B,MAAMO,EAAoBD,EAAM,OAA4B,IAAI,EAC1DE,EAAWF,EAAM,OAAgC,IAAI,EACrDG,EAAkBH,EAAM,OAAO,CAAC,EAEhC,CAACI,EAAcC,CAAe,EAAIL,EAAM,SAAiB,CAAC,EAC1D,CAACM,EAAYC,CAAa,EAAIP,EAAM,SAAkB,EAAK,EAE3DQ,GAAmBhB,EAAAS,GAAA,KAAAA,OAAAA,EAAmB,UAAnB,KAAA,OAAAT,EAA4B,QAAQ,OAAA,EAE7D,GAAIgB,IAAoBX,GAAA,YAAAA,EAAe,aAAc,KAAM,CACzD,MAAMY,EAAkBD,EAAiB,sBAAsB,EAAE,OAC3DE,EAAqBxB,EAAeuB,EACtCZ,GACFC,EAAiB,CAAE,GAAGD,EAAe,UAAWa,GAAsB,CAAE,CAAC,CAE7E,CAEA,OAAAV,EAAM,UAAU,IAAM,CACpB,GAAKf,IAED,CAACiB,EAAS,SAAWD,EAAkB,UACzCC,EAAS,QAAUD,EAAkB,QAAQ,QAC3C,OACF,GAGEC,EAAS,UACPL,GAAA,KAAA,OAAAA,EAAe,OAAQ,OAAQA,GAAA,KAAA,OAAAA,EAAe,UAAW,MAAM,CACjE,MAAMc,GACJd,GAAA,KAAA,OAAAA,EAAe,MAAO,OACtBA,GAAA,KAAAA,OAAAA,EAAe,SAAU,MACzBA,EAAc,IAAMX,GACpBW,EAAc,OAAS,IACnB,CAACA,EAAc,IAAMX,EACrB,EAEFyB,IAAc,GAAGJ,EAAc,EAAI,EAEvCJ,EAAgB,QAAUQ,EAC1BN,EAAgBM,CAAS,EAEzB,sBAAsB,IAAM,CAC1BJ,EAAc,EAAK,CACrB,CAAC,CACH,CAEJ,EAAG,CAACtB,EAAUC,EAAcW,CAAa,CAAC,EAGxCG,EAAA,cAACY,EAAM,OAAN,CACC,MAAO5B,EACP,MAAO,CACL,GAAGK,EACH,kBAAmB,GAAG,OAAAe,EAAY,IAAA,CACpC,EACC,GAAGb,EACJ,UAAWsB,EACT,WACA,MACA,2CACA,4CACAvB,CACF,CAAA,EAECG,EAAkB,EAAA,IAAKqB,GAEpBd,EAAA,cAACY,EAAM,IAAN,CACC,IAAKE,EAAY,GACjB,IAAKb,EACL,UACEhB,GAAYmB,IAAiB,EACzBS,EACE,gCACAP,EACI,sCACA,0DACJ,8BACA,8BACA,yCACA,6BACA,+BACA,2BACA,2BACF,EACA,MAAA,EAGLV,EAA0BI,GAAAA,EAAA,cAACY,EAAM,WAAN,CAAiB,UAAU,MAAA,CAAO,EAC7DjB,GACCK,EAAA,cAACY,EAAM,WAAN,CAAiB,UAAU,MAC1BZ,EAAAA,EAAA,cAACe,EAAA,IAA+B,CAClC,EAEDD,EAAY,QAAQ,IAAI,CAACE,EAAQC,IAChCjB,EAAA,cAACkB,EAAU,WAAV,CACC,OAAQF,EACR,IAAKA,EAAO,GACZ,aAAcC,IAAU,GAAK9B,EAC7B,YAAaC,CAAAA,CACf,CACD,CACH,CAEH,CACH,CAEJ"}
+{"version":3,"file":"DataTableHead.js","sources":["../../../src/components/data-table/DataTableHead.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Table } from '../table'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\nimport { DataTable, useDataTable } from './index'\n\ntype DataTableHeadProps = Omit<\n  React.ComponentProps<typeof Table.Header>,\n  'children'\n> & {\n  sortable?: boolean\n  isSticky?: boolean\n  stickyOffset?: number\n  showTotalInFirstColumn?: boolean\n  totalSuffix?: string\n}\n\nexport const DataTableHead = ({\n  sortable = true,\n  theme = 'light',\n  isSticky = false,\n  stickyOffset = 0,\n  showTotalInFirstColumn,\n  totalSuffix,\n  style,\n  className,\n  ...props\n}: DataTableHeadProps): React.ReactElement => {\n  const {\n    getHeaderGroups,\n    setIsSortable,\n    enableRowSelection,\n    getCanSomeRowsExpand,\n    tablePosition,\n    setTablePosition\n  } = useDataTable()\n\n  React.useEffect(() => {\n    setIsSortable(sortable)\n  }, [sortable, setIsSortable])\n\n  const tableHeaderRowRef = React.useRef<HTMLTableRowElement>(null)\n  const tableRef = React.useRef<HTMLTableElement | null>(null)\n  const headerOffsetRef = React.useRef(0)\n\n  const [headerOffset, setHeaderOffset] = React.useState<number>(0)\n  const [headerHide, setHeaderHide] = React.useState<boolean>(false)\n\n  const tableHeadElement = tableHeaderRowRef?.current?.closest('thead')\n\n  if (tableHeadElement && tablePosition?.offsetTop === null) {\n    const tableHeadHeight = tableHeadElement.getBoundingClientRect().height\n    const intersectionOffset = stickyOffset + tableHeadHeight\n    if (tablePosition) {\n      setTablePosition({ ...tablePosition, offsetTop: intersectionOffset || 0 })\n    }\n  }\n\n  React.useEffect(() => {\n    if (!isSticky) return\n\n    if (!tableRef.current && tableHeaderRowRef.current) {\n      tableRef.current = tableHeaderRowRef.current.closest(\n        'table'\n      ) as HTMLTableElement | null\n    }\n\n    if (tableRef.current) {\n      if (tablePosition?.top !== null && tablePosition?.bottom !== null) {\n        const newOffset =\n          tablePosition?.top != null &&\n          tablePosition?.bottom != null &&\n          tablePosition.top < stickyOffset &&\n          tablePosition.bottom > 100\n            ? -tablePosition.top + stickyOffset\n            : 0\n\n        if (newOffset !== 0) setHeaderHide(true)\n\n        headerOffsetRef.current = newOffset\n        setHeaderOffset(newOffset)\n\n        requestAnimationFrame(() => {\n          setHeaderHide(false)\n        })\n      }\n    }\n  }, [isSticky, stickyOffset, tablePosition])\n\n  return (\n    <Table.Header\n      theme={theme}\n      style={{\n        ...style,\n        '--header-offset': `${headerOffset}px`\n      }}\n      {...props}\n      className={clsx(\n        'relative',\n        'z-3',\n        '[&_tr:not(:last-child)>th]:border-b-none',\n        '[&_tr:not(:first-child)>th]:rounded-none!',\n        className\n      )}\n    >\n      {getHeaderGroups().map((headerGroup) => {\n        return (\n          <Table.Row\n            key={headerGroup.id}\n            ref={tableHeaderRowRef}\n            className={\n              isSticky && headerOffset !== 0\n                ? clsx(\n                    'translate-y-(--header-offset)',\n                    headerHide\n                      ? 'delay-0ms opacity-0 transition-none'\n                      : 'delay-150ms opacity-100 transition-opacity duration-100',\n                    '[&_th]:last:before:absolute',\n                    '[&_th]:last:before:bottom-0',\n                    '[&_th]:last:before:pointer-events-none',\n                    '[&_th]:last:before:right-0',\n                    '[&_th]:last:before:shadow-sm',\n                    '[&_th]:last:before:top-0',\n                    '[&_th]:last:before:w-full'\n                  )\n                : undefined\n            }\n          >\n            {getCanSomeRowsExpand() && <Table.HeaderCell className=\"w-10\" />}\n            {enableRowSelection && (\n              <Table.HeaderCell className=\"w-10\">\n                <DataTableSelectAllRowsCheckbox />\n              </Table.HeaderCell>\n            )}\n            {headerGroup.headers.map((header, index) => (\n              <DataTable.HeaderCell\n                header={header}\n                key={header.id}\n                includeTotal={index === 0 && showTotalInFirstColumn}\n                totalSuffix={totalSuffix}\n              />\n            ))}\n          </Table.Row>\n        )\n      })}\n    </Table.Header>\n  )\n}\n"],"names":["DataTableHead","sortable","theme","isSticky","stickyOffset","showTotalInFirstColumn","totalSuffix","style","className","props","_a","getHeaderGroups","setIsSortable","enableRowSelection","getCanSomeRowsExpand","tablePosition","setTablePosition","useDataTable","React","tableHeaderRowRef","tableRef","headerOffsetRef","headerOffset","setHeaderOffset","headerHide","setHeaderHide","tableHeadElement","tableHeadHeight","intersectionOffset","newOffset","Table","clsx","headerGroup","DataTableSelectAllRowsCheckbox","header","index","DataTable"],"mappings":"2QAkBa,MAAAA,EAAgB,CAAC,CAC5B,SAAAC,EAAW,GACX,MAAAC,EAAQ,QACR,SAAAC,EAAW,GACX,aAAAC,EAAe,EACf,uBAAAC,EACA,YAAAC,EACA,MAAAC,EACA,UAAAC,EACA,GAAGC,CACL,IAA8C,CA5B9C,IAAAC,EA6BE,KAAM,CACJ,gBAAAC,EACA,cAAAC,EACA,mBAAAC,EACA,qBAAAC,EACA,cAAAC,EACA,iBAAAC,CACF,EAAIC,EAAa,EAEjBC,EAAM,UAAU,IAAM,CACpBN,EAAcX,CAAQ,CACxB,EAAG,CAACA,EAAUW,CAAa,CAAC,EAE5B,MAAMO,EAAoBD,EAAM,OAA4B,IAAI,EAC1DE,EAAWF,EAAM,OAAgC,IAAI,EACrDG,EAAkBH,EAAM,OAAO,CAAC,EAEhC,CAACI,EAAcC,CAAe,EAAIL,EAAM,SAAiB,CAAC,EAC1D,CAACM,EAAYC,CAAa,EAAIP,EAAM,SAAkB,EAAK,EAE3DQ,GAAmBhB,EAAAS,GAAA,KAAA,OAAAA,EAAmB,UAAnB,YAAAT,EAA4B,QAAQ,SAE7D,GAAIgB,IAAoBX,GAAA,KAAAA,OAAAA,EAAe,aAAc,KAAM,CACzD,MAAMY,EAAkBD,EAAiB,sBAAA,EAAwB,OAC3DE,EAAqBxB,EAAeuB,EACtCZ,GACFC,EAAiB,CAAE,GAAGD,EAAe,UAAWa,GAAsB,CAAE,CAAC,CAE7E,CAEA,OAAAV,EAAM,UAAU,IAAM,CACpB,GAAKf,IAED,CAACiB,EAAS,SAAWD,EAAkB,UACzCC,EAAS,QAAUD,EAAkB,QAAQ,QAC3C,OACF,GAGEC,EAAS,UACPL,GAAA,YAAAA,EAAe,OAAQ,OAAQA,GAAA,YAAAA,EAAe,UAAW,MAAM,CACjE,MAAMc,GACJd,GAAA,YAAAA,EAAe,MAAO,OACtBA,GAAA,KAAA,OAAAA,EAAe,SAAU,MACzBA,EAAc,IAAMX,GACpBW,EAAc,OAAS,IACnB,CAACA,EAAc,IAAMX,EACrB,EAEFyB,IAAc,GAAGJ,EAAc,EAAI,EAEvCJ,EAAgB,QAAUQ,EAC1BN,EAAgBM,CAAS,EAEzB,sBAAsB,IAAM,CAC1BJ,EAAc,EAAK,CACrB,CAAC,CACH,CAEJ,EAAG,CAACtB,EAAUC,EAAcW,CAAa,CAAC,EAGxCG,EAAA,cAACY,EAAM,OAAN,CACC,MAAO5B,EACP,MAAO,CACL,GAAGK,EACH,kBAAmB,GAAGe,CAAY,IACpC,EACC,GAAGb,EACJ,UAAWsB,EACT,WACA,MACA,2CACA,4CACAvB,CACF,CAAA,EAECG,IAAkB,IAAKqB,GAEpBd,EAAA,cAACY,EAAM,IAAN,CACC,IAAKE,EAAY,GACjB,IAAKb,EACL,UACEhB,GAAYmB,IAAiB,EACzBS,EACE,gCACAP,EACI,sCACA,0DACJ,8BACA,8BACA,yCACA,6BACA,+BACA,2BACA,2BACF,EACA,MAAA,EAGLV,EAA0BI,GAAAA,EAAA,cAACY,EAAM,WAAN,CAAiB,UAAU,MAAA,CAAO,EAC7DjB,GACCK,EAAA,cAACY,EAAM,WAAN,CAAiB,UAAU,MAC1BZ,EAAAA,EAAA,cAACe,EAAA,IAA+B,CAClC,EAEDD,EAAY,QAAQ,IAAI,CAACE,EAAQC,IAChCjB,EAAA,cAACkB,EAAU,WAAV,CACC,OAAQF,EACR,IAAKA,EAAO,GACZ,aAAcC,IAAU,GAAK9B,EAC7B,YAAaC,CAAAA,CACf,CACD,CACH,CAEH,CACH,CAEJ"}

package/dist/components/data-table/DataTableMetaData.js

@@ -1,2 +1,2 @@
-import*as f from"react";import{Text as v}from"../text/Text.js";import{useDataTable as w}from"./DataTableContext.js";import"./DataTable.js";const D={sorted_by:"Sorted by",ascending:"ascending",descending:"descending",separator:"-"},S=({copy:d,...i})=>{var o,c;const{getState:l,columns:g,getRowModel:m,rowSelection:p}=w(),{sorting:a}=l(),b=a.length>0,r=(c=(o=m())==null?void 0:o.rows)==null?void 0:c.length,n=Object.keys(p||{}).length,e={...D,...d},u=t=>{const s=g.find(y=>y.id===t);return(s==null?void 0:s.header)||t},h=t=>"".concat(e.separator," ").concat(e.sorted_by," ").concat(u(t[0].id)," ").concat(t[0].desc?e.descending:e.ascending);return f.createElement(v,{weight:"bold",...i},"".concat(n||r," ").concat((n||r)===1?"item":"items"," ").concat(n?"selected":""," ").concat(b?h(a):""))};export{S as DataTableMetaData};
+import*as y from"react";import{Text as f}from"../text/Text.js";import{useDataTable as v}from"./DataTableContext.js";import"./DataTable.js";const w={sorted_by:"Sorted by",ascending:"ascending",descending:"descending",separator:"-"},D=({copy:i,...c})=>{var o,r;const{getState:l,columns:g,getRowModel:m,rowSelection:p}=v(),{sorting:s}=l(),$=s.length>0,d=(r=(o=m())==null?void 0:o.rows)==null?void 0:r.length,n=Object.keys(p||{}).length,t={...w,...i},b=e=>{const a=g.find(h=>h.id===e);return(a==null?void 0:a.header)||e},u=e=>`${t.separator} ${t.sorted_by} ${b(e[0].id)} ${e[0].desc?t.descending:t.ascending}`;return y.createElement(f,{weight:"bold",...c},`${n||d} ${(n||d)===1?"item":"items"} ${n?"selected":""} ${$?u(s):""}`)};export{D as DataTableMetaData};
 //# sourceMappingURL=DataTableMetaData.js.map

package/dist/components/data-table/DataTableMetaData.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableMetaData.js","sources":["../../../src/components/data-table/DataTableMetaData.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '../text'\nimport { useDataTable } from './index'\n\nconst defaultCopy = {\n  sorted_by: 'Sorted by',\n  ascending: 'ascending',\n  descending: 'descending',\n  separator: '-'\n}\n\nexport const DataTableMetaData = ({\n  copy,\n  ...rest\n}: React.ComponentProps<typeof Text> & {\n  copy?: {\n    sorted_by?: string\n    ascending?: string\n    descending?: string\n    separator?: string\n  }\n  sortLabel?: string\n}) => {\n  const { getState, columns, getRowModel, rowSelection } = useDataTable()\n  const { sorting } = getState()\n  const isSorted = sorting.length > 0\n\n  const totalRows = getRowModel()?.rows?.length\n\n  const selectedRows = Object.keys(rowSelection || {}).length\n\n  const copyMerged = { ...defaultCopy, ...copy }\n\n  const getColumnDisplayName = (id: string) => {\n    const sortedColumn = columns.find((col) => col.id === id)\n    return sortedColumn?.header || id\n  }\n\n  const getSortingString = (sorting) => {\n    return `${copyMerged.separator} ${\n      copyMerged.sorted_by\n    } ${getColumnDisplayName(sorting[0].id)} ${\n      sorting[0].desc ? copyMerged.descending : copyMerged.ascending\n    }`\n  }\n\n  return (\n    <Text weight=\"bold\" {...rest}>{`${selectedRows || totalRows} ${\n      (selectedRows || totalRows) === 1 ? 'item' : 'items'\n    } ${selectedRows ? 'selected' : ''} ${\n      isSorted ? getSortingString(sorting) : ''\n    }`}</Text>\n  )\n}\n"],"names":["defaultCopy","DataTableMetaData","copy","rest","_a","_b","getState","columns","getRowModel","rowSelection","useDataTable","sorting","isSorted","totalRows","selectedRows","copyMerged","getColumnDisplayName","id","sortedColumn","col","getSortingString","React","Text"],"mappings":"2IAKA,MAAMA,EAAc,CAClB,UAAW,YACX,UAAW,YACX,WAAY,aACZ,UAAW,GACb,EAEaC,EAAoB,CAAC,CAChC,KAAAC,EACA,GAAGC,CACL,IAQM,CAvBN,IAAAC,EAAAC,EAwBE,KAAM,CAAE,SAAAC,EAAU,QAAAC,EAAS,YAAAC,EAAa,aAAAC,CAAa,EAAIC,EACnD,EAAA,CAAE,QAAAC,CAAQ,EAAIL,IACdM,EAAWD,EAAQ,OAAS,EAE5BE,GAAYR,GAAAD,EAAAI,MAAA,KAAAJ,OAAAA,EAAe,OAAf,KAAA,OAAAC,EAAqB,OAEjCS,EAAe,OAAO,KAAKL,GAAgB,CAAA,CAAE,EAAE,OAE/CM,EAAa,CAAE,GAAGf,EAAa,GAAGE,CAAK,EAEvCc,EAAwBC,GAAe,CAC3C,MAAMC,EAAeX,EAAQ,KAAMY,GAAQA,EAAI,KAAOF,CAAE,EACxD,OAAOC,GAAA,KAAA,OAAAA,EAAc,SAAUD,CACjC,EAEMG,EAAoBT,GACjB,GAAG,OAAAI,EAAW,UAAS,KAC5B,OAAAA,EAAW,UACb,GAAA,EAAI,OAAAC,EAAqBL,EAAQ,CAAC,EAAE,EAAE,EAAC,GACrC,EAAA,OAAAA,EAAQ,CAAC,EAAE,KAAOI,EAAW,WAAaA,EAAW,WAIzD,OACEM,EAAA,cAACC,EAAA,CAAK,OAAO,OAAQ,GAAGnB,CAAO,EAAA,GAAG,OAAAW,GAAgBD,EAAS,GACxD,EAAA,QAAAC,GAAgBD,KAAe,EAAI,OAAS,QAC/C,KAAI,OAAAC,EAAe,WAAa,GAAE,KAChC,OAAAF,EAAWQ,EAAiBT,CAAO,EAAI,GACtC,CAEP"}
+{"version":3,"file":"DataTableMetaData.js","sources":["../../../src/components/data-table/DataTableMetaData.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '../text'\nimport { useDataTable } from './index'\n\nconst defaultCopy = {\n  sorted_by: 'Sorted by',\n  ascending: 'ascending',\n  descending: 'descending',\n  separator: '-'\n}\n\nexport const DataTableMetaData = ({\n  copy,\n  ...rest\n}: React.ComponentProps<typeof Text> & {\n  copy?: {\n    sorted_by?: string\n    ascending?: string\n    descending?: string\n    separator?: string\n  }\n  sortLabel?: string\n}) => {\n  const { getState, columns, getRowModel, rowSelection } = useDataTable()\n  const { sorting } = getState()\n  const isSorted = sorting.length > 0\n\n  const totalRows = getRowModel()?.rows?.length\n\n  const selectedRows = Object.keys(rowSelection || {}).length\n\n  const copyMerged = { ...defaultCopy, ...copy }\n\n  const getColumnDisplayName = (id: string) => {\n    const sortedColumn = columns.find((col) => col.id === id)\n    return sortedColumn?.header || id\n  }\n\n  const getSortingString = (sorting) => {\n    return `${copyMerged.separator} ${\n      copyMerged.sorted_by\n    } ${getColumnDisplayName(sorting[0].id)} ${\n      sorting[0].desc ? copyMerged.descending : copyMerged.ascending\n    }`\n  }\n\n  return (\n    <Text weight=\"bold\" {...rest}>{`${selectedRows || totalRows} ${\n      (selectedRows || totalRows) === 1 ? 'item' : 'items'\n    } ${selectedRows ? 'selected' : ''} ${\n      isSorted ? getSortingString(sorting) : ''\n    }`}</Text>\n  )\n}\n"],"names":["defaultCopy","DataTableMetaData","copy","rest","_a","_b","getState","columns","getRowModel","rowSelection","useDataTable","sorting","isSorted","totalRows","selectedRows","copyMerged","getColumnDisplayName","id","sortedColumn","col","getSortingString","React","Text"],"mappings":"2IAKA,MAAMA,EAAc,CAClB,UAAW,YACX,UAAW,YACX,WAAY,aACZ,UAAW,GACb,EAEaC,EAAoB,CAAC,CAChC,KAAAC,EACA,GAAGC,CACL,IAQM,CAvBN,IAAAC,EAAAC,EAwBE,KAAM,CAAE,SAAAC,EAAU,QAAAC,EAAS,YAAAC,EAAa,aAAAC,CAAa,EAAIC,EAAa,EAChE,CAAE,QAAAC,CAAQ,EAAIL,EACdM,EAAAA,EAAWD,EAAQ,OAAS,EAE5BE,GAAYR,GAAAD,EAAAI,EAAY,IAAZ,KAAAJ,OAAAA,EAAe,OAAf,KAAAC,OAAAA,EAAqB,OAEjCS,EAAe,OAAO,KAAKL,GAAgB,CAAE,CAAA,EAAE,OAE/CM,EAAa,CAAE,GAAGf,EAAa,GAAGE,CAAK,EAEvCc,EAAwBC,GAAe,CAC3C,MAAMC,EAAeX,EAAQ,KAAMY,GAAQA,EAAI,KAAOF,CAAE,EACxD,OAAOC,GAAA,KAAAA,OAAAA,EAAc,SAAUD,CACjC,EAEMG,EAAoBT,GACjB,GAAGI,EAAW,SAAS,IAC5BA,EAAW,SACb,IAAIC,EAAqBL,EAAQ,CAAC,EAAE,EAAE,CAAC,IACrCA,EAAQ,CAAC,EAAE,KAAOI,EAAW,WAAaA,EAAW,SACvD,GAGF,OACEM,EAAA,cAACC,EAAA,CAAK,OAAO,OAAQ,GAAGnB,CAAO,EAAA,GAAGW,GAAgBD,CAAS,KACxDC,GAAgBD,KAAe,EAAI,OAAS,OAC/C,IAAIC,EAAe,WAAa,EAAE,IAChCF,EAAWQ,EAAiBT,CAAO,EAAI,EACzC,EAAG,CAEP"}

package/dist/components/data-table/DataTableRow.js

@@ -1,2 +1,2 @@
-import{ChevronDown as w,ChevronRight as x}from"@atom-learning/icons";import C from"clsx";import*as r from"react";import{styled as D}from"../../styled.js";import{Icon as E}from"../icon/Icon.js";import{Table as l}from"../table/Table.js";import{useDataTable as h}from"./DataTableContext.js";import{DataTableDataCell as v}from"./DataTableDataCell.js";import{DataTableRowSelectionCheckbox as y}from"./DataTableRowSelectionCheckbox.js";const S=D(l.Row,{base:["bg-[initial]","relative"],variants:{isSelected:{true:["odd:bg-primary-100"]},isDisabled:{true:["opacity-30"]},isFocusable:{true:["translate-y-0","duration-200","ease-out","transition-shadow","transition-transform","hover:shadow-[0px_4px_11px_0px_hsla(0,0%,12%,0.12)]","hover:-translate-y-px","hover:z-3","focus:outline-2","focus:outline-primary-500","focus:outline-solid","focus:-outline-offset-4","focus:[&_td]:bg-transparent"]}}}),d=e=>e?!!(e.closest("button, a, input, select, textarea")||e.getAttribute("role")==="button"):!1,k=({row:e,rowAction:n})=>{const{enableRowSelection:m,disabledRows:i,getCanSomeRowsExpand:u}=h(),s=!!(i!=null&&i[e.id]),p=e.getToggleExpandedHandler(),g=e.getToggleSelectedHandler(),f=()=>e.getIsSomeSelected()?"indeterminate":e.getIsSelected(),c=(t,o)=>{!n||!o.target.closest("tr")||d(o.target)||n(t.original,o)},b=t=>{if(t.key==="Enter"||t.key===" "){if(d(t.target))return;t.preventDefault(),c(e,t)}if(t.key==="ArrowDown"){t.preventDefault();const o=t.target.closest("tr"),a=o==null?void 0:o.nextElementSibling;a&&a.tagName==="TR"&&a.focus()}if(t.key==="ArrowUp"){t.preventDefault();const o=t.target.closest("tr"),a=o==null?void 0:o.previousElementSibling;a&&a.tagName==="TR"&&a.focus()}};return r.createElement(S,{isSelected:e.getIsSelected(),isDisabled:s,isFocusable:!!n&&!s,...n&&{onClick:t=>c(e,t),tabIndex:0,className:"cursor-pointer",onKeyDown:b}},u()&&r.createElement(l.Cell,{"data-testid":"expand-icon-".concat(e.id),onClick:p,className:C("w-10",e.getCanExpand()?"cursor-pointer":"cursor-auto")},e.getCanExpand()&&r.createElement(E,{is:e.getIsExpanded()?w:x})),m&&r.createElement(l.Cell,{className:"w-10"},r.createElement(y,{row:e,checked:f(),onCheckedChange:g})),e.getVisibleCells().map((t,o)=>r.createElement(v,{key:t.id,cell:t})))};export{k as DataTableRow};
+import{ChevronDown as w,ChevronRight as x}from"@atom-learning/icons";import C from"clsx";import*as r from"react";import{styled as D}from"../../styled.js";import{Icon as E}from"../icon/Icon.js";import{Table as l}from"../table/Table.js";import{useDataTable as h}from"./DataTableContext.js";import{DataTableDataCell as v}from"./DataTableDataCell.js";import{DataTableRowSelectionCheckbox as y}from"./DataTableRowSelectionCheckbox.js";const S=D(l.Row,{base:["bg-[initial]","relative"],variants:{isSelected:{true:["odd:bg-primary-100"]},isDisabled:{true:["opacity-30"]},isFocusable:{true:["translate-y-0","duration-200","ease-out","transition-shadow","transition-transform","hover:shadow-[0px_4px_11px_0px_hsla(0,0%,12%,0.12)]","hover:-translate-y-px","hover:z-3","focus:outline-2","focus:outline-primary-500","focus:outline-solid","focus:-outline-offset-4","focus:[&_td]:bg-transparent"]}}}),d=e=>e?!!(e.closest("button, a, input, select, textarea")||e.getAttribute("role")==="button"):!1,k=({row:e,rowAction:n})=>{const{enableRowSelection:m,disabledRows:i,getCanSomeRowsExpand:u}=h(),s=!!(i!=null&&i[e.id]),p=e.getToggleExpandedHandler(),g=e.getToggleSelectedHandler(),f=()=>e.getIsSomeSelected()?"indeterminate":e.getIsSelected(),c=(t,o)=>{!n||!o.target.closest("tr")||d(o.target)||n(t.original,o)},b=t=>{if(t.key==="Enter"||t.key===" "){if(d(t.target))return;t.preventDefault(),c(e,t)}if(t.key==="ArrowDown"){t.preventDefault();const o=t.target.closest("tr"),a=o==null?void 0:o.nextElementSibling;a&&a.tagName==="TR"&&a.focus()}if(t.key==="ArrowUp"){t.preventDefault();const o=t.target.closest("tr"),a=o==null?void 0:o.previousElementSibling;a&&a.tagName==="TR"&&a.focus()}};return r.createElement(S,{isSelected:e.getIsSelected(),isDisabled:s,isFocusable:!!n&&!s,...n&&{onClick:t=>c(e,t),tabIndex:0,className:"cursor-pointer",onKeyDown:b}},u()&&r.createElement(l.Cell,{"data-testid":`expand-icon-${e.id}`,onClick:p,className:C("w-10",e.getCanExpand()?"cursor-pointer":"cursor-auto")},e.getCanExpand()&&r.createElement(E,{is:e.getIsExpanded()?w:x})),m&&r.createElement(l.Cell,{className:"w-10"},r.createElement(y,{row:e,checked:f(),onCheckedChange:g})),e.getVisibleCells().map((t,o)=>r.createElement(v,{key:t.id,cell:t})))};export{k as DataTableRow};
 //# sourceMappingURL=DataTableRow.js.map

package/dist/components/data-table/DataTableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableRow.js","sources":["../../../src/components/data-table/DataTableRow.tsx"],"sourcesContent":["import { ChevronDown, ChevronRight } from '@atom-learning/icons'\nimport type { Row } from '@tanstack/react-table'\nimport clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Icon } from '../icon'\nimport { Table } from '../table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\n\nexport type DataTableRowProps = React.ComponentProps<typeof Table.Row> & {\n  row: Row<Record<string, unknown>>\n  rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void\n}\n\nconst StyledRow = styled(Table.Row, {\n  base: ['bg-[initial]', 'relative'],\n  variants: {\n    isSelected: {\n      true: ['odd:bg-primary-100']\n    },\n    isDisabled: {\n      true: ['opacity-30']\n    },\n    isFocusable: {\n      true: [\n        'translate-y-0',\n        'duration-200',\n        'ease-out',\n        'transition-shadow',\n        'transition-transform',\n        'hover:shadow-[0px_4px_11px_0px_hsla(0,0%,12%,0.12)]',\n        'hover:-translate-y-px',\n        'hover:z-3',\n        'focus:outline-2',\n        'focus:outline-primary-500',\n        'focus:outline-solid',\n        'focus:-outline-offset-4',\n        'focus:[&_td]:bg-transparent'\n      ]\n    }\n  }\n})\n\nconst isElementInteractive = (element: Element | null): boolean => {\n  if (!element) return false\n  if (element.closest('button, a, input, select, textarea')) return true\n  if (element.getAttribute('role') === 'button') return true\n  return false\n}\n\nexport const DataTableRow = ({ row, rowAction }: DataTableRowProps) => {\n  const { enableRowSelection, disabledRows, getCanSomeRowsExpand } =\n    useDataTable()\n\n  const isDisabled = !!disabledRows?.[row.id]\n\n  const toggleExpandHandler = row.getToggleExpandedHandler()\n  const toggleSelectHandler = row.getToggleSelectedHandler()\n\n  const getCheckedState = (): boolean | 'indeterminate' => {\n    if (row.getIsSomeSelected()) return 'indeterminate'\n    return row.getIsSelected()\n  }\n\n  const handleRowClick = (\n    rowData: Row<Record<string, unknown>>,\n    event: React.MouseEvent<HTMLTableRowElement>\n  ) => {\n    if (!rowAction) return\n\n    // Skip if clicking on an interactive element\n    const rowElement = (event.target as Element).closest('tr')\n    if (!rowElement || isElementInteractive(event.target as Element)) {\n      return\n    }\n\n    rowAction(rowData.original, event)\n  }\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      if (isElementInteractive(event.target as Element)) {\n        return\n      }\n      event.preventDefault()\n      handleRowClick(\n        row,\n        event as unknown as React.MouseEvent<HTMLTableRowElement>\n      )\n    }\n    if (event.key === 'ArrowDown') {\n      event.preventDefault()\n      const currentRow = (event.target as HTMLElement).closest('tr')\n      const nextRow = currentRow?.nextElementSibling as HTMLElement\n      if (nextRow && nextRow.tagName === 'TR') {\n        nextRow.focus()\n      }\n    }\n    if (event.key === 'ArrowUp') {\n      event.preventDefault()\n      const currentRow = (event.target as HTMLElement).closest('tr')\n      const previousRow = currentRow?.previousElementSibling as HTMLElement\n      if (previousRow && previousRow.tagName === 'TR') {\n        previousRow.focus()\n      }\n    }\n  }\n\n  return (\n    <StyledRow\n      isSelected={row.getIsSelected()}\n      isDisabled={isDisabled}\n      isFocusable={!!rowAction && !isDisabled}\n      {...(rowAction && {\n        onClick: (event) => handleRowClick(row, event),\n        tabIndex: 0,\n        className: 'cursor-pointer',\n        onKeyDown: handleKeyDown\n      })}\n    >\n      {getCanSomeRowsExpand() && (\n        <Table.Cell\n          data-testid={`expand-icon-${row.id}`}\n          onClick={toggleExpandHandler}\n          className={clsx(\n            'w-10',\n            row.getCanExpand() ? 'cursor-pointer' : 'cursor-auto'\n          )}\n        >\n          {row.getCanExpand() && (\n            <Icon is={row.getIsExpanded() ? ChevronDown : ChevronRight} />\n          )}\n        </Table.Cell>\n      )}\n\n      {enableRowSelection && (\n        <Table.Cell className=\"w-10\">\n          <DataTableRowSelectionCheckbox\n            row={row}\n            checked={getCheckedState()}\n            onCheckedChange={toggleSelectHandler}\n          />\n        </Table.Cell>\n      )}\n      {row.getVisibleCells().map((cell, i) => {\n        return <DataTableDataCell key={cell.id} cell={cell} />\n      })}\n    </StyledRow>\n  )\n}\n"],"names":["StyledRow","styled","Table","isElementInteractive","element","DataTableRow","row","rowAction","enableRowSelection","disabledRows","getCanSomeRowsExpand","useDataTable","isDisabled","toggleExpandHandler","toggleSelectHandler","getCheckedState","handleRowClick","rowData","event","handleKeyDown","currentRow","nextRow","previousRow","React","clsx","Icon","ChevronDown","ChevronRight","DataTableRowSelectionCheckbox","cell","i","DataTableDataCell"],"mappings":"8aAkBA,MAAMA,EAAYC,EAAOC,EAAM,IAAK,CAClC,KAAM,CAAC,eAAgB,UAAU,EACjC,SAAU,CACR,WAAY,CACV,KAAM,CAAC,oBAAoB,CAC7B,EACA,WAAY,CACV,KAAM,CAAC,YAAY,CACrB,EACA,YAAa,CACX,KAAM,CACJ,gBACA,eACA,WACA,oBACA,uBACA,sDACA,wBACA,YACA,kBACA,4BACA,sBACA,0BACA,6BACF,CACF,CACF,CACF,CAAC,EAEKC,EAAwBC,GACvBA,EACD,CAAA,EAAAA,EAAQ,QAAQ,oCAAoC,GACpDA,EAAQ,aAAa,MAAM,IAAM,UAFhB,GAMVC,EAAe,CAAC,CAAE,IAAAC,EAAK,UAAAC,CAAU,IAAyB,CACrE,KAAM,CAAE,mBAAAC,EAAoB,aAAAC,EAAc,qBAAAC,CAAqB,EAC7DC,IAEIC,EAAa,CAAC,EAACH,GAAA,MAAAA,EAAeH,EAAI,EAAA,GAElCO,EAAsBP,EAAI,yBAAA,EAC1BQ,EAAsBR,EAAI,yBAAyB,EAEnDS,EAAkB,IAClBT,EAAI,kBAA4B,EAAA,gBAC7BA,EAAI,cAAc,EAGrBU,EAAiB,CACrBC,EACAC,IACG,CACC,CAACX,GAID,CADgBW,EAAM,OAAmB,QAAQ,IAAI,GACtCf,EAAqBe,EAAM,MAAiB,GAI/DX,EAAUU,EAAQ,SAAUC,CAAK,CACnC,EAEMC,EAAiBD,GAAoD,CACzE,GAAIA,EAAM,MAAQ,SAAWA,EAAM,MAAQ,IAAK,CAC9C,GAAIf,EAAqBe,EAAM,MAAiB,EAC9C,OAEFA,EAAM,eAAe,EACrBF,EACEV,EACAY,CACF,CACF,CACA,GAAIA,EAAM,MAAQ,YAAa,CAC7BA,EAAM,eACN,EAAA,MAAME,EAAcF,EAAM,OAAuB,QAAQ,IAAI,EACvDG,EAAUD,GAAA,YAAAA,EAAY,mBACxBC,GAAWA,EAAQ,UAAY,MACjCA,EAAQ,MAAA,CAEZ,CACA,GAAIH,EAAM,MAAQ,UAAW,CAC3BA,EAAM,iBACN,MAAME,EAAcF,EAAM,OAAuB,QAAQ,IAAI,EACvDI,EAAcF,GAAA,KAAA,OAAAA,EAAY,uBAC5BE,GAAeA,EAAY,UAAY,MACzCA,EAAY,MAEhB,CAAA,CACF,EAEA,OACEC,EAAA,cAACvB,EAAA,CACC,WAAYM,EAAI,cAAc,EAC9B,WAAYM,EACZ,YAAa,CAAC,CAACL,GAAa,CAACK,EAC5B,GAAIL,GAAa,CAChB,QAAUW,GAAUF,EAAeV,EAAKY,CAAK,EAC7C,SAAU,EACV,UAAW,iBACX,UAAWC,CACb,CAECT,EAAAA,EAAAA,GACCa,EAAA,cAACrB,EAAM,KAAN,CACC,cAAa,eAAe,OAAAI,EAAI,EAAA,EAChC,QAASO,EACT,UAAWW,EACT,OACAlB,EAAI,eAAiB,iBAAmB,aAC1C,CAECA,EAAAA,EAAI,gBACHiB,EAAA,cAACE,EAAA,CAAK,GAAInB,EAAI,cAAA,EAAkBoB,EAAcC,EAAc,CAEhE,EAGDnB,GACCe,EAAA,cAACrB,EAAM,KAAN,CAAW,UAAU,MACpBqB,EAAAA,EAAA,cAACK,EAAA,CACC,IAAKtB,EACL,QAASS,IACT,gBAAiBD,CACnB,CAAA,CACF,EAEDR,EAAI,kBAAkB,IAAI,CAACuB,EAAMC,IACzBP,EAAA,cAACQ,EAAA,CAAkB,IAAKF,EAAK,GAAI,KAAMA,CAAM,CAAA,CACrD,CACH,CAEJ"}
+{"version":3,"file":"DataTableRow.js","sources":["../../../src/components/data-table/DataTableRow.tsx"],"sourcesContent":["import { ChevronDown, ChevronRight } from '@atom-learning/icons'\nimport type { Row } from '@tanstack/react-table'\nimport clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Icon } from '../icon'\nimport { Table } from '../table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\n\nexport type DataTableRowProps = React.ComponentProps<typeof Table.Row> & {\n  row: Row<Record<string, unknown>>\n  rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void\n}\n\nconst StyledRow = styled(Table.Row, {\n  base: ['bg-[initial]', 'relative'],\n  variants: {\n    isSelected: {\n      true: ['odd:bg-primary-100']\n    },\n    isDisabled: {\n      true: ['opacity-30']\n    },\n    isFocusable: {\n      true: [\n        'translate-y-0',\n        'duration-200',\n        'ease-out',\n        'transition-shadow',\n        'transition-transform',\n        'hover:shadow-[0px_4px_11px_0px_hsla(0,0%,12%,0.12)]',\n        'hover:-translate-y-px',\n        'hover:z-3',\n        'focus:outline-2',\n        'focus:outline-primary-500',\n        'focus:outline-solid',\n        'focus:-outline-offset-4',\n        'focus:[&_td]:bg-transparent'\n      ]\n    }\n  }\n})\n\nconst isElementInteractive = (element: Element | null): boolean => {\n  if (!element) return false\n  if (element.closest('button, a, input, select, textarea')) return true\n  if (element.getAttribute('role') === 'button') return true\n  return false\n}\n\nexport const DataTableRow = ({ row, rowAction }: DataTableRowProps) => {\n  const { enableRowSelection, disabledRows, getCanSomeRowsExpand } =\n    useDataTable()\n\n  const isDisabled = !!disabledRows?.[row.id]\n\n  const toggleExpandHandler = row.getToggleExpandedHandler()\n  const toggleSelectHandler = row.getToggleSelectedHandler()\n\n  const getCheckedState = (): boolean | 'indeterminate' => {\n    if (row.getIsSomeSelected()) return 'indeterminate'\n    return row.getIsSelected()\n  }\n\n  const handleRowClick = (\n    rowData: Row<Record<string, unknown>>,\n    event: React.MouseEvent<HTMLTableRowElement>\n  ) => {\n    if (!rowAction) return\n\n    // Skip if clicking on an interactive element\n    const rowElement = (event.target as Element).closest('tr')\n    if (!rowElement || isElementInteractive(event.target as Element)) {\n      return\n    }\n\n    rowAction(rowData.original, event)\n  }\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      if (isElementInteractive(event.target as Element)) {\n        return\n      }\n      event.preventDefault()\n      handleRowClick(\n        row,\n        event as unknown as React.MouseEvent<HTMLTableRowElement>\n      )\n    }\n    if (event.key === 'ArrowDown') {\n      event.preventDefault()\n      const currentRow = (event.target as HTMLElement).closest('tr')\n      const nextRow = currentRow?.nextElementSibling as HTMLElement\n      if (nextRow && nextRow.tagName === 'TR') {\n        nextRow.focus()\n      }\n    }\n    if (event.key === 'ArrowUp') {\n      event.preventDefault()\n      const currentRow = (event.target as HTMLElement).closest('tr')\n      const previousRow = currentRow?.previousElementSibling as HTMLElement\n      if (previousRow && previousRow.tagName === 'TR') {\n        previousRow.focus()\n      }\n    }\n  }\n\n  return (\n    <StyledRow\n      isSelected={row.getIsSelected()}\n      isDisabled={isDisabled}\n      isFocusable={!!rowAction && !isDisabled}\n      {...(rowAction && {\n        onClick: (event) => handleRowClick(row, event),\n        tabIndex: 0,\n        className: 'cursor-pointer',\n        onKeyDown: handleKeyDown\n      })}\n    >\n      {getCanSomeRowsExpand() && (\n        <Table.Cell\n          data-testid={`expand-icon-${row.id}`}\n          onClick={toggleExpandHandler}\n          className={clsx(\n            'w-10',\n            row.getCanExpand() ? 'cursor-pointer' : 'cursor-auto'\n          )}\n        >\n          {row.getCanExpand() && (\n            <Icon is={row.getIsExpanded() ? ChevronDown : ChevronRight} />\n          )}\n        </Table.Cell>\n      )}\n\n      {enableRowSelection && (\n        <Table.Cell className=\"w-10\">\n          <DataTableRowSelectionCheckbox\n            row={row}\n            checked={getCheckedState()}\n            onCheckedChange={toggleSelectHandler}\n          />\n        </Table.Cell>\n      )}\n      {row.getVisibleCells().map((cell, i) => {\n        return <DataTableDataCell key={cell.id} cell={cell} />\n      })}\n    </StyledRow>\n  )\n}\n"],"names":["StyledRow","styled","Table","isElementInteractive","element","DataTableRow","row","rowAction","enableRowSelection","disabledRows","getCanSomeRowsExpand","useDataTable","isDisabled","toggleExpandHandler","toggleSelectHandler","getCheckedState","handleRowClick","rowData","event","handleKeyDown","currentRow","nextRow","previousRow","React","clsx","Icon","ChevronDown","ChevronRight","DataTableRowSelectionCheckbox","cell","i","DataTableDataCell"],"mappings":"8aAkBA,MAAMA,EAAYC,EAAOC,EAAM,IAAK,CAClC,KAAM,CAAC,eAAgB,UAAU,EACjC,SAAU,CACR,WAAY,CACV,KAAM,CAAC,oBAAoB,CAC7B,EACA,WAAY,CACV,KAAM,CAAC,YAAY,CACrB,EACA,YAAa,CACX,KAAM,CACJ,gBACA,eACA,WACA,oBACA,uBACA,sDACA,wBACA,YACA,kBACA,4BACA,sBACA,0BACA,6BACF,CACF,CACF,CACF,CAAC,EAEKC,EAAwBC,GACvBA,EACD,CAAA,EAAAA,EAAQ,QAAQ,oCAAoC,GACpDA,EAAQ,aAAa,MAAM,IAAM,UAFhB,GAMVC,EAAe,CAAC,CAAE,IAAAC,EAAK,UAAAC,CAAU,IAAyB,CACrE,KAAM,CAAE,mBAAAC,EAAoB,aAAAC,EAAc,qBAAAC,CAAqB,EAC7DC,IAEIC,EAAa,CAAC,EAACH,GAAA,MAAAA,EAAeH,EAAI,EAAA,GAElCO,EAAsBP,EAAI,yBAAA,EAC1BQ,EAAsBR,EAAI,yBAAyB,EAEnDS,EAAkB,IAClBT,EAAI,kBAA4B,EAAA,gBAC7BA,EAAI,cAAc,EAGrBU,EAAiB,CACrBC,EACAC,IACG,CACC,CAACX,GAID,CADgBW,EAAM,OAAmB,QAAQ,IAAI,GACtCf,EAAqBe,EAAM,MAAiB,GAI/DX,EAAUU,EAAQ,SAAUC,CAAK,CACnC,EAEMC,EAAiBD,GAAoD,CACzE,GAAIA,EAAM,MAAQ,SAAWA,EAAM,MAAQ,IAAK,CAC9C,GAAIf,EAAqBe,EAAM,MAAiB,EAC9C,OAEFA,EAAM,eAAe,EACrBF,EACEV,EACAY,CACF,CACF,CACA,GAAIA,EAAM,MAAQ,YAAa,CAC7BA,EAAM,eACN,EAAA,MAAME,EAAcF,EAAM,OAAuB,QAAQ,IAAI,EACvDG,EAAUD,GAAA,YAAAA,EAAY,mBACxBC,GAAWA,EAAQ,UAAY,MACjCA,EAAQ,MAAA,CAEZ,CACA,GAAIH,EAAM,MAAQ,UAAW,CAC3BA,EAAM,iBACN,MAAME,EAAcF,EAAM,OAAuB,QAAQ,IAAI,EACvDI,EAAcF,GAAA,KAAA,OAAAA,EAAY,uBAC5BE,GAAeA,EAAY,UAAY,MACzCA,EAAY,MAEhB,CAAA,CACF,EAEA,OACEC,EAAA,cAACvB,EAAA,CACC,WAAYM,EAAI,cAAc,EAC9B,WAAYM,EACZ,YAAa,CAAC,CAACL,GAAa,CAACK,EAC5B,GAAIL,GAAa,CAChB,QAAUW,GAAUF,EAAeV,EAAKY,CAAK,EAC7C,SAAU,EACV,UAAW,iBACX,UAAWC,CACb,CAECT,EAAAA,EAAAA,GACCa,EAAA,cAACrB,EAAM,KAAN,CACC,cAAa,eAAeI,EAAI,EAAE,GAClC,QAASO,EACT,UAAWW,EACT,OACAlB,EAAI,eAAiB,iBAAmB,aAC1C,CAECA,EAAAA,EAAI,gBACHiB,EAAA,cAACE,EAAA,CAAK,GAAInB,EAAI,cAAA,EAAkBoB,EAAcC,EAAc,CAEhE,EAGDnB,GACCe,EAAA,cAACrB,EAAM,KAAN,CAAW,UAAU,MACpBqB,EAAAA,EAAA,cAACK,EAAA,CACC,IAAKtB,EACL,QAASS,IACT,gBAAiBD,CACnB,CAAA,CACF,EAEDR,EAAI,kBAAkB,IAAI,CAACuB,EAAMC,IACzBP,EAAA,cAACQ,EAAA,CAAkB,IAAKF,EAAK,GAAI,KAAMA,CAAM,CAAA,CACrD,CACH,CAEJ"}

package/dist/components/data-table/DataTableRowSelectionCheckbox.js

@@ -1,2 +1,2 @@
-import*as n from"@radix-ui/react-visually-hidden";import*as t from"react";import{Checkbox as r}from"../checkbox/Checkbox.js";import{Label as m}from"../label/Label.js";import{useDataTable as i}from"./DataTableContext.js";const d=({row:e,checked:c,onCheckedChange:a,label:l="Row ".concat(e.id," selection")})=>{const{tableId:o}=i();return t.createElement(t.Fragment,null,t.createElement(n.Root,null,t.createElement(m,{htmlFor:"".concat(o,"_row_").concat(e.id,"_selection")},l)),t.createElement(r,{size:"lg",style:{"--depth":e.depth},checked:c,onCheckedChange:a,name:"".concat(o,"_row_").concat(e.id,"_selection"),disabled:!e.getCanSelect(),className:"mr-3 ml-[calc((var(--depth,0)*2)*4px)]"}))};export{d as DataTableRowSelectionCheckbox};
+import*as c from"@radix-ui/react-visually-hidden";import*as t from"react";import{Checkbox as m}from"../checkbox/Checkbox.js";import{Label as n}from"../label/Label.js";import{useDataTable as i}from"./DataTableContext.js";const d=({row:e,checked:l,onCheckedChange:a,label:r=`Row ${e.id} selection`})=>{const{tableId:o}=i();return t.createElement(t.Fragment,null,t.createElement(c.Root,null,t.createElement(n,{htmlFor:`${o}_row_${e.id}_selection`},r)),t.createElement(m,{size:"lg",style:{"--depth":e.depth},checked:l,onCheckedChange:a,name:`${o}_row_${e.id}_selection`,disabled:!e.getCanSelect(),className:"mr-3 ml-[calc((var(--depth,0)*2)*4px)]"}))};export{d as DataTableRowSelectionCheckbox};
 //# sourceMappingURL=DataTableRowSelectionCheckbox.js.map

package/dist/components/data-table/DataTableRowSelectionCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableRowSelectionCheckbox.js","sources":["../../../src/components/data-table/DataTableRowSelectionCheckbox.tsx"],"sourcesContent":["import * as VisuallyHidden from '@radix-ui/react-visually-hidden'\nimport type { Row } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { Checkbox } from '../checkbox'\nimport { Label } from '../label'\nimport { useDataTable } from './DataTableContext'\n\nexport const DataTableRowSelectionCheckbox = ({\n  row,\n  checked,\n  onCheckedChange,\n  label = `Row ${row.id} selection`\n}: {\n  row: Row<Record<string, unknown>>\n  checked: boolean | 'indeterminate'\n  onCheckedChange: (value: boolean) => void\n  label?: string\n}): React.ReactElement => {\n  const { tableId } = useDataTable()\n\n  return (\n    <>\n      <VisuallyHidden.Root>\n        <Label htmlFor={`${tableId}_row_${row.id}_selection`}>{label}</Label>\n      </VisuallyHidden.Root>\n      <Checkbox\n        size=\"lg\"\n        style={{ '--depth': row.depth }}\n        checked={checked}\n        onCheckedChange={onCheckedChange}\n        name={`${tableId}_row_${row.id}_selection`}\n        disabled={!row.getCanSelect()}\n        className=\"mr-3 ml-[calc((var(--depth,0)*2)*4px)]\"\n      />\n    </>\n  )\n}\n"],"names":["DataTableRowSelectionCheckbox","row","checked","onCheckedChange","label","tableId","useDataTable","React","VisuallyHidden","Label","Checkbox"],"mappings":"kOAQaA,EAAgC,CAAC,CAC5C,IAAAC,EACA,QAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,OAAO,OAAAH,EAAI,GAAE,YACvB,CAAA,IAK0B,CACxB,KAAM,CAAE,QAAAI,CAAQ,EAAIC,EAEpB,EAAA,OACEC,EAAA,cAAAA,EAAA,SACEA,KAAAA,EAAA,cAACC,EAAe,KAAf,KACCD,EAAA,cAACE,EAAA,CAAM,QAAS,GAAG,OAAAJ,EAAO,OAAA,EAAQ,OAAAJ,EAAI,GAAE,YAAeG,CAAAA,EAAAA,CAAM,CAC/D,EACAG,EAAA,cAACG,EAAA,CACC,KAAK,KACL,MAAO,CAAE,UAAWT,EAAI,KAAM,EAC9B,QAASC,EACT,gBAAiBC,EACjB,KAAM,GAAG,OAAAE,EAAO,OAAA,EAAQ,OAAAJ,EAAI,GAAE,YAC9B,EAAA,SAAU,CAACA,EAAI,eACf,UAAU,wCACZ,CAAA,CACF,CAEJ"}
+{"version":3,"file":"DataTableRowSelectionCheckbox.js","sources":["../../../src/components/data-table/DataTableRowSelectionCheckbox.tsx"],"sourcesContent":["import * as VisuallyHidden from '@radix-ui/react-visually-hidden'\nimport type { Row } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { Checkbox } from '../checkbox'\nimport { Label } from '../label'\nimport { useDataTable } from './DataTableContext'\n\nexport const DataTableRowSelectionCheckbox = ({\n  row,\n  checked,\n  onCheckedChange,\n  label = `Row ${row.id} selection`\n}: {\n  row: Row<Record<string, unknown>>\n  checked: boolean | 'indeterminate'\n  onCheckedChange: (value: boolean) => void\n  label?: string\n}): React.ReactElement => {\n  const { tableId } = useDataTable()\n\n  return (\n    <>\n      <VisuallyHidden.Root>\n        <Label htmlFor={`${tableId}_row_${row.id}_selection`}>{label}</Label>\n      </VisuallyHidden.Root>\n      <Checkbox\n        size=\"lg\"\n        style={{ '--depth': row.depth }}\n        checked={checked}\n        onCheckedChange={onCheckedChange}\n        name={`${tableId}_row_${row.id}_selection`}\n        disabled={!row.getCanSelect()}\n        className=\"mr-3 ml-[calc((var(--depth,0)*2)*4px)]\"\n      />\n    </>\n  )\n}\n"],"names":["DataTableRowSelectionCheckbox","row","checked","onCheckedChange","label","tableId","useDataTable","React","VisuallyHidden","Label","Checkbox"],"mappings":"4NAQa,MAAAA,EAAgC,CAAC,CAC5C,IAAAC,EACA,QAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,OAAOH,EAAI,EAAE,YACvB,IAK0B,CACxB,KAAM,CAAE,QAAAI,CAAQ,EAAIC,EAAAA,EAEpB,OACEC,EAAA,cAAAA,EAAA,SACEA,KAAAA,EAAA,cAACC,EAAe,KAAf,KACCD,EAAA,cAACE,EAAA,CAAM,QAAS,GAAGJ,CAAO,QAAQJ,EAAI,EAAE,YAAA,EAAeG,CAAM,CAC/D,EACAG,EAAA,cAACG,EAAA,CACC,KAAK,KACL,MAAO,CAAE,UAAWT,EAAI,KAAM,EAC9B,QAASC,EACT,gBAAiBC,EACjB,KAAM,GAAGE,CAAO,QAAQJ,EAAI,EAAE,aAC9B,SAAU,CAACA,EAAI,eACf,UAAU,wCACZ,CAAA,CACF,CAEJ"}