@atom-learning/components 6.14.4 → 6.16.0-beta.0

package/dist/components/accordion/Accordion.js

@@ -1,14 +1,14 @@
+import { cn } from "../../styled.js";
 import { AccordionContent } from "./AccordionContent.js";
 import { AccordionItem } from "./AccordionItem.js";
 import { AccordionTrigger } from "./AccordionTrigger.js";
 import { Root } from "@radix-ui/react-accordion";
-import clsx from "clsx";
 import React from "react";
 //#region src/components/accordion/Accordion.tsx
 var Accordion = React.forwardRef(({ type = "single", className, children, ...remainingProps }, ref) => /* @__PURE__ */ React.createElement(Root, {
 	ref,
 	type,
-	className: clsx("w-full", className),
+	className: cn("w-full", className),
 	...remainingProps
 }, children));
 Accordion.Item = AccordionItem;

package/dist/components/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","names":[],"sources":["../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-accordion'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { AccordionContent } from './AccordionContent'\nimport { AccordionItem } from './AccordionItem'\nimport { AccordionTrigger } from './AccordionTrigger'\n\ntype AccordionProps = React.ComponentProps<typeof Root> & {\n  type: 'single' | 'multiple'\n}\n\ntype AccordionType = ReturnType<\n  typeof React.forwardRef<HTMLDivElement, AccordionProps>\n> & {\n  Item: typeof AccordionItem\n  Content: typeof AccordionContent\n  Trigger: typeof AccordionTrigger\n}\n\nexport const Accordion = React.forwardRef<HTMLDivElement, AccordionProps>(\n  ({ type = 'single', className, children, ...remainingProps }, ref) => (\n    // eslint-disable-next-line\n    // @ts-ignore TODO: Radix has an TS error that throws a warning if you pass multiple in. Needs to be fixed by the owner\n    <Root\n      ref={ref}\n      type={type}\n      className={clsx('w-full', className)}\n      {...remainingProps}\n    >\n      {children}\n    </Root>\n  )\n) as AccordionType\n\nAccordion.Item = AccordionItem\nAccordion.Content = AccordionContent\nAccordion.Trigger = AccordionTrigger\n\nAccordion.displayName = 'Accordion'\n"],"mappings":";;;;;;;AAoBA,IAAa,YAAY,MAAM,YAC5B,EAAE,OAAO,UAAU,WAAW,UAAU,GAAG,kBAAkB,QAG5D,sBAAA,cAAC,MAAD;CACO;CACC;CACN,WAAW,KAAK,UAAU,UAAU;CACpC,GAAI;CAGC,EADJ,SACI,CAEV;AAED,UAAU,OAAO;AACjB,UAAU,UAAU;AACpB,UAAU,UAAU;AAEpB,UAAU,cAAc"}
+{"version":3,"file":"Accordion.js","names":[],"sources":["../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-accordion'\nimport React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { AccordionContent } from './AccordionContent'\nimport { AccordionItem } from './AccordionItem'\nimport { AccordionTrigger } from './AccordionTrigger'\n\ntype AccordionProps = React.ComponentProps<typeof Root> & {\n  type: 'single' | 'multiple'\n}\n\ntype AccordionType = ReturnType<\n  typeof React.forwardRef<HTMLDivElement, AccordionProps>\n> & {\n  Item: typeof AccordionItem\n  Content: typeof AccordionContent\n  Trigger: typeof AccordionTrigger\n}\n\nexport const Accordion = React.forwardRef<HTMLDivElement, AccordionProps>(\n  ({ type = 'single', className, children, ...remainingProps }, ref) => (\n    // eslint-disable-next-line\n    // @ts-ignore TODO: Radix has an TS error that throws a warning if you pass multiple in. Needs to be fixed by the owner\n    <Root\n      ref={ref}\n      type={type}\n      className={cn('w-full', className)}\n      {...remainingProps}\n    >\n      {children}\n    </Root>\n  )\n) as AccordionType\n\nAccordion.Item = AccordionItem\nAccordion.Content = AccordionContent\nAccordion.Trigger = AccordionTrigger\n\nAccordion.displayName = 'Accordion'\n"],"mappings":";;;;;;;AAqBA,IAAa,YAAY,MAAM,YAC5B,EAAE,OAAO,UAAU,WAAW,UAAU,GAAG,kBAAkB,QAG5D,sBAAA,cAAC,MAAD;CACO;CACC;CACN,WAAW,GAAG,UAAU,UAAU;CAClC,GAAI;CAGC,EADJ,SACI,CAEV;AAED,UAAU,OAAO;AACjB,UAAU,UAAU;AACpB,UAAU,UAAU;AAEpB,UAAU,cAAc"}

package/dist/components/action-icon/ActionIcon.d.ts

@@ -15,6 +15,7 @@ declare const StyledButton: React.ForwardRefExoticComponent<Omit<Omit<React.Deta
 type ActionIconProps = Override<React.ComponentProps<typeof StyledButton>, {
     children: React.ReactNode;
     label: string;
+    reloadDocument?: boolean;
 } & Omit<TOptionalTooltipWrapperProps, 'label'> & NavigatorActions>;
 export declare const ActionIcon: React.ForwardRefExoticComponent<Omit<ActionIconProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export {};

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

@@ -2,6 +2,7 @@ import { styled } from "../../styled.js";
 import { Icon } from "../icon/Icon.js";
 import { OptionalTooltipWrapper } from "../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";
 import { getExternalAnchorProps } from "../../utilities/uri/index.js";
+import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
 import { ActionIconSizeMap } from "./ActionIcon.constants.js";
 import * as React$1 from "react";
 import invariant from "invariant";
@@ -101,11 +102,12 @@ var StyledButton = styled("button", {
 		isRounded: { true: ["rounded-full"] }
 	}
 }, { enabledResponsiveVariants: true });
-var ActionIcon = React$1.forwardRef(({ children, theme = "primary", appearance = "simple", size = "sm", label, href, disabled, hasTooltip = true, tooltipSide, ...remainingProps }, ref) => {
+var ActionIcon = React$1.forwardRef(({ children, theme = "primary", appearance = "simple", size = "sm", label, href, disabled, hasTooltip = true, tooltipSide, reloadDocument, ...remainingProps }, ref) => {
 	const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`;
 	invariant(React$1.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE);
+	const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
 	const optionalLinkProps = href ? {
-		as: "a",
+		as: routerLinkProps.as || "a",
 		href: disabled ? void 0 : href,
 		onClick: void 0,
 		"aria-disabled": !!disabled

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

@@ -1 +1 @@
-{"version":3,"file":"ActionIcon.js","names":[],"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/navigatorActions.types'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { Override } from '~/utilities/types'\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      'rounded-md',\n      'box-border',\n      'cursor-pointer',\n      'flex',\n      'shrink-0',\n      'justify-center',\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          '[--solid-base:var(--color-white)]',\n          '[--solid-interact:var(--color-grey-100)]',\n          '[--solid-active:var(--color-grey-200)]',\n          '[--solid-text:var(--color-grey-1200)]',\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-(--solid-base,var(--base))',\n          'text-(--solid-text,white)',\n          'not-disabled:hover:bg-(--solid-interact,var(--interact))',\n          'not-disabled:hover:text-(--solid-text,white)',\n          'not-disabled:focus:bg-(--solid-interact,var(--interact))',\n          'not-disabled:focus:text-(--solid-text,white)',\n          'not-disabled:active:bg-(--solid-active,var(--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"],"mappings":";;;;;;;;AAaA,IAAM,eAAe,OACnB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,aAAa;IACX;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,QAAQ;IACN;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GAChB;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAWD,IAAa,aAAa,QAAM,YAE5B,EACE,UACA,QAAQ,WACR,aAAa,UACb,OAAO,MACP,OACA,MACA,UACA,aAAa,MACb,aACA,GAAG,kBAEL,QACG;CACH,MAAM,2BAA2B,YAAY,KAAK,YAAY,wCAAwC,WAAW;AAEjH,WAAU,QAAM,SAAS,MAAM,SAAS,KAAK,GAAG,yBAAyB;CAIzE,MAAM,oBAAoB,OACrB;EACC,IAAI;EACJ,MAAM,WAAW,KAAA,IAAY;EAC7B,SAAS,KAAA;EACT,iBAAiB,CAAC,CAAC;EACpB,GACA,EAAE,MAAM,UAAU;AAEvB,QACE,wBAAA,cAAC,wBAAD;EACc;EACL;EACM;EAiCU,EA/BvB,wBAAA,cAAC,cAAD;EACE,GAAK;EACL,GAAI,uBAAuB,KAAK;EAChC,GAAI;EACJ,cAAY;EACL;EACK;EACN;EACD;EACK;EAqBG,EAnBZ,QAAM,SAAS,IAAI,WAAW,UAAU;AAGvC,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MAAM,yBAAyB;AAG3C,YACE,MAAM,SAAS,MACf,oBAAoB,OAAO,KAAK,6BAA6B,KAAK,YAAY,2BAA2B,WAAW,cACrH;AAED,SAAO,QAAM,aACX,OACA,EACE,MAAM,kBAAkB,OACzB,CACF;GACD,CACW,CACQ;EAG9B;AAED,WAAW,cAAc"}
+{"version":3,"file":"ActionIcon.js","names":[],"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/navigatorActions.types'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst StyledButton = styled(\n  'button',\n  {\n    base: [\n      'items-center',\n      'appearance-none',\n      'bg-white',\n      'rounded-md',\n      'box-border',\n      'cursor-pointer',\n      'flex',\n      'shrink-0',\n      'justify-center',\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          '[--solid-base:var(--color-white)]',\n          '[--solid-interact:var(--color-grey-100)]',\n          '[--solid-active:var(--color-grey-200)]',\n          '[--solid-text:var(--color-grey-1200)]',\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-(--solid-base,var(--base))',\n          'text-(--solid-text,white)',\n          'not-disabled:hover:bg-(--solid-interact,var(--interact))',\n          'not-disabled:hover:text-(--solid-text,white)',\n          'not-disabled:focus:bg-(--solid-interact,var(--interact))',\n          'not-disabled:focus:text-(--solid-text,white)',\n          'not-disabled:active:bg-(--solid-active,var(--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    reloadDocument?: boolean\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      reloadDocument,\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    const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\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: routerLinkProps.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"],"mappings":";;;;;;;;;AAcA,IAAM,eAAe,OACnB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,aAAa;IACX;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,QAAQ;IACN;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GAChB;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAYD,IAAa,aAAa,QAAM,YAE5B,EACE,UACA,QAAQ,WACR,aAAa,UACb,OAAO,MACP,OACA,MACA,UACA,aAAa,MACb,aACA,gBACA,GAAG,kBAEL,QACG;CACH,MAAM,2BAA2B,YAAY,KAAK,YAAY,wCAAwC,WAAW;AAEjH,WAAU,QAAM,SAAS,MAAM,SAAS,KAAK,GAAG,yBAAyB;CAEzE,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;CAIpE,MAAM,oBAAoB,OACrB;EACC,IAAI,gBAAgB,MAAM;EAC1B,MAAM,WAAW,KAAA,IAAY;EAC7B,SAAS,KAAA;EACT,iBAAiB,CAAC,CAAC;EACpB,GACA,EAAE,MAAM,UAAU;AAEvB,QACE,wBAAA,cAAC,wBAAD;EACc;EACL;EACM;EAiCU,EA/BvB,wBAAA,cAAC,cAAD;EACE,GAAK;EACL,GAAI,uBAAuB,KAAK;EAChC,GAAI;EACJ,cAAY;EACL;EACK;EACN;EACD;EACK;EAqBG,EAnBZ,QAAM,SAAS,IAAI,WAAW,UAAU;AAGvC,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MAAM,yBAAyB;AAG3C,YACE,MAAM,SAAS,MACf,oBAAoB,OAAO,KAAK,6BAA6B,KAAK,YAAY,2BAA2B,WAAW,cACrH;AAED,SAAO,QAAM,aACX,OACA,EACE,MAAM,kBAAkB,OACzB,CACF;GACD,CACW,CACQ;EAG9B;AAED,WAAW,cAAc"}

package/dist/components/avatar/Avatar.js

@@ -1,10 +1,9 @@
-import { styled } from "../../styled.js";
+import { cn, styled } from "../../styled.js";
 import { AvatarRootContext } from "./AvatarContext.js";
 import { AvatarIcon } from "./AvatarIcon.js";
 import { AvatarPlaceholder } from "./AvatarPlaceholder.js";
 import { AvatarInitial } from "./AvatarInitial.js";
 import { AvatarImage } from "./AvatarImage.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 //#region src/components/avatar/Avatar.tsx
 var avatarRootStyles = [
@@ -106,7 +105,7 @@ var AvatarRoot = ({ children, size = "lg", name, emphasis = "white", disabled =
 		style: { "--bg-color": backgroundColor },
 		disabled,
 		onClick: disabled ? void 0 : onClick,
-		className: clsx(disabled ? "cursor-auto" : "cursor-pointer"),
+		className: cn(disabled ? "cursor-auto" : "cursor-pointer"),
 		emphasis
 	}, children) : /* @__PURE__ */ React$1.createElement(StyledDiv, {
 		size,

package/dist/components/avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","names":[],"sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport type { TAvatarRootContext } from './AvatarContext'\nimport { AvatarRootContext } from './AvatarContext'\nimport { AvatarIcon } from './AvatarIcon'\nimport { AvatarImage } from './AvatarImage'\nimport { AvatarInitial } from './AvatarInitial'\nimport { AvatarPlaceholder } from './AvatarPlaceholder'\n\nconst avatarRootStyles = [\n  'flex',\n  'justify-center',\n  'items-center',\n  'text-grey-800',\n  'rounded-full',\n  'border-2',\n  'border-grey-200',\n  'bg-(--bg-color)',\n  'overflow-hidden'\n]\n\nconst StyledDiv = styled('div', {\n  base: avatarRootStyles,\n  variants: {\n    size: {\n      xs: ['size-6'],\n      sm: ['size-8'],\n      md: ['size-10'],\n      lg: ['size-12'],\n      xl: ['size-16'],\n      xxl: ['size-24']\n    },\n    emphasis: {\n      bold: ['border-0', '[&>p]:text-white'],\n      subtle: ['border-0'],\n      white: []\n    }\n  }\n})\n\nconst StyledButton = styled('button', {\n  base: [\n    ...avatarRootStyles,\n    'not-disabled:active:bg-grey-200',\n    'not-disabled:active:border-primary-800',\n    'not-disabled:hover:bg-grey-100',\n    'not-disabled:hover:border-grey-800',\n    'not-disabled:focus-visible:outline-none',\n    'not-disabled:focus-visible:relative',\n    'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n    'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n    'not-disabled:focus-visible:z-1',\n    'disabled:cursor-not-allowed',\n    'disabled:opacity-30'\n  ],\n  variants: {\n    size: {\n      xs: ['size-6'],\n      sm: ['size-8'],\n      md: ['size-10'],\n      lg: ['size-12'],\n      xl: ['size-16'],\n      xxl: ['size-24']\n    },\n    emphasis: {\n      bold: ['border-0', '[&>p]:text-white'],\n      subtle: ['border-0'],\n      white: []\n    }\n  }\n})\n\ntype TAvatarProps = React.ComponentProps<\n  typeof StyledDiv | typeof StyledButton\n> & {\n  name?: string\n} & (\n    | {\n        onClick: React.MouseEventHandler<HTMLButtonElement>\n        disabled?: boolean\n      }\n    | { onClick?: never; disabled?: never }\n  )\n\nexport { AvatarRootContext }\nexport type { TAvatarRootContext }\n\nexport const AvatarRootProvider = ({ children, name, size }: TAvatarProps) => {\n  const value = React.useMemo<TAvatarRootContext>(\n    () => ({ name, size }),\n    [name, size]\n  )\n\n  return (\n    <AvatarRootContext.Provider value={value}>\n      {children}\n    </AvatarRootContext.Provider>\n  )\n}\n\nconst DS_COLORS = [\n  'maroon',\n  'red',\n  'magenta',\n  'pink',\n  'purple',\n  'lapis',\n  'blue',\n  'cyan',\n  'teal',\n  'green',\n  'lime',\n  'yellow',\n  'orange'\n] as const\n\nconst getBackgroundColor = ({\n  emphasis,\n  name\n}: Pick<TAvatarProps, 'emphasis' | 'name'>) => {\n  if (emphasis === 'white' || !name) return 'white'\n  const index = name.toLocaleUpperCase().charCodeAt(0) % DS_COLORS.length\n  return `var(--color-${DS_COLORS[index]}-${emphasis === 'bold' ? 700 : 300})`\n}\n\nexport const AvatarRoot = ({\n  children,\n  size = 'lg',\n  name,\n  emphasis = 'white',\n  disabled = false,\n  onClick\n}: TAvatarProps) => {\n  const backgroundColor = getBackgroundColor({ emphasis, name })\n  return (\n    <AvatarRootProvider name={name} size={size}>\n      {onClick ? (\n        <StyledButton\n          size={size}\n          style={{\n            '--bg-color': backgroundColor\n          }}\n          disabled={disabled}\n          onClick={disabled ? undefined : onClick}\n          className={clsx(disabled ? 'cursor-auto' : 'cursor-pointer')}\n          emphasis={emphasis}\n        >\n          {children}\n        </StyledButton>\n      ) : (\n        <StyledDiv\n          size={size}\n          style={{\n            '--bg-color': backgroundColor\n          }}\n          emphasis={emphasis}\n        >\n          {children}\n        </StyledDiv>\n      )}\n    </AvatarRootProvider>\n  )\n}\n\nexport const Avatar = Object.assign(AvatarRoot, {\n  Image: AvatarImage,\n  Initial: AvatarInitial,\n  Placeholder: AvatarPlaceholder,\n  Icon: AvatarIcon\n})\n\nAvatarRoot.displayName = 'Avatar'\n"],"mappings":";;;;;;;;;AAYA,IAAM,mBAAmB;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,IAAM,YAAY,OAAO,OAAO;CAC9B,MAAM;CACN,UAAU;EACR,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,KAAK,CAAC,UAAU;GACjB;EACD,UAAU;GACR,MAAM,CAAC,YAAY,mBAAmB;GACtC,QAAQ,CAAC,WAAW;GACpB,OAAO,EAAE;GACV;EACF;CACF,CAAC;AAEF,IAAM,eAAe,OAAO,UAAU;CACpC,MAAM;EACJ,GAAG;EACH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,KAAK,CAAC,UAAU;GACjB;EACD,UAAU;GACR,MAAM,CAAC,YAAY,mBAAmB;GACtC,QAAQ,CAAC,WAAW;GACpB,OAAO,EAAE;GACV;EACF;CACF,CAAC;AAiBF,IAAa,sBAAsB,EAAE,UAAU,MAAM,WAAyB;CAC5E,MAAM,QAAQ,QAAM,eACX;EAAE;EAAM;EAAM,GACrB,CAAC,MAAM,KAAK,CACb;AAED,QACE,wBAAA,cAAC,kBAAkB,UAAnB,EAAmC,OAEN,EAD1B,SAC0B;;AAIjC,IAAM,YAAY;CAChB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,IAAM,sBAAsB,EAC1B,UACA,WAC6C;AAC7C,KAAI,aAAa,WAAW,CAAC,KAAM,QAAO;AAE1C,QAAO,eAAe,UADR,KAAK,mBAAmB,CAAC,WAAW,EAAE,GAAG,UAAU,QAC1B,GAAG,aAAa,SAAS,MAAM,IAAI;;AAG5E,IAAa,cAAc,EACzB,UACA,OAAO,MACP,MACA,WAAW,SACX,WAAW,OACX,cACkB;CAClB,MAAM,kBAAkB,mBAAmB;EAAE;EAAU;EAAM,CAAC;AAC9D,QACE,wBAAA,cAAC,oBAAD;EAA0B;EAAY;EAyBjB,EAxBlB,UACC,wBAAA,cAAC,cAAD;EACQ;EACN,OAAO,EACL,cAAc,iBACf;EACS;EACV,SAAS,WAAW,KAAA,IAAY;EAChC,WAAW,KAAK,WAAW,gBAAgB,iBAAiB;EAClD;EAGG,EADZ,SACY,GAEf,wBAAA,cAAC,WAAD;EACQ;EACN,OAAO,EACL,cAAc,iBACf;EACS;EAGA,EADT,SACS,CAEK;;AAIzB,IAAa,SAAS,OAAO,OAAO,YAAY;CAC9C,OAAO;CACP,SAAS;CACT,aAAa;CACb,MAAM;CACP,CAAC;AAEF,WAAW,cAAc"}
+{"version":3,"file":"Avatar.js","names":[],"sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { cn } from '~/styled'\n\nimport type { TAvatarRootContext } from './AvatarContext'\nimport { AvatarRootContext } from './AvatarContext'\nimport { AvatarIcon } from './AvatarIcon'\nimport { AvatarImage } from './AvatarImage'\nimport { AvatarInitial } from './AvatarInitial'\nimport { AvatarPlaceholder } from './AvatarPlaceholder'\n\nconst avatarRootStyles = [\n  'flex',\n  'justify-center',\n  'items-center',\n  'text-grey-800',\n  'rounded-full',\n  'border-2',\n  'border-grey-200',\n  'bg-(--bg-color)',\n  'overflow-hidden'\n]\n\nconst StyledDiv = styled('div', {\n  base: avatarRootStyles,\n  variants: {\n    size: {\n      xs: ['size-6'],\n      sm: ['size-8'],\n      md: ['size-10'],\n      lg: ['size-12'],\n      xl: ['size-16'],\n      xxl: ['size-24']\n    },\n    emphasis: {\n      bold: ['border-0', '[&>p]:text-white'],\n      subtle: ['border-0'],\n      white: []\n    }\n  }\n})\n\nconst StyledButton = styled('button', {\n  base: [\n    ...avatarRootStyles,\n    'not-disabled:active:bg-grey-200',\n    'not-disabled:active:border-primary-800',\n    'not-disabled:hover:bg-grey-100',\n    'not-disabled:hover:border-grey-800',\n    'not-disabled:focus-visible:outline-none',\n    'not-disabled:focus-visible:relative',\n    'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n    'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n    'not-disabled:focus-visible:z-1',\n    'disabled:cursor-not-allowed',\n    'disabled:opacity-30'\n  ],\n  variants: {\n    size: {\n      xs: ['size-6'],\n      sm: ['size-8'],\n      md: ['size-10'],\n      lg: ['size-12'],\n      xl: ['size-16'],\n      xxl: ['size-24']\n    },\n    emphasis: {\n      bold: ['border-0', '[&>p]:text-white'],\n      subtle: ['border-0'],\n      white: []\n    }\n  }\n})\n\ntype TAvatarProps = React.ComponentProps<\n  typeof StyledDiv | typeof StyledButton\n> & {\n  name?: string\n} & (\n    | {\n        onClick: React.MouseEventHandler<HTMLButtonElement>\n        disabled?: boolean\n      }\n    | { onClick?: never; disabled?: never }\n  )\n\nexport { AvatarRootContext }\nexport type { TAvatarRootContext }\n\nexport const AvatarRootProvider = ({ children, name, size }: TAvatarProps) => {\n  const value = React.useMemo<TAvatarRootContext>(\n    () => ({ name, size }),\n    [name, size]\n  )\n\n  return (\n    <AvatarRootContext.Provider value={value}>\n      {children}\n    </AvatarRootContext.Provider>\n  )\n}\n\nconst DS_COLORS = [\n  'maroon',\n  'red',\n  'magenta',\n  'pink',\n  'purple',\n  'lapis',\n  'blue',\n  'cyan',\n  'teal',\n  'green',\n  'lime',\n  'yellow',\n  'orange'\n] as const\n\nconst getBackgroundColor = ({\n  emphasis,\n  name\n}: Pick<TAvatarProps, 'emphasis' | 'name'>) => {\n  if (emphasis === 'white' || !name) return 'white'\n  const index = name.toLocaleUpperCase().charCodeAt(0) % DS_COLORS.length\n  return `var(--color-${DS_COLORS[index]}-${emphasis === 'bold' ? 700 : 300})`\n}\n\nexport const AvatarRoot = ({\n  children,\n  size = 'lg',\n  name,\n  emphasis = 'white',\n  disabled = false,\n  onClick\n}: TAvatarProps) => {\n  const backgroundColor = getBackgroundColor({ emphasis, name })\n  return (\n    <AvatarRootProvider name={name} size={size}>\n      {onClick ? (\n        <StyledButton\n          size={size}\n          style={{\n            '--bg-color': backgroundColor\n          }}\n          disabled={disabled}\n          onClick={disabled ? undefined : onClick}\n          className={cn(disabled ? 'cursor-auto' : 'cursor-pointer')}\n          emphasis={emphasis}\n        >\n          {children}\n        </StyledButton>\n      ) : (\n        <StyledDiv\n          size={size}\n          style={{\n            '--bg-color': backgroundColor\n          }}\n          emphasis={emphasis}\n        >\n          {children}\n        </StyledDiv>\n      )}\n    </AvatarRootProvider>\n  )\n}\n\nexport const Avatar = Object.assign(AvatarRoot, {\n  Image: AvatarImage,\n  Initial: AvatarInitial,\n  Placeholder: AvatarPlaceholder,\n  Icon: AvatarIcon\n})\n\nAvatarRoot.displayName = 'Avatar'\n"],"mappings":";;;;;;;;AAYA,IAAM,mBAAmB;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,IAAM,YAAY,OAAO,OAAO;CAC9B,MAAM;CACN,UAAU;EACR,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,KAAK,CAAC,UAAU;GACjB;EACD,UAAU;GACR,MAAM,CAAC,YAAY,mBAAmB;GACtC,QAAQ,CAAC,WAAW;GACpB,OAAO,EAAE;GACV;EACF;CACF,CAAC;AAEF,IAAM,eAAe,OAAO,UAAU;CACpC,MAAM;EACJ,GAAG;EACH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GACf,KAAK,CAAC,UAAU;GACjB;EACD,UAAU;GACR,MAAM,CAAC,YAAY,mBAAmB;GACtC,QAAQ,CAAC,WAAW;GACpB,OAAO,EAAE;GACV;EACF;CACF,CAAC;AAiBF,IAAa,sBAAsB,EAAE,UAAU,MAAM,WAAyB;CAC5E,MAAM,QAAQ,QAAM,eACX;EAAE;EAAM;EAAM,GACrB,CAAC,MAAM,KAAK,CACb;AAED,QACE,wBAAA,cAAC,kBAAkB,UAAnB,EAAmC,OAEN,EAD1B,SAC0B;;AAIjC,IAAM,YAAY;CAChB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,IAAM,sBAAsB,EAC1B,UACA,WAC6C;AAC7C,KAAI,aAAa,WAAW,CAAC,KAAM,QAAO;AAE1C,QAAO,eAAe,UADR,KAAK,mBAAmB,CAAC,WAAW,EAAE,GAAG,UAAU,QAC1B,GAAG,aAAa,SAAS,MAAM,IAAI;;AAG5E,IAAa,cAAc,EACzB,UACA,OAAO,MACP,MACA,WAAW,SACX,WAAW,OACX,cACkB;CAClB,MAAM,kBAAkB,mBAAmB;EAAE;EAAU;EAAM,CAAC;AAC9D,QACE,wBAAA,cAAC,oBAAD;EAA0B;EAAY;EAyBjB,EAxBlB,UACC,wBAAA,cAAC,cAAD;EACQ;EACN,OAAO,EACL,cAAc,iBACf;EACS;EACV,SAAS,WAAW,KAAA,IAAY;EAChC,WAAW,GAAG,WAAW,gBAAgB,iBAAiB;EAChD;EAGG,EADZ,SACY,GAEf,wBAAA,cAAC,WAAD;EACQ;EACN,OAAO,EACL,cAAc,iBACf;EACS;EAGA,EADT,SACS,CAEK;;AAIzB,IAAa,SAAS,OAAO,OAAO,YAAY;CAC9C,OAAO;CACP,SAAS;CACT,aAAa;CACb,MAAM;CACP,CAAC;AAEF,WAAW,cAAc"}

package/dist/components/banner/banner-regular/BannerRegular.d.ts

@@ -314,6 +314,7 @@ export declare const BannerRegular: {
             formTarget?: string | undefined | undefined;
             hasTooltip?: boolean | undefined;
             tooltipSide?: "bottom" | "left" | "right" | "top" | undefined;
+            reloadDocument?: boolean | undefined;
             isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
         }): React.JSX.Element;
         displayName: string;

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

@@ -1,6 +1,6 @@
+import { cn } from "../../../styled.js";
 import { useBannerContext } from "../BannerContext.js";
 import { BannerRegularButton } from "./BannerRegularButton.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 import invariant from "invariant";
 //#region src/components/banner/banner-regular/BannerRegularActions.tsx
@@ -25,7 +25,7 @@ var BannerRegularActions = ({ children, className, ...props }) => {
 	}, [size]);
 	invariant(React$1.Children.count(children) <= MAX_ALLOWED_CHILDREN, `A maximum of ${MAX_ALLOWED_CHILDREN} ${BannerRegularButton.displayName} component(s) are permitted as children of ${BannerRegularActions.displayName}`);
 	return /* @__PURE__ */ React$1.createElement("div", {
-		className: clsx("flex", gap, direction, className),
+		className: cn("flex", gap, direction, className),
 		...props
 	}, React$1.Children.map(children, (child, index) => {
 		if (child == null) return child;

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

@@ -1 +1 @@
-{"version":3,"file":"BannerRegularActions.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularActions.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { useBannerContext } from '../BannerContext'\nimport { BannerRegularButton } from './BannerRegularButton'\n\nconst MAX_ALLOWED_CHILDREN = 2\n\nconst toGap = {\n  sm: 'gap-2',\n  md: 'gap-4'\n}\n\nconst toDirection = {\n  sm: 'flex-col',\n  md: 'flex-row'\n}\n\nexport const BannerRegularActions = ({\n  children,\n  className,\n  ...props\n}: React.PropsWithChildren<React.ComponentProps<'div'>>) => {\n  const { size } = useBannerContext()\n\n  const gap = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toGap[size]\n    }\n    return 'gap-2 md:gap-4'\n  }, [size])\n\n  const direction = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toDirection[size]\n    }\n    return 'flex-col md:flex-row'\n  }, [size])\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    <div className={clsx('flex', gap, direction, className)} {...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    </div>\n  )\n}\n\nBannerRegularActions.displayName = 'BannerRegularActions'\n"],"mappings":";;;;;;AAOA,IAAM,uBAAuB;AAE7B,IAAM,QAAQ;CACZ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,cAAc;CAClB,IAAI;CACJ,IAAI;CACL;AAED,IAAa,wBAAwB,EACnC,UACA,WACA,GAAG,YACuD;CAC1D,MAAM,EAAE,SAAS,kBAAkB;CAEnC,MAAM,MAAM,QAAM,cAAc;AAC9B,MAAI,OAAO,SAAS,SAClB,QAAO,MAAM;AAEf,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,YAAY,QAAM,cAAc;AACpC,MAAI,OAAO,SAAS,SAClB,QAAO,YAAY;AAErB,SAAO;IACN,CAAC,KAAK,CAAC;AAEV,WACE,QAAM,SAAS,MAAM,SAAS,IAAI,sBAClC,gBAAgB,qBAAqB,GAAG,oBAAoB,YAAY,6CAA6C,qBAAqB,cAC3I;AAED,QACE,wBAAA,cAAC,OAAD;EAAK,WAAW,KAAK,QAAQ,KAAK,WAAW,UAAU;EAAE,GAAI;EA+BvD,EA9BH,QAAM,SAAS,IAAI,WAAW,OAAO,UAAU;AAG9C,MAAI,SAAS,KAAM,QAAO;AAE1B,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MACR,mBAAmB,qBAAqB,YAAY,yBACrD;AAGH,YACE,MAAM,SAAS,qBACf,oBAAoB,OAAO,KAAK,6BAA6B,oBAAoB,YAAY,2BAA2B,qBAAqB,cAC9I;EAED,MAAM,gBAEF,EAEF,YAAY,QAAQ,IAAI,YAAY,KAAA,GACrC;AAED,SAAO,QAAM,aACX,OAGA,cACD;GACD,CACE;;AAIV,qBAAqB,cAAc"}
+{"version":3,"file":"BannerRegularActions.js","names":[],"sources":["../../../../src/components/banner/banner-regular/BannerRegularActions.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { useBannerContext } from '../BannerContext'\nimport { BannerRegularButton } from './BannerRegularButton'\n\nconst MAX_ALLOWED_CHILDREN = 2\n\nconst toGap = {\n  sm: 'gap-2',\n  md: 'gap-4'\n}\n\nconst toDirection = {\n  sm: 'flex-col',\n  md: 'flex-row'\n}\n\nexport const BannerRegularActions = ({\n  children,\n  className,\n  ...props\n}: React.PropsWithChildren<React.ComponentProps<'div'>>) => {\n  const { size } = useBannerContext()\n\n  const gap = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toGap[size]\n    }\n    return 'gap-2 md:gap-4'\n  }, [size])\n\n  const direction = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toDirection[size]\n    }\n    return 'flex-col md:flex-row'\n  }, [size])\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    <div className={cn('flex', gap, direction, className)} {...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    </div>\n  )\n}\n\nBannerRegularActions.displayName = 'BannerRegularActions'\n"],"mappings":";;;;;;AAQA,IAAM,uBAAuB;AAE7B,IAAM,QAAQ;CACZ,IAAI;CACJ,IAAI;CACL;AAED,IAAM,cAAc;CAClB,IAAI;CACJ,IAAI;CACL;AAED,IAAa,wBAAwB,EACnC,UACA,WACA,GAAG,YACuD;CAC1D,MAAM,EAAE,SAAS,kBAAkB;CAEnC,MAAM,MAAM,QAAM,cAAc;AAC9B,MAAI,OAAO,SAAS,SAClB,QAAO,MAAM;AAEf,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,YAAY,QAAM,cAAc;AACpC,MAAI,OAAO,SAAS,SAClB,QAAO,YAAY;AAErB,SAAO;IACN,CAAC,KAAK,CAAC;AAEV,WACE,QAAM,SAAS,MAAM,SAAS,IAAI,sBAClC,gBAAgB,qBAAqB,GAAG,oBAAoB,YAAY,6CAA6C,qBAAqB,cAC3I;AAED,QACE,wBAAA,cAAC,OAAD;EAAK,WAAW,GAAG,QAAQ,KAAK,WAAW,UAAU;EAAE,GAAI;EA+BrD,EA9BH,QAAM,SAAS,IAAI,WAAW,OAAO,UAAU;AAG9C,MAAI,SAAS,KAAM,QAAO;AAE1B,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MACR,mBAAmB,qBAAqB,YAAY,yBACrD;AAGH,YACE,MAAM,SAAS,qBACf,oBAAoB,OAAO,KAAK,6BAA6B,oBAAoB,YAAY,2BAA2B,qBAAqB,cAC9I;EAED,MAAM,gBAEF,EAEF,YAAY,QAAQ,IAAI,YAAY,KAAA,GACrC;AAED,SAAO,QAAM,aACX,OAGA,cACD;GACD,CACE;;AAIV,qBAAqB,cAAc"}

package/dist/components/banner/banner-regular/BannerRegularDismiss.d.ts

@@ -8,9 +8,10 @@ declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
     isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../../..").NavigatorActions> & {
+}, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../../..").NavigatorActions> & {
     children: React.ReactNode;
     label: string;
+    reloadDocument?: boolean;
 } & Omit<import("../../..").TOptionalTooltipWrapperProps, "label"> & import("../../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
     as?: React.ElementType;
 }>;

package/dist/components/banner/banner-slim/BannerSlim.d.ts

@@ -302,6 +302,7 @@ export declare const BannerSlim: {
             formTarget?: string | undefined | undefined;
             hasTooltip?: boolean | undefined;
             tooltipSide?: "bottom" | "left" | "right" | "top" | undefined;
+            reloadDocument?: boolean | undefined;
             isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
             emphasis?: ("bold" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold">>) | undefined;
             containerSize?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;

package/dist/components/banner/banner-slim/BannerSlimButton.js

@@ -1,7 +1,7 @@
+import { cn } from "../../../styled.js";
 import { Button } from "../../button/Button.js";
 import { overrideStyledVariantValue } from "../../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";
 import { useBannerContext } from "../BannerContext.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 //#region src/components/banner/banner-slim/BannerSlimButton.tsx
 var BannerSlimButton = ({ className, ...props }) => {
@@ -12,7 +12,7 @@ var BannerSlimButton = ({ className, ...props }) => {
 		fullWidth,
 		theme: emphasis === "bold" ? "neutral" : "primary",
 		...props,
-		className: clsx("ml-auto", className)
+		className: cn("ml-auto", className)
 	});
 };
 BannerSlimButton.displayName = "BannerSlimButton";

package/dist/components/banner/banner-slim/BannerSlimButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerSlimButton.js","names":[],"sources":["../../../../src/components/banner/banner-slim/BannerSlimButton.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Button } from '../../button/Button'\nimport { useBannerContext } from '../BannerContext'\n\nexport const BannerSlimButton = ({\n  className,\n  ...props\n}: React.ComponentProps<typeof Button>) => {\n  const { emphasis, size } = useBannerContext()\n\n  const fullWidth = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => s === 'sm'),\n    [size]\n  )\n\n  return (\n    <Button\n      size=\"md\"\n      fullWidth={fullWidth}\n      theme={emphasis === 'bold' ? 'neutral' : 'primary'}\n      {...props}\n      className={clsx('ml-auto', className)}\n    />\n  )\n}\n\nBannerSlimButton.displayName = 'BannerSlimButton'\n"],"mappings":";;;;;;AAQA,IAAa,oBAAoB,EAC/B,WACA,GAAG,YACsC;CACzC,MAAM,EAAE,UAAU,SAAS,kBAAkB;CAE7C,MAAM,YAAY,QAAM,cAChB,2BAA2B,OAAO,MAAM,MAAM,KAAK,EACzD,CAAC,KAAK,CACP;AAED,QACE,wBAAA,cAAC,QAAD;EACE,MAAK;EACM;EACX,OAAO,aAAa,SAAS,YAAY;EACzC,GAAI;EACJ,WAAW,KAAK,WAAW,UAAU;EACrC,CAAA;;AAIN,iBAAiB,cAAc"}
+{"version":3,"file":"BannerSlimButton.js","names":[],"sources":["../../../../src/components/banner/banner-slim/BannerSlimButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '~/styled'\nimport { overrideStyledVariantValue } from '~/utilities/override-styled-variant-value/overrideStyledVariantValue'\n\nimport { Button } from '../../button/Button'\nimport { useBannerContext } from '../BannerContext'\n\nexport const BannerSlimButton = ({\n  className,\n  ...props\n}: React.ComponentProps<typeof Button>) => {\n  const { emphasis, size } = useBannerContext()\n\n  const fullWidth = React.useMemo(\n    () => overrideStyledVariantValue(size, (s) => s === 'sm'),\n    [size]\n  )\n\n  return (\n    <Button\n      size=\"md\"\n      fullWidth={fullWidth}\n      theme={emphasis === 'bold' ? 'neutral' : 'primary'}\n      {...props}\n      className={cn('ml-auto', className)}\n    />\n  )\n}\n\nBannerSlimButton.displayName = 'BannerSlimButton'\n"],"mappings":";;;;;;AAQA,IAAa,oBAAoB,EAC/B,WACA,GAAG,YACsC;CACzC,MAAM,EAAE,UAAU,SAAS,kBAAkB;CAE7C,MAAM,YAAY,QAAM,cAChB,2BAA2B,OAAO,MAAM,MAAM,KAAK,EACzD,CAAC,KAAK,CACP;AAED,QACE,wBAAA,cAAC,QAAD;EACE,MAAK;EACM;EACX,OAAO,aAAa,SAAS,YAAY;EACzC,GAAI;EACJ,WAAW,GAAG,WAAW,UAAU;EACnC,CAAA;;AAIN,iBAAiB,cAAc"}

package/dist/components/banner/banner-slim/BannerSlimContainer.js

@@ -1,7 +1,6 @@
-import { styled } from "../../../styled.js";
+import { cn, styled } from "../../../styled.js";
 import { useBannerContext } from "../BannerContext.js";
 import { BannerContainer } from "../BannerContainer.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 //#region src/components/banner/banner-slim/BannerSlimContainer.tsx
 var toDirection = {
@@ -40,7 +39,7 @@ var BannerSlimContainer = (props) => {
 	return /* @__PURE__ */ React$1.createElement(StyledBannerSlimContainer, {
 		...props,
 		sizeWorkaround: size,
-		className: clsx(direction, align, "gap-4", wrap, props.className)
+		className: cn(direction, align, "gap-4", wrap, props.className)
 	});
 };
 BannerSlimContainer.displayName = "BannerSlimContainer";

package/dist/components/banner/banner-slim/BannerSlimContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerSlimContainer.js","names":[],"sources":["../../../../src/components/banner/banner-slim/BannerSlimContainer.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { BannerContainer } from '../BannerContainer'\nimport { useBannerContext } from '../BannerContext'\n\nconst toDirection = {\n  sm: 'flex-col',\n  md: 'flex-row'\n}\n\nconst toAlign = {\n  sm: 'items-start',\n  md: 'items-center'\n}\n\nconst toWrap = {\n  sm: 'flex-wrap',\n  md: 'flex-nowrap'\n}\n\nconst StyledBannerSlimContainer = styled(\n  BannerContainer,\n  {\n    base: ['p-4'],\n    variants: {\n      sizeWorkaround: {\n        sm: [],\n        md: ['px-6']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\ntype TBannerSlimContainerProps = React.ComponentProps<\n  typeof StyledBannerSlimContainer\n>\n\nexport const BannerSlimContainer = (\n  props: TBannerSlimContainerProps\n): JSX.Element => {\n  const { size } = useBannerContext()\n\n  const direction = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toDirection[size]\n    }\n    return 'flex-col md:flex-row'\n  }, [size])\n\n  const align = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toAlign[size]\n    }\n    return 'items-start md:items-center'\n  }, [size])\n\n  const wrap = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toWrap[size]\n    }\n    return 'flex-wrap md:flex-nowrap'\n  }, [size])\n\n  return (\n    <StyledBannerSlimContainer\n      {...props}\n      sizeWorkaround={size}\n      className={clsx(direction, align, 'gap-4', wrap, props.className)}\n    />\n  )\n}\n\nBannerSlimContainer.displayName = 'BannerSlimContainer'\n"],"mappings":";;;;;;AAQA,IAAM,cAAc;CAClB,IAAI;CACJ,IAAI;CACL;AAED,IAAM,UAAU;CACd,IAAI;CACJ,IAAI;CACL;AAED,IAAM,SAAS;CACb,IAAI;CACJ,IAAI;CACL;AAED,IAAM,4BAA4B,OAChC,iBACA;CACE,MAAM,CAAC,MAAM;CACb,UAAU,EACR,gBAAgB;EACd,IAAI,EAAE;EACN,IAAI,CAAC,OAAO;EACb,EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAMD,IAAa,uBACX,UACgB;CAChB,MAAM,EAAE,SAAS,kBAAkB;CAEnC,MAAM,YAAY,QAAM,cAAc;AACpC,MAAI,OAAO,SAAS,SAClB,QAAO,YAAY;AAErB,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,QAAQ,QAAM,cAAc;AAChC,MAAI,OAAO,SAAS,SAClB,QAAO,QAAQ;AAEjB,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,OAAO,QAAM,cAAc;AAC/B,MAAI,OAAO,SAAS,SAClB,QAAO,OAAO;AAEhB,SAAO;IACN,CAAC,KAAK,CAAC;AAEV,QACE,wBAAA,cAAC,2BAAD;EACE,GAAI;EACJ,gBAAgB;EAChB,WAAW,KAAK,WAAW,OAAO,SAAS,MAAM,MAAM,UAAU;EACjE,CAAA;;AAIN,oBAAoB,cAAc"}
+{"version":3,"file":"BannerSlimContainer.js","names":[],"sources":["../../../../src/components/banner/banner-slim/BannerSlimContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, cn } from '~/styled'\n\nimport { BannerContainer } from '../BannerContainer'\nimport { useBannerContext } from '../BannerContext'\n\nconst toDirection = {\n  sm: 'flex-col',\n  md: 'flex-row'\n}\n\nconst toAlign = {\n  sm: 'items-start',\n  md: 'items-center'\n}\n\nconst toWrap = {\n  sm: 'flex-wrap',\n  md: 'flex-nowrap'\n}\n\nconst StyledBannerSlimContainer = styled(\n  BannerContainer,\n  {\n    base: ['p-4'],\n    variants: {\n      sizeWorkaround: {\n        sm: [],\n        md: ['px-6']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\ntype TBannerSlimContainerProps = React.ComponentProps<\n  typeof StyledBannerSlimContainer\n>\n\nexport const BannerSlimContainer = (\n  props: TBannerSlimContainerProps\n): JSX.Element => {\n  const { size } = useBannerContext()\n\n  const direction = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toDirection[size]\n    }\n    return 'flex-col md:flex-row'\n  }, [size])\n\n  const align = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toAlign[size]\n    }\n    return 'items-start md:items-center'\n  }, [size])\n\n  const wrap = React.useMemo(() => {\n    if (typeof size === 'string') {\n      return toWrap[size]\n    }\n    return 'flex-wrap md:flex-nowrap'\n  }, [size])\n\n  return (\n    <StyledBannerSlimContainer\n      {...props}\n      sizeWorkaround={size}\n      className={cn(direction, align, 'gap-4', wrap, props.className)}\n    />\n  )\n}\n\nBannerSlimContainer.displayName = 'BannerSlimContainer'\n"],"mappings":";;;;;AAOA,IAAM,cAAc;CAClB,IAAI;CACJ,IAAI;CACL;AAED,IAAM,UAAU;CACd,IAAI;CACJ,IAAI;CACL;AAED,IAAM,SAAS;CACb,IAAI;CACJ,IAAI;CACL;AAED,IAAM,4BAA4B,OAChC,iBACA;CACE,MAAM,CAAC,MAAM;CACb,UAAU,EACR,gBAAgB;EACd,IAAI,EAAE;EACN,IAAI,CAAC,OAAO;EACb,EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAMD,IAAa,uBACX,UACgB;CAChB,MAAM,EAAE,SAAS,kBAAkB;CAEnC,MAAM,YAAY,QAAM,cAAc;AACpC,MAAI,OAAO,SAAS,SAClB,QAAO,YAAY;AAErB,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,QAAQ,QAAM,cAAc;AAChC,MAAI,OAAO,SAAS,SAClB,QAAO,QAAQ;AAEjB,SAAO;IACN,CAAC,KAAK,CAAC;CAEV,MAAM,OAAO,QAAM,cAAc;AAC/B,MAAI,OAAO,SAAS,SAClB,QAAO,OAAO;AAEhB,SAAO;IACN,CAAC,KAAK,CAAC;AAEV,QACE,wBAAA,cAAC,2BAAD;EACE,GAAI;EACJ,gBAAgB;EAChB,WAAW,GAAG,WAAW,OAAO,SAAS,MAAM,MAAM,UAAU;EAC/D,CAAA;;AAIN,oBAAoB,cAAc"}

package/dist/components/banner/banner-slim/BannerSlimDismiss.d.ts

@@ -8,9 +8,10 @@ declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
     isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../../..").NavigatorActions> & {
+}, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../../..").NavigatorActions> & {
     children: React.ReactNode;
     label: string;
+    reloadDocument?: boolean;
 } & Omit<import("../../..").TOptionalTooltipWrapperProps, "label"> & import("../../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "containerSize"> & {
     emphasis?: ("bold" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold">>) | undefined;
     containerSize?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;

package/dist/components/button/Button.d.ts

@@ -16,6 +16,7 @@ type ButtonProps = Override<React.ComponentProps<typeof StyledButton>, {
     children: React.ReactNode;
     href?: string;
     isLoading?: boolean;
+    reloadDocument?: boolean;
 } & NavigatorActions>;
 export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLElement>>;
 export {};

package/dist/components/button/Button.js

@@ -1,5 +1,6 @@
 import { styled } from "../../styled.js";
 import { getExternalAnchorProps } from "../../utilities/uri/index.js";
+import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
 import { Loader } from "../loader/Loader.js";
 import * as React$1 from "react";
 //#region src/components/button/Button.tsx
@@ -144,19 +145,22 @@ var LoaderContentsWrapper = styled("span", {
 	defaultVariants: { size: "md" }
 }, { enabledResponsiveVariants: true });
 var WithLoader = ({ size, children }) => /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(Loader, { className: "absolute" }), /* @__PURE__ */ React$1.createElement(LoaderContentsWrapper, { size }, children));
-var Button = React$1.forwardRef(({ children, as, href, isLoading = false, onClick, disabled, ...rest }, ref) => /* @__PURE__ */ React$1.createElement(StyledButton, {
-	as: as || (href ? "a" : void 0),
-	...!disabled && !isLoading && {
-		href,
-		onClick
-	},
-	isLoading,
-	type: !href ? "button" : void 0,
-	disabled,
-	...rest,
-	...getExternalAnchorProps(href),
-	ref
-}, isLoading ? /* @__PURE__ */ React$1.createElement(WithLoader, { size: rest.size }, children) : children));
+var Button = React$1.forwardRef(({ children, as, href, isLoading = false, onClick, disabled, reloadDocument, ...rest }, ref) => {
+	const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
+	return /* @__PURE__ */ React$1.createElement(StyledButton, {
+		as: as || routerLinkProps.as || (href ? "a" : void 0),
+		...!disabled && !isLoading && {
+			href,
+			onClick
+		},
+		isLoading,
+		type: !href ? "button" : void 0,
+		disabled,
+		...rest,
+		...getExternalAnchorProps(href),
+		ref
+	}, isLoading ? /* @__PURE__ */ React$1.createElement(WithLoader, { size: rest.size }, children) : children);
+});
 Button.displayName = "Button";
 //#endregion
 export { Button, StyledButton };

package/dist/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Loader } from '~/components/loader/Loader'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nexport const StyledButton = styled(\n  'button',\n  {\n    base: [\n      'items-center',\n      'bg-[unset]',\n      'rounded-md',\n      'cursor-pointer',\n      'flex',\n      'font-body',\n      'font-semibold',\n      'justify-center',\n      'no-underline',\n      'transition-all',\n      'duration-100',\n      'ease-out',\n      'whitespace-nowrap',\n      'w-max',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30'\n    ],\n    variants: {\n      theme: {\n        primary: [\n          '[--base:var(--color-primary-800)]',\n          '[--interact:var(--color-primary-900)]',\n          '[--active:var(--color-primary-1000)]'\n        ],\n        secondary: [\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          '[--text:var(--color-grey-800)]'\n        ],\n        danger: [\n          '[--base:var(--color-danger)]',\n          '[--interact:var(--color-danger-mid)]',\n          '[--active:var(--color-danger-dark)]'\n        ],\n        neutral: [\n          '[--base:white]',\n          '[--interact:rgba(255,255,255,0.9)]',\n          '[--active:rgba(255,255,255,0.75)]',\n          '[--text:var(--color-primary-800)]'\n        ]\n      },\n      appearance: {\n        solid: [\n          'bg-(--base)',\n          'text-(--text,white)',\n          'disabled:opacity-30',\n          'disabled:cursor-not-allowed',\n          'not-disabled:hover:bg-(--interact)',\n          'not-disabled:hover:text-(--text,white)',\n          'not-disabled:focus:bg-(--interact)',\n          'not-disabled:focus:text-(--text,white)',\n          'not-disabled:active:bg-(--active)'\n        ],\n        outline: [\n          'border',\n          'border-current',\n          'text-(--base)',\n          'disabled:opacity-30',\n          'disabled:cursor-not-allowed',\n          'not-disabled:hover:no-underline',\n          'not-disabled:hover:text-(--interact)',\n          'not-disabled:focus:no-underline',\n          'not-disabled:focus:text-(--interact)',\n          'not-disabled:active:text-(--active)'\n        ]\n      },\n      size: {\n        sm: [\n          'text-sm',\n          'leading-[1.53]',\n          'h-8',\n          'px-4',\n          'gap-2',\n          '[&_svg]:size-4'\n        ],\n        md: [\n          'text-md',\n          'leading-normal',\n          'h-10',\n          'px-8',\n          'gap-3',\n          '[&_svg]:size-5'\n        ],\n        lg: [\n          'text-lg',\n          'leading-normal',\n          'h-12',\n          'px-8',\n          'gap-3',\n          '[&_svg]:size-[22px]'\n        ],\n        xl: [\n          'text-lg',\n          'leading-normal',\n          'h-16',\n          'px-8',\n          'gap-3',\n          '[&_svg]:size-[22px]'\n        ]\n      },\n      isLoading: {\n        true: ['cursor-not-allowed opacity-60 pointer-events-none']\n      },\n      fullWidth: {\n        true: ['w-full'],\n        false: ['w-max']\n      }\n    },\n    defaultVariants: {\n      appearance: 'solid',\n      size: 'md',\n      theme: 'primary'\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst LoaderContentsWrapper = styled(\n  'span',\n  {\n    base: ['items-center', 'flex', 'justify-center', 'invisible'],\n    variants: {\n      size: {\n        sm: ['gap-2'],\n        md: ['gap-3'],\n        lg: ['gap-3'],\n        xl: ['gap-3']\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst WithLoader = ({\n  size,\n  children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n  <>\n    <Loader className=\"absolute\" />\n    <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n  </>\n)\n\ntype ButtonProps = Override<\n  React.ComponentProps<typeof StyledButton>,\n  {\n    children: React.ReactNode\n    href?: string\n    isLoading?: boolean\n  } & NavigatorActions\n>\n\nexport const Button = React.forwardRef<HTMLElement, ButtonProps>(\n  (\n    { children, as, href, isLoading = false, onClick, disabled, ...rest },\n    ref\n  ) => (\n    <StyledButton\n      as={as || (href ? 'a' : undefined)}\n      {...(!disabled && !isLoading && { href, onClick })}\n      isLoading={isLoading}\n      type={!href ? 'button' : undefined}\n      disabled={disabled}\n      {...rest}\n      {...getExternalAnchorProps(href)}\n      ref={ref as any}\n    >\n      {isLoading ? (\n        <WithLoader size={rest.size}>{children}</WithLoader>\n      ) : (\n        children\n      )}\n    </StyledButton>\n  )\n)\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;AAQA,IAAa,eAAe,OAC1B,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACD;GACD,WAAW;IACT;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,WAAW,EACT,MAAM,CAAC,oDAAoD,EAC5D;EACD,WAAW;GACT,MAAM,CAAC,SAAS;GAChB,OAAO,CAAC,QAAQ;GACjB;EACF;CACD,iBAAiB;EACf,YAAY;EACZ,MAAM;EACN,OAAO;EACR;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,wBAAwB,OAC5B,QACA;CACE,MAAM;EAAC;EAAgB;EAAQ;EAAkB;EAAY;CAC7D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACd,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,cAAc,EAClB,MACA,eAEA,wBAAA,cAAA,QAAA,UAAA,MACE,wBAAA,cAAC,QAAD,EAAQ,WAAU,YAAa,CAAA,EAC/B,wBAAA,cAAC,uBAAD,EAA6B,MAAwC,EAAjC,SAAiC,CACpE;AAYL,IAAa,SAAS,QAAM,YAExB,EAAE,UAAU,IAAI,MAAM,YAAY,OAAO,SAAS,UAAU,GAAG,QAC/D,QAEA,wBAAA,cAAC,cAAD;CACE,IAAI,OAAO,OAAO,MAAM,KAAA;CACxB,GAAK,CAAC,YAAY,CAAC,aAAa;EAAE;EAAM;EAAS;CACtC;CACX,MAAM,CAAC,OAAO,WAAW,KAAA;CACf;CACV,GAAI;CACJ,GAAI,uBAAuB,KAAK;CAC3B;CAOQ,EALZ,YACC,wBAAA,cAAC,YAAD,EAAY,MAAM,KAAK,MAA6B,EAAtB,SAAsB,GAEpD,SAEW,CAElB;AAED,OAAO,cAAc"}
+{"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Loader } from '~/components/loader/Loader'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\n\nexport const StyledButton = styled(\n  'button',\n  {\n    base: [\n      'items-center',\n      'bg-[unset]',\n      'rounded-md',\n      'cursor-pointer',\n      'flex',\n      'font-body',\n      'font-semibold',\n      'justify-center',\n      'no-underline',\n      'transition-all',\n      'duration-100',\n      'ease-out',\n      'whitespace-nowrap',\n      'w-max',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30'\n    ],\n    variants: {\n      theme: {\n        primary: [\n          '[--base:var(--color-primary-800)]',\n          '[--interact:var(--color-primary-900)]',\n          '[--active:var(--color-primary-1000)]'\n        ],\n        secondary: [\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          '[--text:var(--color-grey-800)]'\n        ],\n        danger: [\n          '[--base:var(--color-danger)]',\n          '[--interact:var(--color-danger-mid)]',\n          '[--active:var(--color-danger-dark)]'\n        ],\n        neutral: [\n          '[--base:white]',\n          '[--interact:rgba(255,255,255,0.9)]',\n          '[--active:rgba(255,255,255,0.75)]',\n          '[--text:var(--color-primary-800)]'\n        ]\n      },\n      appearance: {\n        solid: [\n          'bg-(--base)',\n          'text-(--text,white)',\n          'disabled:opacity-30',\n          'disabled:cursor-not-allowed',\n          'not-disabled:hover:bg-(--interact)',\n          'not-disabled:hover:text-(--text,white)',\n          'not-disabled:focus:bg-(--interact)',\n          'not-disabled:focus:text-(--text,white)',\n          'not-disabled:active:bg-(--active)'\n        ],\n        outline: [\n          'border',\n          'border-current',\n          'text-(--base)',\n          'disabled:opacity-30',\n          'disabled:cursor-not-allowed',\n          'not-disabled:hover:no-underline',\n          'not-disabled:hover:text-(--interact)',\n          'not-disabled:focus:no-underline',\n          'not-disabled:focus:text-(--interact)',\n          'not-disabled:active:text-(--active)'\n        ]\n      },\n      size: {\n        sm: [\n          'text-sm',\n          'leading-[1.53]',\n          'h-8',\n          'px-4',\n          'gap-2',\n          '[&_svg]:size-4'\n        ],\n        md: [\n          'text-md',\n          'leading-normal',\n          'h-10',\n          'px-8',\n          'gap-3',\n          '[&_svg]:size-5'\n        ],\n        lg: [\n          'text-lg',\n          'leading-normal',\n          'h-12',\n          'px-8',\n          'gap-3',\n          '[&_svg]:size-[22px]'\n        ],\n        xl: [\n          'text-lg',\n          'leading-normal',\n          'h-16',\n          'px-8',\n          'gap-3',\n          '[&_svg]:size-[22px]'\n        ]\n      },\n      isLoading: {\n        true: ['cursor-not-allowed opacity-60 pointer-events-none']\n      },\n      fullWidth: {\n        true: ['w-full'],\n        false: ['w-max']\n      }\n    },\n    defaultVariants: {\n      appearance: 'solid',\n      size: 'md',\n      theme: 'primary'\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst LoaderContentsWrapper = styled(\n  'span',\n  {\n    base: ['items-center', 'flex', 'justify-center', 'invisible'],\n    variants: {\n      size: {\n        sm: ['gap-2'],\n        md: ['gap-3'],\n        lg: ['gap-3'],\n        xl: ['gap-3']\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst WithLoader = ({\n  size,\n  children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n  <>\n    <Loader className=\"absolute\" />\n    <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n  </>\n)\n\ntype ButtonProps = Override<\n  React.ComponentProps<typeof StyledButton>,\n  {\n    children: React.ReactNode\n    href?: string\n    isLoading?: boolean\n    reloadDocument?: boolean\n  } & NavigatorActions\n>\n\nexport const Button = React.forwardRef<HTMLElement, ButtonProps>(\n  (\n    {\n      children,\n      as,\n      href,\n      isLoading = false,\n      onClick,\n      disabled,\n      reloadDocument,\n      ...rest\n    },\n    ref\n  ) => {\n    const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n\n    return (\n      <StyledButton\n        as={as || routerLinkProps.as || (href ? 'a' : undefined)}\n        {...(!disabled && !isLoading && { href, onClick })}\n        isLoading={isLoading}\n        type={!href ? 'button' : undefined}\n        disabled={disabled}\n        {...rest}\n        {...getExternalAnchorProps(href)}\n        ref={ref as any}\n      >\n        {isLoading ? (\n          <WithLoader size={rest.size}>{children}</WithLoader>\n        ) : (\n          children\n        )}\n      </StyledButton>\n    )\n  }\n)\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;;AAUA,IAAa,eAAe,OAC1B,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACD;GACD,WAAW;IACT;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,WAAW,EACT,MAAM,CAAC,oDAAoD,EAC5D;EACD,WAAW;GACT,MAAM,CAAC,SAAS;GAChB,OAAO,CAAC,QAAQ;GACjB;EACF;CACD,iBAAiB;EACf,YAAY;EACZ,MAAM;EACN,OAAO;EACR;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,wBAAwB,OAC5B,QACA;CACE,MAAM;EAAC;EAAgB;EAAQ;EAAkB;EAAY;CAC7D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACd,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,cAAc,EAClB,MACA,eAEA,wBAAA,cAAA,QAAA,UAAA,MACE,wBAAA,cAAC,QAAD,EAAQ,WAAU,YAAa,CAAA,EAC/B,wBAAA,cAAC,uBAAD,EAA6B,MAAwC,EAAjC,SAAiC,CACpE;AAaL,IAAa,SAAS,QAAM,YAExB,EACE,UACA,IACA,MACA,YAAY,OACZ,SACA,UACA,gBACA,GAAG,QAEL,QACG;CACH,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;AAEpE,QACE,wBAAA,cAAC,cAAD;EACE,IAAI,MAAM,gBAAgB,OAAO,OAAO,MAAM,KAAA;EAC9C,GAAK,CAAC,YAAY,CAAC,aAAa;GAAE;GAAM;GAAS;EACtC;EACX,MAAM,CAAC,OAAO,WAAW,KAAA;EACf;EACV,GAAI;EACJ,GAAI,uBAAuB,KAAK;EAC3B;EAOQ,EALZ,YACC,wBAAA,cAAC,YAAD,EAAY,MAAM,KAAK,MAA6B,EAAtB,SAAsB,GAEpD,SAEW;EAGpB;AAED,OAAO,cAAc"}

package/dist/components/calendar/Calendar.js

@@ -1,11 +1,10 @@
-import { styled } from "../../styled.js";
+import { cn, styled } from "../../styled.js";
 import { Icon } from "../icon/Icon.js";
 import { ActionIcon } from "../action-icon/ActionIcon.js";
 import { Button } from "../button/Button.js";
 import { Text } from "../text/Text.js";
 import { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from "./constants.js";
 import { Day } from "./Day.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 import { ChevronLeft, ChevronRight } from "@atom-learning/icons";
 import { useDayzed } from "dayzed";
@@ -53,7 +52,7 @@ var Calendar = ({ className, refDateSelected, refDateToday, firstDayOfWeek = 0,
 		...remainingProps
 	});
 	if (!calendars.length) return null;
-	return /* @__PURE__ */ React$1.createElement("div", { className: clsx("relative", "w-fit", "-mt-1", className) }, /* @__PURE__ */ React$1.createElement("div", { className: "absolute top-0 -right-1 flex" }, /* @__PURE__ */ React$1.createElement(ActionIcon, {
+	return /* @__PURE__ */ React$1.createElement("div", { className: cn("relative", "w-fit", "-mt-1", className) }, /* @__PURE__ */ React$1.createElement("div", { className: "absolute top-0 -right-1 flex" }, /* @__PURE__ */ React$1.createElement(ActionIcon, {
 		label: labels[showYears ? "previousYear" : "previous"],
 		theme: "neutral",
 		size: "md",

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

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","names":[],"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/ActionIcon'\nimport { Button } from '~/components/button/Button'\nimport { Icon } from '~/components/icon/Icon'\nimport { Text } from '~/components/text/Text'\nimport { styled } from '~/styled'\n\nimport { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from './constants'\nimport { Day } from './Day'\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-fit', '-mt-1', className)}>\n      <div className=\"absolute top-0 -right-1 flex\">\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      </div>\n      {showYears && (\n        <div className=\"grid grid-cols-4 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        </div>\n      )}\n      {!showYears &&\n        calendars.map(({ month, year, weeks }) => (\n          <div key={`${month}${year}`}>\n            <div className=\"mb-4 flex 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            </div>\n            <div className=\"mb-3 grid grid-cols-7 gap-x-2 gap-y-1\">\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            </div>\n            <div className=\"grid grid-cols-7 gap-x-2 gap-y-1\">\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            </div>\n          </div>\n        ))}\n    </div>\n  )\n}\n\nCalendar.displayName = 'Calendar'\n"],"mappings":"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"}
+{"version":3,"file":"Calendar.js","names":[],"sources":["../../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport { useDayzed } from 'dayzed'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon/ActionIcon'\nimport { Button } from '~/components/button/Button'\nimport { Icon } from '~/components/icon/Icon'\nimport { Text } from '~/components/text/Text'\nimport { styled } from '~/styled'\nimport { cn } from '~/styled'\n\nimport { DEFAULT_LABELS, monthNamesShort, weekdayNamesShort } from './constants'\nimport { Day } from './Day'\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={cn('relative', 'w-fit', '-mt-1', className)}>\n      <div className=\"absolute top-0 -right-1 flex\">\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      </div>\n      {showYears && (\n        <div className=\"grid grid-cols-4 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        </div>\n      )}\n      {!showYears &&\n        calendars.map(({ month, year, weeks }) => (\n          <div key={`${month}${year}`}>\n            <div className=\"mb-4 flex 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            </div>\n            <div className=\"mb-3 grid grid-cols-7 gap-x-2 gap-y-1\">\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            </div>\n            <div className=\"grid grid-cols-7 gap-x-2 gap-y-1\">\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            </div>\n          </div>\n        ))}\n    </div>\n  )\n}\n\nCalendar.displayName = 'Calendar'\n"],"mappings":"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"}

package/dist/components/carousel/CarouselSlider.js

@@ -1,10 +1,10 @@
-import clsx from "clsx";
+import { cn } from "../../styled.js";
 import * as React$1 from "react";
 import { Slider } from "pure-react-carousel";
 //#region src/components/carousel/CarouselSlider.tsx
 var CarouselSlider = ({ children, className, overflow, ...rest }) => /* @__PURE__ */ React$1.createElement(Slider, {
 	...rest,
-	className: clsx(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)]`, overflow && "overflow-visible", className)
+	className: cn(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)]`, overflow && "overflow-visible", className)
 }, children);
 //#endregion
 export { CarouselSlider };

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

@@ -1 +1 @@
-{"version":3,"file":"CarouselSlider.js","names":[],"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  typeof BaseSlider & {\n    tabIndex?: number\n    className?: string\n    overflow?: boolean\n  }\n>) => (\n  <BaseSlider\n    {...rest}\n    className={clsx(\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      overflow && 'overflow-visible',\n      className\n    )}\n  >\n    {children}\n  </BaseSlider>\n)\n"],"mappings":";;;;AAIA,IAAa,kBAAkB,EAC7B,UACA,WACA,UACA,GAAG,WAQH,wBAAA,cAAC,QAAD;CACE,GAAI;CACJ,WAAW,KACT,OAAO,GAAG,qVACV,YAAY,oBACZ,UACD;CAGU,EADV,SACU"}
+{"version":3,"file":"CarouselSlider.js","names":[],"sources":["../../../src/components/carousel/CarouselSlider.tsx"],"sourcesContent":["import { Slider as BaseSlider } from 'pure-react-carousel'\nimport * as React from 'react'\n\nimport { cn } from '~/styled'\n\nexport const CarouselSlider = ({\n  children,\n  className,\n  overflow,\n  ...rest\n}: React.PropsWithChildren<\n  typeof BaseSlider & {\n    tabIndex?: number\n    className?: string\n    overflow?: boolean\n  }\n>) => (\n  <BaseSlider\n    {...rest}\n    className={cn(\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      overflow && 'overflow-visible',\n      className\n    )}\n  >\n    {children}\n  </BaseSlider>\n)\n"],"mappings":";;;;AAKA,IAAa,kBAAkB,EAC7B,UACA,WACA,UACA,GAAG,WAQH,wBAAA,cAAC,QAAD;CACE,GAAI;CACJ,WAAW,GACT,OAAO,GAAG,qVACV,YAAY,oBACZ,UACD;CAGU,EADV,SACU"}

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

@@ -1,8 +1,8 @@
+import { cn } from "../../styled.js";
 import { Label } from "../label/Label.js";
 import { AsyncDataState } from "./DataTable.types.js";
 import { useDataTable } from "./DataTableContext.js";
 import { SearchInput } from "../search-input/SearchInput.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 import { debounce } from "throttle-debounce";
 //#region src/components/data-table/DataTableGlobalFilter.tsx
@@ -18,7 +18,7 @@ var DataTableGlobalFilter = ({ onChange, label, hideLabel = false, ...props }) =
 	});
 	return /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(Label, {
 		htmlFor: label,
-		className: clsx("mb-3", hideLabel && "sr-only")
+		className: cn("mb-3", hideLabel && "sr-only")
 	}, label), /* @__PURE__ */ React$1.createElement(SearchInput, {
 		...props,
 		defaultValue: globalFilter,

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableGlobalFilter.js","names":[],"sources":["../../../src/components/data-table/DataTableGlobalFilter.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\nimport { debounce } from 'throttle-debounce'\n\nimport { Label } from '../label/Label'\nimport { SearchInput } from '../search-input/SearchInput'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableSearchProps = React.ComponentProps<typeof SearchInput> & {\n  label: string\n  hideLabel?: boolean\n}\nexport const DataTableGlobalFilter = ({\n  onChange,\n  label,\n  hideLabel = false,\n  ...props\n}: DataTableSearchProps) => {\n  const {\n    setGlobalFilter,\n    getState,\n    resetPagination,\n    getTotalRows,\n    asyncDataState\n  } = useDataTable()\n  const { globalFilter } = getState()\n\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  if (isEmpty) return null\n\n  const handleChange = debounce(250, (event) => {\n    const {\n      target: { value }\n    } = event\n\n    onChange?.(event)\n    resetPagination()\n    setGlobalFilter(value)\n  })\n\n  return (\n    <>\n      <Label htmlFor={label} className={clsx('mb-3', hideLabel && 'sr-only')}>\n        {label}\n      </Label>\n      <SearchInput\n        {...props}\n        defaultValue={globalFilter}\n        onChange={handleChange}\n        name={label}\n      />\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAaA,IAAa,yBAAyB,EACpC,UACA,OACA,YAAY,OACZ,GAAG,YACuB;CAC1B,MAAM,EACJ,iBACA,UACA,iBACA,cACA,mBACE,cAAc;CAClB,MAAM,EAAE,iBAAiB,UAAU;AAKnC,KAFgB,EADE,mBAAmB,eAAe,YACtB,cAAc,KAAK,EAEpC,QAAO;CAEpB,MAAM,eAAe,SAAS,MAAM,UAAU;EAC5C,MAAM,EACJ,QAAQ,EAAE,YACR;AAEJ,aAAW,MAAM;AACjB,mBAAiB;AACjB,kBAAgB,MAAM;GACtB;AAEF,QACE,wBAAA,cAAA,QAAA,UAAA,MACE,wBAAA,cAAC,OAAD;EAAO,SAAS;EAAO,WAAW,KAAK,QAAQ,aAAa,UAAU;EAE9D,EADL,MACK,EACR,wBAAA,cAAC,aAAD;EACE,GAAI;EACJ,cAAc;EACd,UAAU;EACV,MAAM;EACN,CAAA,CACD"}
+{"version":3,"file":"DataTableGlobalFilter.js","names":[],"sources":["../../../src/components/data-table/DataTableGlobalFilter.tsx"],"sourcesContent":["import * as React from 'react'\nimport { debounce } from 'throttle-debounce'\n\nimport { cn } from '~/styled'\n\nimport { Label } from '../label/Label'\nimport { SearchInput } from '../search-input/SearchInput'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableSearchProps = React.ComponentProps<typeof SearchInput> & {\n  label: string\n  hideLabel?: boolean\n}\nexport const DataTableGlobalFilter = ({\n  onChange,\n  label,\n  hideLabel = false,\n  ...props\n}: DataTableSearchProps) => {\n  const {\n    setGlobalFilter,\n    getState,\n    resetPagination,\n    getTotalRows,\n    asyncDataState\n  } = useDataTable()\n  const { globalFilter } = getState()\n\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  if (isEmpty) return null\n\n  const handleChange = debounce(250, (event) => {\n    const {\n      target: { value }\n    } = event\n\n    onChange?.(event)\n    resetPagination()\n    setGlobalFilter(value)\n  })\n\n  return (\n    <>\n      <Label htmlFor={label} className={cn('mb-3', hideLabel && 'sr-only')}>\n        {label}\n      </Label>\n      <SearchInput\n        {...props}\n        defaultValue={globalFilter}\n        onChange={handleChange}\n        name={label}\n      />\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAcA,IAAa,yBAAyB,EACpC,UACA,OACA,YAAY,OACZ,GAAG,YACuB;CAC1B,MAAM,EACJ,iBACA,UACA,iBACA,cACA,mBACE,cAAc;CAClB,MAAM,EAAE,iBAAiB,UAAU;AAKnC,KAFgB,EADE,mBAAmB,eAAe,YACtB,cAAc,KAAK,EAEpC,QAAO;CAEpB,MAAM,eAAe,SAAS,MAAM,UAAU;EAC5C,MAAM,EACJ,QAAQ,EAAE,YACR;AAEJ,aAAW,MAAM;AACjB,mBAAiB;AACjB,kBAAgB,MAAM;GACtB;AAEF,QACE,wBAAA,cAAA,QAAA,UAAA,MACE,wBAAA,cAAC,OAAD;EAAO,SAAS;EAAO,WAAW,GAAG,QAAQ,aAAa,UAAU;EAE5D,EADL,MACK,EACR,wBAAA,cAAC,aAAD;EACE,GAAI;EACJ,cAAc;EACd,UAAU;EACV,MAAM;EACN,CAAA,CACD"}

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

@@ -1,8 +1,8 @@
+import { cn } from "../../styled.js";
 import { Table } from "../table/Table.js";
 import { useDataTable } from "./DataTableContext.js";
 import { DataTableHeaderCell } from "./DataTableHeaderCell.js";
 import { DataTableSelectAllRowsCheckbox } from "./DataTableSelectAllRowsCheckbox.js";
-import clsx from "clsx";
 import * as React$1 from "react";
 //#region src/components/data-table/DataTableHead.tsx
 var DataTableHead = ({ sortable = true, theme = "light", isSticky = false, stickyOffset = 0, showTotalInFirstColumn, totalSuffix, style, className, ...props }) => {
@@ -49,12 +49,12 @@ var DataTableHead = ({ sortable = true, theme = "light", isSticky = false, stick
 			"--header-offset": `${headerOffset}px`
 		},
 		...props,
-		className: clsx("relative", "z-3", "[&_tr:not(:last-child)>th]:border-b-none", "[&_tr:not(:first-child)>th]:rounded-none!", className)
+		className: cn("relative", "z-3", "[&_tr:not(:last-child)>th]:border-b-none", "[&_tr:not(:first-child)>th]:rounded-none!", className)
 	}, getHeaderGroups().map((headerGroup) => {
 		return /* @__PURE__ */ React$1.createElement(Table.Row, {
 			key: headerGroup.id,
 			ref: tableHeaderRowRef,
-			className: isSticky && headerOffset !== 0 ? clsx("translate-y-(--header-offset)", headerHide ? "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
+			className: isSticky && headerOffset !== 0 ? cn("translate-y-(--header-offset)", headerHide ? "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
 		}, getCanSomeRowsExpand() && /* @__PURE__ */ React$1.createElement(Table.HeaderCell, { className: "w-10" }), enableRowSelection && /* @__PURE__ */ React$1.createElement(Table.HeaderCell, { className: "w-10" }, /* @__PURE__ */ React$1.createElement(DataTableSelectAllRowsCheckbox, null)), headerGroup.headers.map((header, index) => /* @__PURE__ */ React$1.createElement(DataTableHeaderCell, {
 			header,
 			key: header.id,