@clubmed/trident-ui 1.3.0-beta.4 → 1.3.0-beta.6

package/molecules/Buttons/ButtonAnchor.d.ts

@@ -1,8 +1,7 @@
 import type { AnchorHTMLAttributes, FunctionComponent, PropsWithChildren } from 'react';
-import './button.css';
 import { type CommonButtonProps } from './Button';
-interface ButtonAnchorProps extends CommonButtonProps, AnchorHTMLAttributes<HTMLAnchorElement> {
+type ButtonAnchorProps = CommonButtonProps & {
     component?: FunctionComponent<PropsWithChildren<any>> | string;
-}
+} & AnchorHTMLAttributes<HTMLAnchorElement>;
 export declare const ButtonAnchor: FunctionComponent<ButtonAnchorProps>;
 export {};

package/molecules/Buttons/ButtonAnchor.js

@@ -1,40 +1,18 @@
-import { jsx as m } from "react/jsx-runtime";
-import { c as C } from "../../chunks/index.js";
-/* empty css                  */
-import "react";
-import { variants as y, rootClassName as B } from "./Button.helpers.js";
-import { themes as w } from "./Button.themes.js";
-import { ButtonContent as A } from "./ButtonContent.js";
-const D = ({
-  theme: s = "yellow",
-  component: r = "a",
-  backgroundOverride: e,
-  variant: t = "text",
-  className: n,
-  label: o,
-  children: a,
-  title: c,
-  icon: p,
-  dataTestId: i,
-  href: l,
-  groupName: f = "",
-  ...h
-}) => {
-  const u = t === "text", d = y[t], x = w(s, e, f);
-  return /* @__PURE__ */ m(
-    r,
-    {
-      "data-name": "ButtonAnchor",
-      "data-testid": i,
-      className: C(B, x, d, t, n),
-      title: c || o,
-      href: l,
-      ...h,
-      children: /* @__PURE__ */ m(A, { showLabel: u, label: o, icon: p, children: a })
-    }
-  );
+import { jsxs as n } from "react/jsx-runtime";
+import { ButtonAnchor as r } from "./v2/ButtonAnchor.js";
+import { BUTTON_VARIANT_LEGACY as c, BUTTON_THEME_LEGACY as e } from "./Button.js";
+const i = (t) => {
+  const o = {
+    ...t,
+    ...e[t.theme] || {},
+    ...c[t.variant] || {}
+  };
+  return /* @__PURE__ */ n(r, { ...o, children: [
+    o.label,
+    t.children
+  ] });
 };
 export {
-  D as ButtonAnchor
+  i as ButtonAnchor
 };
 //# sourceMappingURL=ButtonAnchor.js.map

package/molecules/Buttons/ButtonAnchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonAnchor.js","sources":["../../../lib/molecules/Buttons/ButtonAnchor.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { AnchorHTMLAttributes, FunctionComponent, PropsWithChildren } from 'react';\nimport './button.css';\nimport { type CommonButtonProps } from './Button';\nimport { rootClassName, variants } from './Button.helpers';\nimport { themes } from './Button.themes';\nimport { ButtonContent } from './ButtonContent';\n\ninterface ButtonAnchorProps extends CommonButtonProps, AnchorHTMLAttributes<HTMLAnchorElement> {\n  component?: FunctionComponent<PropsWithChildren<any>> | string;\n}\n\nexport const ButtonAnchor: FunctionComponent<ButtonAnchorProps> = ({\n  theme = 'yellow',\n  component = 'a',\n  backgroundOverride,\n  variant = 'text',\n  className,\n  label,\n  children,\n  title,\n  icon,\n  dataTestId,\n  href,\n  groupName = '',\n  ...rest\n}) => {\n  const showLabel = variant === 'text';\n  const layout = variants[variant];\n  const style = themes(theme, backgroundOverride, groupName);\n  const Cmp = component as FunctionComponent<PropsWithChildren<ButtonAnchorProps>>;\n\n  return (\n    <Cmp\n      data-name=\"ButtonAnchor\"\n      data-testid={dataTestId}\n      className={classNames(rootClassName, style, layout, variant, className)}\n      title={title || label}\n      href={href}\n      {...rest}\n    >\n      <ButtonContent showLabel={showLabel} label={label} icon={icon}>\n        {children}\n      </ButtonContent>\n    </Cmp>\n  );\n};\n"],"names":["ButtonAnchor","theme","component","backgroundOverride","variant","className","label","children","title","icon","dataTestId","href","groupName","rest","showLabel","layout","variants","style","themes","jsx","classNames","rootClassName","ButtonContent"],"mappings":";;;;;;;AAYO,MAAMA,IAAqD,CAAC;AAAA,EACjE,OAAAC,IAAQ;AAAA,EACR,WAAAC,IAAY;AAAA,EACZ,oBAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,YAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAYV,MAAY,QACxBW,IAASC,EAASZ,CAAO,GACzBa,IAAQC,EAAOjB,GAAOE,GAAoBS,CAAS;AAIvD,SAAA,gBAAAO;AAAA,IAHUjB;AAAA,IAGT;AAAA,MACC,aAAU;AAAA,MACV,eAAaQ;AAAA,MACb,WAAWU,EAAWC,GAAeJ,GAAOF,GAAQX,GAASC,CAAS;AAAA,MACtE,OAAOG,KAASF;AAAA,MAChB,MAAAK;AAAA,MACC,GAAGE;AAAA,MAEJ,UAAC,gBAAAM,EAAAG,GAAA,EAAc,WAAAR,GAAsB,OAAAR,GAAc,MAAAG,GAChD,UAAAF,GACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"ButtonAnchor.js","sources":["../../../lib/molecules/Buttons/ButtonAnchor.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, FunctionComponent, PropsWithChildren } from 'react';\nimport { ButtonAnchor as ButtonAnchorV2 } from './v2/ButtonAnchor';\nimport { BUTTON_THEME_LEGACY, BUTTON_VARIANT_LEGACY, type CommonButtonProps } from './Button';\n\ntype ButtonAnchorProps = CommonButtonProps & {\n  component?: FunctionComponent<PropsWithChildren<any>> | string;\n} & AnchorHTMLAttributes<HTMLAnchorElement>;\n\nexport const ButtonAnchor: FunctionComponent<ButtonAnchorProps> = (props) => {\n  const opts = {\n    ...props,\n    ...(BUTTON_THEME_LEGACY[props.theme!] || {}),\n    ...(BUTTON_VARIANT_LEGACY[props.variant!] || {}),\n  };\n\n  return (\n    <ButtonAnchorV2 {...opts}>\n      {opts.label}\n      {props.children}\n    </ButtonAnchorV2>\n  );\n};\n"],"names":["ButtonAnchor","props","opts","BUTTON_THEME_LEGACY","BUTTON_VARIANT_LEGACY","jsxs","ButtonAnchorV2"],"mappings":";;;AAQO,MAAMA,IAAqD,CAACC,MAAU;AAC3E,QAAMC,IAAO;AAAA,IACX,GAAGD;AAAA,IACH,GAAIE,EAAoBF,EAAM,KAAM,KAAK,CAAA;AAAA,IACzC,GAAIG,EAAsBH,EAAM,OAAQ,KAAK,CAAA;AAAA,EAAC;AAGhD,SACE,gBAAAI,EAACC,GAAA,EAAgB,GAAGJ,GACjB,UAAA;AAAA,IAAAA,EAAK;AAAA,IACLD,EAAM;AAAA,EAAA,GACT;AAEJ;"}

package/molecules/Buttons/ButtonContent.d.ts

@@ -1,9 +1,17 @@
 import type { FunctionComponent, ReactNode } from 'react';
 import { type IconicNames, type IconicTypes } from '../../atoms/Icons';
-export declare const ButtonContent: FunctionComponent<{
-    showLabel: boolean;
+export type ButtonContentProps = {
+    /**
+     * @deprecated
+     */
+    showLabel?: boolean;
+    /**
+     * @deprecated
+     */
     label?: string;
     children?: ReactNode;
     icon?: IconicNames;
     iconType?: IconicTypes;
-}>;
+    iconWidth?: string;
+};
+export declare const ButtonContent: FunctionComponent<ButtonContentProps>;

package/molecules/Buttons/ButtonContent.js

@@ -1,12 +1,19 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
-import { Icon as p } from "../../atoms/Icons/Icon.js";
+import { jsxs as p, jsx as n } from "react/jsx-runtime";
+import { Icon as c } from "../../atoms/Icons/Icon.js";
 import "@clubmed/trident-icons";
-const l = ({ showLabel: r, label: t, children: s, icon: e, iconType: o }) => /* @__PURE__ */ m("span", { className: "flex items-center justify-center gap-x-8 w-full", children: [
-  r ? t : /* @__PURE__ */ n("span", { className: "sr-only", children: t }),
+const f = ({
+  showLabel: r,
+  label: t,
+  children: s,
+  icon: e,
+  iconType: o,
+  iconWidth: m
+}) => /* @__PURE__ */ p("span", { className: "flex items-center justify-center gap-x-8 w-full", children: [
+  r ? t : t && /* @__PURE__ */ n("span", { className: "sr-only", children: t }),
   s,
-  e && /* @__PURE__ */ n(p, { width: "24px", name: e, type: o })
+  e && /* @__PURE__ */ n(c, { name: e, width: m ?? "24px", type: o })
 ] });
 export {
-  l as ButtonContent
+  f as ButtonContent
 };
 //# sourceMappingURL=ButtonContent.js.map

package/molecules/Buttons/ButtonContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonContent.js","sources":["../../../lib/molecules/Buttons/ButtonContent.tsx"],"sourcesContent":["import type { FunctionComponent, ReactNode } from 'react';\n\nimport { Icon, type IconicNames, type IconicTypes } from '@/atoms/Icons';\n\nexport const ButtonContent: FunctionComponent<{\n  showLabel: boolean;\n  label?: string;\n  children?: ReactNode;\n  icon?: IconicNames;\n  iconType?: IconicTypes;\n}> = ({ showLabel, label, children, icon, iconType }) => {\n  return (\n    <span className=\"flex items-center justify-center gap-x-8 w-full\">\n      {showLabel ? label : <span className=\"sr-only\">{label}</span>}\n      {children}\n      {icon && <Icon width=\"24px\" name={icon} type={iconType} />}\n    </span>\n  );\n};\n"],"names":["ButtonContent","showLabel","label","children","icon","iconType","jsxs","jsx","Icon"],"mappings":";;;AAIa,MAAAA,IAMR,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,UAAAC,GAAU,MAAAC,GAAM,UAAAC,QAEtC,gBAAAC,EAAC,QAAK,EAAA,WAAU,mDACb,UAAA;AAAA,EAAAL,IAAYC,IAAQ,gBAAAK,EAAC,QAAK,EAAA,WAAU,WAAW,UAAML,GAAA;AAAA,EACrDC;AAAA,EACAC,uBAASI,GAAK,EAAA,OAAM,QAAO,MAAMJ,GAAM,MAAMC,GAAU;AAC1D,EAAA,CAAA;"}
+{"version":3,"file":"ButtonContent.js","sources":["../../../lib/molecules/Buttons/ButtonContent.tsx"],"sourcesContent":["import type { FunctionComponent, ReactNode } from 'react';\n\nimport { Icon, type IconicNames, type IconicTypes } from '@/atoms/Icons';\n\nexport type ButtonContentProps = {\n  /**\n   * @deprecated\n   */\n  showLabel?: boolean;\n  /**\n   * @deprecated\n   */\n  label?: string;\n  children?: ReactNode;\n  icon?: IconicNames;\n  iconType?: IconicTypes;\n  iconWidth?: string;\n};\n\nexport const ButtonContent: FunctionComponent<ButtonContentProps> = ({\n  showLabel,\n  label,\n  children,\n  icon,\n  iconType,\n  iconWidth,\n}) => {\n  return (\n    <span className=\"flex items-center justify-center gap-x-8 w-full\">\n      {showLabel ? label : label && <span className=\"sr-only\">{label}</span>}\n      {children}\n      {icon && <Icon name={icon} width={iconWidth ?? '24px'} type={iconType} />}\n    </span>\n  );\n};\n"],"names":["ButtonContent","showLabel","label","children","icon","iconType","iconWidth","jsxs","jsx","Icon"],"mappings":";;;AAmBO,MAAMA,IAAuD,CAAC;AAAA,EACnE,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,MAEI,gBAAAC,EAAC,QAAA,EAAK,WAAU,mDACb,UAAA;AAAA,EAAAN,IAAYC,IAAQA,KAAS,gBAAAM,EAAC,QAAA,EAAK,WAAU,WAAW,UAAAN,GAAM;AAAA,EAC9DC;AAAA,EACAC,uBAASK,GAAA,EAAK,MAAML,GAAM,OAAOE,KAAa,QAAQ,MAAMD,EAAA,CAAU;AAAA,GACzE;"}

package/molecules/Buttons/FakeButton.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentPropsWithoutRef, FunctionComponent } from 'react';
+import { type ButtonProps } from './v2/Button.type';
+import './v2/Button.css';
+interface Props extends ButtonProps, Omit<ComponentPropsWithoutRef<'span'>, 'color'> {
+}
+export declare const FakeButton: FunctionComponent<Props>;
+export {};

package/molecules/Buttons/FakeButton.js

@@ -0,0 +1,27 @@
+import { jsx as o } from "react/jsx-runtime";
+import { c as l } from "../../chunks/index.js";
+import { getButtonClasses as f } from "./v2/Button.type.js";
+import { ButtonContent as c } from "./ButtonContent.js";
+/* empty css                  */
+const g = ({
+  className: t,
+  children: r,
+  color: s = "saffron",
+  icon: m,
+  iconWidth: n,
+  size: e = "medium",
+  theme: a = "solid",
+  variant: i = "pill",
+  ...p
+}) => /* @__PURE__ */ o(
+  "span",
+  {
+    ...p,
+    className: l(f({ color: s, size: e, theme: a, variant: i }), t),
+    children: /* @__PURE__ */ o(c, { icon: m, iconWidth: n, children: r })
+  }
+);
+export {
+  g as FakeButton
+};
+//# sourceMappingURL=FakeButton.js.map

package/molecules/Buttons/FakeButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FakeButton.js","sources":["../../../lib/molecules/Buttons/FakeButton.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport type { ComponentPropsWithoutRef, FunctionComponent } from 'react';\n\nimport { getButtonClasses, type ButtonProps } from './v2/Button.type';\n\nimport { ButtonContent } from './ButtonContent';\n\nimport './v2/Button.css';\n\ninterface Props extends ButtonProps, Omit<ComponentPropsWithoutRef<'span'>, 'color'> {}\n\nexport const FakeButton: FunctionComponent<Props> = ({\n  className,\n  children,\n  color = 'saffron',\n  icon,\n  iconWidth,\n  size = 'medium',\n  theme = 'solid',\n  variant = 'pill',\n  ...attrs\n}) => {\n  return (\n    <span\n      {...attrs}\n      className={classnames(getButtonClasses({ color, size, theme, variant }), className)}\n    >\n      <ButtonContent icon={icon} iconWidth={iconWidth}>\n        {children}\n      </ButtonContent>\n    </span>\n  );\n};\n"],"names":["FakeButton","className","children","color","icon","iconWidth","size","theme","variant","attrs","jsx","classnames","getButtonClasses","ButtonContent"],"mappings":";;;;;AAWO,MAAMA,IAAuC,CAAC;AAAA,EACnD,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACE,GAAGD;AAAA,IACJ,WAAWE,EAAWC,EAAiB,EAAE,OAAAT,GAAO,MAAAG,GAAM,OAAAC,GAAO,SAAAC,GAAS,GAAGP,CAAS;AAAA,IAElF,UAAA,gBAAAS,EAACG,GAAA,EAAc,MAAAT,GAAY,WAAAC,GACxB,UAAAH,EAAA,CACH;AAAA,EAAA;AAAA;"}

package/molecules/Buttons/InertButton.d.ts

@@ -1,3 +1,7 @@
 import type { FunctionComponent } from 'react';
 import { type CommonButtonProps } from './Button';
+/**
+ * @deprecated Use `FakeButton` instead.
+ * @param props
+ */
 export declare const InertButton: FunctionComponent<CommonButtonProps>;

package/molecules/Buttons/InertButton.js

@@ -1,35 +1,18 @@
-import { jsx as s } from "react/jsx-runtime";
-import { c as d } from "../../chunks/index.js";
-import "react";
-/* empty css                  */
-import { variants as x, rootClassName as h } from "./Button.helpers.js";
-import { themes as y } from "./Button.themes.js";
-import { ButtonContent as B } from "./ButtonContent.js";
-const g = ({
-  theme: e = "yellow",
-  backgroundOverride: r,
-  variant: t = "text",
-  className: m,
-  label: o,
-  children: n,
-  title: a,
-  icon: i,
-  dataTestId: p,
-  groupName: c = ""
-}) => {
-  const l = t === "text", f = x[t], u = y(e, r, c);
-  return /* @__PURE__ */ s(
-    "span",
-    {
-      "data-name": "InertButton",
-      "data-testid": p,
-      className: d(h, u, f, t, m),
-      title: a || o,
-      children: /* @__PURE__ */ s(B, { showLabel: l, label: o, icon: i, children: n })
-    }
-  );
+import { jsxs as e } from "react/jsx-runtime";
+import { BUTTON_VARIANT_LEGACY as n, BUTTON_THEME_LEGACY as o } from "./Button.js";
+import { FakeButton as m } from "./FakeButton.js";
+const c = (t) => {
+  const r = {
+    ...t,
+    ...o[t.theme] || {},
+    ...n[t.variant] || {}
+  };
+  return /* @__PURE__ */ e(m, { ...r, children: [
+    r.label,
+    t.children
+  ] });
 };
 export {
-  g as InertButton
+  c as InertButton
 };
 //# sourceMappingURL=InertButton.js.map

package/molecules/Buttons/InertButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"InertButton.js","sources":["../../../lib/molecules/Buttons/InertButton.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { FunctionComponent } from 'react';\n\nimport { type CommonButtonProps } from './Button';\nimport { rootClassName, variants } from './Button.helpers';\nimport { themes } from './Button.themes';\nimport { ButtonContent } from './ButtonContent';\n\nexport const InertButton: FunctionComponent<CommonButtonProps> = ({\n  theme = 'yellow',\n  backgroundOverride,\n  variant = 'text',\n  className,\n  label,\n  children,\n  title,\n  icon,\n  dataTestId,\n  groupName = '',\n}) => {\n  const showLabel = variant === 'text';\n  const layout = variants[variant];\n  const style = themes(theme, backgroundOverride, groupName);\n\n  return (\n    <span\n      data-name=\"InertButton\"\n      data-testid={dataTestId}\n      className={classNames(rootClassName, style, layout, variant, className)}\n      title={title || label}\n    >\n      <ButtonContent showLabel={showLabel} label={label} icon={icon}>\n        {children}\n      </ButtonContent>\n    </span>\n  );\n};\n"],"names":["InertButton","theme","backgroundOverride","variant","className","label","children","title","icon","dataTestId","groupName","showLabel","layout","variants","style","themes","jsx","classNames","rootClassName","ButtonContent"],"mappings":";;;;;;;AAQO,MAAMA,IAAoD,CAAC;AAAA,EAChE,OAAAC,IAAQ;AAAA,EACR,oBAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC,IAAY;AACd,MAAM;AACJ,QAAMC,IAAYR,MAAY,QACxBS,IAASC,EAASV,CAAO,GACzBW,IAAQC,EAAOd,GAAOC,GAAoBQ,CAAS;AAGvD,SAAA,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,eAAaP;AAAA,MACb,WAAWQ,EAAWC,GAAeJ,GAAOF,GAAQT,GAASC,CAAS;AAAA,MACtE,OAAOG,KAASF;AAAA,MAEhB,UAAC,gBAAAW,EAAAG,GAAA,EAAc,WAAAR,GAAsB,OAAAN,GAAc,MAAAG,GAChD,UAAAF,GACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"InertButton.js","sources":["../../../lib/molecules/Buttons/InertButton.tsx"],"sourcesContent":["import type { FunctionComponent } from 'react';\n\nimport { BUTTON_THEME_LEGACY, BUTTON_VARIANT_LEGACY, type CommonButtonProps } from './Button';\nimport { FakeButton } from '@/molecules/Buttons/FakeButton';\n\n/**\n * @deprecated Use `FakeButton` instead.\n * @param props\n */\nexport const InertButton: FunctionComponent<CommonButtonProps> = (props) => {\n  const opts = {\n    ...props,\n    ...(BUTTON_THEME_LEGACY[props.theme!] || {}),\n    ...(BUTTON_VARIANT_LEGACY[props.variant!] || {}),\n  };\n\n  return (\n    <FakeButton {...opts}>\n      {opts.label}\n      {props.children}\n    </FakeButton>\n  );\n};\n"],"names":["InertButton","props","opts","BUTTON_THEME_LEGACY","BUTTON_VARIANT_LEGACY","jsxs","FakeButton"],"mappings":";;;AASO,MAAMA,IAAoD,CAACC,MAAU;AAC1E,QAAMC,IAAO;AAAA,IACX,GAAGD;AAAA,IACH,GAAIE,EAAoBF,EAAM,KAAM,KAAK,CAAA;AAAA,IACzC,GAAIG,EAAsBH,EAAM,OAAQ,KAAK,CAAA;AAAA,EAAC;AAGhD,SACE,gBAAAI,EAACC,GAAA,EAAY,GAAGJ,GACb,UAAA;AAAA,IAAAA,EAAK;AAAA,IACLD,EAAM;AAAA,EAAA,GACT;AAEJ;"}

package/molecules/Buttons/v2/Button.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentPropsWithoutRef, FunctionComponent } from 'react';
+import { type ButtonProps as Btn } from './Button.type';
+import './Button.css';
+export interface ButtonProps extends Btn, Omit<ComponentPropsWithoutRef<'button'>, 'color'> {
+    /**
+     * @deprecated use `data-testid` instead
+     */
+    dataTestId?: string;
+}
+export declare const Button: FunctionComponent<ButtonProps>;

package/molecules/Buttons/v2/Button.js

@@ -0,0 +1,32 @@
+"use client";
+import { jsx as t } from "react/jsx-runtime";
+import { c as p } from "../../../chunks/index.js";
+import { getButtonClasses as c } from "./Button.type.js";
+import { ButtonContent as d } from "../ButtonContent.js";
+/* empty css                     */
+const g = ({
+  className: o,
+  children: n,
+  color: s = "saffron",
+  icon: e,
+  iconWidth: m,
+  size: r = "medium",
+  theme: a = "solid",
+  variant: i = "pill",
+  dataTestId: u,
+  ...l
+}) => /* @__PURE__ */ t(
+  "button",
+  {
+    type: "button",
+    "data-testid": u,
+    ...l,
+    className: p(c({ color: s, size: r, theme: a, variant: i }), o),
+    "data-name": "Button",
+    children: /* @__PURE__ */ t(d, { icon: e, iconWidth: m, children: n })
+  }
+);
+export {
+  g as Button
+};
+//# sourceMappingURL=Button.js.map

package/molecules/Buttons/v2/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sources":["../../../../lib/molecules/Buttons/v2/Button.tsx"],"sourcesContent":["'use client';\nimport classnames from 'classnames';\nimport type { ComponentPropsWithoutRef, FunctionComponent } from 'react';\n\nimport { getButtonClasses, type ButtonProps as Btn } from './Button.type';\nimport { ButtonContent } from '../ButtonContent';\n\nimport './Button.css';\n\nexport interface ButtonProps extends Btn, Omit<ComponentPropsWithoutRef<'button'>, 'color'> {\n  /**\n   * @deprecated use `data-testid` instead\n   */\n  dataTestId?: string;\n}\n\nexport const Button: FunctionComponent<ButtonProps> = ({\n  className,\n  children,\n  color = 'saffron',\n  icon,\n  iconWidth,\n  size = 'medium',\n  theme = 'solid',\n  variant = 'pill',\n  dataTestId,\n  ...attrs\n}) => {\n  return (\n    <button\n      type=\"button\"\n      data-testid={dataTestId}\n      {...attrs}\n      className={classnames(getButtonClasses({ color, size, theme, variant }), className)}\n      data-name=\"Button\"\n    >\n      <ButtonContent icon={icon} iconWidth={iconWidth}>\n        {children}\n      </ButtonContent>\n    </button>\n  );\n};\n"],"names":["Button","className","children","color","icon","iconWidth","size","theme","variant","dataTestId","attrs","jsx","classnames","getButtonClasses","ButtonContent"],"mappings":";;;;;;AAgBO,MAAMA,IAAyC,CAAC;AAAA,EACrD,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,YAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,eAAaF;AAAA,IACZ,GAAGC;AAAA,IACJ,WAAWE,EAAWC,EAAiB,EAAE,OAAAV,GAAO,MAAAG,GAAM,OAAAC,GAAO,SAAAC,GAAS,GAAGP,CAAS;AAAA,IAClF,aAAU;AAAA,IAEV,UAAA,gBAAAU,EAACG,GAAA,EAAc,MAAAV,GAAY,WAAAC,GACxB,UAAAH,EAAA,CACH;AAAA,EAAA;AAAA;"}

package/molecules/Buttons/v2/Button.type.d.ts

@@ -0,0 +1,54 @@
+import type { Colors } from '../../../types/Colors';
+import type { IconicNames, IconicTypes } from '../../../atoms/Icons';
+export interface ButtonProps {
+    color?: Colors;
+    /**
+     * Optional icon name
+     */
+    icon?: IconicNames;
+    /**
+     * Force the icon type to be svg, font or default
+     */
+    iconType?: IconicTypes;
+    iconWidth?: string;
+    size?: 'small' | 'medium' | 'large';
+    theme?: 'outline' | 'solid';
+    variant?: 'circle' | 'pill';
+}
+type Params = {
+    color: ButtonProps['color'];
+    size: ButtonProps['size'];
+    theme: ButtonProps['theme'];
+    variant: ButtonProps['variant'];
+};
+export declare const BUTTON_COLORS: {
+    readonly black: "button-black";
+    readonly green: "button-green";
+    readonly lavender: "button-lavender";
+    readonly lightSand: "button-lightSand";
+    readonly marygold: "button-marygold";
+    readonly orange: "button-orange";
+    readonly red: "button-red";
+    readonly saffron: "button-saffron";
+    readonly sand: "button-sand";
+    readonly sienna: "button-sienna";
+    readonly ultramarine: "button-ultramarine";
+    readonly verdigris: "button-verdigris";
+    readonly wave: "button-wave";
+    readonly white: "button-white";
+};
+export declare const BUTTON_THEMES: {
+    readonly outline: "button-outline";
+    readonly solid: "button-solid";
+};
+export declare const BUTTON_VARIANTS: {
+    readonly circle: "button-circle";
+    readonly pill: "button-pill";
+};
+export declare const BUTTON_SIZES: {
+    readonly small: "button-small";
+    readonly medium: "button-medium";
+    readonly large: "button-large";
+};
+export declare const getButtonClasses: ({ color, size, theme, variant }: Params) => string;
+export {};

package/molecules/Buttons/v2/Button.type.js

@@ -0,0 +1,42 @@
+import { c as r } from "../../../chunks/index.js";
+const u = {
+  black: "button-black",
+  green: "button-green",
+  lavender: "button-lavender",
+  lightSand: "button-lightSand",
+  marygold: "button-marygold",
+  orange: "button-orange",
+  red: "button-red",
+  saffron: "button-saffron",
+  sand: "button-sand",
+  sienna: "button-sienna",
+  ultramarine: "button-ultramarine",
+  verdigris: "button-verdigris",
+  wave: "button-wave",
+  white: "button-white"
+}, a = (t) => u[t || "saffron"], l = {
+  outline: "button-outline",
+  solid: "button-solid"
+}, s = (t) => l[t || "solid"], i = {
+  circle: "button-circle",
+  pill: "button-pill"
+}, b = (t) => i[t || "pill"], d = {
+  small: "button-small",
+  medium: "button-medium",
+  large: "button-large"
+}, c = (t) => d[t || "medium"], m = ({ color: t, size: n, theme: o, variant: e }) => r(
+  "flex",
+  "button",
+  s(o),
+  a(t),
+  b(e),
+  c(n)
+);
+export {
+  u as BUTTON_COLORS,
+  d as BUTTON_SIZES,
+  l as BUTTON_THEMES,
+  i as BUTTON_VARIANTS,
+  m as getButtonClasses
+};
+//# sourceMappingURL=Button.type.js.map

package/molecules/Buttons/v2/Button.type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.type.js","sources":["../../../../lib/molecules/Buttons/v2/Button.type.ts"],"sourcesContent":["import classnames from 'classnames';\n\nimport type { Colors } from '@/types/Colors';\nimport type { IconicNames, IconicTypes } from '@/atoms/Icons';\n\nexport interface ButtonProps {\n  color?: Colors;\n  /**\n   * Optional icon name\n   */\n  icon?: IconicNames;\n  /**\n   * Force the icon type to be svg, font or default\n   */\n  iconType?: IconicTypes;\n  iconWidth?: string;\n  size?: 'small' | 'medium' | 'large';\n  theme?: 'outline' | 'solid';\n  variant?: 'circle' | 'pill';\n}\n\ntype Params = {\n  color: ButtonProps['color'];\n  size: ButtonProps['size'];\n  theme: ButtonProps['theme'];\n  variant: ButtonProps['variant'];\n};\n\nexport const BUTTON_COLORS = {\n  black: 'button-black',\n  green: 'button-green',\n  lavender: 'button-lavender',\n  lightSand: 'button-lightSand',\n  marygold: 'button-marygold',\n  orange: 'button-orange',\n  red: 'button-red',\n  saffron: 'button-saffron',\n  sand: 'button-sand',\n  sienna: 'button-sienna',\n  ultramarine: 'button-ultramarine',\n  verdigris: 'button-verdigris',\n  wave: 'button-wave',\n  white: 'button-white',\n} as const satisfies Record<string, `button-${string}`>;\n\nconst getButtonColor = (color: ButtonProps['color']) => {\n  return BUTTON_COLORS[color || 'saffron'];\n};\n\nexport const BUTTON_THEMES = {\n  outline: 'button-outline',\n  solid: 'button-solid',\n} as const satisfies Record<string, `button-${string}`>;\n\nconst getButtonTheme = (theme: ButtonProps['theme']) => {\n  return BUTTON_THEMES[theme || 'solid'];\n};\n\nexport const BUTTON_VARIANTS = {\n  circle: 'button-circle',\n  pill: 'button-pill',\n} as const satisfies Record<string, `button-${string}`>;\n\nconst getButtonVariant = (variant: ButtonProps['variant']) => {\n  return BUTTON_VARIANTS[variant || 'pill'];\n};\n\nexport const BUTTON_SIZES = {\n  small: 'button-small',\n  medium: 'button-medium',\n  large: 'button-large',\n} as const satisfies Record<string, `button-${string}`>;\n\nconst getButtonSize = (size: ButtonProps['size']) => {\n  return BUTTON_SIZES[size || 'medium'];\n};\n\nexport const getButtonClasses = ({ color, size, theme, variant }: Params) => {\n  /* keep the \"flex\" class outside of \"button-*\" so that it can be overridden in responsive */\n  return classnames(\n    'flex',\n    'button',\n    getButtonTheme(theme),\n    getButtonColor(color),\n    getButtonVariant(variant),\n    getButtonSize(size),\n  );\n};\n"],"names":["BUTTON_COLORS","getButtonColor","color","BUTTON_THEMES","getButtonTheme","theme","BUTTON_VARIANTS","getButtonVariant","variant","BUTTON_SIZES","getButtonSize","size","getButtonClasses","classnames"],"mappings":";AA4BO,MAAMA,IAAgB;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,WAAW;AAAA,EACX,MAAM;AAAA,EACN,OAAO;AACT,GAEMC,IAAiB,CAACC,MACfF,EAAcE,KAAS,SAAS,GAG5BC,IAAgB;AAAA,EAC3B,SAAS;AAAA,EACT,OAAO;AACT,GAEMC,IAAiB,CAACC,MACfF,EAAcE,KAAS,OAAO,GAG1BC,IAAkB;AAAA,EAC7B,QAAQ;AAAA,EACR,MAAM;AACR,GAEMC,IAAmB,CAACC,MACjBF,EAAgBE,KAAW,MAAM,GAG7BC,IAAe;AAAA,EAC1B,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT,GAEMC,IAAgB,CAACC,MACdF,EAAaE,KAAQ,QAAQ,GAGzBC,IAAmB,CAAC,EAAE,OAAAV,GAAO,MAAAS,GAAM,OAAAN,GAAO,SAAAG,QAE9CK;AAAA,EACL;AAAA,EACA;AAAA,EACAT,EAAeC,CAAK;AAAA,EACpBJ,EAAeC,CAAK;AAAA,EACpBK,EAAiBC,CAAO;AAAA,EACxBE,EAAcC,CAAI;AAAA;"}

package/molecules/Buttons/v2/ButtonAnchor.d.ts

@@ -0,0 +1,12 @@
+import type { ComponentPropsWithoutRef, FunctionComponent, PropsWithChildren } from 'react';
+import { type ButtonProps } from './Button.type';
+import './Button.css';
+export interface ButtonAnchorProps extends ButtonProps, Omit<ComponentPropsWithoutRef<'a'>, 'color'> {
+    href: string;
+    /**
+     * @deprecated use `data-testid` instead
+     */
+    dataTestId?: string;
+    component?: FunctionComponent<PropsWithChildren<any>> | string;
+}
+export declare const ButtonAnchor: FunctionComponent<ButtonAnchorProps>;

package/molecules/Buttons/v2/ButtonAnchor.js

@@ -0,0 +1,32 @@
+"use client";
+import { jsx as t } from "react/jsx-runtime";
+import { c as u } from "../../../chunks/index.js";
+import { getButtonClasses as d } from "./Button.type.js";
+import { ButtonContent as f } from "../ButtonContent.js";
+/* empty css                     */
+const j = ({
+  className: o,
+  children: m,
+  color: n = "saffron",
+  icon: r,
+  iconWidth: s,
+  size: a = "medium",
+  theme: e = "solid",
+  variant: i = "pill",
+  component: c = "a",
+  dataTestId: p,
+  ...l
+}) => /* @__PURE__ */ t(
+  c,
+  {
+    "data-testid": p,
+    ...l,
+    className: u(d({ color: n, size: a, theme: e, variant: i }), o),
+    "data-name": "ButtonAnchor",
+    children: /* @__PURE__ */ t(f, { icon: r, iconWidth: s, children: m })
+  }
+);
+export {
+  j as ButtonAnchor
+};
+//# sourceMappingURL=ButtonAnchor.js.map

package/molecules/Buttons/v2/ButtonAnchor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonAnchor.js","sources":["../../../../lib/molecules/Buttons/v2/ButtonAnchor.tsx"],"sourcesContent":["'use client';\n\nimport classnames from 'classnames';\nimport type { ComponentPropsWithoutRef, FunctionComponent, PropsWithChildren } from 'react';\n\nimport { getButtonClasses, type ButtonProps } from './Button.type';\nimport { ButtonContent } from '../ButtonContent';\n\nimport './Button.css';\n\nexport interface ButtonAnchorProps\n  extends ButtonProps,\n    Omit<ComponentPropsWithoutRef<'a'>, 'color'> {\n  href: string;\n  /**\n   * @deprecated use `data-testid` instead\n   */\n  dataTestId?: string;\n\n  component?: FunctionComponent<PropsWithChildren<any>> | string;\n}\n\nexport const ButtonAnchor: FunctionComponent<ButtonAnchorProps> = ({\n  className,\n  children,\n  color = 'saffron',\n  icon,\n  iconWidth,\n  size = 'medium',\n  theme = 'solid',\n  variant = 'pill',\n  component = 'a',\n  dataTestId,\n  ...attrs\n}) => {\n  const Cmp = component as FunctionComponent<PropsWithChildren<ButtonAnchorProps>>;\n  return (\n    <Cmp\n      data-testid={dataTestId}\n      {...attrs}\n      className={classnames(getButtonClasses({ color, size, theme, variant }), className)}\n      data-name=\"ButtonAnchor\"\n    >\n      <ButtonContent icon={icon} iconWidth={iconWidth}>\n        {children}\n      </ButtonContent>\n    </Cmp>\n  );\n};\n"],"names":["ButtonAnchor","className","children","color","icon","iconWidth","size","theme","variant","component","dataTestId","attrs","jsx","classnames","getButtonClasses","ButtonContent"],"mappings":";;;;;;AAsBO,MAAMA,IAAqD,CAAC;AAAA,EACjE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,YAAAC;AAAA,EACA,GAAGC;AACL,MAGI,gBAAAC;AAAA,EAFUH;AAAA,EAET;AAAA,IACC,eAAaC;AAAA,IACZ,GAAGC;AAAA,IACJ,WAAWE,EAAWC,EAAiB,EAAE,OAAAX,GAAO,MAAAG,GAAM,OAAAC,GAAO,SAAAC,GAAS,GAAGP,CAAS;AAAA,IAClF,aAAU;AAAA,IAEV,UAAA,gBAAAW,EAACG,GAAA,EAAc,MAAAX,GAAY,WAAAC,GACxB,UAAAH,EAAA,CACH;AAAA,EAAA;AAAA;"}

package/molecules/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../lib/molecules/Card.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport type { FunctionComponent, PropsWithChildren } from 'react';\n\nimport { Icon, type IconicNames, type IconicTypes } from '@/atoms/Icons';\n\ninterface CardProps {\n  title: string;\n  icon: IconicNames;\n  iconType?: IconicTypes;\n  theme?: 'light' | 'dark';\n  dataName?: string;\n}\n\nexport const Card: FunctionComponent<PropsWithChildren<CardProps>> = ({\n  title,\n  children,\n  icon,\n  iconType,\n  theme = 'light',\n  dataName = 'Card',\n}) => {\n  return (\n    <div\n      className=\"border-lightGrey rounded-16 flex shrink-0 flex-row gap-20 border bg-white p-20\"\n      data-name={dataName}\n    >\n      <div\n        className={classnames('flex h-48 w-48 shrink-0 items-center justify-center rounded-full', {\n          'bg-ultramarine text-white': theme === 'dark',\n          'bg-lightSand text-black': theme === 'light',\n        })}\n      >\n        <Icon name={icon} type={iconType} width=\"24px\" />\n      </div>\n      <div className=\"space-y-8 font-sans\">\n        <div className=\"text-b3 font-semibold\">{title}</div>\n        <div className=\"text-b4 font-normal\">{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"names":["Card","title","children","icon","iconType","theme","dataName","jsxs","jsx","classnames","Icon"],"mappings":";;;;AAaO,MAAMA,IAAwD,CAAC;AAAA,EACpE,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC,IAAW;AACb,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,aAAWD;AAAA,IAEX,UAAA;AAAA,MAAA,gBAAAE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWC,EAAW,oEAAoE;AAAA,YACxF,6BAA6BJ,MAAU;AAAA,YACvC,2BAA2BA,MAAU;AAAA,UAAA,CACtC;AAAA,UAED,4BAACK,GAAK,EAAA,MAAMP,GAAM,MAAMC,GAAU,OAAM,QAAO;AAAA,QAAA;AAAA,MACjD;AAAA,MACA,gBAAAG,EAAC,OAAI,EAAA,WAAU,uBACb,UAAA;AAAA,QAAC,gBAAAC,EAAA,OAAA,EAAI,WAAU,yBAAyB,UAAMP,GAAA;AAAA,QAC7C,gBAAAO,EAAA,OAAA,EAAI,WAAU,uBAAuB,UAAAN,EAAS,CAAA;AAAA,MAAA,GACjD;AAAA,IAAA;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"Card.js","sources":["../../lib/molecules/Card.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport type { FunctionComponent, PropsWithChildren } from 'react';\n\nimport { Icon, type IconicNames, type IconicTypes } from '@/atoms/Icons';\n\ninterface CardProps {\n  title: string;\n  icon: IconicNames;\n  iconType?: IconicTypes;\n  theme?: 'light' | 'dark';\n  dataName?: string;\n}\n\nexport const Card: FunctionComponent<PropsWithChildren<CardProps>> = ({\n  title,\n  children,\n  icon,\n  iconType,\n  theme = 'light',\n  dataName = 'Card',\n}) => {\n  return (\n    <div\n      className=\"border-lightGrey rounded-16 flex shrink-0 flex-row gap-20 border bg-white p-20\"\n      data-name={dataName}\n    >\n      <div\n        className={classnames('flex h-48 w-48 shrink-0 items-center justify-center rounded-full', {\n          'bg-ultramarine text-white': theme === 'dark',\n          'bg-lightSand text-black': theme === 'light',\n        })}\n      >\n        <Icon name={icon} type={iconType} width=\"24px\" />\n      </div>\n      <div className=\"space-y-8 font-sans\">\n        <div className=\"text-b3 font-semibold\">{title}</div>\n        <div className=\"text-b4 font-normal\">{children}</div>\n      </div>\n    </div>\n  );\n};\n"],"names":["Card","title","children","icon","iconType","theme","dataName","jsxs","jsx","classnames","Icon"],"mappings":";;;;AAaO,MAAMA,IAAwD,CAAC;AAAA,EACpE,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC,IAAW;AACb,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,aAAWD;AAAA,IAEX,UAAA;AAAA,MAAA,gBAAAE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWC,EAAW,oEAAoE;AAAA,YACxF,6BAA6BJ,MAAU;AAAA,YACvC,2BAA2BA,MAAU;AAAA,UAAA,CACtC;AAAA,UAED,4BAACK,GAAA,EAAK,MAAMP,GAAM,MAAMC,GAAU,OAAM,OAAA,CAAO;AAAA,QAAA;AAAA,MAAA;AAAA,MAEjD,gBAAAG,EAAC,OAAA,EAAI,WAAU,uBACb,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,yBAAyB,UAAAP,GAAM;AAAA,QAC9C,gBAAAO,EAAC,OAAA,EAAI,WAAU,uBAAuB,UAAAN,EAAA,CAAS;AAAA,MAAA,EAAA,CACjD;AAAA,IAAA;AAAA,EAAA;AAAA;"}

package/molecules/ElasticHeight.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElasticHeight.js","sources":["../../lib/molecules/ElasticHeight.tsx"],"sourcesContent":["import { useSpring, animated, useResize } from '@react-spring/web';\nimport classnames from 'classnames';\nimport {\n  type FunctionComponent,\n  type MutableRefObject,\n  type PropsWithChildren,\n  useEffect,\n  useRef,\n} from 'react';\n\n/**\n * This is not a Collapse component, it's a component that animates *to* the height of its children.\n * It does the *absolute* same but you Bring Your Own Height™ by applying a class to the children.\n * e.g.: <ElasticHeight className={isOpen ? \"\" : \"h-0\"}><div>...</div></ElasticHeight>\n * ID is there for accessibility purposes.\n *\n * This is in no way affiliated with Amazon ElasticSearch.\n */\n\ninterface ElasticHeightProps {\n  /**\n   * Id of the element\n   */\n  id?: string;\n  /**\n   * Class of the element (please provide something that sets the height)\n   */\n  className?: string;\n  /**\n   * Class of the container (to avoid CLS, mainly)\n   */\n  containerClassName?: string;\n  /**\n   * Role of the element\n   */\n  role?: string;\n}\n\nconst linearInterpolation = (x: number) => x;\n\nexport const ElasticHeight: FunctionComponent<PropsWithChildren<ElasticHeightProps>> = ({\n  children,\n  id,\n  className,\n  role,\n  containerClassName,\n}) => {\n  const ref = useRef<HTMLDivElement>(null) as MutableRefObject<HTMLDivElement>;\n  const { height } = useResize({ container: ref });\n\n  const [styles, api] = useSpring(() => ({\n    from: {\n      height: height.to(linearInterpolation),\n    },\n    immediate: true,\n  }));\n\n  useEffect(() => {\n    api.start({\n      to: {\n        height: height.to(linearInterpolation),\n      },\n      config: {\n        tension: 170,\n        friction: 26,\n      },\n    });\n  }, [api, height]);\n\n  return (\n    <animated.div\n      role={role}\n      className={classnames('overflow-hidden', containerClassName)}\n      style={{ ...styles }}\n      id={id}\n    >\n      <div className={className} ref={ref}>\n        {children}\n      </div>\n    </animated.div>\n  );\n};\n"],"names":["linearInterpolation","x","ElasticHeight","children","id","className","role","containerClassName","ref","useRef","height","useResize","styles","api","useSpring","useEffect","jsx","animated","classnames"],"mappings":";;;;AAsCA,MAAMA,IAAsB,CAACC,MAAcA,GAE9BC,IAA0E,CAAC;AAAA,EACtF,UAAAC;AAAA,EACA,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,oBAAAC;AACF,MAAM;AACE,QAAAC,IAAMC,EAAuB,IAAI,GACjC,EAAE,QAAAC,EAAO,IAAIC,EAAU,EAAE,WAAWH,GAAK,GAEzC,CAACI,GAAQC,CAAG,IAAIC,EAAU,OAAO;AAAA,IACrC,MAAM;AAAA,MACJ,QAAQJ,EAAO,GAAGV,CAAmB;AAAA,IACvC;AAAA,IACA,WAAW;AAAA,EACX,EAAA;AAEF,SAAAe,EAAU,MAAM;AACd,IAAAF,EAAI,MAAM;AAAA,MACR,IAAI;AAAA,QACF,QAAQH,EAAO,GAAGV,CAAmB;AAAA,MACvC;AAAA,MACA,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,UAAU;AAAA,MACZ;AAAA,IAAA,CACD;AAAA,EAAA,GACA,CAACa,GAAKH,CAAM,CAAC,GAGd,gBAAAM;AAAA,IAACC,EAAS;AAAA,IAAT;AAAA,MACC,MAAAX;AAAA,MACA,WAAWY,EAAW,mBAAmBX,CAAkB;AAAA,MAC3D,OAAO,EAAE,GAAGK,EAAO;AAAA,MACnB,IAAAR;AAAA,MAEA,UAAC,gBAAAY,EAAA,OAAA,EAAI,WAAAX,GAAsB,KAAAG,GACxB,UAAAL,GACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"ElasticHeight.js","sources":["../../lib/molecules/ElasticHeight.tsx"],"sourcesContent":["import { useSpring, animated, useResize } from '@react-spring/web';\nimport classnames from 'classnames';\nimport {\n  type FunctionComponent,\n  type MutableRefObject,\n  type PropsWithChildren,\n  useEffect,\n  useRef,\n} from 'react';\n\n/**\n * This is not a Collapse component, it's a component that animates *to* the height of its children.\n * It does the *absolute* same but you Bring Your Own Height™ by applying a class to the children.\n * e.g.: <ElasticHeight className={isOpen ? \"\" : \"h-0\"}><div>...</div></ElasticHeight>\n * ID is there for accessibility purposes.\n *\n * This is in no way affiliated with Amazon ElasticSearch.\n */\n\ninterface ElasticHeightProps {\n  /**\n   * Id of the element\n   */\n  id?: string;\n  /**\n   * Class of the element (please provide something that sets the height)\n   */\n  className?: string;\n  /**\n   * Class of the container (to avoid CLS, mainly)\n   */\n  containerClassName?: string;\n  /**\n   * Role of the element\n   */\n  role?: string;\n}\n\nconst linearInterpolation = (x: number) => x;\n\nexport const ElasticHeight: FunctionComponent<PropsWithChildren<ElasticHeightProps>> = ({\n  children,\n  id,\n  className,\n  role,\n  containerClassName,\n}) => {\n  const ref = useRef<HTMLDivElement>(null) as MutableRefObject<HTMLDivElement>;\n  const { height } = useResize({ container: ref });\n\n  const [styles, api] = useSpring(() => ({\n    from: {\n      height: height.to(linearInterpolation),\n    },\n    immediate: true,\n  }));\n\n  useEffect(() => {\n    api.start({\n      to: {\n        height: height.to(linearInterpolation),\n      },\n      config: {\n        tension: 170,\n        friction: 26,\n      },\n    });\n  }, [api, height]);\n\n  return (\n    <animated.div\n      role={role}\n      className={classnames('overflow-hidden', containerClassName)}\n      style={{ ...styles }}\n      id={id}\n    >\n      <div className={className} ref={ref}>\n        {children}\n      </div>\n    </animated.div>\n  );\n};\n"],"names":["linearInterpolation","x","ElasticHeight","children","id","className","role","containerClassName","ref","useRef","height","useResize","styles","api","useSpring","useEffect","jsx","animated","classnames"],"mappings":";;;;AAsCA,MAAMA,IAAsB,CAACC,MAAcA,GAE9BC,IAA0E,CAAC;AAAA,EACtF,UAAAC;AAAA,EACA,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,oBAAAC;AACF,MAAM;AACJ,QAAMC,IAAMC,EAAuB,IAAI,GACjC,EAAE,QAAAC,EAAA,IAAWC,EAAU,EAAE,WAAWH,GAAK,GAEzC,CAACI,GAAQC,CAAG,IAAIC,EAAU,OAAO;AAAA,IACrC,MAAM;AAAA,MACJ,QAAQJ,EAAO,GAAGV,CAAmB;AAAA,IAAA;AAAA,IAEvC,WAAW;AAAA,EAAA,EACX;AAEF,SAAAe,EAAU,MAAM;AACd,IAAAF,EAAI,MAAM;AAAA,MACR,IAAI;AAAA,QACF,QAAQH,EAAO,GAAGV,CAAmB;AAAA,MAAA;AAAA,MAEvC,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,UAAU;AAAA,MAAA;AAAA,IACZ,CACD;AAAA,EACH,GAAG,CAACa,GAAKH,CAAM,CAAC,GAGd,gBAAAM;AAAA,IAACC,EAAS;AAAA,IAAT;AAAA,MACC,MAAAX;AAAA,MACA,WAAWY,EAAW,mBAAmBX,CAAkB;AAAA,MAC3D,OAAO,EAAE,GAAGK,EAAA;AAAA,MACZ,IAAAR;AAAA,MAEA,UAAA,gBAAAY,EAAC,OAAA,EAAI,WAAAX,GAAsB,KAAAG,GACxB,UAAAL,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/molecules/Forms/Checkboxes/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../lib/molecules/Forms/Checkboxes/Checkbox.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport { useId } from 'react';\nimport { Icon } from '@/atoms/Icons/index.js';\nimport { useValue } from '@/hooks/useValue.js';\nimport '../controls.css';\nimport type { FormControlProps } from '@/molecules/Forms/FormControl';\nimport { useInternalStatus } from '@/hooks/useInternalStatus';\n\nexport interface CheckboxProps<Value = string> extends FormControlProps<Value> {\n  size?: number;\n  onChange?: (name: string, value: Value | null) => void;\n}\n\nexport function Checkbox<Value = string>(props: CheckboxProps<Value>) {\n  const internalId = useId();\n\n  const {\n    id = internalId,\n    name = id,\n    className,\n    dataTestId,\n    disabled = false,\n    checked: initialChecked = false,\n    value,\n    size = 24,\n    tabIndex = 0,\n    validationStatus = 'default',\n    errorMessage,\n    children,\n    onChange,\n    ...rest\n  } = props;\n\n  const { value: checked, setValue } = useValue<boolean>({\n    name,\n    initialValue: initialChecked,\n    onChange(name, checked) {\n      onChange?.(name, checked ? ((value !== undefined ? value : checked) as Value) : null);\n    },\n  });\n  const internalStatus = useInternalStatus({\n    isDisabled: disabled,\n    validationStatus,\n  });\n\n  const shouldDisplayErrorMessage = internalStatus === 'error' && errorMessage;\n\n  return (\n    <div\n      className={classnames('flex flex-col space-y-2', className)}\n      data-testid={`checkbox-container-${id}`}\n    >\n      <label\n        className={classnames('cursor-pointer relative flex text-b3 items-center', {\n          'text-grey': internalStatus === 'disabled',\n          'text-black': internalStatus !== 'default',\n        })}\n      >\n        <span className=\"relative self-start me-8\">\n          <input\n            {...rest}\n            name={name}\n            data-testid={dataTestId}\n            type=\"checkbox\"\n            tabIndex={tabIndex}\n            onChange={() => {\n              !disabled && setValue(!checked);\n            }}\n            checked={checked}\n            data-name=\"Checkbox\"\n            disabled={disabled}\n            value={value as any}\n          />\n\n          <span\n            style={{ height: size, width: size }}\n            className={classnames({ '!border-red': internalStatus === 'error' })}\n            data-testid={`check-container-${id}`}\n          >\n            <Icon\n              name=\"CheckDefault\"\n              type=\"svg\"\n              width={`${size}px`}\n              color=\"black\"\n              className=\"absolute\"\n            />\n          </span>\n        </span>\n\n        {children}\n      </label>\n\n      {shouldDisplayErrorMessage && (\n        <span className=\"text-red text-b4 flex items-start space-x-4 ps-20\" role=\"alert\">\n          <Icon name=\"Error\" width=\"20px\" />\n          {errorMessage}\n        </span>\n      )}\n    </div>\n  );\n}\n"],"names":["Checkbox","props","internalId","useId","id","name","className","dataTestId","disabled","initialChecked","value","size","tabIndex","validationStatus","errorMessage","children","onChange","rest","checked","setValue","useValue","internalStatus","useInternalStatus","shouldDisplayErrorMessage","jsxs","classnames","jsx","Icon"],"mappings":";;;;;;;;AAaO,SAASA,EAAyBC,GAA6B;AACpE,QAAMC,IAAaC,KAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,WAAAE;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,SAASC,IAAiB;AAAA,IAC1B,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC,IAAW;AAAA,IACX,kBAAAC,IAAmB;AAAA,IACnB,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EACD,IAAAhB,GAEE,EAAE,OAAOiB,GAAS,UAAAC,EAAA,IAAaC,EAAkB;AAAA,IACrD,MAAAf;AAAA,IACA,cAAcI;AAAA,IACd,SAASJ,GAAMa,GAAS;AACtB,MAAAF,KAAA,QAAAA,EAAWX,GAAMa,IAAYR,MAAU,SAAYA,IAAQQ,IAAqB;AAAA,IAClF;AAAA,EAAA,CACD,GACKG,IAAiBC,EAAkB;AAAA,IACvC,YAAYd;AAAA,IACZ,kBAAAK;AAAA,EAAA,CACD,GAEKU,IAA4BF,MAAmB,WAAWP;AAG9D,SAAA,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAW,2BAA2BnB,CAAS;AAAA,MAC1D,eAAa,sBAAsBF,CAAE;AAAA,MAErC,UAAA;AAAA,QAAA,gBAAAoB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAW,qDAAqD;AAAA,cACzE,aAAaJ,MAAmB;AAAA,cAChC,cAAcA,MAAmB;AAAA,YAAA,CAClC;AAAA,YAED,UAAA;AAAA,cAAC,gBAAAG,EAAA,QAAA,EAAK,WAAU,4BACd,UAAA;AAAA,gBAAA,gBAAAE;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACE,GAAGT;AAAA,oBACJ,MAAAZ;AAAA,oBACA,eAAaE;AAAA,oBACb,MAAK;AAAA,oBACL,UAAAK;AAAA,oBACA,UAAU,MAAM;AACb,uBAAAJ,KAAYW,EAAS,CAACD,CAAO;AAAA,oBAChC;AAAA,oBACA,SAAAA;AAAA,oBACA,aAAU;AAAA,oBACV,UAAAV;AAAA,oBACA,OAAAE;AAAA,kBAAA;AAAA,gBACF;AAAA,gBAEA,gBAAAgB;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,OAAO,EAAE,QAAQf,GAAM,OAAOA,EAAK;AAAA,oBACnC,WAAWc,EAAW,EAAE,eAAeJ,MAAmB,SAAS;AAAA,oBACnE,eAAa,mBAAmBjB,CAAE;AAAA,oBAElC,UAAA,gBAAAsB;AAAA,sBAACC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,MAAK;AAAA,wBACL,OAAO,GAAGhB,CAAI;AAAA,wBACd,OAAM;AAAA,wBACN,WAAU;AAAA,sBAAA;AAAA,oBACZ;AAAA,kBAAA;AAAA,gBACF;AAAA,cAAA,GACF;AAAA,cAECI;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,QAECQ,KACE,gBAAAC,EAAA,QAAA,EAAK,WAAU,qDAAoD,MAAK,SACvE,UAAA;AAAA,UAAA,gBAAAE,EAACC,GAAK,EAAA,MAAK,SAAQ,OAAM,QAAO;AAAA,UAC/Bb;AAAA,QAAA,GACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../lib/molecules/Forms/Checkboxes/Checkbox.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport { useId } from 'react';\nimport { Icon } from '@/atoms/Icons/index.js';\nimport { useValue } from '@/hooks/useValue.js';\nimport '../controls.css';\nimport type { FormControlProps } from '@/molecules/Forms/FormControl';\nimport { useInternalStatus } from '@/hooks/useInternalStatus';\n\nexport interface CheckboxProps<Value = string> extends FormControlProps<Value> {\n  size?: number;\n  onChange?: (name: string, value: Value | null) => void;\n}\n\nexport function Checkbox<Value = string>(props: CheckboxProps<Value>) {\n  const internalId = useId();\n\n  const {\n    id = internalId,\n    name = id,\n    className,\n    dataTestId,\n    disabled = false,\n    checked: initialChecked = false,\n    value,\n    size = 24,\n    tabIndex = 0,\n    validationStatus = 'default',\n    errorMessage,\n    children,\n    onChange,\n    ...rest\n  } = props;\n\n  const { value: checked, setValue } = useValue<boolean>({\n    name,\n    initialValue: initialChecked,\n    onChange(name, checked) {\n      onChange?.(name, checked ? ((value !== undefined ? value : checked) as Value) : null);\n    },\n  });\n  const internalStatus = useInternalStatus({\n    isDisabled: disabled,\n    validationStatus,\n  });\n\n  const shouldDisplayErrorMessage = internalStatus === 'error' && errorMessage;\n\n  return (\n    <div\n      className={classnames('flex flex-col space-y-2', className)}\n      data-testid={`checkbox-container-${id}`}\n    >\n      <label\n        className={classnames('cursor-pointer relative flex text-b3 items-center', {\n          'text-grey': internalStatus === 'disabled',\n          'text-black': internalStatus !== 'default',\n        })}\n      >\n        <span className=\"relative self-start me-8\">\n          <input\n            {...rest}\n            name={name}\n            data-testid={dataTestId}\n            type=\"checkbox\"\n            tabIndex={tabIndex}\n            onChange={() => {\n              !disabled && setValue(!checked);\n            }}\n            checked={checked}\n            data-name=\"Checkbox\"\n            disabled={disabled}\n            value={value as any}\n          />\n\n          <span\n            style={{ height: size, width: size }}\n            className={classnames({ '!border-red': internalStatus === 'error' })}\n            data-testid={`check-container-${id}`}\n          >\n            <Icon\n              name=\"CheckDefault\"\n              type=\"svg\"\n              width={`${size}px`}\n              color=\"black\"\n              className=\"absolute\"\n            />\n          </span>\n        </span>\n\n        {children}\n      </label>\n\n      {shouldDisplayErrorMessage && (\n        <span className=\"text-red text-b4 flex items-start space-x-4 ps-20\" role=\"alert\">\n          <Icon name=\"Error\" width=\"20px\" />\n          {errorMessage}\n        </span>\n      )}\n    </div>\n  );\n}\n"],"names":["Checkbox","props","internalId","useId","id","name","className","dataTestId","disabled","initialChecked","value","size","tabIndex","validationStatus","errorMessage","children","onChange","rest","checked","setValue","useValue","internalStatus","useInternalStatus","shouldDisplayErrorMessage","jsxs","classnames","jsx","Icon"],"mappings":";;;;;;;;AAaO,SAASA,EAAyBC,GAA6B;AACpE,QAAMC,IAAaC,EAAA,GAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,WAAAE;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,SAASC,IAAiB;AAAA,IAC1B,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC,IAAW;AAAA,IACX,kBAAAC,IAAmB;AAAA,IACnB,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDhB,GAEE,EAAE,OAAOiB,GAAS,UAAAC,EAAA,IAAaC,EAAkB;AAAA,IACrD,MAAAf;AAAA,IACA,cAAcI;AAAA,IACd,SAASJ,GAAMa,GAAS;AACtB,MAAAF,KAAA,QAAAA,EAAWX,GAAMa,IAAYR,MAAU,SAAYA,IAAQQ,IAAqB;AAAA,IAClF;AAAA,EAAA,CACD,GACKG,IAAiBC,EAAkB;AAAA,IACvC,YAAYd;AAAA,IACZ,kBAAAK;AAAA,EAAA,CACD,GAEKU,IAA4BF,MAAmB,WAAWP;AAEhE,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAW,2BAA2BnB,CAAS;AAAA,MAC1D,eAAa,sBAAsBF,CAAE;AAAA,MAErC,UAAA;AAAA,QAAA,gBAAAoB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAW,qDAAqD;AAAA,cACzE,aAAaJ,MAAmB;AAAA,cAChC,cAAcA,MAAmB;AAAA,YAAA,CAClC;AAAA,YAED,UAAA;AAAA,cAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,4BACd,UAAA;AAAA,gBAAA,gBAAAE;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACE,GAAGT;AAAA,oBACJ,MAAAZ;AAAA,oBACA,eAAaE;AAAA,oBACb,MAAK;AAAA,oBACL,UAAAK;AAAA,oBACA,UAAU,MAAM;AACd,uBAACJ,KAAYW,EAAS,CAACD,CAAO;AAAA,oBAChC;AAAA,oBACA,SAAAA;AAAA,oBACA,aAAU;AAAA,oBACV,UAAAV;AAAA,oBACA,OAAAE;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGF,gBAAAgB;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,OAAO,EAAE,QAAQf,GAAM,OAAOA,EAAA;AAAA,oBAC9B,WAAWc,EAAW,EAAE,eAAeJ,MAAmB,SAAS;AAAA,oBACnE,eAAa,mBAAmBjB,CAAE;AAAA,oBAElC,UAAA,gBAAAsB;AAAA,sBAACC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,MAAK;AAAA,wBACL,OAAO,GAAGhB,CAAI;AAAA,wBACd,OAAM;AAAA,wBACN,WAAU;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACZ;AAAA,gBAAA;AAAA,cACF,GACF;AAAA,cAECI;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAGFQ,KACC,gBAAAC,EAAC,QAAA,EAAK,WAAU,qDAAoD,MAAK,SACvE,UAAA;AAAA,UAAA,gBAAAE,EAACC,GAAA,EAAK,MAAK,SAAQ,OAAM,QAAO;AAAA,UAC/Bb;AAAA,QAAA,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/molecules/Forms/Checkboxes/Checkboxes.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkboxes.js","sources":["../../../../lib/molecules/Forms/Checkboxes/Checkboxes.tsx"],"sourcesContent":["import { Children, cloneElement, type HTMLAttributes, isValidElement, useId } from 'react';\nimport type { FormControlProps } from '@/molecules/Forms/FormControl.js';\nimport { useValue } from '@/hooks/useValue.js';\nimport type { CheckboxProps } from './Checkbox.js';\nimport classnames from 'classnames';\n\nexport interface CheckboxesProps<Value = string>\n  extends Pick<\n      FormControlProps<Value[]>,\n      | 'id'\n      | 'name'\n      | 'value'\n      | 'onChange'\n      | 'disabled'\n      | 'readOnly'\n      | 'tabIndex'\n      | 'description'\n      | 'validationStatus'\n      | 'errorMessage'\n    >,\n    Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {}\n\nexport function Checkboxes<Value = string>(props: CheckboxesProps<Value>) {\n  const internalId = useId();\n\n  const {\n    id = internalId,\n    name = id,\n    children,\n    value: initialValue,\n    defaultValue,\n    onChange,\n    disabled,\n    readOnly,\n    tabIndex = 0,\n    ...rest\n  } = props;\n\n  const { value, setValue } = useValue<Value[]>({\n    name,\n    initialValue,\n    formatter(value) {\n      return value !== undefined ? ([].concat(value as never) as Value[]) : value;\n    },\n    defaultValue: (defaultValue as Value[]) || ([] as Value[]),\n    onChange,\n  });\n\n  return (\n    <div {...rest} className={rest.className} role=\"listbox\">\n      {Children.map(children, (child, index) => {\n        if (isValidElement(child)) {\n          const propValue: Value = (child.props as CheckboxProps<Value>).value as Value;\n\n          return cloneElement(child, {\n            ...child.props,\n            name,\n            id: `${id}-${index}`,\n            disabled,\n            readOnly,\n            tabIndex: tabIndex + index + 1,\n            className: classnames(child.props.className || 'mt-8 first:mt-0'),\n            checked: value.includes(propValue),\n            onChange(_: string, item: Value | null) {\n              if (item === null) {\n                setValue(value.filter((v) => v !== propValue));\n              } else {\n                setValue(value.concat(propValue));\n              }\n            },\n          } as CheckboxProps<Value>);\n        }\n\n        return child;\n      })}\n    </div>\n  );\n}\n"],"names":["Checkboxes","props","internalId","useId","id","name","children","initialValue","defaultValue","onChange","disabled","readOnly","tabIndex","rest","value","setValue","useValue","jsx","Children","child","index","isValidElement","propValue","cloneElement","classnames","_","item","v"],"mappings":";;;;AAsBO,SAASA,EAA2BC,GAA+B;AACxE,QAAMC,IAAaC,KAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,UAAAE;AAAA,IACA,OAAOC;AAAA,IACP,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,GAAGC;AAAA,EACD,IAAAZ,GAEE,EAAE,OAAAa,GAAO,UAAAC,EAAS,IAAIC,EAAkB;AAAA,IAC5C,MAAAX;AAAA,IACA,cAAAE;AAAA,IACA,UAAUO,GAAO;AACf,aAAOA,MAAU,SAAa,CAAA,EAAG,OAAOA,CAAc,IAAgBA;AAAAA,IACxE;AAAA,IACA,cAAeN,KAA6B,CAAC;AAAA,IAC7C,UAAAC;AAAA,EAAA,CACD;AAED,SACG,gBAAAQ,EAAA,OAAA,EAAK,GAAGJ,GAAM,WAAWA,EAAK,WAAW,MAAK,WAC5C,UAASK,EAAA,IAAIZ,GAAU,CAACa,GAAOC,MAAU;AACpC,QAAAC,EAAeF,CAAK,GAAG;AACnB,YAAAG,IAAoBH,EAAM,MAA+B;AAE/D,aAAOI,EAAaJ,GAAO;AAAA,QACzB,GAAGA,EAAM;AAAA,QACT,MAAAd;AAAA,QACA,IAAI,GAAGD,CAAE,IAAIgB,CAAK;AAAA,QAClB,UAAAV;AAAA,QACA,UAAAC;AAAA,QACA,UAAUC,IAAWQ,IAAQ;AAAA,QAC7B,WAAWI,EAAWL,EAAM,MAAM,aAAa,iBAAiB;AAAA,QAChE,SAASL,EAAM,SAASQ,CAAS;AAAA,QACjC,SAASG,GAAWC,GAAoB;AACtC,UACEX,EADEW,MAAS,OACFZ,EAAM,OAAO,CAACa,MAAMA,MAAML,CAAS,IAEnCR,EAAM,OAAOQ,CAAS,CAFc;AAAA,QAIjD;AAAA,MAAA,CACuB;AAAA,IAC3B;AAEO,WAAAH;AAAA,EACR,CAAA,EACH,CAAA;AAEJ;"}
+{"version":3,"file":"Checkboxes.js","sources":["../../../../lib/molecules/Forms/Checkboxes/Checkboxes.tsx"],"sourcesContent":["import { Children, cloneElement, type HTMLAttributes, isValidElement, useId } from 'react';\nimport type { FormControlProps } from '@/molecules/Forms/FormControl.js';\nimport { useValue } from '@/hooks/useValue.js';\nimport type { CheckboxProps } from './Checkbox.js';\nimport classnames from 'classnames';\n\nexport interface CheckboxesProps<Value = string>\n  extends Pick<\n      FormControlProps<Value[]>,\n      | 'id'\n      | 'name'\n      | 'value'\n      | 'onChange'\n      | 'disabled'\n      | 'readOnly'\n      | 'tabIndex'\n      | 'description'\n      | 'validationStatus'\n      | 'errorMessage'\n    >,\n    Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {}\n\nexport function Checkboxes<Value = string>(props: CheckboxesProps<Value>) {\n  const internalId = useId();\n\n  const {\n    id = internalId,\n    name = id,\n    children,\n    value: initialValue,\n    defaultValue,\n    onChange,\n    disabled,\n    readOnly,\n    tabIndex = 0,\n    ...rest\n  } = props;\n\n  const { value, setValue } = useValue<Value[]>({\n    name,\n    initialValue,\n    formatter(value) {\n      return value !== undefined ? ([].concat(value as never) as Value[]) : value;\n    },\n    defaultValue: (defaultValue as Value[]) || ([] as Value[]),\n    onChange,\n  });\n\n  return (\n    <div {...rest} className={rest.className} role=\"listbox\">\n      {Children.map(children, (child, index) => {\n        if (isValidElement(child)) {\n          const propValue: Value = (child.props as CheckboxProps<Value>).value as Value;\n\n          return cloneElement(child, {\n            ...child.props,\n            name,\n            id: `${id}-${index}`,\n            disabled,\n            readOnly,\n            tabIndex: tabIndex + index + 1,\n            className: classnames(child.props.className || 'mt-8 first:mt-0'),\n            checked: value.includes(propValue),\n            onChange(_: string, item: Value | null) {\n              if (item === null) {\n                setValue(value.filter((v) => v !== propValue));\n              } else {\n                setValue(value.concat(propValue));\n              }\n            },\n          } as CheckboxProps<Value>);\n        }\n\n        return child;\n      })}\n    </div>\n  );\n}\n"],"names":["Checkboxes","props","internalId","useId","id","name","children","initialValue","defaultValue","onChange","disabled","readOnly","tabIndex","rest","value","setValue","useValue","jsx","Children","child","index","isValidElement","propValue","cloneElement","classnames","_","item","v"],"mappings":";;;;AAsBO,SAASA,EAA2BC,GAA+B;AACxE,QAAMC,IAAaC,EAAA,GAEb;AAAA,IACJ,IAAAC,IAAKF;AAAA,IACL,MAAAG,IAAOD;AAAA,IACP,UAAAE;AAAA,IACA,OAAOC;AAAA,IACP,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,GAAGC;AAAA,EAAA,IACDZ,GAEE,EAAE,OAAAa,GAAO,UAAAC,EAAA,IAAaC,EAAkB;AAAA,IAC5C,MAAAX;AAAA,IACA,cAAAE;AAAA,IACA,UAAUO,GAAO;AACf,aAAOA,MAAU,SAAa,CAAA,EAAG,OAAOA,CAAc,IAAgBA;AAAAA,IACxE;AAAA,IACA,cAAeN,KAA6B,CAAA;AAAA,IAC5C,UAAAC;AAAA,EAAA,CACD;AAED,SACE,gBAAAQ,EAAC,OAAA,EAAK,GAAGJ,GAAM,WAAWA,EAAK,WAAW,MAAK,WAC5C,UAAAK,EAAS,IAAIZ,GAAU,CAACa,GAAOC,MAAU;AACxC,QAAIC,EAAeF,CAAK,GAAG;AACzB,YAAMG,IAAoBH,EAAM,MAA+B;AAE/D,aAAOI,EAAaJ,GAAO;AAAA,QACzB,GAAGA,EAAM;AAAA,QACT,MAAAd;AAAA,QACA,IAAI,GAAGD,CAAE,IAAIgB,CAAK;AAAA,QAClB,UAAAV;AAAA,QACA,UAAAC;AAAA,QACA,UAAUC,IAAWQ,IAAQ;AAAA,QAC7B,WAAWI,EAAWL,EAAM,MAAM,aAAa,iBAAiB;AAAA,QAChE,SAASL,EAAM,SAASQ,CAAS;AAAA,QACjC,SAASG,GAAWC,GAAoB;AACtC,UACEX,EADEW,MAAS,OACFZ,EAAM,OAAO,CAACa,MAAMA,MAAML,CAAS,IAEnCR,EAAM,OAAOQ,CAAS,CAFc;AAAA,QAIjD;AAAA,MAAA,CACuB;AAAA,IAC3B;AAEA,WAAOH;AAAA,EACT,CAAC,EAAA,CACH;AAEJ;"}