@bi-digital/react 0.11.2 → 0.11.4

package/dist/{alert-footer-CIn6xe4F.d.mts → alert-footer-D3W7nNsf.d.mts}

@@ -143,7 +143,8 @@ type ButtonProps = MergeRight<DefaultProps & ButtonHTMLAttributes<HTMLButtonElem
    */
   icon?: boolean; /** Set an icon before the button label, no effect if `icon=true` */
   startIcon?: ReactNode; /** Set an icon after the button label, no effect if `icon=true` */
-  endIcon?: ReactNode; /** Make the button active by showing an active state. */
+  endIcon?: ReactNode; /** Skew the button, only works when there's a start or end icon in the same direction. */
+  skewed?: 'start' | 'end'; /** Make the button active by showing an active state. */
   active?: boolean;
   ref?: Ref<HTMLButtonElement>;
   /**
@@ -169,6 +170,7 @@ declare const Button: ({
   className,
   startIcon,
   endIcon,
+  skewed,
   active,
   ref,
   ...props
@@ -668,11 +670,12 @@ declare const DialogTrigger: ({
 type DialogCloseButtonProps = Omit<ButtonProps, 'asChild' | 'type' | 'name'>;
 /**
  * A button that can be used to close the dialog. Must be used inside a `Dialog` that is wrapped in a `DialogTriggerContext`.
- * If placed as the first direct child of the `Dialog`, it will be placed in the top right corner of the dialog, otherwise it will be placed where it is rendered.
+ * When placed as a direct child of `Dialog`, it will be positioned absolutely in the top right corner.
  */
 declare const DialogCloseButton: ({
   children,
   ref,
+  className,
   ...props
 }: DialogCloseButtonProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
@@ -1626,4 +1629,4 @@ declare const AlertFooter: ({
 }: AlertFooterProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { FilterGroup as $, Input as $t, SelectOptgroupProps as A, DialogCloseButtonProps as At, PaginationButtonProps as B, DialogProps as Bt, Spinner as C, Dropdown as Ct, Selectfield as D, Popover as Dt, SkipLinkProps as E, PopoverTriggerProps as Et, Search as F, DialogHeader as Ft, Navbar as G, Details as Gt, PaginationProps as H, DetailsSummaryProps as Ht, SearchProps as I, DialogHeaderProps as It, LogoProps as J, ChipProps as Jt, NavbarProps as K, DetailsProps as Kt, Radio as L, DialogContent as Lt, SelectOptionProps as M, DialogTriggerProps as Mt, Select as N, DialogFooter as Nt, SelectfieldProps as O, PopoverProps as Ot, SelectProps as P, DialogFooterProps as Pt, FooterProps as Q, CheckboxProps as Qt, RadioProps as R, DialogContentProps as Rt, SwitchProps as S, AlertProps as Sn, DropdownButtonProps as St, SkipLink as T, PopoverTrigger as Tt, SubNavbar as U, DetailsContent as Ut, Pagination as V, DetailsSummary as Vt, SubNavbarProps as W, DetailsContentProps as Wt, LinkProps as X, CheckboxSubsectionProps as Xt, Link as Y, CheckboxSubsection as Yt, Footer as Z, Checkbox as Zt, Context as _, Badge as _n, DropdownTriggerContext as _t, ValidationMessage as a, CardHeader as an, FieldsetDescription as at, TabsProps as b, AvatarProps as bn, DropdownTriggerProps as bt, TextfieldProps as c, CardContentProps as cn, FieldsetProps as ct, TabsPanel as d, CardActions as dn, FieldAffixes as dt, InputProps as en, FilterGroupProps as et, TabsPanelProps as f, CardActionsProps as fn, FieldAffixesProps as ft, TabProps as g, ButtonProps as gn, FieldProps as gt, Tab as h, Button as hn, Field as ht, usePagination as i, CardMediaProps as in, LabelProps as it, SelectOption as j, DialogTrigger as jt, SelectOptgroup as k, DialogCloseButton as kt, Textarea as l, CardAction as ln, FieldAffix as lt, TabsListProps as m, CardProps as mn, FieldDescriptionProps as mt, AlertFooterProps as n, CardDateProps as nn, FieldsetLegendProps as nt, ValidationMessageProps as o, CardHeaderProps as on, FieldsetDescriptionProps as ot, TabsList as p, Card as pn, FieldDescription as pt, Logo as q, Chip as qt, UsePaginationProps as r, CardMedia as rn, Label as rt, Textfield as s, CardContent as sn, Fieldset as st, AlertFooter as t, CardDate as tn, FieldsetLegend as tt, TextareaProps as u, CardActionProps as un, FieldAffixProps as ut, Tabs as v, BadgeProps as vn, DropdownTriggerContextProps as vt, SpinnerProps as w, DropdownProps as wt, Switch as x, Alert as xn, DropdownButton as xt, TabsContext as y, Avatar as yn, DropdownTrigger as yt, PaginationButton as z, Dialog as zt };
-//# sourceMappingURL=alert-footer-CIn6xe4F.d.mts.map
+//# sourceMappingURL=alert-footer-D3W7nNsf.d.mts.map

package/dist/components/alert/alert-footer.d.mts

@@ -1,2 +1,2 @@
-import { n as AlertFooterProps, t as AlertFooter } from "../../alert-footer-CIn6xe4F.mjs";
+import { n as AlertFooterProps, t as AlertFooter } from "../../alert-footer-D3W7nNsf.mjs";
 export { AlertFooter, AlertFooterProps };

package/dist/components/alert/alert-footer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alert-footer.mjs","names":[],"sources":["../../../src/components/alert/alert-footer.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\n\nexport type AlertFooterProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const AlertFooter = ({ className, children, asChild, ref, ...rest }: AlertFooterProps) => {\n  const Component = asChild ? Slot : 'div';\n  return (\n    <Component className={clsx('bi-alert--footer', className)} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAiBA,MAAa,eAAe,EAAE,WAAW,UAAU,SAAS,KAAK,GAAG,WAA6B;AAE/F,QACE,oBAFgB,UAAU,OAAO,OAEjC;EAAW,WAAW,KAAK,oBAAoB,UAAU;EAAO;EAAK,GAAI;EACtE;EACS,CAAA"}
+{"version":3,"file":"alert-footer.mjs","names":[],"sources":["../../../src/components/alert/alert-footer.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\n\nexport type AlertFooterProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const AlertFooter = ({ className, children, asChild, ref, ...rest }: AlertFooterProps) => {\n  const Component = asChild ? Slot : 'div';\n  return (\n    <Component className={clsx('bi-alert--footer', className)} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAiBA,MAAa,eAAe,EAAE,WAAW,UAAU,SAAS,KAAK,GAAG,WAA6B;CAE/F,OACE,oBAFgB,UAAU,OAAO,OAEjC;EAAW,WAAW,KAAK,oBAAoB,UAAU;EAAO;EAAK,GAAI;EACtE;EACS,CAAA"}

package/dist/components/alert/alert.d.mts

@@ -1,2 +1,2 @@
-import { Sn as AlertProps, xn as Alert } from "../../alert-footer-CIn6xe4F.mjs";
+import { Sn as AlertProps, xn as Alert } from "../../alert-footer-D3W7nNsf.mjs";
 export { Alert, AlertProps };

package/dist/components/alert/alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alert.mjs","names":[],"sources":["../../../src/components/alert/alert.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { CheckmarkSmallIcon, ErrorIcon, InfoIcon, WarningIcon } from '@bi-digital/icons';\n\nexport type AlertProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The alert variant.\n     * @default 'primary'\n     */\n    variant?: 'info' | 'success' | 'warning' | 'alert' | 'primary' | 'neutral';\n    /**\n     * Size of the alert.\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium' | 'large';\n    /** Custom close button. It's your responsibility to make the button close the alert. */\n    closeButton?: ReactNode;\n    /** Override the default icon which is decided by the `variant`. Set to `null` to remove the icon. */\n    icon?: ReactNode;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nconst variantIcons: Record<NonNullable<AlertProps['variant']>, React.ComponentType> = {\n  info: InfoIcon,\n  success: CheckmarkSmallIcon,\n  warning: WarningIcon,\n  alert: ErrorIcon,\n  primary: InfoIcon,\n  neutral: InfoIcon,\n};\n\nexport const Alert = ({\n  className,\n  children,\n  closeButton,\n  variant = 'primary',\n  icon,\n  asChild,\n  dark,\n  size,\n  ref,\n  ...rest\n}: AlertProps) => {\n  const Component = asChild ? Slot : 'div';\n  const DefaultIcon = variantIcons[variant];\n  return (\n    <Component\n      className={clsx('bi-alert', className)}\n      data-variant={variant}\n      data-size={size}\n      data-dark={dark}\n      ref={ref}\n      {...rest}\n    >\n      {icon === null ? null : (icon ?? <DefaultIcon />)}\n      {children}\n      {closeButton}\n    </Component>\n  );\n};\n"],"mappings":";;;;;AAiCA,MAAM,eAAgF;CACpF,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACV;AAED,MAAa,SAAS,EACpB,WACA,UACA,aACA,UAAU,WACV,MACA,SACA,MACA,MACA,KACA,GAAG,WACa;CAChB,MAAM,YAAY,UAAU,OAAO;CACnC,MAAM,cAAc,aAAa;AACjC,QACE,qBAAC,WAAD;EACE,WAAW,KAAK,YAAY,UAAU;EACtC,gBAAc;EACd,aAAW;EACX,aAAW;EACN;EACL,GAAI;YANN;GAQG,SAAS,OAAO,OAAQ,QAAQ,oBAAC,aAAD,EAAe,CAAA;GAC/C;GACA;GACS"}
+{"version":3,"file":"alert.mjs","names":[],"sources":["../../../src/components/alert/alert.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { CheckmarkSmallIcon, ErrorIcon, InfoIcon, WarningIcon } from '@bi-digital/icons';\n\nexport type AlertProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The alert variant.\n     * @default 'primary'\n     */\n    variant?: 'info' | 'success' | 'warning' | 'alert' | 'primary' | 'neutral';\n    /**\n     * Size of the alert.\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium' | 'large';\n    /** Custom close button. It's your responsibility to make the button close the alert. */\n    closeButton?: ReactNode;\n    /** Override the default icon which is decided by the `variant`. Set to `null` to remove the icon. */\n    icon?: ReactNode;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nconst variantIcons: Record<NonNullable<AlertProps['variant']>, React.ComponentType> = {\n  info: InfoIcon,\n  success: CheckmarkSmallIcon,\n  warning: WarningIcon,\n  alert: ErrorIcon,\n  primary: InfoIcon,\n  neutral: InfoIcon,\n};\n\nexport const Alert = ({\n  className,\n  children,\n  closeButton,\n  variant = 'primary',\n  icon,\n  asChild,\n  dark,\n  size,\n  ref,\n  ...rest\n}: AlertProps) => {\n  const Component = asChild ? Slot : 'div';\n  const DefaultIcon = variantIcons[variant];\n  return (\n    <Component\n      className={clsx('bi-alert', className)}\n      data-variant={variant}\n      data-size={size}\n      data-dark={dark}\n      ref={ref}\n      {...rest}\n    >\n      {icon === null ? null : (icon ?? <DefaultIcon />)}\n      {children}\n      {closeButton}\n    </Component>\n  );\n};\n"],"mappings":";;;;;AAiCA,MAAM,eAAgF;CACpF,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACV;AAED,MAAa,SAAS,EACpB,WACA,UACA,aACA,UAAU,WACV,MACA,SACA,MACA,MACA,KACA,GAAG,WACa;CAChB,MAAM,YAAY,UAAU,OAAO;CACnC,MAAM,cAAc,aAAa;CACjC,OACE,qBAAC,WAAD;EACE,WAAW,KAAK,YAAY,UAAU;EACtC,gBAAc;EACd,aAAW;EACX,aAAW;EACN;EACL,GAAI;YANN;GAQG,SAAS,OAAO,OAAQ,QAAQ,oBAAC,aAAD,EAAe,CAAA;GAC/C;GACA;GACS"}

package/dist/components/alert/index.d.mts

@@ -1,2 +1,2 @@
-import { Sn as AlertProps, n as AlertFooterProps, t as AlertFooter, xn as Alert } from "../../alert-footer-CIn6xe4F.mjs";
+import { Sn as AlertProps, n as AlertFooterProps, t as AlertFooter, xn as Alert } from "../../alert-footer-D3W7nNsf.mjs";
 export { Alert, AlertFooter, AlertFooterProps, AlertProps };

package/dist/components/avatar/avatar.d.mts

@@ -1,2 +1,2 @@
-import { bn as AvatarProps, yn as Avatar } from "../../alert-footer-CIn6xe4F.mjs";
+import { bn as AvatarProps, yn as Avatar } from "../../alert-footer-D3W7nNsf.mjs";
 export { Avatar, AvatarProps };

package/dist/components/avatar/avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.mjs","names":[],"sources":["../../../src/components/avatar/avatar.tsx"],"sourcesContent":["import { Fragment, type HTMLAttributes, type Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type AvatarProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * Name of the person the avatar represents.\n     */\n    'aria-label': string;\n    /**\n     * Size of the avatar.\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium';\n    /**\n     * Color scheme of the avatar.\n     * @default 'primary'\n     */\n    color?: 'primary' | 'info' | 'success' | 'warning' | 'alert';\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\n/**\n * An Avatar represents a person.\n *\n * @example\n * <Avatar aria-label=\"Ola Nordmann\">ON</Avatar>\n *\n * @example\n * <Avatar aria-label=\"Ola Nordmann\">\n *  <img src='…' alt='Ola Nordmann' />\n * </Avatar>\n */\nexport const Avatar = ({\n  'aria-label': ariaLabel,\n  className,\n  ref,\n  dark,\n  size,\n  color,\n  children,\n  ...props\n}: AvatarProps) => {\n  const isSlotInUse = children && typeof children !== 'string';\n  const Component = isSlotInUse ? Slot : Fragment;\n  return (\n    <span\n      className={clsx('bi-avatar', className)}\n      aria-label={ariaLabel}\n      role='img'\n      data-size={size}\n      data-color={color}\n      data-dark={dark}\n      ref={ref}\n      {...props}\n    >\n      <Component {...(isSlotInUse ? { 'aria-hidden': true } : {})}>{children}</Component>\n    </span>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAsCA,MAAa,UAAU,EACrB,cAAc,WACd,WACA,KACA,MACA,MACA,OACA,UACA,GAAG,YACc;CACjB,MAAM,cAAc,YAAY,OAAO,aAAa;CACpD,MAAM,YAAY,cAAc,OAAO;AACvC,QACE,oBAAC,QAAD;EACE,WAAW,KAAK,aAAa,UAAU;EACvC,cAAY;EACZ,MAAK;EACL,aAAW;EACX,cAAY;EACZ,aAAW;EACN;EACL,GAAI;YAEJ,oBAAC,WAAD;GAAW,GAAK,cAAc,EAAE,eAAe,MAAM,GAAG,EAAE;GAAI;GAAqB,CAAA;EAC9E,CAAA"}
+{"version":3,"file":"avatar.mjs","names":[],"sources":["../../../src/components/avatar/avatar.tsx"],"sourcesContent":["import { Fragment, type HTMLAttributes, type Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type AvatarProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * Name of the person the avatar represents.\n     */\n    'aria-label': string;\n    /**\n     * Size of the avatar.\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium';\n    /**\n     * Color scheme of the avatar.\n     * @default 'primary'\n     */\n    color?: 'primary' | 'info' | 'success' | 'warning' | 'alert';\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\n/**\n * An Avatar represents a person.\n *\n * @example\n * <Avatar aria-label=\"Ola Nordmann\">ON</Avatar>\n *\n * @example\n * <Avatar aria-label=\"Ola Nordmann\">\n *  <img src='…' alt='Ola Nordmann' />\n * </Avatar>\n */\nexport const Avatar = ({\n  'aria-label': ariaLabel,\n  className,\n  ref,\n  dark,\n  size,\n  color,\n  children,\n  ...props\n}: AvatarProps) => {\n  const isSlotInUse = children && typeof children !== 'string';\n  const Component = isSlotInUse ? Slot : Fragment;\n  return (\n    <span\n      className={clsx('bi-avatar', className)}\n      aria-label={ariaLabel}\n      role='img'\n      data-size={size}\n      data-color={color}\n      data-dark={dark}\n      ref={ref}\n      {...props}\n    >\n      <Component {...(isSlotInUse ? { 'aria-hidden': true } : {})}>{children}</Component>\n    </span>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAsCA,MAAa,UAAU,EACrB,cAAc,WACd,WACA,KACA,MACA,MACA,OACA,UACA,GAAG,YACc;CACjB,MAAM,cAAc,YAAY,OAAO,aAAa;CACpD,MAAM,YAAY,cAAc,OAAO;CACvC,OACE,oBAAC,QAAD;EACE,WAAW,KAAK,aAAa,UAAU;EACvC,cAAY;EACZ,MAAK;EACL,aAAW;EACX,cAAY;EACZ,aAAW;EACN;EACL,GAAI;YAEJ,oBAAC,WAAD;GAAW,GAAK,cAAc,EAAE,eAAe,MAAM,GAAG,EAAE;GAAI;GAAqB,CAAA;EAC9E,CAAA"}

package/dist/components/avatar/index.d.mts

@@ -1,2 +1,2 @@
-import { bn as AvatarProps, yn as Avatar } from "../../alert-footer-CIn6xe4F.mjs";
+import { bn as AvatarProps, yn as Avatar } from "../../alert-footer-D3W7nNsf.mjs";
 export { Avatar, AvatarProps };

package/dist/components/badge/badge.d.mts

@@ -1,2 +1,2 @@
-import { _n as Badge, vn as BadgeProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { _n as Badge, vn as BadgeProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { Badge, BadgeProps };

package/dist/components/badge/badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"badge.mjs","names":[],"sources":["../../../src/components/badge/badge.tsx"],"sourcesContent":["import { HTMLAttributes, Ref } from 'react';\nimport { AsChildProps, DefaultProps } from '../../types';\nimport { MergeRight } from '../../utilities';\nimport { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx';\n\nexport type BadgeProps = MergeRight<\n  DefaultProps & AsChildProps & HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * Size of the badge.\n     * @default 'medium'\n     */\n    size?: 'xs' | 'small' | 'medium';\n    /**\n     * Color of the badge.\n     * @default 'neutral'\n     */\n    color: 'neutral' | 'success' | 'warning' | 'alert' | 'brand' | 'info' | 'negative';\n    /**\n     * Makes the badge have the same height/width. Use for single-letter badges.\n     * @default false\n     */\n    singleLetter?: boolean;\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\nexport const Badge = ({\n  className,\n  children,\n  dark,\n  size = 'medium',\n  color = 'neutral',\n  singleLetter = false,\n  asChild,\n  ref,\n  ...props\n}: BadgeProps) => {\n  const Component = asChild ? Slot : 'span';\n\n  return (\n    <Component\n      className={clsx('bi-badge', className)}\n      data-size={size}\n      data-color={color}\n      data-single-letter={singleLetter}\n      data-dark={dark}\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AA4BA,MAAa,SAAS,EACpB,WACA,UACA,MACA,OAAO,UACP,QAAQ,WACR,eAAe,OACf,SACA,KACA,GAAG,YACa;AAGhB,QACE,oBAHgB,UAAU,OAAO,QAGjC;EACE,WAAW,KAAK,YAAY,UAAU;EACtC,aAAW;EACX,cAAY;EACZ,sBAAoB;EACpB,aAAW;EACN;EACL,GAAI;EAEH;EACS,CAAA"}
+{"version":3,"file":"badge.mjs","names":[],"sources":["../../../src/components/badge/badge.tsx"],"sourcesContent":["import { HTMLAttributes, Ref } from 'react';\nimport { AsChildProps, DefaultProps } from '../../types';\nimport { MergeRight } from '../../utilities';\nimport { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx';\n\nexport type BadgeProps = MergeRight<\n  DefaultProps & AsChildProps & HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * Size of the badge.\n     * @default 'medium'\n     */\n    size?: 'xs' | 'small' | 'medium';\n    /**\n     * Color of the badge.\n     * @default 'neutral'\n     */\n    color: 'neutral' | 'success' | 'warning' | 'alert' | 'brand' | 'info' | 'negative';\n    /**\n     * Makes the badge have the same height/width. Use for single-letter badges.\n     * @default false\n     */\n    singleLetter?: boolean;\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\nexport const Badge = ({\n  className,\n  children,\n  dark,\n  size = 'medium',\n  color = 'neutral',\n  singleLetter = false,\n  asChild,\n  ref,\n  ...props\n}: BadgeProps) => {\n  const Component = asChild ? Slot : 'span';\n\n  return (\n    <Component\n      className={clsx('bi-badge', className)}\n      data-size={size}\n      data-color={color}\n      data-single-letter={singleLetter}\n      data-dark={dark}\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AA4BA,MAAa,SAAS,EACpB,WACA,UACA,MACA,OAAO,UACP,QAAQ,WACR,eAAe,OACf,SACA,KACA,GAAG,YACa;CAGhB,OACE,oBAHgB,UAAU,OAAO,QAGjC;EACE,WAAW,KAAK,YAAY,UAAU;EACtC,aAAW;EACX,cAAY;EACZ,sBAAoB;EACpB,aAAW;EACN;EACL,GAAI;EAEH;EACS,CAAA"}

package/dist/components/badge/index.d.mts

@@ -1,2 +1,2 @@
-import { _n as Badge, vn as BadgeProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { _n as Badge, vn as BadgeProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { Badge, BadgeProps };

package/dist/components/button/button.d.mts

@@ -1,2 +1,2 @@
-import { gn as ButtonProps, hn as Button } from "../../alert-footer-CIn6xe4F.mjs";
+import { gn as ButtonProps, hn as Button } from "../../alert-footer-D3W7nNsf.mjs";
 export { Button, ButtonProps };

package/dist/components/button/button.mjs

@@ -4,7 +4,7 @@ import clsx from "clsx/lite";
 import { Slot, Slottable } from "@radix-ui/react-slot";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/button/button.tsx
-const Button = ({ asChild, variant = "filled", size = "medium", fullwidth, dark, submitting, icon, children, className, startIcon, endIcon, active, ref, ...props }) => {
+const Button = ({ asChild, variant = "filled", size = "medium", fullwidth, dark, submitting, icon, children, className, startIcon, endIcon, skewed, active, ref, ...props }) => {
 	return /* @__PURE__ */ jsxs(asChild ? Slot : "button", {
 		"aria-busy": Boolean(submitting) || void 0,
 		"aria-disabled": Boolean(submitting) || void 0,
@@ -15,6 +15,7 @@ const Button = ({ asChild, variant = "filled", size = "medium", fullwidth, dark,
 		"data-dark": dark || void 0,
 		"data-icon": icon || void 0,
 		"data-active": active || void 0,
+		"data-skewed": skewed || void 0,
 		ref,
 		type: asChild ? void 0 : "button",
 		...props,

package/dist/components/button/button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.mjs","names":[],"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { ButtonHTMLAttributes, ReactNode, Ref } from 'react';\nimport { Slot, Slottable } from '@radix-ui/react-slot';\nimport { Spinner } from '../spinner';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type ButtonProps = MergeRight<\n  DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>,\n  {\n    /**\n     * The button size.\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium' | 'large';\n    /**\n     * The button variant.\n     * @default 'filled'\n     */\n    variant?: 'filled' | 'outlined' | 'text' | 'flat';\n    /**\n     * Stretch the button to the full width.\n     * @default false\n     */\n    fullwidth?: boolean;\n    /**\n     * Display a loading animation with the Spinner-component.\n     * Replaces the `startIcon` if used\n     * @default false\n     */\n    submitting?: boolean;\n    /**\n     * Display as icon-button, only use when showing an icon as the label.\n     * Not compatible with the `startIcon`, `endIcon` and `fullwidth` props.\n     * Always provide a descriptive aria-label for accessibility when set to true.\n     * @default false\n     */\n    icon?: boolean;\n    /** Set an icon before the button label, no effect if `icon=true` */\n    startIcon?: ReactNode;\n    /** Set an icon after the button label, no effect if `icon=true` */\n    endIcon?: ReactNode;\n    /** Make the button active by showing an active state. */\n    active?: boolean;\n    ref?: Ref<HTMLButtonElement>;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    /**\n     * Specify the type of button. Unset when `asChild` is true\n     * @default 'button'\n     */\n    type?: ButtonHTMLAttributes<HTMLButtonElement>['type'];\n  }\n>;\n\nexport const Button = ({\n  asChild,\n  variant = 'filled',\n  size = 'medium',\n  fullwidth,\n  dark,\n  submitting,\n  icon,\n  children,\n  className,\n  startIcon,\n  endIcon,\n  active,\n  ref,\n  ...props\n}: ButtonProps) => {\n  const Component = asChild ? Slot : 'button';\n\n  return (\n    <Component\n      aria-busy={Boolean(submitting) || undefined}\n      aria-disabled={Boolean(submitting) || undefined}\n      className={clsx('bi-button', className)}\n      data-variant={variant}\n      data-size={size}\n      data-fullwidth={fullwidth || undefined}\n      data-dark={dark || undefined}\n      data-icon={icon || undefined}\n      data-active={active || undefined}\n      ref={ref}\n      /* don't set type when we use `asChild` */\n      type={asChild ? undefined : 'button'}\n      /* if consumers set type, our default does not set anything, as `rest` contains this */\n      {...props}\n    >\n      {!icon &&\n        (submitting ? (\n          <Spinner aria-hidden='true' className='bi-button--start-icon' />\n        ) : (\n          startIcon && <span className='bi-button--start-icon'>{startIcon}</span>\n        ))}\n      <Slottable>{icon && submitting ? <Spinner aria-hidden='true' /> : children}</Slottable>\n      {!icon && endIcon && <span className='bi-button--end-icon'>{endIcon}</span>}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;AA0DA,MAAa,UAAU,EACrB,SACA,UAAU,UACV,OAAO,UACP,WACA,MACA,YACA,MACA,UACA,WACA,WACA,SACA,QACA,KACA,GAAG,YACc;AAGjB,QACE,qBAHgB,UAAU,OAAO,UAGjC;EACE,aAAW,QAAQ,WAAW,IAAI,KAAA;EAClC,iBAAe,QAAQ,WAAW,IAAI,KAAA;EACtC,WAAW,KAAK,aAAa,UAAU;EACvC,gBAAc;EACd,aAAW;EACX,kBAAgB,aAAa,KAAA;EAC7B,aAAW,QAAQ,KAAA;EACnB,aAAW,QAAQ,KAAA;EACnB,eAAa,UAAU,KAAA;EAClB;EAEL,MAAM,UAAU,KAAA,IAAY;EAE5B,GAAI;YAdN;GAgBG,CAAC,SACC,aACC,oBAAC,SAAD;IAAS,eAAY;IAAO,WAAU;IAA0B,CAAA,GAEhE,aAAa,oBAAC,QAAD;IAAM,WAAU;cAAyB;IAAiB,CAAA;GAE3E,oBAAC,WAAD,EAAA,UAAY,QAAQ,aAAa,oBAAC,SAAD,EAAS,eAAY,QAAS,CAAA,GAAG,UAAqB,CAAA;GACtF,CAAC,QAAQ,WAAW,oBAAC,QAAD;IAAM,WAAU;cAAuB;IAAe,CAAA;GACjE"}
+{"version":3,"file":"button.mjs","names":[],"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { ButtonHTMLAttributes, ReactNode, Ref } from 'react';\nimport { Slot, Slottable } from '@radix-ui/react-slot';\nimport { Spinner } from '../spinner';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type ButtonProps = MergeRight<\n  DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>,\n  {\n    /**\n     * The button size.\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium' | 'large';\n    /**\n     * The button variant.\n     * @default 'filled'\n     */\n    variant?: 'filled' | 'outlined' | 'text' | 'flat';\n    /**\n     * Stretch the button to the full width.\n     * @default false\n     */\n    fullwidth?: boolean;\n    /**\n     * Display a loading animation with the Spinner-component.\n     * Replaces the `startIcon` if used\n     * @default false\n     */\n    submitting?: boolean;\n    /**\n     * Display as icon-button, only use when showing an icon as the label.\n     * Not compatible with the `startIcon`, `endIcon` and `fullwidth` props.\n     * Always provide a descriptive aria-label for accessibility when set to true.\n     * @default false\n     */\n    icon?: boolean;\n    /** Set an icon before the button label, no effect if `icon=true` */\n    startIcon?: ReactNode;\n    /** Set an icon after the button label, no effect if `icon=true` */\n    endIcon?: ReactNode;\n    /** Skew the button, only works when there's a start or end icon in the same direction. */\n    skewed?: 'start' | 'end';\n    /** Make the button active by showing an active state. */\n    active?: boolean;\n    ref?: Ref<HTMLButtonElement>;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    /**\n     * Specify the type of button. Unset when `asChild` is true\n     * @default 'button'\n     */\n    type?: ButtonHTMLAttributes<HTMLButtonElement>['type'];\n  }\n>;\n\nexport const Button = ({\n  asChild,\n  variant = 'filled',\n  size = 'medium',\n  fullwidth,\n  dark,\n  submitting,\n  icon,\n  children,\n  className,\n  startIcon,\n  endIcon,\n  skewed,\n  active,\n  ref,\n  ...props\n}: ButtonProps) => {\n  const Component = asChild ? Slot : 'button';\n\n  return (\n    <Component\n      aria-busy={Boolean(submitting) || undefined}\n      aria-disabled={Boolean(submitting) || undefined}\n      className={clsx('bi-button', className)}\n      data-variant={variant}\n      data-size={size}\n      data-fullwidth={fullwidth || undefined}\n      data-dark={dark || undefined}\n      data-icon={icon || undefined}\n      data-active={active || undefined}\n      data-skewed={skewed || undefined}\n      ref={ref}\n      /* don't set type when we use `asChild` */\n      type={asChild ? undefined : 'button'}\n      /* if consumers set type, our default does not set anything, as `rest` contains this */\n      {...props}\n    >\n      {!icon &&\n        (submitting ? (\n          <Spinner aria-hidden='true' className='bi-button--start-icon' />\n        ) : (\n          startIcon && <span className='bi-button--start-icon'>{startIcon}</span>\n        ))}\n      <Slottable>{icon && submitting ? <Spinner aria-hidden='true' /> : children}</Slottable>\n      {!icon && endIcon && <span className='bi-button--end-icon'>{endIcon}</span>}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;AA4DA,MAAa,UAAU,EACrB,SACA,UAAU,UACV,OAAO,UACP,WACA,MACA,YACA,MACA,UACA,WACA,WACA,SACA,QACA,QACA,KACA,GAAG,YACc;CAGjB,OACE,qBAHgB,UAAU,OAAO,UAGjC;EACE,aAAW,QAAQ,WAAW,IAAI,KAAA;EAClC,iBAAe,QAAQ,WAAW,IAAI,KAAA;EACtC,WAAW,KAAK,aAAa,UAAU;EACvC,gBAAc;EACd,aAAW;EACX,kBAAgB,aAAa,KAAA;EAC7B,aAAW,QAAQ,KAAA;EACnB,aAAW,QAAQ,KAAA;EACnB,eAAa,UAAU,KAAA;EACvB,eAAa,UAAU,KAAA;EAClB;EAEL,MAAM,UAAU,KAAA,IAAY;EAE5B,GAAI;YAfN;GAiBG,CAAC,SACC,aACC,oBAAC,SAAD;IAAS,eAAY;IAAO,WAAU;IAA0B,CAAA,GAEhE,aAAa,oBAAC,QAAD;IAAM,WAAU;cAAyB;IAAiB,CAAA;GAE3E,oBAAC,WAAD,EAAA,UAAY,QAAQ,aAAa,oBAAC,SAAD,EAAS,eAAY,QAAS,CAAA,GAAG,UAAqB,CAAA;GACtF,CAAC,QAAQ,WAAW,oBAAC,QAAD;IAAM,WAAU;cAAuB;IAAe,CAAA;GACjE"}

package/dist/components/button/index.d.mts

@@ -1,2 +1,2 @@
-import { gn as ButtonProps, hn as Button } from "../../alert-footer-CIn6xe4F.mjs";
+import { gn as ButtonProps, hn as Button } from "../../alert-footer-D3W7nNsf.mjs";
 export { Button, ButtonProps };

package/dist/components/card/card-action.d.mts

@@ -1,2 +1,2 @@
-import { ln as CardAction, un as CardActionProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { ln as CardAction, un as CardActionProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { CardAction, CardActionProps };

package/dist/components/card/card-action.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card-action.mjs","names":[],"sources":["../../../src/components/card/card-action.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Button, type ButtonProps } from '../button';\nimport { Slot } from '@radix-ui/react-slot';\n\nexport type CardActionProps = ButtonProps;\n\nexport const CardAction = ({ asChild, ref, children, dark, className, ...props }: CardActionProps) => {\n  const Component = asChild ? Slot : Button;\n  return (\n    <Component\n      variant='text'\n      size='large'\n      icon\n      dark={dark}\n      className={clsx('bi-card--action', className)}\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;AAMA,MAAa,cAAc,EAAE,SAAS,KAAK,UAAU,MAAM,WAAW,GAAG,YAA6B;AAEpG,QACE,oBAFgB,UAAU,OAAO,QAEjC;EACE,SAAQ;EACR,MAAK;EACL,MAAA;EACM;EACN,WAAW,KAAK,mBAAmB,UAAU;EACxC;EACL,GAAI;EAEH;EACS,CAAA"}
+{"version":3,"file":"card-action.mjs","names":[],"sources":["../../../src/components/card/card-action.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Button, type ButtonProps } from '../button';\nimport { Slot } from '@radix-ui/react-slot';\n\nexport type CardActionProps = ButtonProps;\n\nexport const CardAction = ({ asChild, ref, children, dark, className, ...props }: CardActionProps) => {\n  const Component = asChild ? Slot : Button;\n  return (\n    <Component\n      variant='text'\n      size='large'\n      icon\n      dark={dark}\n      className={clsx('bi-card--action', className)}\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;AAMA,MAAa,cAAc,EAAE,SAAS,KAAK,UAAU,MAAM,WAAW,GAAG,YAA6B;CAEpG,OACE,oBAFgB,UAAU,OAAO,QAEjC;EACE,SAAQ;EACR,MAAK;EACL,MAAA;EACM;EACN,WAAW,KAAK,mBAAmB,UAAU;EACxC;EACL,GAAI;EAEH;EACS,CAAA"}

package/dist/components/card/card-actions.d.mts

@@ -1,2 +1,2 @@
-import { dn as CardActions, fn as CardActionsProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { dn as CardActions, fn as CardActionsProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { CardActions, CardActionsProps };

package/dist/components/card/card-actions.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card-actions.mjs","names":[],"sources":["../../../src/components/card/card-actions.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\n\nexport type CardActionsProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardActions = ({ className, ref, children, ...props }: CardActionsProps) => {\n  return (\n    <div className={clsx('bi-card--actions', className)} ref={ref} {...props}>\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAWA,MAAa,eAAe,EAAE,WAAW,KAAK,UAAU,GAAG,YAA8B;AACvF,QACE,oBAAC,OAAD;EAAK,WAAW,KAAK,oBAAoB,UAAU;EAAO;EAAK,GAAI;EAChE;EACG,CAAA"}
+{"version":3,"file":"card-actions.mjs","names":[],"sources":["../../../src/components/card/card-actions.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\n\nexport type CardActionsProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardActions = ({ className, ref, children, ...props }: CardActionsProps) => {\n  return (\n    <div className={clsx('bi-card--actions', className)} ref={ref} {...props}>\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAWA,MAAa,eAAe,EAAE,WAAW,KAAK,UAAU,GAAG,YAA8B;CACvF,OACE,oBAAC,OAAD;EAAK,WAAW,KAAK,oBAAoB,UAAU;EAAO;EAAK,GAAI;EAChE;EACG,CAAA"}

package/dist/components/card/card-content.d.mts

@@ -1,2 +1,2 @@
-import { cn as CardContentProps, sn as CardContent } from "../../alert-footer-CIn6xe4F.mjs";
+import { cn as CardContentProps, sn as CardContent } from "../../alert-footer-D3W7nNsf.mjs";
 export { CardContent, CardContentProps };

package/dist/components/card/card-content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card-content.mjs","names":[],"sources":["../../../src/components/card/card-content.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\n\nexport type CardContentProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    disabled?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardContent = ({ className, ref, children, asChild, ...props }: CardContentProps) => {\n  const Component = asChild ? Slot : 'div';\n  return (\n    <Component className={clsx('bi-card--content', className)} ref={ref} {...props}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAkBA,MAAa,eAAe,EAAE,WAAW,KAAK,UAAU,SAAS,GAAG,YAA8B;AAEhG,QACE,oBAFgB,UAAU,OAAO,OAEjC;EAAW,WAAW,KAAK,oBAAoB,UAAU;EAAO;EAAK,GAAI;EACtE;EACS,CAAA"}
+{"version":3,"file":"card-content.mjs","names":[],"sources":["../../../src/components/card/card-content.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\n\nexport type CardContentProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    disabled?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardContent = ({ className, ref, children, asChild, ...props }: CardContentProps) => {\n  const Component = asChild ? Slot : 'div';\n  return (\n    <Component className={clsx('bi-card--content', className)} ref={ref} {...props}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAkBA,MAAa,eAAe,EAAE,WAAW,KAAK,UAAU,SAAS,GAAG,YAA8B;CAEhG,OACE,oBAFgB,UAAU,OAAO,OAEjC;EAAW,WAAW,KAAK,oBAAoB,UAAU;EAAO;EAAK,GAAI;EACtE;EACS,CAAA"}

package/dist/components/card/card-date.d.mts

@@ -1,2 +1,2 @@
-import { nn as CardDateProps, tn as CardDate } from "../../alert-footer-CIn6xe4F.mjs";
+import { nn as CardDateProps, tn as CardDate } from "../../alert-footer-D3W7nNsf.mjs";
 export { CardDate, CardDateProps };

package/dist/components/card/card-date.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card-date.mjs","names":[],"sources":["../../../src/components/card/card-date.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\n\nexport type CardDateProps = MergeRight<\n  Omit<HTMLAttributes<HTMLParagraphElement>, 'children'>,\n  {\n    /**\n     * The day of the month.\n     */\n    day: number;\n    /**\n     * The month, should be a short string like \"Jan\", \"Feb\", etc.\n     */\n    month: string;\n    ref?: Ref<HTMLParagraphElement>;\n  }\n>;\n\nexport const CardDate = ({ className, ref, day, month, ...props }: CardDateProps) => {\n  return (\n    <p className={clsx('bi-card--date', className)} ref={ref} {...props}>\n      {day}\n      <span>{month}</span>\n    </p>\n  );\n};\n"],"mappings":";;;AAmBA,MAAa,YAAY,EAAE,WAAW,KAAK,KAAK,OAAO,GAAG,YAA2B;AACnF,QACE,qBAAC,KAAD;EAAG,WAAW,KAAK,iBAAiB,UAAU;EAAO;EAAK,GAAI;YAA9D,CACG,KACD,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA,CAClB"}
+{"version":3,"file":"card-date.mjs","names":[],"sources":["../../../src/components/card/card-date.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\n\nexport type CardDateProps = MergeRight<\n  Omit<HTMLAttributes<HTMLParagraphElement>, 'children'>,\n  {\n    /**\n     * The day of the month.\n     */\n    day: number;\n    /**\n     * The month, should be a short string like \"Jan\", \"Feb\", etc.\n     */\n    month: string;\n    ref?: Ref<HTMLParagraphElement>;\n  }\n>;\n\nexport const CardDate = ({ className, ref, day, month, ...props }: CardDateProps) => {\n  return (\n    <p className={clsx('bi-card--date', className)} ref={ref} {...props}>\n      {day}\n      <span>{month}</span>\n    </p>\n  );\n};\n"],"mappings":";;;AAmBA,MAAa,YAAY,EAAE,WAAW,KAAK,KAAK,OAAO,GAAG,YAA2B;CACnF,OACE,qBAAC,KAAD;EAAG,WAAW,KAAK,iBAAiB,UAAU;EAAO;EAAK,GAAI;YAA9D,CACG,KACD,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA,CAClB"}

package/dist/components/card/card-header.d.mts

@@ -1,2 +1,2 @@
-import { an as CardHeader, on as CardHeaderProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { an as CardHeader, on as CardHeaderProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { CardHeader, CardHeaderProps };

package/dist/components/card/card-header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card-header.mjs","names":[],"sources":["../../../src/components/card/card-header.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx';\n\nexport type CardHeaderProps = MergeRight<\n  Omit<HTMLAttributes<HTMLDivElement>, 'children'>,\n  {\n    /**\n     * The header of the card\n     */\n    header?: ReactNode;\n    /**\n     * The label of the card, displayed above the header\n     */\n    label?: ReactNode;\n    /**\n     * The sublabel of the card, displayed next to the label\n     */\n    subLabel?: ReactNode;\n    /**\n     * The description of the card, displayed below the header\n     */\n    description?: ReactNode;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardHeader = ({ className, ref, header, label, subLabel, description, ...props }: CardHeaderProps) => {\n  return (\n    <div className={clsx('bi-card--header', className)} ref={ref} {...props}>\n      {(label || subLabel) && (\n        <p className='bi-card--header-label'>\n          {label && <span className='bi-card--header-bold'>{label}</span>}\n          {label && subLabel && <span aria-hidden='true' className='bi-card--header-dot'></span>}\n          {subLabel && <span>{subLabel}</span>}\n        </p>\n      )}\n      {header && <h3 className='bi-card--header-title'>{header}</h3>}\n      {description && <p className='bi-card--header-label'>{description}</p>}\n    </div>\n  );\n};\n"],"mappings":";;;AA2BA,MAAa,cAAc,EAAE,WAAW,KAAK,QAAQ,OAAO,UAAU,aAAa,GAAG,YAA6B;AACjH,QACE,qBAAC,OAAD;EAAK,WAAW,KAAK,mBAAmB,UAAU;EAAO;EAAK,GAAI;YAAlE;IACI,SAAS,aACT,qBAAC,KAAD;IAAG,WAAU;cAAb;KACG,SAAS,oBAAC,QAAD;MAAM,WAAU;gBAAwB;MAAa,CAAA;KAC9D,SAAS,YAAY,oBAAC,QAAD;MAAM,eAAY;MAAO,WAAU;MAA6B,CAAA;KACrF,YAAY,oBAAC,QAAD,EAAA,UAAO,UAAgB,CAAA;KAClC;;GAEL,UAAU,oBAAC,MAAD;IAAI,WAAU;cAAyB;IAAY,CAAA;GAC7D,eAAe,oBAAC,KAAD;IAAG,WAAU;cAAyB;IAAgB,CAAA;GAClE"}
+{"version":3,"file":"card-header.mjs","names":[],"sources":["../../../src/components/card/card-header.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx';\n\nexport type CardHeaderProps = MergeRight<\n  Omit<HTMLAttributes<HTMLDivElement>, 'children'>,\n  {\n    /**\n     * The header of the card\n     */\n    header?: ReactNode;\n    /**\n     * The label of the card, displayed above the header\n     */\n    label?: ReactNode;\n    /**\n     * The sublabel of the card, displayed next to the label\n     */\n    subLabel?: ReactNode;\n    /**\n     * The description of the card, displayed below the header\n     */\n    description?: ReactNode;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardHeader = ({ className, ref, header, label, subLabel, description, ...props }: CardHeaderProps) => {\n  return (\n    <div className={clsx('bi-card--header', className)} ref={ref} {...props}>\n      {(label || subLabel) && (\n        <p className='bi-card--header-label'>\n          {label && <span className='bi-card--header-bold'>{label}</span>}\n          {label && subLabel && <span aria-hidden='true' className='bi-card--header-dot'></span>}\n          {subLabel && <span>{subLabel}</span>}\n        </p>\n      )}\n      {header && <h3 className='bi-card--header-title'>{header}</h3>}\n      {description && <p className='bi-card--header-label'>{description}</p>}\n    </div>\n  );\n};\n"],"mappings":";;;AA2BA,MAAa,cAAc,EAAE,WAAW,KAAK,QAAQ,OAAO,UAAU,aAAa,GAAG,YAA6B;CACjH,OACE,qBAAC,OAAD;EAAK,WAAW,KAAK,mBAAmB,UAAU;EAAO;EAAK,GAAI;YAAlE;IACI,SAAS,aACT,qBAAC,KAAD;IAAG,WAAU;cAAb;KACG,SAAS,oBAAC,QAAD;MAAM,WAAU;gBAAwB;MAAa,CAAA;KAC9D,SAAS,YAAY,oBAAC,QAAD;MAAM,eAAY;MAAO,WAAU;MAA6B,CAAA;KACrF,YAAY,oBAAC,QAAD,EAAA,UAAO,UAAgB,CAAA;KAClC;;GAEL,UAAU,oBAAC,MAAD;IAAI,WAAU;cAAyB;IAAY,CAAA;GAC7D,eAAe,oBAAC,KAAD;IAAG,WAAU;cAAyB;IAAgB,CAAA;GAClE"}

package/dist/components/card/card-media.d.mts

@@ -1,2 +1,2 @@
-import { in as CardMediaProps, rn as CardMedia } from "../../alert-footer-CIn6xe4F.mjs";
+import { in as CardMediaProps, rn as CardMedia } from "../../alert-footer-D3W7nNsf.mjs";
 export { CardMedia, CardMediaProps };

package/dist/components/card/card-media.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card-media.mjs","names":[],"sources":["../../../src/components/card/card-media.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\n\nexport type CardMediaProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The media to display. Must be audio, figure, iframe, img or video-tag to get correct styles.\n     */\n    children?: ReactNode;\n    /**\n     * Optional content to overlay on top of the media.\n     */\n    overlay?: ReactNode;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardMedia = ({ className, ref, children, overlay, ...props }: CardMediaProps) => {\n  return (\n    <div className={clsx('bi-card--media', className)} ref={ref} {...props}>\n      {children}\n      <div className='bi-card--media-overlay'>{overlay}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAmBA,MAAa,aAAa,EAAE,WAAW,KAAK,UAAU,SAAS,GAAG,YAA4B;AAC5F,QACE,qBAAC,OAAD;EAAK,WAAW,KAAK,kBAAkB,UAAU;EAAO;EAAK,GAAI;YAAjE,CACG,UACD,oBAAC,OAAD;GAAK,WAAU;aAA0B;GAAc,CAAA,CACnD"}
+{"version":3,"file":"card-media.mjs","names":[],"sources":["../../../src/components/card/card-media.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\n\nexport type CardMediaProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The media to display. Must be audio, figure, iframe, img or video-tag to get correct styles.\n     */\n    children?: ReactNode;\n    /**\n     * Optional content to overlay on top of the media.\n     */\n    overlay?: ReactNode;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const CardMedia = ({ className, ref, children, overlay, ...props }: CardMediaProps) => {\n  return (\n    <div className={clsx('bi-card--media', className)} ref={ref} {...props}>\n      {children}\n      <div className='bi-card--media-overlay'>{overlay}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAmBA,MAAa,aAAa,EAAE,WAAW,KAAK,UAAU,SAAS,GAAG,YAA4B;CAC5F,OACE,qBAAC,OAAD;EAAK,WAAW,KAAK,kBAAkB,UAAU;EAAO;EAAK,GAAI;YAAjE,CACG,UACD,oBAAC,OAAD;GAAK,WAAU;aAA0B;GAAc,CAAA,CACnD"}

package/dist/components/card/card.d.mts

@@ -1,2 +1,2 @@
-import { mn as CardProps, pn as Card } from "../../alert-footer-CIn6xe4F.mjs";
+import { mn as CardProps, pn as Card } from "../../alert-footer-D3W7nNsf.mjs";
 export { Card, CardProps };

package/dist/components/card/card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card.mjs","names":[],"sources":["../../../src/components/card/card.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\nimport { Slot, Slottable } from '@radix-ui/react-slot';\n\nexport type CardProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The orientation of the card\n     * @default 'horizontal'\n     */\n    orientation?: 'horizontal' | 'vertical';\n    /**\n     * The color of the card\n     * @default 'neutral'\n     */\n    color?: 'neutral' | 'primary' | 'info' | 'warning';\n    error?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const Card = ({\n  orientation = 'horizontal',\n  color = 'neutral',\n  error = false,\n  dark = false,\n  className,\n  ref,\n  children,\n  asChild,\n  ...props\n}: CardProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component\n      className={clsx('bi-card', className)}\n      data-orientation={orientation}\n      data-color={color}\n      data-error={error}\n      data-dark={dark}\n      ref={ref}\n      {...props}\n    >\n      <Slottable>{children}</Slottable>\n    </Component>\n  );\n};\n"],"mappings":";;;;AA6BA,MAAa,QAAQ,EACnB,cAAc,cACd,QAAQ,WACR,QAAQ,OACR,OAAO,OACP,WACA,KACA,UACA,SACA,GAAG,YACY;AAGf,QACE,oBAHgB,UAAU,OAAO,OAGjC;EACE,WAAW,KAAK,WAAW,UAAU;EACrC,oBAAkB;EAClB,cAAY;EACZ,cAAY;EACZ,aAAW;EACN;EACL,GAAI;YAEJ,oBAAC,WAAD,EAAY,UAAqB,CAAA;EACvB,CAAA"}
+{"version":3,"file":"card.mjs","names":[],"sources":["../../../src/components/card/card.tsx"],"sourcesContent":["import type { HTMLAttributes, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport clsx from 'clsx/lite';\nimport { Slot, Slottable } from '@radix-ui/react-slot';\n\nexport type CardProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The orientation of the card\n     * @default 'horizontal'\n     */\n    orientation?: 'horizontal' | 'vertical';\n    /**\n     * The color of the card\n     * @default 'neutral'\n     */\n    color?: 'neutral' | 'primary' | 'info' | 'warning';\n    error?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const Card = ({\n  orientation = 'horizontal',\n  color = 'neutral',\n  error = false,\n  dark = false,\n  className,\n  ref,\n  children,\n  asChild,\n  ...props\n}: CardProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component\n      className={clsx('bi-card', className)}\n      data-orientation={orientation}\n      data-color={color}\n      data-error={error}\n      data-dark={dark}\n      ref={ref}\n      {...props}\n    >\n      <Slottable>{children}</Slottable>\n    </Component>\n  );\n};\n"],"mappings":";;;;AA6BA,MAAa,QAAQ,EACnB,cAAc,cACd,QAAQ,WACR,QAAQ,OACR,OAAO,OACP,WACA,KACA,UACA,SACA,GAAG,YACY;CAGf,OACE,oBAHgB,UAAU,OAAO,OAGjC;EACE,WAAW,KAAK,WAAW,UAAU;EACrC,oBAAkB;EAClB,cAAY;EACZ,cAAY;EACZ,aAAW;EACN;EACL,GAAI;YAEJ,oBAAC,WAAD,EAAY,UAAqB,CAAA;EACvB,CAAA"}

package/dist/components/card/index.d.mts

@@ -1,2 +1,2 @@
-import { an as CardHeader, cn as CardContentProps, dn as CardActions, fn as CardActionsProps, in as CardMediaProps, ln as CardAction, mn as CardProps, nn as CardDateProps, on as CardHeaderProps, pn as Card, rn as CardMedia, sn as CardContent, tn as CardDate, un as CardActionProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { an as CardHeader, cn as CardContentProps, dn as CardActions, fn as CardActionsProps, in as CardMediaProps, ln as CardAction, mn as CardProps, nn as CardDateProps, on as CardHeaderProps, pn as Card, rn as CardMedia, sn as CardContent, tn as CardDate, un as CardActionProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { Card, CardAction, CardActionProps, CardActions, CardActionsProps, CardContent, CardContentProps, CardDate, CardDateProps, CardHeader, CardHeaderProps, CardMedia, CardMediaProps, CardProps };

package/dist/components/checkbox/checkbox-subsection.d.mts

@@ -1,2 +1,2 @@
-import { Xt as CheckboxSubsectionProps, Yt as CheckboxSubsection } from "../../alert-footer-CIn6xe4F.mjs";
+import { Xt as CheckboxSubsectionProps, Yt as CheckboxSubsection } from "../../alert-footer-D3W7nNsf.mjs";
 export { CheckboxSubsection, CheckboxSubsectionProps };

package/dist/components/checkbox/checkbox-subsection.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-subsection.mjs","names":[],"sources":["../../../src/components/checkbox/checkbox-subsection.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { HtmlHTMLAttributes, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type CheckboxSubsectionProps = MergeRight<\n  DefaultProps & HtmlHTMLAttributes<HTMLDivElement>,\n  { ref?: Ref<HTMLDivElement> }\n>;\n\nexport const CheckboxSubsection = ({ children, className, dark, ref, ...props }: CheckboxSubsectionProps) => {\n  return (\n    <div className={clsx('bi-checkbox-subsection', className)} data-dark={dark} {...props} ref={ref}>\n      <div />\n      <div>{children}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAUA,MAAa,sBAAsB,EAAE,UAAU,WAAW,MAAM,KAAK,GAAG,YAAqC;AAC3G,QACE,qBAAC,OAAD;EAAK,WAAW,KAAK,0BAA0B,UAAU;EAAE,aAAW;EAAM,GAAI;EAAY;YAA5F,CACE,oBAAC,OAAD,EAAO,CAAA,EACP,oBAAC,OAAD,EAAM,UAAe,CAAA,CACjB"}
+{"version":3,"file":"checkbox-subsection.mjs","names":[],"sources":["../../../src/components/checkbox/checkbox-subsection.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { HtmlHTMLAttributes, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type CheckboxSubsectionProps = MergeRight<\n  DefaultProps & HtmlHTMLAttributes<HTMLDivElement>,\n  { ref?: Ref<HTMLDivElement> }\n>;\n\nexport const CheckboxSubsection = ({ children, className, dark, ref, ...props }: CheckboxSubsectionProps) => {\n  return (\n    <div className={clsx('bi-checkbox-subsection', className)} data-dark={dark} {...props} ref={ref}>\n      <div />\n      <div>{children}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAUA,MAAa,sBAAsB,EAAE,UAAU,WAAW,MAAM,KAAK,GAAG,YAAqC;CAC3G,OACE,qBAAC,OAAD;EAAK,WAAW,KAAK,0BAA0B,UAAU;EAAE,aAAW;EAAM,GAAI;EAAY;YAA5F,CACE,oBAAC,OAAD,EAAO,CAAA,EACP,oBAAC,OAAD,EAAM,UAAe,CAAA,CACjB"}

package/dist/components/checkbox/checkbox.d.mts

@@ -1,2 +1,2 @@
-import { Qt as CheckboxProps, Zt as Checkbox } from "../../alert-footer-CIn6xe4F.mjs";
+import { Qt as CheckboxProps, Zt as Checkbox } from "../../alert-footer-D3W7nNsf.mjs";
 export { Checkbox, CheckboxProps };

package/dist/components/checkbox/checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.mjs","names":[],"sources":["../../../src/components/checkbox/checkbox.tsx"],"sourcesContent":["import { useEffect, useId, useRef, type ReactNode, type Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\n\nexport type CheckboxProps = MergeRight<\n  LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'>,\n  {\n    /** Label */\n    label?: ReactNode;\n    /** Description */\n    description?: ReactNode;\n    /** Add error indication to the checkbox. */\n    error?: boolean;\n    /** Specify whether the Checkbox is indeterminate */\n    indeterminate?: boolean;\n    /** If true, the checkbox will take up the full width of the container, and not just \"fit-content\" which is default */\n    fullwidth?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Checkbox = ({\n  dark,\n  label,\n  description,\n  error,\n  fullwidth,\n  style,\n  className,\n  indeterminate,\n  ref,\n  id,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: CheckboxProps) => {\n  const checkRef = useRef<HTMLInputElement>(null);\n  const refs = useMergeRefs([checkRef, ref]);\n  const descriptionId = useId();\n\n  useEffect(() => {\n    let input: HTMLInputElement | null;\n    if (ref && typeof ref !== 'function') {\n      input = ref.current;\n    } else {\n      input = checkRef.current;\n    }\n\n    if (input) {\n      input.indeterminate = indeterminate || false;\n    }\n  }, [indeterminate, checkRef, ref]);\n\n  const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n  return (\n    <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth} asChild>\n      <label>\n        <Input\n          type='checkbox'\n          id={id}\n          ref={refs}\n          aria-invalid={error || undefined}\n          aria-describedby={ariaDescribedBy}\n          dark={dark}\n          {...props}\n        />\n        {label && (\n          <Label weight='medium' htmlFor={id} asChild>\n            <span>{label}</span>\n          </Label>\n        )}\n        {description && (\n          // Aria-hidden is used to prevent screen readers from reading the description twice:\n          // once as part of the label and once from being connected through aria-describedby.\n          <FieldDescription aria-hidden='true' id={descriptionId}>\n            {description}\n          </FieldDescription>\n        )}\n      </label>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;AA0BA,MAAa,YAAY,EACvB,MACA,OACA,aACA,OACA,WACA,OACA,WACA,eACA,KACA,IACA,oBAAoB,qBACpB,GAAG,YACgB;CACnB,MAAM,WAAW,OAAyB,KAAK;CAC/C,MAAM,OAAO,aAAa,CAAC,UAAU,IAAI,CAAC;CAC1C,MAAM,gBAAgB,OAAO;AAE7B,iBAAgB;EACd,IAAI;AACJ,MAAI,OAAO,OAAO,QAAQ,WACxB,SAAQ,IAAI;MAEZ,SAAQ,SAAS;AAGnB,MAAI,MACF,OAAM,gBAAgB,iBAAiB;IAExC;EAAC;EAAe;EAAU;EAAI,CAAC;CAElC,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,oBAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;AAEpG,QACE,oBAAC,OAAD;EAAkB;EAAW,aAAW;EAAa;EAAkB;EAAW,SAAA;YAChF,qBAAC,SAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACD;IACJ,KAAK;IACL,gBAAc,SAAS,KAAA;IACvB,oBAAkB;IACZ;IACN,GAAI;IACJ,CAAA;GACD,SACC,oBAAC,OAAD;IAAO,QAAO;IAAS,SAAS;IAAI,SAAA;cAClC,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA;IACd,CAAA;GAET,eAGC,oBAAC,kBAAD;IAAkB,eAAY;IAAO,IAAI;cACtC;IACgB,CAAA;GAEf,EAAA,CAAA;EACF,CAAA"}
+{"version":3,"file":"checkbox.mjs","names":[],"sources":["../../../src/components/checkbox/checkbox.tsx"],"sourcesContent":["import { useEffect, useId, useRef, type ReactNode, type Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\n\nexport type CheckboxProps = MergeRight<\n  LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'>,\n  {\n    /** Label */\n    label?: ReactNode;\n    /** Description */\n    description?: ReactNode;\n    /** Add error indication to the checkbox. */\n    error?: boolean;\n    /** Specify whether the Checkbox is indeterminate */\n    indeterminate?: boolean;\n    /** If true, the checkbox will take up the full width of the container, and not just \"fit-content\" which is default */\n    fullwidth?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Checkbox = ({\n  dark,\n  label,\n  description,\n  error,\n  fullwidth,\n  style,\n  className,\n  indeterminate,\n  ref,\n  id,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: CheckboxProps) => {\n  const checkRef = useRef<HTMLInputElement>(null);\n  const refs = useMergeRefs([checkRef, ref]);\n  const descriptionId = useId();\n\n  useEffect(() => {\n    let input: HTMLInputElement | null;\n    if (ref && typeof ref !== 'function') {\n      input = ref.current;\n    } else {\n      input = checkRef.current;\n    }\n\n    if (input) {\n      input.indeterminate = indeterminate || false;\n    }\n  }, [indeterminate, checkRef, ref]);\n\n  const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n  return (\n    <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth} asChild>\n      <label>\n        <Input\n          type='checkbox'\n          id={id}\n          ref={refs}\n          aria-invalid={error || undefined}\n          aria-describedby={ariaDescribedBy}\n          dark={dark}\n          {...props}\n        />\n        {label && (\n          <Label weight='medium' htmlFor={id} asChild>\n            <span>{label}</span>\n          </Label>\n        )}\n        {description && (\n          // Aria-hidden is used to prevent screen readers from reading the description twice:\n          // once as part of the label and once from being connected through aria-describedby.\n          <FieldDescription aria-hidden='true' id={descriptionId}>\n            {description}\n          </FieldDescription>\n        )}\n      </label>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;AA0BA,MAAa,YAAY,EACvB,MACA,OACA,aACA,OACA,WACA,OACA,WACA,eACA,KACA,IACA,oBAAoB,qBACpB,GAAG,YACgB;CACnB,MAAM,WAAW,OAAyB,KAAK;CAC/C,MAAM,OAAO,aAAa,CAAC,UAAU,IAAI,CAAC;CAC1C,MAAM,gBAAgB,OAAO;CAE7B,gBAAgB;EACd,IAAI;EACJ,IAAI,OAAO,OAAO,QAAQ,YACxB,QAAQ,IAAI;OAEZ,QAAQ,SAAS;EAGnB,IAAI,OACF,MAAM,gBAAgB,iBAAiB;IAExC;EAAC;EAAe;EAAU;EAAI,CAAC;CAElC,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,oBAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CAEpG,OACE,oBAAC,OAAD;EAAkB;EAAW,aAAW;EAAa;EAAkB;EAAW,SAAA;YAChF,qBAAC,SAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACD;IACJ,KAAK;IACL,gBAAc,SAAS,KAAA;IACvB,oBAAkB;IACZ;IACN,GAAI;IACJ,CAAA;GACD,SACC,oBAAC,OAAD;IAAO,QAAO;IAAS,SAAS;IAAI,SAAA;cAClC,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA;IACd,CAAA;GAET,eAGC,oBAAC,kBAAD;IAAkB,eAAY;IAAO,IAAI;cACtC;IACgB,CAAA;GAEf,EAAA,CAAA;EACF,CAAA"}

package/dist/components/checkbox/index.d.mts

@@ -1,2 +1,2 @@
-import { Qt as CheckboxProps, Xt as CheckboxSubsectionProps, Yt as CheckboxSubsection, Zt as Checkbox } from "../../alert-footer-CIn6xe4F.mjs";
+import { Qt as CheckboxProps, Xt as CheckboxSubsectionProps, Yt as CheckboxSubsection, Zt as Checkbox } from "../../alert-footer-D3W7nNsf.mjs";
 export { Checkbox, CheckboxProps, CheckboxSubsection, CheckboxSubsectionProps };

package/dist/components/chip/chip.d.mts

@@ -1,2 +1,2 @@
-import { Jt as ChipProps, qt as Chip } from "../../alert-footer-CIn6xe4F.mjs";
+import { Jt as ChipProps, qt as Chip } from "../../alert-footer-D3W7nNsf.mjs";
 export { Chip, ChipProps };

package/dist/components/chip/chip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"chip.mjs","names":[],"sources":["../../../src/components/chip/chip.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { Slot, Slottable } from '@radix-ui/react-slot';\nimport clsx from 'clsx';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\nimport { CheckThickIcon } from '@bi-digital/icons';\n\nexport type ChipProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The chip size\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium' | 'large';\n    /**\n     * The chip color\n     * @default 'primary'\n     */\n    color?: 'neutral' | 'info' | 'white' | 'primary' | 'alert' | 'warning' | 'success';\n    /** Set an icon before the chip label */\n    startIcon?: ReactNode;\n    ref?: Ref<HTMLDivElement>;\n    /**\n     * If true, the chip will be displayed as selected.\n     * @default false\n     */\n    selected?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n  }\n>;\n\nexport const Chip = ({\n  children,\n  color = 'primary',\n  size = 'medium',\n  startIcon,\n  dark,\n  selected = false,\n  asChild,\n  className,\n  ref,\n  ...props\n}: ChipProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component\n      className={clsx('bi-chip', className)}\n      data-color={color}\n      data-size={size}\n      data-dark={dark || undefined}\n      data-selected={selected || undefined}\n      ref={ref}\n      {...props}\n    >\n      {startIcon}\n      <Slottable>{children}</Slottable>\n      {selected && <CheckThickIcon aria-hidden='true' />}\n    </Component>\n  );\n};\n"],"mappings":";;;;;AAoCA,MAAa,QAAQ,EACnB,UACA,QAAQ,WACR,OAAO,UACP,WACA,MACA,WAAW,OACX,SACA,WACA,KACA,GAAG,YACY;AAGf,QACE,qBAHgB,UAAU,OAAO,OAGjC;EACE,WAAW,KAAK,WAAW,UAAU;EACrC,cAAY;EACZ,aAAW;EACX,aAAW,QAAQ,KAAA;EACnB,iBAAe,YAAY,KAAA;EACtB;EACL,GAAI;YAPN;GASG;GACD,oBAAC,WAAD,EAAY,UAAqB,CAAA;GAChC,YAAY,oBAAC,gBAAD,EAAgB,eAAY,QAAS,CAAA;GACxC"}
+{"version":3,"file":"chip.mjs","names":[],"sources":["../../../src/components/chip/chip.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { Slot, Slottable } from '@radix-ui/react-slot';\nimport clsx from 'clsx';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\nimport { CheckThickIcon } from '@bi-digital/icons';\n\nexport type ChipProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * The chip size\n     * @default 'medium'\n     */\n    size?: 'small' | 'medium' | 'large';\n    /**\n     * The chip color\n     * @default 'primary'\n     */\n    color?: 'neutral' | 'info' | 'white' | 'primary' | 'alert' | 'warning' | 'success';\n    /** Set an icon before the chip label */\n    startIcon?: ReactNode;\n    ref?: Ref<HTMLDivElement>;\n    /**\n     * If true, the chip will be displayed as selected.\n     * @default false\n     */\n    selected?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n  }\n>;\n\nexport const Chip = ({\n  children,\n  color = 'primary',\n  size = 'medium',\n  startIcon,\n  dark,\n  selected = false,\n  asChild,\n  className,\n  ref,\n  ...props\n}: ChipProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component\n      className={clsx('bi-chip', className)}\n      data-color={color}\n      data-size={size}\n      data-dark={dark || undefined}\n      data-selected={selected || undefined}\n      ref={ref}\n      {...props}\n    >\n      {startIcon}\n      <Slottable>{children}</Slottable>\n      {selected && <CheckThickIcon aria-hidden='true' />}\n    </Component>\n  );\n};\n"],"mappings":";;;;;AAoCA,MAAa,QAAQ,EACnB,UACA,QAAQ,WACR,OAAO,UACP,WACA,MACA,WAAW,OACX,SACA,WACA,KACA,GAAG,YACY;CAGf,OACE,qBAHgB,UAAU,OAAO,OAGjC;EACE,WAAW,KAAK,WAAW,UAAU;EACrC,cAAY;EACZ,aAAW;EACX,aAAW,QAAQ,KAAA;EACnB,iBAAe,YAAY,KAAA;EACtB;EACL,GAAI;YAPN;GASG;GACD,oBAAC,WAAD,EAAY,UAAqB,CAAA;GAChC,YAAY,oBAAC,gBAAD,EAAgB,eAAY,QAAS,CAAA;GACxC"}

package/dist/components/chip/index.d.mts

@@ -1,2 +1,2 @@
-import { Jt as ChipProps, qt as Chip } from "../../alert-footer-CIn6xe4F.mjs";
+import { Jt as ChipProps, qt as Chip } from "../../alert-footer-D3W7nNsf.mjs";
 export { Chip, ChipProps };

package/dist/components/details/details-content.d.mts

@@ -1,2 +1,2 @@
-import { Ut as DetailsContent, Wt as DetailsContentProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { Ut as DetailsContent, Wt as DetailsContentProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { DetailsContent, DetailsContentProps };

package/dist/components/details/details-content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"details-content.mjs","names":[],"sources":["../../../src/components/details/details-content.tsx"],"sourcesContent":["import { type HTMLAttributes, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { Slot } from '@radix-ui/react-slot';\n\nexport type DetailsContentProps = MergeRight<\n  HTMLAttributes<HTMLParagraphElement>,\n  {\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLParagraphElement>;\n  }\n>;\n\n/**\n * Details content component, contains the content to be shown or hidden.\n *\n * @example\n * <DetailsContent><p>Some content</p></DetailsContent>\n */\nexport const DetailsContent = ({ className, asChild, children, ref, ...rest }: DetailsContentProps) => {\n  const Component = asChild ? Slot : 'p';\n  return (\n    <Component ref={ref} className={className} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;;;;AAsBA,MAAa,kBAAkB,EAAE,WAAW,SAAS,UAAU,KAAK,GAAG,WAAgC;AAErG,QACE,oBAFgB,UAAU,OAAO,KAEjC;EAAgB;EAAgB;EAAW,GAAI;EAC5C;EACS,CAAA"}
+{"version":3,"file":"details-content.mjs","names":[],"sources":["../../../src/components/details/details-content.tsx"],"sourcesContent":["import { type HTMLAttributes, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { Slot } from '@radix-ui/react-slot';\n\nexport type DetailsContentProps = MergeRight<\n  HTMLAttributes<HTMLParagraphElement>,\n  {\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLParagraphElement>;\n  }\n>;\n\n/**\n * Details content component, contains the content to be shown or hidden.\n *\n * @example\n * <DetailsContent><p>Some content</p></DetailsContent>\n */\nexport const DetailsContent = ({ className, asChild, children, ref, ...rest }: DetailsContentProps) => {\n  const Component = asChild ? Slot : 'p';\n  return (\n    <Component ref={ref} className={className} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;;;;AAsBA,MAAa,kBAAkB,EAAE,WAAW,SAAS,UAAU,KAAK,GAAG,WAAgC;CAErG,OACE,oBAFgB,UAAU,OAAO,KAEjC;EAAgB;EAAgB;EAAW,GAAI;EAC5C;EACS,CAAA"}

package/dist/components/details/details-summary.d.mts

@@ -1,2 +1,2 @@
-import { Ht as DetailsSummaryProps, Vt as DetailsSummary } from "../../alert-footer-CIn6xe4F.mjs";
+import { Ht as DetailsSummaryProps, Vt as DetailsSummary } from "../../alert-footer-D3W7nNsf.mjs";
 export { DetailsSummary, DetailsSummaryProps };

package/dist/components/details/details-summary.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"details-summary.mjs","names":[],"sources":["../../../src/components/details/details-summary.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { ChevronDownIcon } from '@bi-digital/icons';\n\nexport type DetailsSummaryProps = MergeRight<\n  HTMLAttributes<HTMLElement>,\n  {\n    /** Header */\n    children: ReactNode;\n    /** Optionally replace the default icon. It will be rotated 180 degrees when the content is expanded */\n    icon?: ReactNode;\n    ref?: Ref<HTMLElement>;\n  }\n>;\n\n/**\n * Details summary component, contains a the heading to toggle the content.\n *\n * @example\n * <DetailsSummary>Heading</DetailsSummary>\n */\nexport const DetailsSummary = ({ className, children, icon, ref, ...rest }: DetailsSummaryProps) => {\n  return (\n    <summary ref={ref} className={className} {...rest}>\n      {children}\n      {icon ?? <ChevronDownIcon aria-hidden='true' />}\n    </summary>\n  );\n};\n"],"mappings":";;;;;;;;;AAqBA,MAAa,kBAAkB,EAAE,WAAW,UAAU,MAAM,KAAK,GAAG,WAAgC;AAClG,QACE,qBAAC,WAAD;EAAc;EAAgB;EAAW,GAAI;YAA7C,CACG,UACA,QAAQ,oBAAC,iBAAD,EAAiB,eAAY,QAAS,CAAA,CACvC"}
+{"version":3,"file":"details-summary.mjs","names":[],"sources":["../../../src/components/details/details-summary.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { ChevronDownIcon } from '@bi-digital/icons';\n\nexport type DetailsSummaryProps = MergeRight<\n  HTMLAttributes<HTMLElement>,\n  {\n    /** Header */\n    children: ReactNode;\n    /** Optionally replace the default icon. It will be rotated 180 degrees when the content is expanded */\n    icon?: ReactNode;\n    ref?: Ref<HTMLElement>;\n  }\n>;\n\n/**\n * Details summary component, contains a the heading to toggle the content.\n *\n * @example\n * <DetailsSummary>Heading</DetailsSummary>\n */\nexport const DetailsSummary = ({ className, children, icon, ref, ...rest }: DetailsSummaryProps) => {\n  return (\n    <summary ref={ref} className={className} {...rest}>\n      {children}\n      {icon ?? <ChevronDownIcon aria-hidden='true' />}\n    </summary>\n  );\n};\n"],"mappings":";;;;;;;;;AAqBA,MAAa,kBAAkB,EAAE,WAAW,UAAU,MAAM,KAAK,GAAG,WAAgC;CAClG,OACE,qBAAC,WAAD;EAAc;EAAgB;EAAW,GAAI;YAA7C,CACG,UACA,QAAQ,oBAAC,iBAAD,EAAiB,eAAY,QAAS,CAAA,CACvC"}

package/dist/components/details/details.d.mts

@@ -1,2 +1,2 @@
-import { Gt as Details, Kt as DetailsProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { Gt as Details, Kt as DetailsProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { Details, DetailsProps };

package/dist/components/details/details.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"details.mjs","names":[],"sources":["../../../src/components/details/details.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\n\nexport type DetailsProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDetailsElement>,\n  {\n    /**\n     * Controls open-state.\n     * Using this removes automatic control of open-state\n     *\n     * @default undefined\n     */\n    open?: boolean;\n    /**\n     * Defaults the details to open if not controlled\n     * @default false\n     */\n    defaultOpen?: boolean;\n    /**\n     * Callback function when Details toggles due to click on summary or find in page-search\n     * Must be defined if `open` prop is used\n     */\n    onToggle?: (open: boolean) => void;\n    /**\n     * Content should be one `<DetailsSummary>` and one `<DetailsContent>`\n     */\n    children?: ReactNode;\n    /**\n     * This attribute enables multiple `<Details>` elements to be connected, with only one open at a time.\n     * The name attribute specifies a group name — give multiple `<Details>` elements the same name value to group them.\n     * Only one of the grouped `<Details>` elements can be open at a time — opening one will cause another to close.\n     * If multiple grouped `<Details>` elements are given the open attribute, only the first one in the source order will be rendered open.\n     */\n    name?: string;\n    ref?: Ref<HTMLDetailsElement>;\n  }\n>;\n\n/**\n * Details component, built on top of the native `<details>` element.\n *\n * @example\n * <Details open={isOpen} onToggle={setIsOpen} name='optional-group-name'>\n *   <DetailsSummary>Heading</DetailsSummary>\n *   <DetailsContent>Content</DetailsContent>\n * </Details>\n */\nexport const Details = ({\n  className,\n  children,\n  dark,\n  open,\n  defaultOpen = false,\n  onToggle,\n  ref,\n  ...rest\n}: DetailsProps) => {\n  const [isOpen, setIsOpen] = useControllableState({\n    prop: open,\n    onChange: onToggle,\n    defaultProp: defaultOpen,\n    caller: 'Details',\n  });\n\n  return (\n    <details\n      className={clsx('bi-details', className)}\n      data-dark={dark}\n      open={isOpen || undefined} // Fallback to undefined to prevent rendering open=\"false\"\n      ref={ref}\n      onToggle={(e) => setIsOpen(e.currentTarget.open)}\n      {...rest}\n    >\n      {children}\n    </details>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkDA,MAAa,WAAW,EACtB,WACA,UACA,MACA,MACA,cAAc,OACd,UACA,KACA,GAAG,WACe;CAClB,MAAM,CAAC,QAAQ,aAAa,qBAAqB;EAC/C,MAAM;EACN,UAAU;EACV,aAAa;EACb,QAAQ;EACT,CAAC;AAEF,QACE,oBAAC,WAAD;EACE,WAAW,KAAK,cAAc,UAAU;EACxC,aAAW;EACX,MAAM,UAAU,KAAA;EACX;EACL,WAAW,MAAM,UAAU,EAAE,cAAc,KAAK;EAChD,GAAI;EAEH;EACO,CAAA"}
+{"version":3,"file":"details.mjs","names":[],"sources":["../../../src/components/details/details.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { type HTMLAttributes, type ReactNode, type Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\n\nexport type DetailsProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDetailsElement>,\n  {\n    /**\n     * Controls open-state.\n     * Using this removes automatic control of open-state\n     *\n     * @default undefined\n     */\n    open?: boolean;\n    /**\n     * Defaults the details to open if not controlled\n     * @default false\n     */\n    defaultOpen?: boolean;\n    /**\n     * Callback function when Details toggles due to click on summary or find in page-search\n     * Must be defined if `open` prop is used\n     */\n    onToggle?: (open: boolean) => void;\n    /**\n     * Content should be one `<DetailsSummary>` and one `<DetailsContent>`\n     */\n    children?: ReactNode;\n    /**\n     * This attribute enables multiple `<Details>` elements to be connected, with only one open at a time.\n     * The name attribute specifies a group name — give multiple `<Details>` elements the same name value to group them.\n     * Only one of the grouped `<Details>` elements can be open at a time — opening one will cause another to close.\n     * If multiple grouped `<Details>` elements are given the open attribute, only the first one in the source order will be rendered open.\n     */\n    name?: string;\n    ref?: Ref<HTMLDetailsElement>;\n  }\n>;\n\n/**\n * Details component, built on top of the native `<details>` element.\n *\n * @example\n * <Details open={isOpen} onToggle={setIsOpen} name='optional-group-name'>\n *   <DetailsSummary>Heading</DetailsSummary>\n *   <DetailsContent>Content</DetailsContent>\n * </Details>\n */\nexport const Details = ({\n  className,\n  children,\n  dark,\n  open,\n  defaultOpen = false,\n  onToggle,\n  ref,\n  ...rest\n}: DetailsProps) => {\n  const [isOpen, setIsOpen] = useControllableState({\n    prop: open,\n    onChange: onToggle,\n    defaultProp: defaultOpen,\n    caller: 'Details',\n  });\n\n  return (\n    <details\n      className={clsx('bi-details', className)}\n      data-dark={dark}\n      open={isOpen || undefined} // Fallback to undefined to prevent rendering open=\"false\"\n      ref={ref}\n      onToggle={(e) => setIsOpen(e.currentTarget.open)}\n      {...rest}\n    >\n      {children}\n    </details>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkDA,MAAa,WAAW,EACtB,WACA,UACA,MACA,MACA,cAAc,OACd,UACA,KACA,GAAG,WACe;CAClB,MAAM,CAAC,QAAQ,aAAa,qBAAqB;EAC/C,MAAM;EACN,UAAU;EACV,aAAa;EACb,QAAQ;EACT,CAAC;CAEF,OACE,oBAAC,WAAD;EACE,WAAW,KAAK,cAAc,UAAU;EACxC,aAAW;EACX,MAAM,UAAU,KAAA;EACX;EACL,WAAW,MAAM,UAAU,EAAE,cAAc,KAAK;EAChD,GAAI;EAEH;EACO,CAAA"}

package/dist/components/details/index.d.mts

@@ -1,2 +1,2 @@
-import { Gt as Details, Ht as DetailsSummaryProps, Kt as DetailsProps, Ut as DetailsContent, Vt as DetailsSummary, Wt as DetailsContentProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { Gt as Details, Ht as DetailsSummaryProps, Kt as DetailsProps, Ut as DetailsContent, Vt as DetailsSummary, Wt as DetailsContentProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { Details, DetailsContent, DetailsContentProps, DetailsProps, DetailsSummary, DetailsSummaryProps };

package/dist/components/dialog/dialog-close-button.d.mts

@@ -1,2 +1,2 @@
-import { At as DialogCloseButtonProps, kt as DialogCloseButton } from "../../alert-footer-CIn6xe4F.mjs";
+import { At as DialogCloseButtonProps, kt as DialogCloseButton } from "../../alert-footer-D3W7nNsf.mjs";
 export { DialogCloseButton, DialogCloseButtonProps };

package/dist/components/dialog/dialog-close-button.mjs

@@ -1,23 +1,23 @@
 import { Button } from "../button/button.mjs";
 import "../button/index.mjs";
 import { Context } from "./dialog-trigger-context.mjs";
+import clsx from "clsx/lite";
 import { CrossSmallIcon } from "@bi-digital/icons";
 import { jsx } from "react/jsx-runtime";
 import { use } from "react";
 //#region src/components/dialog/dialog-close-button.tsx
 /**
 * A button that can be used to close the dialog. Must be used inside a `Dialog` that is wrapped in a `DialogTriggerContext`.
-* If placed as the first direct child of the `Dialog`, it will be placed in the top right corner of the dialog, otherwise it will be placed where it is rendered.
+* When placed as a direct child of `Dialog`, it will be positioned absolutely in the top right corner.
 */
-const DialogCloseButton = ({ children, ref, ...props }) => {
+const DialogCloseButton = ({ children, ref, className, ...props }) => {
 	const { id } = use(Context);
 	return /* @__PURE__ */ jsx(Button, {
 		ref,
 		icon: true,
-		name: "close",
-		type: "submit",
 		variant: "text",
-		command: "close",
+		className: clsx("bi-dialog--close", className),
+		command: id ? "close" : void 0,
 		commandfor: id,
 		...props,
 		children: children || /* @__PURE__ */ jsx(CrossSmallIcon, { "aria-hidden": "true" })

package/dist/components/dialog/dialog-close-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-close-button.mjs","names":[],"sources":["../../../src/components/dialog/dialog-close-button.tsx"],"sourcesContent":["import { CrossSmallIcon } from '@bi-digital/icons';\nimport { Button, type ButtonProps } from '../button';\nimport { use } from 'react';\nimport { Context } from './dialog-trigger-context';\n\nexport type DialogCloseButtonProps = Omit<ButtonProps, 'asChild' | 'type' | 'name'>;\n\n/**\n * A button that can be used to close the dialog. Must be used inside a `Dialog` that is wrapped in a `DialogTriggerContext`.\n * If placed as the first direct child of the `Dialog`, it will be placed in the top right corner of the dialog, otherwise it will be placed where it is rendered.\n */\nexport const DialogCloseButton = ({ children, ref, ...props }: DialogCloseButtonProps) => {\n  const { id } = use(Context);\n  return (\n    <Button ref={ref} icon name='close' type='submit' variant='text' command='close' commandfor={id} {...props}>\n      {children || <CrossSmallIcon aria-hidden='true' />}\n    </Button>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAWA,MAAa,qBAAqB,EAAE,UAAU,KAAK,GAAG,YAAoC;CACxF,MAAM,EAAE,OAAO,IAAI,QAAQ;AAC3B,QACE,oBAAC,QAAD;EAAa;EAAK,MAAA;EAAK,MAAK;EAAQ,MAAK;EAAS,SAAQ;EAAO,SAAQ;EAAQ,YAAY;EAAI,GAAI;YAClG,YAAY,oBAAC,gBAAD,EAAgB,eAAY,QAAS,CAAA;EAC3C,CAAA"}
+{"version":3,"file":"dialog-close-button.mjs","names":[],"sources":["../../../src/components/dialog/dialog-close-button.tsx"],"sourcesContent":["import { CrossSmallIcon } from '@bi-digital/icons';\nimport { Button, type ButtonProps } from '../button';\nimport { use } from 'react';\nimport { Context } from './dialog-trigger-context';\nimport clsx from 'clsx/lite';\n\nexport type DialogCloseButtonProps = Omit<ButtonProps, 'asChild' | 'type' | 'name'>;\n\n/**\n * A button that can be used to close the dialog. Must be used inside a `Dialog` that is wrapped in a `DialogTriggerContext`.\n * When placed as a direct child of `Dialog`, it will be positioned absolutely in the top right corner.\n */\nexport const DialogCloseButton = ({ children, ref, className, ...props }: DialogCloseButtonProps) => {\n  const { id } = use(Context);\n  return (\n    <Button\n      ref={ref}\n      icon\n      variant='text'\n      className={clsx('bi-dialog--close', className)}\n      command={id ? 'close' : undefined}\n      commandfor={id}\n      {...props}\n    >\n      {children || <CrossSmallIcon aria-hidden='true' />}\n    </Button>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAYA,MAAa,qBAAqB,EAAE,UAAU,KAAK,WAAW,GAAG,YAAoC;CACnG,MAAM,EAAE,OAAO,IAAI,QAAQ;CAC3B,OACE,oBAAC,QAAD;EACO;EACL,MAAA;EACA,SAAQ;EACR,WAAW,KAAK,oBAAoB,UAAU;EAC9C,SAAS,KAAK,UAAU,KAAA;EACxB,YAAY;EACZ,GAAI;YAEH,YAAY,oBAAC,gBAAD,EAAgB,eAAY,QAAS,CAAA;EAC3C,CAAA"}

package/dist/components/dialog/dialog-content.d.mts

@@ -1,2 +1,2 @@
-import { Lt as DialogContent, Rt as DialogContentProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { Lt as DialogContent, Rt as DialogContentProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { DialogContent, DialogContentProps };

package/dist/components/dialog/dialog-content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-content.mjs","names":[],"sources":["../../../src/components/dialog/dialog-content.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport type { MergeRight } from '../../utilities';\n\nexport type DialogContentProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Don't render a border to separate the content from the other content.\n     * @default false\n     */\n    noBorder?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const DialogContent = ({ asChild, ref, children, className, noBorder = false, ...rest }: DialogContentProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component className={clsx('bi-dialog--content', className)} data-no-border={noBorder} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAsBA,MAAa,iBAAiB,EAAE,SAAS,KAAK,UAAU,WAAW,WAAW,OAAO,GAAG,WAA+B;AAGrH,QACE,oBAHgB,UAAU,OAAO,OAGjC;EAAW,WAAW,KAAK,sBAAsB,UAAU;EAAE,kBAAgB;EAAe;EAAK,GAAI;EAClG;EACS,CAAA"}
+{"version":3,"file":"dialog-content.mjs","names":[],"sources":["../../../src/components/dialog/dialog-content.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport type { MergeRight } from '../../utilities';\n\nexport type DialogContentProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Don't render a border to separate the content from the other content.\n     * @default false\n     */\n    noBorder?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const DialogContent = ({ asChild, ref, children, className, noBorder = false, ...rest }: DialogContentProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component className={clsx('bi-dialog--content', className)} data-no-border={noBorder} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAsBA,MAAa,iBAAiB,EAAE,SAAS,KAAK,UAAU,WAAW,WAAW,OAAO,GAAG,WAA+B;CAGrH,OACE,oBAHgB,UAAU,OAAO,OAGjC;EAAW,WAAW,KAAK,sBAAsB,UAAU;EAAE,kBAAgB;EAAe;EAAK,GAAI;EAClG;EACS,CAAA"}

package/dist/components/dialog/dialog-footer.d.mts

@@ -1,2 +1,2 @@
-import { Nt as DialogFooter, Pt as DialogFooterProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { Nt as DialogFooter, Pt as DialogFooterProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { DialogFooter, DialogFooterProps };

package/dist/components/dialog/dialog-footer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-footer.mjs","names":[],"sources":["../../../src/components/dialog/dialog-footer.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport type { MergeRight } from '../../utilities';\n\nexport type DialogFooterProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Don't render a border to separate the footer from the other content.\n     * @default false\n     */\n    noBorder?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const DialogFooter = ({ asChild, ref, children, className, noBorder = false, ...rest }: DialogFooterProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component className={clsx('bi-dialog--footer', className)} data-no-border={noBorder} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAsBA,MAAa,gBAAgB,EAAE,SAAS,KAAK,UAAU,WAAW,WAAW,OAAO,GAAG,WAA8B;AAGnH,QACE,oBAHgB,UAAU,OAAO,OAGjC;EAAW,WAAW,KAAK,qBAAqB,UAAU;EAAE,kBAAgB;EAAe;EAAK,GAAI;EACjG;EACS,CAAA"}
+{"version":3,"file":"dialog-footer.mjs","names":[],"sources":["../../../src/components/dialog/dialog-footer.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport type { MergeRight } from '../../utilities';\n\nexport type DialogFooterProps = MergeRight<\n  HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Don't render a border to separate the footer from the other content.\n     * @default false\n     */\n    noBorder?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\nexport const DialogFooter = ({ asChild, ref, children, className, noBorder = false, ...rest }: DialogFooterProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component className={clsx('bi-dialog--footer', className)} data-no-border={noBorder} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAsBA,MAAa,gBAAgB,EAAE,SAAS,KAAK,UAAU,WAAW,WAAW,OAAO,GAAG,WAA8B;CAGnH,OACE,oBAHgB,UAAU,OAAO,OAGjC;EAAW,WAAW,KAAK,qBAAqB,UAAU;EAAE,kBAAgB;EAAe;EAAK,GAAI;EACjG;EACS,CAAA"}

package/dist/components/dialog/dialog-header.d.mts

@@ -1,2 +1,2 @@
-import { Ft as DialogHeader, It as DialogHeaderProps } from "../../alert-footer-CIn6xe4F.mjs";
+import { Ft as DialogHeader, It as DialogHeaderProps } from "../../alert-footer-D3W7nNsf.mjs";
 export { DialogHeader, DialogHeaderProps };

package/dist/components/dialog/dialog-header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-header.mjs","names":[],"sources":["../../../src/components/dialog/dialog-header.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport type { MergeRight } from '../../utilities';\n\nexport type DialogHeaderProps = MergeRight<\n  HTMLAttributes<HTMLHeadingElement>,\n  {\n    /**\n     * Don't render a border to separate the header from the other content.\n     * @default false\n     */\n    noBorder?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLHeadingElement>;\n  }\n>;\n\nexport const DialogHeader = ({ asChild, ref, children, className, noBorder = false, ...rest }: DialogHeaderProps) => {\n  const Component = asChild ? Slot : 'h2';\n\n  return (\n    <Component className={clsx('bi-dialog--header', className)} data-no-border={noBorder} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAsBA,MAAa,gBAAgB,EAAE,SAAS,KAAK,UAAU,WAAW,WAAW,OAAO,GAAG,WAA8B;AAGnH,QACE,oBAHgB,UAAU,OAAO,MAGjC;EAAW,WAAW,KAAK,qBAAqB,UAAU;EAAE,kBAAgB;EAAe;EAAK,GAAI;EACjG;EACS,CAAA"}
+{"version":3,"file":"dialog-header.mjs","names":[],"sources":["../../../src/components/dialog/dialog-header.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { HTMLAttributes, Ref } from 'react';\nimport clsx from 'clsx/lite';\nimport type { MergeRight } from '../../utilities';\n\nexport type DialogHeaderProps = MergeRight<\n  HTMLAttributes<HTMLHeadingElement>,\n  {\n    /**\n     * Don't render a border to separate the header from the other content.\n     * @default false\n     */\n    noBorder?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLHeadingElement>;\n  }\n>;\n\nexport const DialogHeader = ({ asChild, ref, children, className, noBorder = false, ...rest }: DialogHeaderProps) => {\n  const Component = asChild ? Slot : 'h2';\n\n  return (\n    <Component className={clsx('bi-dialog--header', className)} data-no-border={noBorder} ref={ref} {...rest}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAsBA,MAAa,gBAAgB,EAAE,SAAS,KAAK,UAAU,WAAW,WAAW,OAAO,GAAG,WAA8B;CAGnH,OACE,oBAHgB,UAAU,OAAO,MAGjC;EAAW,WAAW,KAAK,qBAAqB,UAAU;EAAE,kBAAgB;EAAe;EAAK,GAAI;EACjG;EACS,CAAA"}

package/dist/components/dialog/dialog-trigger-context.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-trigger-context.mjs","names":[],"sources":["../../../src/components/dialog/dialog-trigger-context.tsx"],"sourcesContent":["import { createContext, useState } from 'react';\nimport type { ReactNode } from 'react';\n\ntype DialogContext = { id?: string };\nexport const Context = createContext<DialogContext & { setContext?: (context: DialogContext) => void }>({});\n\nexport type DialogTriggerContextProps = { children: ReactNode };\n\nexport const DialogTriggerContext = ({ children }: DialogTriggerContextProps) => {\n  const [state, setState] = useState<DialogContext>({});\n  const setContext = (next: DialogContext) => setState({ ...state, ...next });\n\n  return <Context.Provider value={{ ...state, setContext }}>{children}</Context.Provider>;\n};\n"],"mappings":";;;AAIA,MAAa,UAAU,cAAiF,EAAE,CAAC;AAI3G,MAAa,wBAAwB,EAAE,eAA0C;CAC/E,MAAM,CAAC,OAAO,YAAY,SAAwB,EAAE,CAAC;CACrD,MAAM,cAAc,SAAwB,SAAS;EAAE,GAAG;EAAO,GAAG;EAAM,CAAC;AAE3E,QAAO,oBAAC,QAAQ,UAAT;EAAkB,OAAO;GAAE,GAAG;GAAO;GAAY;EAAG;EAA4B,CAAA"}
+{"version":3,"file":"dialog-trigger-context.mjs","names":[],"sources":["../../../src/components/dialog/dialog-trigger-context.tsx"],"sourcesContent":["import { createContext, useState } from 'react';\nimport type { ReactNode } from 'react';\n\ntype DialogContext = { id?: string };\nexport const Context = createContext<DialogContext & { setContext?: (context: DialogContext) => void }>({});\n\nexport type DialogTriggerContextProps = { children: ReactNode };\n\nexport const DialogTriggerContext = ({ children }: DialogTriggerContextProps) => {\n  const [state, setState] = useState<DialogContext>({});\n  const setContext = (next: DialogContext) => setState({ ...state, ...next });\n\n  return <Context.Provider value={{ ...state, setContext }}>{children}</Context.Provider>;\n};\n"],"mappings":";;;AAIA,MAAa,UAAU,cAAiF,EAAE,CAAC;AAI3G,MAAa,wBAAwB,EAAE,eAA0C;CAC/E,MAAM,CAAC,OAAO,YAAY,SAAwB,EAAE,CAAC;CACrD,MAAM,cAAc,SAAwB,SAAS;EAAE,GAAG;EAAO,GAAG;EAAM,CAAC;CAE3E,OAAO,oBAAC,QAAQ,UAAT;EAAkB,OAAO;GAAE,GAAG;GAAO;GAAY;EAAG;EAA4B,CAAA"}

package/dist/components/dialog/dialog-trigger.d.mts

@@ -1,2 +1,2 @@
-import { Mt as DialogTriggerProps, jt as DialogTrigger } from "../../alert-footer-CIn6xe4F.mjs";
+import { Mt as DialogTriggerProps, jt as DialogTrigger } from "../../alert-footer-D3W7nNsf.mjs";
 export { DialogTrigger, DialogTriggerProps };

package/dist/components/dialog/dialog-trigger.mjs

@@ -9,7 +9,7 @@ const DialogTrigger = ({ asChild, ref, ...rest }) => {
 	const { id } = use(Context);
 	return /* @__PURE__ */ jsx(asChild ? Slot : Button, {
 		suppressHydrationWarning: true,
-		command: "show-modal",
+		command: id ? "show-modal" : void 0,
 		commandfor: id,
 		ref,
 		...rest