@clubmed/trident-ui 1.5.0 → 1.6.0-beta.1

package/molecules/Backdrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"Backdrop.js","sources":["../../lib/molecules/Backdrop.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type MouseEvent,\n  type PropsWithChildren,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport classnames from 'classnames';\n\ninterface BackdropProps {\n  /**\n   * On close\n   * @param event\n   */\n  onClose?: (event: MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * Is visible\n   */\n  isVisible?: boolean;\n  /**\n   * Sweep Mode™\n   * (makes it appear from the sides instead of from everywhere)\n   */\n  sweep?: boolean;\n}\n\nexport const Backdrop: FunctionComponent<PropsWithChildren<BackdropProps>> = ({\n  children,\n  onClose,\n  isVisible,\n  sweep,\n}) => {\n  // Prevent initial mount animation flash when closed\n  const wasVisibleRef = useRef(!!isVisible);\n  const wasVisible = wasVisibleRef.current;\n  const isLeaving = !isVisible && wasVisible;\n\n  // Mount only when visible or when we need to play leave animation\n  const [mounted, setMounted] = useState<boolean>(!!isVisible);\n\n  // When becoming visible, ensure we are mounted\n  useEffect(() => {\n    if (isVisible) setMounted(true);\n  }, [isVisible]);\n\n  // update ref for next render\n  wasVisibleRef.current = !!isVisible;\n\n  if (!mounted) {\n    return null;\n  }\n\n  return (\n    <div\n      role=\"presentation\"\n      className=\"z-1 pointer-events-none fixed inset-0 items-center justify-center flex\"\n    >\n      <button\n        type=\"button\"\n        aria-hidden=\"true\"\n        className={classnames(\n          '-z-1 absolute inset-0 bg-white backdrop will-change-[opacity,transform,backdrop-filter]',\n          {\n            'pointer-events-auto': isVisible || isLeaving,\n            'pointer-events-none': !isVisible && !isLeaving,\n            'animate-backdropFadeIn': !sweep && isVisible,\n            'animate-backdropFadeOut': !sweep && !isVisible && isLeaving,\n            'backdrop-blur-0 opacity-0': !sweep && isVisible && !isLeaving,\n            'animate-backdropSweepIn': sweep && isVisible,\n            'animate-backdropSweepOut': sweep && !isVisible && isLeaving,\n            'backdrop-blur-0 opacity-0 translate-x-[-100%]': sweep && isVisible && !isLeaving,\n          },\n        )}\n        onClick={onClose}\n        onAnimationEnd={() => {\n          // When leave animation finishes and still not visible, unmount\n          if (!isVisible) {\n            setMounted(false);\n          }\n        }}\n      />\n      {children}\n    </div>\n  );\n};\n"],"names":["Backdrop","children","onClose","isVisible","sweep","wasVisibleRef","useRef","wasVisible","isLeaving","mounted","setMounted","useState","useEffect","jsxs","jsx","classnames"],"mappings":";;;AA2BO,MAAMA,IAAgE,CAAC;AAAA,EAC5E,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AACF,MAAM;AAEJ,QAAMC,IAAgBC,EAAO,CAAC,CAACH,CAAS,GAClCI,IAAaF,EAAc,SAC3BG,IAAY,CAACL,KAAaI,GAG1B,CAACE,GAASC,CAAU,IAAIC,EAAkB,CAAC,CAACR,CAAS;AAU3D,SAPAS,EAAU,MAAM;AACd,IAAIT,OAAsB,EAAI;AAAA,EAChC,GAAG,CAACA,CAAS,CAAC,GAGdE,EAAc,UAAU,CAAC,CAACF,GAErBM,IAKH,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,eAAY;AAAA,YACZ,WAAWC;AAAA,cACT;AAAA,cACA;AAAA,gBACE,uBAAuBZ,KAAaK;AAAA,gBACpC,uBAAuB,CAACL,KAAa,CAACK;AAAA,gBACtC,0BAA0B,CAACJ,KAASD;AAAA,gBACpC,2BAA2B,CAACC,KAAS,CAACD,KAAaK;AAAA,gBACnD,6BAA6B,CAACJ,KAASD,KAAa,CAACK;AAAA,gBACrD,2BAA2BJ,KAASD;AAAA,gBACpC,4BAA4BC,KAAS,CAACD,KAAaK;AAAA,gBACnD,iDAAiDJ,KAASD,KAAa,CAACK;AAAA,cAAA;AAAA,YAC1E;AAAA,YAEF,SAASN;AAAA,YACT,gBAAgB,MAAM;AAEpB,cAAKC,KACHO,EAAW,EAAK;AAAA,YAEpB;AAAA,UAAA;AAAA,QAAA;AAAA,QAEDT;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IAhCI;AAmCX;"}
+{"version":3,"file":"Backdrop.js","sources":["../../node_modules/react-transition-state/dist/esm/utils.mjs","../../node_modules/react-transition-state/dist/esm/useTransitionState.mjs","../../lib/molecules/Backdrop.tsx"],"sourcesContent":["//#region src/utils.ts\nconst PRE_ENTER = 0;\nconst ENTERING = 1;\nconst ENTERED = 2;\nconst PRE_EXIT = 3;\nconst EXITING = 4;\nconst EXITED = 5;\nconst UNMOUNTED = 6;\nconst STATUS = [\n\t\"preEnter\",\n\t\"entering\",\n\t\"entered\",\n\t\"preExit\",\n\t\"exiting\",\n\t\"exited\",\n\t\"unmounted\"\n];\nconst getState = (status) => ({\n\t_s: status,\n\tstatus: STATUS[status],\n\tisEnter: status < PRE_EXIT,\n\tisMounted: status !== UNMOUNTED,\n\tisResolved: status === ENTERED || status > EXITING\n});\nconst startOrEnd = (unmounted) => unmounted ? UNMOUNTED : EXITED;\nconst getEndStatus = (status, unmountOnExit) => {\n\tswitch (status) {\n\t\tcase ENTERING:\n\t\tcase PRE_ENTER: return ENTERED;\n\t\tcase EXITING:\n\t\tcase PRE_EXIT: return startOrEnd(unmountOnExit);\n\t}\n};\nconst getTimeout = (timeout) => typeof timeout === \"object\" ? [timeout.enter, timeout.exit] : [timeout, timeout];\nconst _setTimeout = setTimeout;\nconst nextTick = (transitState, status) => _setTimeout(() => {\n\tisNaN(document.body.offsetTop) || transitState(status + 1);\n}, 0);\n\n//#endregion\nexport { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, _setTimeout, getEndStatus, getState, getTimeout, nextTick, startOrEnd };","import { ENTERED, ENTERING, EXITING, PRE_ENTER, PRE_EXIT, _setTimeout, getEndStatus, getState, getTimeout, nextTick, startOrEnd } from \"./utils.mjs\";\nimport { useCallback, useRef, useState } from \"react\";\n\n//#region src/useTransitionState.ts\nconst updateState = (status, setState, latestState, timeoutId, onChange) => {\n\tclearTimeout(timeoutId.current);\n\tconst state = getState(status);\n\tsetState(state);\n\tlatestState.current = state;\n\tonChange && onChange({ current: state });\n};\nconst useTransitionState = ({ enter = true, exit = true, preEnter, preExit, timeout, initialEntered, mountOnEnter, unmountOnExit, onStateChange: onChange } = {}) => {\n\tconst [state, setState] = useState(() => getState(initialEntered ? ENTERED : startOrEnd(mountOnEnter)));\n\tconst latestState = useRef(state);\n\tconst timeoutId = useRef(0);\n\tconst [enterTimeout, exitTimeout] = getTimeout(timeout);\n\tconst endTransition = useCallback(() => {\n\t\tconst status = getEndStatus(latestState.current._s, unmountOnExit);\n\t\tstatus && updateState(status, setState, latestState, timeoutId, onChange);\n\t}, [onChange, unmountOnExit]);\n\treturn [\n\t\tstate,\n\t\tuseCallback((toEnter) => {\n\t\t\tconst transitState = (status) => {\n\t\t\t\tupdateState(status, setState, latestState, timeoutId, onChange);\n\t\t\t\tswitch (status) {\n\t\t\t\t\tcase ENTERING:\n\t\t\t\t\t\tif (enterTimeout >= 0) timeoutId.current = _setTimeout(endTransition, enterTimeout);\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase EXITING:\n\t\t\t\t\t\tif (exitTimeout >= 0) timeoutId.current = _setTimeout(endTransition, exitTimeout);\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase PRE_ENTER:\n\t\t\t\t\tcase PRE_EXIT:\n\t\t\t\t\t\ttimeoutId.current = nextTick(transitState, status);\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t};\n\t\t\tconst enterStage = latestState.current.isEnter;\n\t\t\tif (typeof toEnter !== \"boolean\") toEnter = !enterStage;\n\t\t\tif (toEnter) !enterStage && transitState(enter ? preEnter ? PRE_ENTER : ENTERING : ENTERED);\n\t\t\telse enterStage && transitState(exit ? preExit ? PRE_EXIT : EXITING : startOrEnd(unmountOnExit));\n\t\t}, [\n\t\t\tendTransition,\n\t\t\tonChange,\n\t\t\tenter,\n\t\t\texit,\n\t\t\tpreEnter,\n\t\t\tpreExit,\n\t\t\tenterTimeout,\n\t\t\texitTimeout,\n\t\t\tunmountOnExit\n\t\t]),\n\t\tendTransition\n\t];\n};\n\n//#endregion\nexport { useTransitionState };","import {\n  type ComponentProps,\n  type FunctionComponent,\n  type MouseEvent,\n  type PropsWithChildren,\n  useEffect,\n} from 'react';\nimport clsx from 'clsx';\nimport { useTransitionState } from 'react-transition-state';\nimport { Portal } from '@/molecules/Portal/Portal';\n\nexport interface BackdropProps extends ComponentProps<'div'> {\n  /**\n   * On close\n   * @param event\n   */\n  onClose?: (event: MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * Is visible\n   */\n  isVisible?: boolean;\n  /**\n   * Sweep Mode™\n   * (makes it appear from the sides instead of from everywhere)\n   */\n  sweep?: boolean;\n  /**\n   * Target ID for the Portal component\n   */\n  target?: ComponentProps<typeof Portal>['target'];\n}\n\nexport const Backdrop: FunctionComponent<PropsWithChildren<BackdropProps>> = ({\n  children,\n  className = 'flex justify-center',\n  onClose,\n  isVisible,\n  target = 'backdrop',\n  sweep = false,\n  ...attrs\n}) => {\n  const [state, toggle] = useTransitionState({\n    timeout: { enter: 0, exit: 500 },\n    mountOnEnter: true,\n    unmountOnExit: true,\n    preEnter: true,\n  });\n\n  const { status, isMounted } = state;\n\n  useEffect(() => {\n    toggle(isVisible);\n  }, [isVisible, toggle]);\n\n  const animated = status === 'preEnter' || status === 'exiting';\n\n  return (\n    <Portal target={target}>\n      {isMounted && (\n        <div\n          {...attrs}\n          role=\"presentation\"\n          className={clsx(className, 'fixed inset-0 isolate items-center')}\n        >\n          <button\n            aria-hidden=\"true\"\n            className={clsx('absolute inset-0 -z-1 transition-all duration-500', {\n              'bg-white/80 backdrop-blur': !animated,\n              'bg-white/0 backdrop-blur-none': animated,\n              '-translate-x-full': sweep && (status === 'preEnter' || status === 'entering'),\n              'translate-x-full': sweep && status === 'exiting',\n            })}\n            onClick={onClose}\n            type=\"button\"\n          />\n          {children}\n        </div>\n      )}\n    </Portal>\n  );\n};\n"],"names":["PRE_ENTER","ENTERING","ENTERED","PRE_EXIT","EXITING","EXITED","UNMOUNTED","STATUS","getState","status","startOrEnd","unmounted","getEndStatus","unmountOnExit","getTimeout","timeout","_setTimeout","nextTick","transitState","updateState","setState","latestState","timeoutId","onChange","state","useTransitionState","enter","exit","preEnter","preExit","initialEntered","mountOnEnter","useState","useRef","enterTimeout","exitTimeout","endTransition","useCallback","toEnter","enterStage","Backdrop","children","className","onClose","isVisible","target","sweep","attrs","toggle","isMounted","useEffect","animated","jsx","Portal","jsxs","clsx"],"mappings":";;;;AACA,MAAMA,IAAY,GACZC,IAAW,GACXC,IAAU,GACVC,IAAW,GACXC,IAAU,GACVC,IAAS,GACTC,IAAY,GACZC,IAAS;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GACMC,IAAW,CAACC,OAAY;AAAA,EAC7B,IAAIA;AAAA,EACJ,QAAQF,EAAOE,CAAM;AAAA,EACrB,SAASA,IAASN;AAAA,EAClB,WAAWM,MAAWH;AAAA,EACtB,YAAYG,MAAWP,KAAWO,IAASL;AAC5C,IACMM,IAAa,CAACC,MAAcA,IAAYL,IAAYD,GACpDO,IAAe,CAACH,GAAQI,MAAkB;AAC/C,UAAQJ,GAAM;AAAA,IACb,KAAKR;AAAA,IACL,KAAKD;AAAW,aAAOE;AAAA,IACvB,KAAKE;AAAA,IACL,KAAKD;AAAU,aAAOO,EAAWG,CAAa;AAAA,EAChD;AACA,GACMC,IAAa,CAACC,MAAY,OAAOA,KAAY,WAAW,CAACA,EAAQ,OAAOA,EAAQ,IAAI,IAAI,CAACA,GAASA,CAAO,GACzGC,IAAc,YACdC,IAAW,CAACC,GAAcT,MAAWO,EAAY,MAAM;AAC5D,QAAM,SAAS,KAAK,SAAS,KAAKE,EAAaT,IAAS,CAAC;AAC1D,GAAG,CAAC,GCjCEU,IAAc,CAACV,GAAQW,GAAUC,GAAaC,GAAWC,MAAa;AAC3E,eAAaD,EAAU,OAAO;AAC9B,QAAME,IAAQhB,EAASC,CAAM;AAC7B,EAAAW,EAASI,CAAK,GACdH,EAAY,UAAUG,GACtBD,KAAYA,EAAS,EAAE,SAASC,EAAK,CAAE;AACxC,GACMC,IAAqB,CAAC,EAAE,OAAAC,IAAQ,IAAM,MAAAC,IAAO,IAAM,UAAAC,GAAU,SAAAC,GAAS,SAAAd,GAAS,gBAAAe,GAAgB,cAAAC,GAAc,eAAAlB,GAAe,eAAeU,EAAQ,IAAK,OAAO;AACpK,QAAM,CAACC,GAAOJ,CAAQ,IAAIY,EAAS,MAAMxB,EAASsB,IAAiB5B,IAAUQ,EAAWqB,CAAY,CAAC,CAAC,GAChGV,IAAcY,EAAOT,CAAK,GAC1BF,IAAYW,EAAO,CAAC,GACpB,CAACC,GAAcC,CAAW,IAAIrB,EAAWC,CAAO,GAChDqB,IAAgBC,EAAY,MAAM;AACvC,UAAM5B,IAASG,EAAaS,EAAY,QAAQ,IAAIR,CAAa;AACjE,IAAAJ,KAAUU,EAAYV,GAAQW,GAAUC,GAAaC,GAAWC,CAAQ;AAAA,EACzE,GAAG,CAACA,GAAUV,CAAa,CAAC;AAC5B,SAAO;AAAA,IACNW;AAAA,IACAa,EAAY,CAACC,MAAY;AACxB,YAAMpB,IAAe,CAACT,MAAW;AAEhC,gBADAU,EAAYV,GAAQW,GAAUC,GAAaC,GAAWC,CAAQ,GACtDd,GAAM;AAAA,UACb,KAAKR;AACJ,YAAIiC,KAAgB,MAAGZ,EAAU,UAAUN,EAAYoB,GAAeF,CAAY;AAClF;AAAA,UACD,KAAK9B;AACJ,YAAI+B,KAAe,MAAGb,EAAU,UAAUN,EAAYoB,GAAeD,CAAW;AAChF;AAAA,UACD,KAAKnC;AAAA,UACL,KAAKG;AACJ,YAAAmB,EAAU,UAAUL,EAASC,GAAcT,CAAM;AACjD;AAAA,QACN;AAAA,MACG,GACM8B,IAAalB,EAAY,QAAQ;AACvC,MAAI,OAAOiB,KAAY,cAAWA,IAAU,CAACC,IACzCD,IAAS,CAACC,KAAcrB,EAAaQ,IAAQE,IAAW5B,IAAYC,IAAWC,CAAO,IACrFqC,KAAcrB,EAAaS,IAAOE,IAAU1B,IAAWC,IAAUM,EAAWG,CAAa,CAAC;AAAA,IAChG,GAAG;AAAA,MACFuB;AAAA,MACAb;AAAA,MACAG;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAK;AAAA,MACAC;AAAA,MACAtB;AAAA,IACH,CAAG;AAAA,IACDuB;AAAA,EACF;AACA,GCvBaI,IAAgE,CAAC;AAAA,EAC5E,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,MAAM;AACJ,QAAM,CAACvB,GAAOwB,CAAM,IAAIvB,EAAmB;AAAA,IACzC,SAAS,EAAE,OAAO,GAAG,MAAM,IAAA;AAAA,IAC3B,cAAc;AAAA,IACd,eAAe;AAAA,IACf,UAAU;AAAA,EAAA,CACX,GAEK,EAAE,QAAAhB,GAAQ,WAAAwC,EAAA,IAAczB;AAE9B,EAAA0B,EAAU,MAAM;AACd,IAAAF,EAAOJ,CAAS;AAAA,EAClB,GAAG,CAACA,GAAWI,CAAM,CAAC;AAEtB,QAAMG,IAAW1C,MAAW,cAAcA,MAAW;AAErD,SACE,gBAAA2C,EAACC,GAAA,EAAO,QAAAR,GACL,UAAAI,KACC,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGP;AAAA,MACJ,MAAK;AAAA,MACL,WAAWQ,EAAKb,GAAW,oCAAoC;AAAA,MAE/D,UAAA;AAAA,QAAA,gBAAAU;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,eAAY;AAAA,YACZ,WAAWG,EAAK,qDAAqD;AAAA,cACnE,6BAA6B,CAACJ;AAAA,cAC9B,iCAAiCA;AAAA,cACjC,qBAAqBL,MAAUrC,MAAW,cAAcA,MAAW;AAAA,cACnE,oBAAoBqC,KAASrC,MAAW;AAAA,YAAA,CACzC;AAAA,YACD,SAASkC;AAAA,YACT,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAENF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAGP;AAEJ;","x_google_ignoreList":[0,1]}

package/molecules/Breadcrumb.js

@@ -1,6 +1,6 @@
 import { jsx as a } from "react/jsx-runtime";
 import { createElement as k } from "react";
-import { c as l } from "../chunks/index.js";
+import { c as l } from "../chunks/clsx.js";
 import { getTheme as w } from "./Breadcrumb.themes.js";
 import { Icon as B } from "@clubmed/trident-icons";
 const j = ({
@@ -11,7 +11,7 @@ const j = ({
 }) => {
   if (e.length == 0)
     return null;
-  const [d, f, , ...t] = e, p = t.length ? t[t.length - 1] : e[e.length - 1], g = { label: "", href: "", className: "breadcrumb-spacer" }, s = t.length ? [d, f, g, p] : e, { thStart: u, thEnd: b } = w(i);
+  const [d, f, , ...t] = e, p = t.length ? t[t.length - 1] : e[e.length - 1], g = { label: "", href: "", className: "breadcrumb-spacer" }, s = t.length ? [d, f, g, p] : e, { thStart: u, thEnd: x } = w(i);
   return /* @__PURE__ */ a(
     "nav",
     {
@@ -20,7 +20,7 @@ const j = ({
       ...h,
       className: l(m, "overflow-hidden"),
       "data-name": "Breadcrumb",
-      children: /* @__PURE__ */ a("ol", { className: "scrollbar-hidden flex items-center overflow-x-auto font-sans text-b4", children: s.map(({ label: n, href: o, className: x, ...N }, c) => {
+      children: /* @__PURE__ */ a("ol", { className: "scrollbar-hidden flex items-center overflow-x-auto font-sans text-b4", children: s.map(({ label: n, href: o, className: b, ...N }, c) => {
         const r = c === s.length - 1, v = o && !r;
         return /* @__PURE__ */ k(
           "li",
@@ -31,9 +31,9 @@ const j = ({
               "flex shrink-0 items-center",
               {
                 [u]: !r,
-                [b]: r
+                [x]: r
               },
-              x
+              b
             ),
             key: `${n}-${c}`
           },

package/molecules/Breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.js","sources":["../../lib/molecules/Breadcrumb.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport type { ComponentPropsWithoutRef, FunctionComponent } from 'react';\n\nimport { getTheme } from './Breadcrumb.themes';\n\nimport type { Theme } from '@/types/Theme';\nimport { Icon } from '@clubmed/trident-icons';\nimport './Breadcrumb.css';\n\nexport interface BreadcrumbProps extends ComponentPropsWithoutRef<'nav'> {\n  items: ({\n    href: string;\n    label: string;\n  } & ComponentPropsWithoutRef<'li'>)[];\n  theme?: Theme;\n}\n\nexport const Breadcrumb: FunctionComponent<BreadcrumbProps> = ({\n  className,\n  items,\n  theme = 'light',\n  ...attrs\n}) => {\n  if (items.length == 0) {\n    return null;\n  }\n\n  const [first, second, , ...rest] = items;\n  const lastItem = rest.length ? rest[rest.length - 1] : items[items.length - 1];\n  const spacer = { label: '', href: '', className: 'breadcrumb-spacer' };\n  const itemsToRender = !rest.length ? items : [first, second, spacer, lastItem];\n\n  const { thStart, thEnd } = getTheme(theme);\n\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"Breadcrumb\"\n      {...attrs}\n      className={classnames(className, 'overflow-hidden')}\n      data-name=\"Breadcrumb\"\n    >\n      <ol className=\"scrollbar-hidden flex items-center overflow-x-auto font-sans text-b4\">\n        {itemsToRender.map(({ label, href, className, ...attrs }, index) => {\n          const isLast = index === itemsToRender.length - 1;\n          const isLink = href && !isLast;\n          return (\n            <li\n              {...attrs}\n              {...(isLast && { 'aria-current': 'page' })}\n              className={classnames(\n                'flex shrink-0 items-center',\n                {\n                  [thStart]: !isLast,\n                  [thEnd]: isLast,\n                },\n                className,\n              )}\n              key={`${label}-${index}`}\n            >\n              {isLink ? <a href={href}>{label}</a> : label}\n              {!isLast && <Icon className=\"mx-4\" name=\"Diamond\" width=\"14px\" />}\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n"],"names":["Breadcrumb","className","items","theme","attrs","first","second","rest","lastItem","spacer","itemsToRender","thStart","thEnd","getTheme","jsx","classnames","label","href","index","isLast","isLink","createElement","Icon"],"mappings":";;;;;AAiBO,MAAMA,IAAiD,CAAC;AAAA,EAC7D,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,MAAM;AACJ,MAAIF,EAAM,UAAU;AAClB,WAAO;AAGT,QAAM,CAACG,GAAOC,KAAU,GAAGC,CAAI,IAAIL,GAC7BM,IAAWD,EAAK,SAASA,EAAKA,EAAK,SAAS,CAAC,IAAIL,EAAMA,EAAM,SAAS,CAAC,GACvEO,IAAS,EAAE,OAAO,IAAI,MAAM,IAAI,WAAW,oBAAA,GAC3CC,IAAiBH,EAAK,SAAiB,CAACF,GAAOC,GAAQG,GAAQD,CAAQ,IAAxCN,GAE/B,EAAE,SAAAS,GAAS,OAAAC,MAAUC,EAASV,CAAK;AAEzC,SACE,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAW;AAAA,MACV,GAAGV;AAAA,MACJ,WAAWW,EAAWd,GAAW,iBAAiB;AAAA,MAClD,aAAU;AAAA,MAEV,UAAA,gBAAAa,EAAC,MAAA,EAAG,WAAU,wEACX,YAAc,IAAI,CAAC,EAAE,OAAAE,GAAO,MAAAC,GAAM,WAAAhB,GAAW,GAAGG,EAAAA,GAASc,MAAU;AAClE,cAAMC,IAASD,MAAUR,EAAc,SAAS,GAC1CU,IAASH,KAAQ,CAACE;AACxB,eACE,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACE,GAAGjB;AAAAA,YACH,GAAIe,KAAU,EAAE,gBAAgB,OAAA;AAAA,YACjC,WAAWJ;AAAA,cACT;AAAA,cACA;AAAA,gBACE,CAACJ,CAAO,GAAG,CAACQ;AAAA,gBACZ,CAACP,CAAK,GAAGO;AAAA,cAAA;AAAA,cAEXlB;AAAAA,YAAA;AAAA,YAEF,KAAK,GAAGe,CAAK,IAAIE,CAAK;AAAA,UAAA;AAAA,UAErBE,IAAS,gBAAAN,EAAC,KAAA,EAAE,MAAAG,GAAa,aAAM,IAAOD;AAAA,UACtC,CAACG,KAAU,gBAAAL,EAACQ,GAAA,EAAK,WAAU,QAAO,MAAK,WAAU,OAAM,OAAA,CAAO;AAAA,QAAA;AAAA,MAGrE,CAAC,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"Breadcrumb.js","sources":["../../lib/molecules/Breadcrumb.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ComponentPropsWithoutRef, FunctionComponent } from 'react';\n\nimport { getTheme } from './Breadcrumb.themes';\n\nimport type { Theme } from '@/types/Theme';\nimport { Icon } from '@clubmed/trident-icons';\nimport './Breadcrumb.css';\n\nexport interface BreadcrumbProps extends ComponentPropsWithoutRef<'nav'> {\n  items: ({\n    href: string;\n    label: string;\n  } & ComponentPropsWithoutRef<'li'>)[];\n  theme?: Theme;\n}\n\nexport const Breadcrumb: FunctionComponent<BreadcrumbProps> = ({\n  className,\n  items,\n  theme = 'light',\n  ...attrs\n}) => {\n  if (items.length == 0) {\n    return null;\n  }\n\n  const [first, second, , ...rest] = items;\n  const lastItem = rest.length ? rest[rest.length - 1] : items[items.length - 1];\n  const spacer = { label: '', href: '', className: 'breadcrumb-spacer' };\n  const itemsToRender = !rest.length ? items : [first, second, spacer, lastItem];\n\n  const { thStart, thEnd } = getTheme(theme);\n\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"Breadcrumb\"\n      {...attrs}\n      className={clsx(className, 'overflow-hidden')}\n      data-name=\"Breadcrumb\"\n    >\n      <ol className=\"scrollbar-hidden flex items-center overflow-x-auto font-sans text-b4\">\n        {itemsToRender.map(({ label, href, className, ...attrs }, index) => {\n          const isLast = index === itemsToRender.length - 1;\n          const isLink = href && !isLast;\n          return (\n            <li\n              {...attrs}\n              {...(isLast && { 'aria-current': 'page' })}\n              className={clsx(\n                'flex shrink-0 items-center',\n                {\n                  [thStart]: !isLast,\n                  [thEnd]: isLast,\n                },\n                className,\n              )}\n              key={`${label}-${index}`}\n            >\n              {isLink ? <a href={href}>{label}</a> : label}\n              {!isLast && <Icon className=\"mx-4\" name=\"Diamond\" width=\"14px\" />}\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n"],"names":["Breadcrumb","className","items","theme","attrs","first","second","rest","lastItem","spacer","itemsToRender","thStart","thEnd","getTheme","jsx","clsx","label","href","index","isLast","isLink","createElement","Icon"],"mappings":";;;;;AAiBO,MAAMA,IAAiD,CAAC;AAAA,EAC7D,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,MAAM;AACJ,MAAIF,EAAM,UAAU;AAClB,WAAO;AAGT,QAAM,CAACG,GAAOC,KAAU,GAAGC,CAAI,IAAIL,GAC7BM,IAAWD,EAAK,SAASA,EAAKA,EAAK,SAAS,CAAC,IAAIL,EAAMA,EAAM,SAAS,CAAC,GACvEO,IAAS,EAAE,OAAO,IAAI,MAAM,IAAI,WAAW,oBAAA,GAC3CC,IAAiBH,EAAK,SAAiB,CAACF,GAAOC,GAAQG,GAAQD,CAAQ,IAAxCN,GAE/B,EAAE,SAAAS,GAAS,OAAAC,MAAUC,EAASV,CAAK;AAEzC,SACE,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAW;AAAA,MACV,GAAGV;AAAA,MACJ,WAAWW,EAAKd,GAAW,iBAAiB;AAAA,MAC5C,aAAU;AAAA,MAEV,UAAA,gBAAAa,EAAC,MAAA,EAAG,WAAU,wEACX,YAAc,IAAI,CAAC,EAAE,OAAAE,GAAO,MAAAC,GAAM,WAAAhB,GAAW,GAAGG,EAAAA,GAASc,MAAU;AAClE,cAAMC,IAASD,MAAUR,EAAc,SAAS,GAC1CU,IAASH,KAAQ,CAACE;AACxB,eACE,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACE,GAAGjB;AAAAA,YACH,GAAIe,KAAU,EAAE,gBAAgB,OAAA;AAAA,YACjC,WAAWJ;AAAA,cACT;AAAA,cACA;AAAA,gBACE,CAACJ,CAAO,GAAG,CAACQ;AAAA,gBACZ,CAACP,CAAK,GAAGO;AAAA,cAAA;AAAA,cAEXlB;AAAAA,YAAA;AAAA,YAEF,KAAK,GAAGe,CAAK,IAAIE,CAAK;AAAA,UAAA;AAAA,UAErBE,IAAS,gBAAAN,EAAC,KAAA,EAAE,MAAAG,GAAa,aAAM,IAAOD;AAAA,UACtC,CAACG,KAAU,gBAAAL,EAACQ,GAAA,EAAK,WAAU,QAAO,MAAK,WAAU,OAAM,OAAA,CAAO;AAAA,QAAA;AAAA,MAGrE,CAAC,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/molecules/Buttons/v2/Button.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as n } from "react/jsx-runtime";
-import { c as l } from "../../../chunks/index.js";
+import { c as l } from "../../../chunks/clsx.js";
 import { getButtonClasses as B } from "./Button.type.js";
 import { ButtonContent as c } from "../ButtonContent.js";
 function p({ component: t, disabled: r, ...a }) {
@@ -34,20 +34,13 @@ const C = ({
   color: a = "saffron",
   icon: e,
   iconWidth: o,
-  size: s = "medium",
-  theme: u = "solid",
-  variant: i = "pill",
+  size: u = "medium",
+  theme: i = "solid",
+  variant: s = "pill",
   ...m
 }) => {
   const { Cmp: f, attrs: d } = p(m);
-  return /* @__PURE__ */ n(
-    f,
-    {
-      ...d,
-      className: l(B({ color: a, size: s, theme: u, variant: i }), t),
-      children: /* @__PURE__ */ n(c, { icon: e, iconWidth: o, children: r })
-    }
-  );
+  return /* @__PURE__ */ n(f, { ...d, className: l(B({ color: a, size: u, theme: i, variant: s }), t), children: /* @__PURE__ */ n(c, { icon: e, iconWidth: o, children: r }) });
 };
 C.displayName = "Button";
 export {

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

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../lib/molecules/Buttons/v2/Button.tsx"],"sourcesContent":["'use client';\nimport classnames from 'classnames';\nimport type {\n  ComponentPropsWithoutRef,\n  FunctionComponent,\n  PropsWithChildren,\n  ReactElement,\n  ReactPortal,\n} from 'react';\n\nimport { type ButtonProps as Btn, getButtonClasses } from './Button.type';\nimport { ButtonContent } from '../ButtonContent';\n\nimport './Button.css';\n\nexport interface ButtonProps extends Btn, Omit<ComponentPropsWithoutRef<'button'>, 'color'> {\n  component?: 'button';\n}\n\nexport interface ButtonAnchorProps extends Btn, Omit<ComponentPropsWithoutRef<'a'>, 'color'> {\n  component: 'a';\n  disabled?: boolean;\n}\n\nexport interface FakeButtonProps extends Btn, Omit<ComponentPropsWithoutRef<'span'>, 'color'> {\n  component: 'span' | 'div';\n  disabled?: boolean;\n}\n// For Button with React Router Link or similar components\nexport interface ReactButtonProps\n  extends Btn,\n    Omit<ComponentPropsWithoutRef<'a'>, 'href' | 'color'> {\n  component: ReactElement | ReactPortal;\n  disabled?: boolean;\n}\n\ntype AnyButtonProps = ButtonProps | ButtonAnchorProps | FakeButtonProps | ReactButtonProps;\n\nexport function useButton({ component, disabled, ...props }: AnyButtonProps) {\n  if (component === 'a' || 'href' in props || typeof component === 'object') {\n    return {\n      attrs: {\n        'data-name': 'ButtonAnchor',\n        'aria-disabled': disabled ? 'true' : undefined,\n        ...props,\n      },\n      Cmp: 'a' as unknown as FunctionComponent<PropsWithChildren<any>>,\n    };\n  }\n\n  if (component === 'span' || component === 'div') {\n    return {\n      attrs: {\n        'data-name': 'FakeButton',\n        'aria-disabled': disabled ? 'true' : undefined,\n        ...props,\n      },\n      Cmp: 'span' as unknown as FunctionComponent<PropsWithChildren<any>>,\n    };\n  }\n\n  return {\n    attrs: {\n      'data-name': 'Button',\n      type: 'button',\n      disabled,\n      ...props,\n    },\n    Cmp: 'button' as unknown as FunctionComponent<PropsWithChildren<any>>,\n  };\n}\n\n// Main Button component that handles both button and anchor functionality\nexport const Button: FunctionComponent<AnyButtonProps> = ({\n  className,\n  children,\n  color = 'saffron',\n  icon,\n  iconWidth,\n  size = 'medium',\n  theme = 'solid',\n  variant = 'pill',\n  ...props\n}) => {\n  const { Cmp, attrs } = useButton(props);\n\n  return (\n    <Cmp\n      {...attrs}\n      className={classnames(getButtonClasses({ color, size, theme, variant }), className)}\n    >\n      <ButtonContent icon={icon} iconWidth={iconWidth}>\n        {children}\n      </ButtonContent>\n    </Cmp>\n  );\n};\n\nButton.displayName = 'Button';\n"],"names":["useButton","component","disabled","props","Button","className","children","color","icon","iconWidth","size","theme","variant","Cmp","attrs","jsx","classnames","getButtonClasses","ButtonContent"],"mappings":";;;;;AAsCO,SAASA,EAAU,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,KAAyB;AAC3E,SAAIF,MAAc,OAAO,UAAUE,KAAS,OAAOF,KAAc,WACxD;AAAA,IACL,OAAO;AAAA,MACL,aAAa;AAAA,MACb,iBAAiBC,IAAW,SAAS;AAAA,MACrC,GAAGC;AAAA,IAAA;AAAA,IAEL,KAAK;AAAA,EAAA,IAILF,MAAc,UAAUA,MAAc,QACjC;AAAA,IACL,OAAO;AAAA,MACL,aAAa;AAAA,MACb,iBAAiBC,IAAW,SAAS;AAAA,MACrC,GAAGC;AAAA,IAAA;AAAA,IAEL,KAAK;AAAA,EAAA,IAIF;AAAA,IACL,OAAO;AAAA,MACL,aAAa;AAAA,MACb,MAAM;AAAA,MACN,UAAAD;AAAA,MACA,GAAGC;AAAA,IAAA;AAAA,IAEL,KAAK;AAAA,EAAA;AAET;AAGO,MAAMC,IAA4C,CAAC;AAAA,EACxD,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,GAAGT;AACL,MAAM;AACJ,QAAM,EAAE,KAAAU,GAAK,OAAAC,MAAUd,EAAUG,CAAK;AAEtC,SACE,gBAAAY;AAAA,IAACF;AAAA,IAAA;AAAA,MACE,GAAGC;AAAA,MACJ,WAAWE,EAAWC,EAAiB,EAAE,OAAAV,GAAO,MAAAG,GAAM,OAAAC,GAAO,SAAAC,GAAS,GAAGP,CAAS;AAAA,MAElF,UAAA,gBAAAU,EAACG,GAAA,EAAc,MAAAV,GAAY,WAAAC,GACxB,UAAAH,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;AAEAF,EAAO,cAAc;"}
+{"version":3,"file":"Button.js","sources":["../../../../lib/molecules/Buttons/v2/Button.tsx"],"sourcesContent":["'use client';\nimport clsx from 'clsx';\nimport type {\n  ComponentPropsWithoutRef,\n  FunctionComponent,\n  PropsWithChildren,\n  ReactElement,\n  ReactPortal,\n} from 'react';\n\nimport { type ButtonProps as Btn, getButtonClasses } from './Button.type';\nimport { ButtonContent } from '../ButtonContent';\n\nimport './Button.css';\n\nexport interface ButtonProps extends Btn, Omit<ComponentPropsWithoutRef<'button'>, 'color'> {\n  component?: 'button';\n}\n\nexport interface ButtonAnchorProps extends Btn, Omit<ComponentPropsWithoutRef<'a'>, 'color'> {\n  component: 'a';\n  disabled?: boolean;\n}\n\nexport interface FakeButtonProps extends Btn, Omit<ComponentPropsWithoutRef<'span'>, 'color'> {\n  component: 'span' | 'div';\n  disabled?: boolean;\n}\n// For Button with React Router Link or similar components\nexport interface ReactButtonProps\n  extends Btn,\n    Omit<ComponentPropsWithoutRef<'a'>, 'href' | 'color'> {\n  component: ReactElement | ReactPortal;\n  disabled?: boolean;\n}\n\ntype AnyButtonProps = ButtonProps | ButtonAnchorProps | FakeButtonProps | ReactButtonProps;\n\nexport function useButton({ component, disabled, ...props }: AnyButtonProps) {\n  if (component === 'a' || 'href' in props || typeof component === 'object') {\n    return {\n      attrs: {\n        'data-name': 'ButtonAnchor',\n        'aria-disabled': disabled ? 'true' : undefined,\n        ...props,\n      },\n      Cmp: 'a' as unknown as FunctionComponent<PropsWithChildren<any>>,\n    };\n  }\n\n  if (component === 'span' || component === 'div') {\n    return {\n      attrs: {\n        'data-name': 'FakeButton',\n        'aria-disabled': disabled ? 'true' : undefined,\n        ...props,\n      },\n      Cmp: 'span' as unknown as FunctionComponent<PropsWithChildren<any>>,\n    };\n  }\n\n  return {\n    attrs: {\n      'data-name': 'Button',\n      type: 'button',\n      disabled,\n      ...props,\n    },\n    Cmp: 'button' as unknown as FunctionComponent<PropsWithChildren<any>>,\n  };\n}\n\n// Main Button component that handles both button and anchor functionality\nexport const Button: FunctionComponent<AnyButtonProps> = ({\n  className,\n  children,\n  color = 'saffron',\n  icon,\n  iconWidth,\n  size = 'medium',\n  theme = 'solid',\n  variant = 'pill',\n  ...props\n}) => {\n  const { Cmp, attrs } = useButton(props);\n\n  return (\n    <Cmp {...attrs} className={clsx(getButtonClasses({ color, size, theme, variant }), className)}>\n      <ButtonContent icon={icon} iconWidth={iconWidth}>\n        {children}\n      </ButtonContent>\n    </Cmp>\n  );\n};\n\nButton.displayName = 'Button';\n"],"names":["useButton","component","disabled","props","Button","className","children","color","icon","iconWidth","size","theme","variant","Cmp","attrs","jsx","clsx","getButtonClasses","ButtonContent"],"mappings":";;;;;AAsCO,SAASA,EAAU,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,KAAyB;AAC3E,SAAIF,MAAc,OAAO,UAAUE,KAAS,OAAOF,KAAc,WACxD;AAAA,IACL,OAAO;AAAA,MACL,aAAa;AAAA,MACb,iBAAiBC,IAAW,SAAS;AAAA,MACrC,GAAGC;AAAA,IAAA;AAAA,IAEL,KAAK;AAAA,EAAA,IAILF,MAAc,UAAUA,MAAc,QACjC;AAAA,IACL,OAAO;AAAA,MACL,aAAa;AAAA,MACb,iBAAiBC,IAAW,SAAS;AAAA,MACrC,GAAGC;AAAA,IAAA;AAAA,IAEL,KAAK;AAAA,EAAA,IAIF;AAAA,IACL,OAAO;AAAA,MACL,aAAa;AAAA,MACb,MAAM;AAAA,MACN,UAAAD;AAAA,MACA,GAAGC;AAAA,IAAA;AAAA,IAEL,KAAK;AAAA,EAAA;AAET;AAGO,MAAMC,IAA4C,CAAC;AAAA,EACxD,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,GAAGT;AACL,MAAM;AACJ,QAAM,EAAE,KAAAU,GAAK,OAAAC,MAAUd,EAAUG,CAAK;AAEtC,SACE,gBAAAY,EAACF,KAAK,GAAGC,GAAO,WAAWE,EAAKC,EAAiB,EAAE,OAAAV,GAAO,MAAAG,GAAM,OAAAC,GAAO,SAAAC,EAAA,CAAS,GAAGP,CAAS,GAC1F,4BAACa,GAAA,EAAc,MAAAV,GAAY,WAAAC,GACxB,UAAAH,EAAA,CACH,GACF;AAEJ;AAEAF,EAAO,cAAc;"}

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

@@ -1,4 +1,4 @@
-import { c as r } from "../../../chunks/index.js";
+import { c as r } from "../../../chunks/clsx.js";
 const u = {
   black: "button-black",
   green: "button-green",
@@ -17,10 +17,10 @@ const u = {
   darkGrey: "button-darkGrey",
   lightGrey: "button-lightGrey",
   current: "button-current"
-}, a = (t) => u[t || "saffron"], l = {
+}, l = (t) => u[t || "saffron"], a = {
   outline: "button-outline",
   solid: "button-solid"
-}, i = (t) => l[t || "solid"], s = {
+}, i = (t) => a[t || "solid"], s = {
   circle: "button-circle",
   pill: "button-pill"
 }, b = (t) => s[t || "pill"], d = {
@@ -31,14 +31,14 @@ const u = {
   "flex",
   "button",
   i(o),
-  a(t),
+  l(t),
   b(e),
   c(n)
 );
 export {
   u as BUTTON_COLORS,
   d as BUTTON_SIZES,
-  l as BUTTON_THEMES,
+  a as BUTTON_THEMES,
   s as BUTTON_VARIANTS,
   m as getButtonClasses
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Button.type.js","sources":["../../../../lib/molecules/Buttons/v2/Button.type.ts"],"sourcesContent":["import classnames from 'classnames';\n\nimport type { IconicNames, IconicTypes } from '@clubmed/trident-icons';\nimport type { Colors } from '@/types/Colors';\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  darkGrey: 'button-darkGrey',\n  lightGrey: 'button-lightGrey',\n  current: 'button-current',\n} as const satisfies Record<Colors, `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;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,SAAS;AACX,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;"}
+{"version":3,"file":"Button.type.js","sources":["../../../../lib/molecules/Buttons/v2/Button.type.ts"],"sourcesContent":["import clsx from 'clsx';\n\nimport type { IconicNames, IconicTypes } from '@clubmed/trident-icons';\nimport type { Colors } from '@/types/Colors';\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  darkGrey: 'button-darkGrey',\n  lightGrey: 'button-lightGrey',\n  current: 'button-current',\n} as const satisfies Record<Colors, `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 clsx(\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","clsx"],"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;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,SAAS;AACX,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/Cards/CardBackground.js

@@ -1,14 +1,14 @@
-import { jsxs as a, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { c as s } from "../../chunks/index.js";
+import { jsxs as c, Fragment as a, jsx as e } from "react/jsx-runtime";
+import { c as s } from "../../chunks/clsx.js";
 import "react";
-import { Image as m } from "../../atoms/Image/Image.js";
-import { CardBackgroundContext as l } from "./CardBackgroundContext.js";
+import { Image as l } from "../../atoms/Image/Image.js";
+import { CardBackgroundContext as m } from "./CardBackgroundContext.js";
 const u = ({
   children: o,
   className: n,
   ...r
-}) => /* @__PURE__ */ a(c, { children: [
-  r?.src && /* @__PURE__ */ e(m, { ...r, src: r.src, className: "h-full w-full object-cover" }),
+}) => /* @__PURE__ */ c(a, { children: [
+  r?.src && /* @__PURE__ */ e(l, { ...r, src: r.src, className: "h-full w-full object-cover" }),
   /* @__PURE__ */ e(
     "div",
     {
@@ -20,7 +20,7 @@ const u = ({
         },
         n
       ),
-      children: /* @__PURE__ */ e(l.Provider, { value: { hasImage: !!r?.src }, children: o })
+      children: /* @__PURE__ */ e(m.Provider, { value: { hasImage: !!r?.src }, children: o })
     }
   )
 ] });

package/molecules/Cards/CardBackground.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardBackground.js","sources":["../../../lib/molecules/Cards/CardBackground.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport { type ComponentPropsWithoutRef, type FunctionComponent } from 'react';\nimport { Image, type ImageProps } from '@/atoms/Image/Image';\nimport { CardBackgroundContext } from './CardBackgroundContext';\n\nexport type CardBackgroundProps = ComponentPropsWithoutRef<'div'> & Partial<ImageProps>;\n\nexport const CardBackground: FunctionComponent<CardBackgroundProps> = ({\n  children,\n  className,\n  ...attrs\n}) => {\n  return (\n    <>\n      {attrs?.src && <Image {...attrs} src={attrs.src} className=\"h-full w-full object-cover\" />}\n\n      <div\n        {...attrs}\n        className={classnames(\n          'pointer-events-none absolute inset-0 flex flex-col rounded-16',\n          {\n            'bg-gradient-to-b from-transparent via-transparent to-black/40': attrs?.src,\n          },\n          className,\n        )}\n      >\n        <CardBackgroundContext.Provider value={{ hasImage: !!attrs?.src }}>\n          {children}\n        </CardBackgroundContext.Provider>\n      </div>\n    </>\n  );\n};\n"],"names":["CardBackground","children","className","attrs","jsxs","Fragment","Image","jsx","classnames","CardBackgroundContext"],"mappings":";;;;;AAOO,MAAMA,IAAyD,CAAC;AAAA,EACrE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,EAAAF,GAAO,yBAAQG,GAAA,EAAO,GAAGH,GAAO,KAAKA,EAAM,KAAK,WAAU,6BAAA,CAA6B;AAAA,EAExF,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGJ;AAAA,MACJ,WAAWK;AAAA,QACT;AAAA,QACA;AAAA,UACE,iEAAiEL,GAAO;AAAA,QAAA;AAAA,QAE1ED;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAK,EAACE,EAAsB,UAAtB,EAA+B,OAAO,EAAE,UAAU,CAAC,CAACN,GAAO,IAAA,GACzD,UAAAF,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AACF,GACF;"}
+{"version":3,"file":"CardBackground.js","sources":["../../../lib/molecules/Cards/CardBackground.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { type ComponentPropsWithoutRef, type FunctionComponent } from 'react';\nimport { Image, type ImageProps } from '@/atoms/Image/Image';\nimport { CardBackgroundContext } from './CardBackgroundContext';\n\nexport type CardBackgroundProps = ComponentPropsWithoutRef<'div'> & Partial<ImageProps>;\n\nexport const CardBackground: FunctionComponent<CardBackgroundProps> = ({\n  children,\n  className,\n  ...attrs\n}) => {\n  return (\n    <>\n      {attrs?.src && <Image {...attrs} src={attrs.src} className=\"h-full w-full object-cover\" />}\n\n      <div\n        {...attrs}\n        className={clsx(\n          'pointer-events-none absolute inset-0 flex flex-col rounded-16',\n          {\n            'bg-gradient-to-b from-transparent via-transparent to-black/40': attrs?.src,\n          },\n          className,\n        )}\n      >\n        <CardBackgroundContext.Provider value={{ hasImage: !!attrs?.src }}>\n          {children}\n        </CardBackgroundContext.Provider>\n      </div>\n    </>\n  );\n};\n"],"names":["CardBackground","children","className","attrs","jsxs","Fragment","Image","jsx","clsx","CardBackgroundContext"],"mappings":";;;;;AAOO,MAAMA,IAAyD,CAAC;AAAA,EACrE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,EAAAF,GAAO,yBAAQG,GAAA,EAAO,GAAGH,GAAO,KAAKA,EAAM,KAAK,WAAU,6BAAA,CAA6B;AAAA,EAExF,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGJ;AAAA,MACJ,WAAWK;AAAA,QACT;AAAA,QACA;AAAA,UACE,iEAAiEL,GAAO;AAAA,QAAA;AAAA,QAE1ED;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAK,EAACE,EAAsB,UAAtB,EAA+B,OAAO,EAAE,UAAU,CAAC,CAACN,GAAO,IAAA,GACzD,UAAAF,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AACF,GACF;"}

package/molecules/Cards/CardClickable.js

@@ -1,20 +1,20 @@
 import { jsx as l } from "react/jsx-runtime";
-import { c as i } from "../../chunks/index.js";
+import { c as x } from "../../chunks/clsx.js";
 import "react";
-import { useCardBackground as u } from "./CardBackgroundContext.js";
+import { useCardBackground as i } from "./CardBackgroundContext.js";
 const d = ({
   children: t,
   className: m,
   coverLink: a = !1,
   href: s,
   onClick: r,
-  ...n
+  ...p
 }) => {
-  const e = !!s, { hasImage: o } = u(), p = e ? "a" : "div", c = e ? { href: s, onClick: r } : {};
+  const e = !!s, { hasImage: o } = i(), c = e ? "a" : "div", n = e ? { href: s, onClick: r } : {};
   return /* @__PURE__ */ l(
-    p,
+    c,
     {
-      className: i(
+      className: x(
         "pointer-events-auto flex w-full gap-x-8 px-12 pb-12 sm:px-24 sm:pb-24",
         {
           "justify-center text-center": !t,
@@ -25,8 +25,8 @@ const d = ({
         },
         m
       ),
-      ...c,
       ...n,
+      ...p,
       children: t
     }
   );

package/molecules/Cards/CardClickable.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardClickable.js","sources":["../../../lib/molecules/Cards/CardClickable.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport { type FunctionComponent, type HTMLAttributes } from 'react';\nimport { useCardBackground } from '@/molecules/Cards/CardBackgroundContext';\n\nexport interface CartTitleProps extends HTMLAttributes<HTMLDivElement | HTMLAnchorElement> {\n  coverLink?: boolean;\n  href?: string;\n}\n\nexport const CardClickable: FunctionComponent<CartTitleProps> = ({\n  children,\n  className,\n  coverLink = false,\n  href,\n  onClick,\n  ...attrs\n}) => {\n  const hasLink = !!href;\n  const { hasImage } = useCardBackground();\n  const TagName = hasLink ? 'a' : 'div';\n  const tagProps = hasLink ? { href, onClick } : {};\n\n  return (\n    <TagName\n      className={classnames(\n        'pointer-events-auto flex w-full gap-x-8 px-12 pb-12 sm:px-24 sm:pb-24',\n        {\n          'justify-center text-center': !children,\n          'h-full items-end': coverLink,\n          'mt-auto h-auto': !coverLink,\n          'text-white': hasImage,\n          'text-black': !hasImage,\n        },\n        className,\n      )}\n      {...tagProps}\n      {...attrs}\n    >\n      {children}\n    </TagName>\n  );\n};\n"],"names":["CardClickable","children","className","coverLink","href","onClick","attrs","hasLink","hasImage","useCardBackground","TagName","tagProps","jsx","classnames"],"mappings":";;;;AASO,MAAMA,IAAmD,CAAC;AAAA,EAC/D,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAU,CAAC,CAACH,GACZ,EAAE,UAAAI,EAAA,IAAaC,EAAA,GACfC,IAAUH,IAAU,MAAM,OAC1BI,IAAWJ,IAAU,EAAE,MAAAH,GAAM,SAAAC,EAAA,IAAY,CAAA;AAE/C,SACE,gBAAAO;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,WAAWG;AAAA,QACT;AAAA,QACA;AAAA,UACE,8BAA8B,CAACZ;AAAA,UAC/B,oBAAoBE;AAAA,UACpB,kBAAkB,CAACA;AAAA,UACnB,cAAcK;AAAA,UACd,cAAc,CAACA;AAAA,QAAA;AAAA,QAEjBN;AAAA,MAAA;AAAA,MAED,GAAGS;AAAA,MACH,GAAGL;AAAA,MAEH,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"CardClickable.js","sources":["../../../lib/molecules/Cards/CardClickable.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { type FunctionComponent, type HTMLAttributes } from 'react';\nimport { useCardBackground } from '@/molecules/Cards/CardBackgroundContext';\n\nexport interface CartTitleProps extends HTMLAttributes<HTMLDivElement | HTMLAnchorElement> {\n  coverLink?: boolean;\n  href?: string;\n}\n\nexport const CardClickable: FunctionComponent<CartTitleProps> = ({\n  children,\n  className,\n  coverLink = false,\n  href,\n  onClick,\n  ...attrs\n}) => {\n  const hasLink = !!href;\n  const { hasImage } = useCardBackground();\n  const TagName = hasLink ? 'a' : 'div';\n  const tagProps = hasLink ? { href, onClick } : {};\n\n  return (\n    <TagName\n      className={clsx(\n        'pointer-events-auto flex w-full gap-x-8 px-12 pb-12 sm:px-24 sm:pb-24',\n        {\n          'justify-center text-center': !children,\n          'h-full items-end': coverLink,\n          'mt-auto h-auto': !coverLink,\n          'text-white': hasImage,\n          'text-black': !hasImage,\n        },\n        className,\n      )}\n      {...tagProps}\n      {...attrs}\n    >\n      {children}\n    </TagName>\n  );\n};\n"],"names":["CardClickable","children","className","coverLink","href","onClick","attrs","hasLink","hasImage","useCardBackground","TagName","tagProps","jsx","clsx"],"mappings":";;;;AASO,MAAMA,IAAmD,CAAC;AAAA,EAC/D,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAU,CAAC,CAACH,GACZ,EAAE,UAAAI,EAAA,IAAaC,EAAA,GACfC,IAAUH,IAAU,MAAM,OAC1BI,IAAWJ,IAAU,EAAE,MAAAH,GAAM,SAAAC,EAAA,IAAY,CAAA;AAE/C,SACE,gBAAAO;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,WAAWG;AAAA,QACT;AAAA,QACA;AAAA,UACE,8BAA8B,CAACZ;AAAA,UAC/B,oBAAoBE;AAAA,UACpB,kBAAkB,CAACA;AAAA,UACnB,cAAcK;AAAA,UACd,cAAc,CAACA;AAAA,QAAA;AAAA,QAEjBN;AAAA,MAAA;AAAA,MAED,GAAGS;AAAA,MACH,GAAGL;AAAA,MAEH,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/molecules/Cards/ExpandableCard.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs as r, jsx as a } from "react/jsx-runtime";
 import { useState as b, createElement as k } from "react";
-import { c as s } from "../../chunks/index.js";
+import { c as d } from "../../chunks/clsx.js";
 import { Clickable as w } from "../../atoms/Clickable/Clickable.js";
 import { Tag as v } from "../Tag.js";
 import { CardBackground as C } from "./CardBackground.js";
@@ -10,9 +10,9 @@ import { Card as g } from "./v2/Card.js";
 import { HeadingGroup as N } from "../../atoms/Heading/HeadingGroup.js";
 import { Button as B } from "../Buttons/v2/Button.js";
 const q = ({
-  children: d,
-  className: i,
-  hLevel: c = 3,
+  children: i,
+  className: c,
+  hLevel: s = 3,
   image: t,
   onClick: m,
   subtitle: p,
@@ -29,7 +29,7 @@ const q = ({
       "data-name": "ExpandableCard",
       "data-testid": "expandable-card",
       ...x,
-      className: s({ "border-t-0": t?.src }, i),
+      className: d({ "border-t-0": t?.src }, c),
       "data-open": e,
       children: [
         /* @__PURE__ */ a(
@@ -45,11 +45,11 @@ const q = ({
               /* @__PURE__ */ r(
                 "div",
                 {
-                  className: s("mt-auto flex justify-between gap-x-8 p-20", {
+                  className: d("mt-auto flex justify-between gap-x-8 p-20", {
                     "text-white": t?.src
                   }),
                   children: [
-                    h && /* @__PURE__ */ a(N, { subtitle: p, level: c, children: l }),
+                    h && /* @__PURE__ */ a(N, { subtitle: p, level: s, children: l }),
                     /* @__PURE__ */ a(
                       B,
                       {
@@ -69,7 +69,7 @@ const q = ({
             ] })
           }
         ),
-        /* @__PURE__ */ a(E, { isExpanded: e, children: d })
+        /* @__PURE__ */ a(E, { isExpanded: e, children: i })
       ]
     }
   );

package/molecules/Cards/ExpandableCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableCard.js","sources":["../../../lib/molecules/Cards/ExpandableCard.tsx"],"sourcesContent":["'use client';\n\nimport classnames from 'classnames';\nimport { type ComponentProps, type FunctionComponent, useState } from 'react';\n\nimport { Clickable } from '../../atoms/Clickable/Clickable';\nimport { Heading } from '../../atoms/Heading/Heading';\nimport { Tag } from '../Tag';\nimport { CardBackground, type CardBackgroundProps } from '@/molecules/Cards/CardBackground';\nimport { ElasticHeight } from '@/molecules/ElasticHeight';\nimport { Card, type CardProps } from '@/molecules/Cards/v2/Card';\nimport { HeadingGroup } from '@/atoms/Heading/HeadingGroup';\nimport { Button } from '@/molecules/Buttons/v2/Button';\n\nexport interface ExpandableCardProps extends Omit<CardProps<'article'>, 'onClick'> {\n  hLevel?: ComponentProps<typeof Heading>['level'];\n  image?: CardBackgroundProps;\n  onClick?: (isExpanded: boolean) => void;\n  subtitle?: string | null;\n  tags?: ComponentProps<typeof Tag>[] | null;\n  title: string;\n}\n\nexport const ExpandableCard: FunctionComponent<ExpandableCardProps> = ({\n  children,\n  className,\n  hLevel = 3,\n  image,\n  onClick,\n  subtitle,\n  tags,\n  title,\n  component = 'article',\n  ...attrs\n}) => {\n  const hasTitle = Boolean(title);\n\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  return (\n    <Card<'article'>\n      component={component}\n      data-name=\"ExpandableCard\"\n      data-testid=\"expandable-card\"\n      {...attrs}\n      className={classnames({ 'border-t-0': image?.src }, className)}\n      data-open={isExpanded}\n    >\n      <Clickable\n        className=\"group relative -m-1 block aspect-horizontal overflow-hidden rounded-16 text-start\"\n        data-testid=\"expandable-card-clickable\"\n        onClick={() => {\n          onClick?.(!isExpanded);\n          setIsExpanded(!isExpanded);\n        }}\n      >\n        <CardBackground {...(image || {})}>\n          {Boolean(tags?.length) && (\n            <div className=\"flex flex-wrap gap-4 self-start p-20\">\n              {tags?.map((tag) => <Tag {...tag} key={tag.label} />)}\n            </div>\n          )}\n          <div\n            className={classnames('mt-auto flex justify-between gap-x-8 p-20', {\n              'text-white': image?.src,\n            })}\n          >\n            {hasTitle && (\n              <HeadingGroup subtitle={subtitle} level={hLevel}>\n                {title}\n              </HeadingGroup>\n            )}\n            <Button\n              component=\"span\"\n              className=\"!transition duration-500\"\n              color={image?.src ? 'white' : 'black'}\n              icon=\"ArrowDefaultDown\"\n              style={{ rotate: isExpanded ? '-180deg' : '0deg' }}\n              tabIndex={-1}\n              theme=\"outline\"\n              variant=\"circle\"\n            />\n          </div>\n        </CardBackground>\n      </Clickable>\n      <ElasticHeight isExpanded={isExpanded}>{children}</ElasticHeight>\n    </Card>\n  );\n};\n"],"names":["ExpandableCard","children","className","hLevel","image","onClick","subtitle","tags","title","component","attrs","hasTitle","isExpanded","setIsExpanded","useState","jsxs","Card","classnames","jsx","Clickable","CardBackground","tag","createElement","Tag","HeadingGroup","Button","ElasticHeight"],"mappings":";;;;;;;;;;;AAuBO,MAAMA,IAAyD,CAAC;AAAA,EACrE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAW,EAAQH,GAEnB,CAACI,GAAYC,CAAa,IAAIC,EAAS,EAAK;AAElD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAAP;AAAA,MACA,aAAU;AAAA,MACV,eAAY;AAAA,MACX,GAAGC;AAAA,MACJ,WAAWO,EAAW,EAAE,cAAcb,GAAO,IAAA,GAAOF,CAAS;AAAA,MAC7D,aAAWU;AAAA,MAEX,UAAA;AAAA,QAAA,gBAAAM;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,SAAS,MAAM;AACb,cAAAd,IAAU,CAACO,CAAU,GACrBC,EAAc,CAACD,CAAU;AAAA,YAC3B;AAAA,YAEA,UAAA,gBAAAG,EAACK,GAAA,EAAgB,GAAIhB,KAAS,CAAA,GAC3B,UAAA;AAAA,cAAA,EAAQG,GAAM,4BACZ,OAAA,EAAI,WAAU,wCACZ,UAAAA,GAAM,IAAI,CAACc,MAAQ,gBAAAC,EAACC,KAAK,GAAGF,GAAK,KAAKA,EAAI,OAAO,CAAE,GACtD;AAAA,cAEF,gBAAAN;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWE,EAAW,6CAA6C;AAAA,oBACjE,cAAcb,GAAO;AAAA,kBAAA,CACtB;AAAA,kBAEA,UAAA;AAAA,oBAAAO,KACC,gBAAAO,EAACM,GAAA,EAAa,UAAAlB,GAAoB,OAAOH,GACtC,UAAAK,GACH;AAAA,oBAEF,gBAAAU;AAAA,sBAACO;AAAA,sBAAA;AAAA,wBACC,WAAU;AAAA,wBACV,WAAU;AAAA,wBACV,OAAOrB,GAAO,MAAM,UAAU;AAAA,wBAC9B,MAAK;AAAA,wBACL,OAAO,EAAE,QAAQQ,IAAa,YAAY,OAAA;AAAA,wBAC1C,UAAU;AAAA,wBACV,OAAM;AAAA,wBACN,SAAQ;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACV;AAAA,gBAAA;AAAA,cAAA;AAAA,YACF,EAAA,CACF;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAM,EAACQ,GAAA,EAAc,YAAAd,GAAyB,UAAAX,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGvD;"}
+{"version":3,"file":"ExpandableCard.js","sources":["../../../lib/molecules/Cards/ExpandableCard.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type ComponentProps, type FunctionComponent, useState } from 'react';\n\nimport { Clickable } from '../../atoms/Clickable/Clickable';\nimport { Heading } from '../../atoms/Heading/Heading';\nimport { Tag } from '../Tag';\nimport { CardBackground, type CardBackgroundProps } from '@/molecules/Cards/CardBackground';\nimport { ElasticHeight } from '@/molecules/ElasticHeight';\nimport { Card, type CardProps } from '@/molecules/Cards/v2/Card';\nimport { HeadingGroup } from '@/atoms/Heading/HeadingGroup';\nimport { Button } from '@/molecules/Buttons/v2/Button';\n\nexport interface ExpandableCardProps extends Omit<CardProps<'article'>, 'onClick'> {\n  hLevel?: ComponentProps<typeof Heading>['level'];\n  image?: CardBackgroundProps;\n  onClick?: (isExpanded: boolean) => void;\n  subtitle?: string | null;\n  tags?: ComponentProps<typeof Tag>[] | null;\n  title: string;\n}\n\nexport const ExpandableCard: FunctionComponent<ExpandableCardProps> = ({\n  children,\n  className,\n  hLevel = 3,\n  image,\n  onClick,\n  subtitle,\n  tags,\n  title,\n  component = 'article',\n  ...attrs\n}) => {\n  const hasTitle = Boolean(title);\n\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  return (\n    <Card<'article'>\n      component={component}\n      data-name=\"ExpandableCard\"\n      data-testid=\"expandable-card\"\n      {...attrs}\n      className={clsx({ 'border-t-0': image?.src }, className)}\n      data-open={isExpanded}\n    >\n      <Clickable\n        className=\"group relative -m-1 block aspect-horizontal overflow-hidden rounded-16 text-start\"\n        data-testid=\"expandable-card-clickable\"\n        onClick={() => {\n          onClick?.(!isExpanded);\n          setIsExpanded(!isExpanded);\n        }}\n      >\n        <CardBackground {...(image || {})}>\n          {Boolean(tags?.length) && (\n            <div className=\"flex flex-wrap gap-4 self-start p-20\">\n              {tags?.map((tag) => <Tag {...tag} key={tag.label} />)}\n            </div>\n          )}\n          <div\n            className={clsx('mt-auto flex justify-between gap-x-8 p-20', {\n              'text-white': image?.src,\n            })}\n          >\n            {hasTitle && (\n              <HeadingGroup subtitle={subtitle} level={hLevel}>\n                {title}\n              </HeadingGroup>\n            )}\n            <Button\n              component=\"span\"\n              className=\"!transition duration-500\"\n              color={image?.src ? 'white' : 'black'}\n              icon=\"ArrowDefaultDown\"\n              style={{ rotate: isExpanded ? '-180deg' : '0deg' }}\n              tabIndex={-1}\n              theme=\"outline\"\n              variant=\"circle\"\n            />\n          </div>\n        </CardBackground>\n      </Clickable>\n      <ElasticHeight isExpanded={isExpanded}>{children}</ElasticHeight>\n    </Card>\n  );\n};\n"],"names":["ExpandableCard","children","className","hLevel","image","onClick","subtitle","tags","title","component","attrs","hasTitle","isExpanded","setIsExpanded","useState","jsxs","Card","clsx","jsx","Clickable","CardBackground","tag","createElement","Tag","HeadingGroup","Button","ElasticHeight"],"mappings":";;;;;;;;;;;AAuBO,MAAMA,IAAyD,CAAC;AAAA,EACrE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAW,EAAQH,GAEnB,CAACI,GAAYC,CAAa,IAAIC,EAAS,EAAK;AAElD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAAP;AAAA,MACA,aAAU;AAAA,MACV,eAAY;AAAA,MACX,GAAGC;AAAA,MACJ,WAAWO,EAAK,EAAE,cAAcb,GAAO,IAAA,GAAOF,CAAS;AAAA,MACvD,aAAWU;AAAA,MAEX,UAAA;AAAA,QAAA,gBAAAM;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,SAAS,MAAM;AACb,cAAAd,IAAU,CAACO,CAAU,GACrBC,EAAc,CAACD,CAAU;AAAA,YAC3B;AAAA,YAEA,UAAA,gBAAAG,EAACK,GAAA,EAAgB,GAAIhB,KAAS,CAAA,GAC3B,UAAA;AAAA,cAAA,EAAQG,GAAM,4BACZ,OAAA,EAAI,WAAU,wCACZ,UAAAA,GAAM,IAAI,CAACc,MAAQ,gBAAAC,EAACC,KAAK,GAAGF,GAAK,KAAKA,EAAI,OAAO,CAAE,GACtD;AAAA,cAEF,gBAAAN;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWE,EAAK,6CAA6C;AAAA,oBAC3D,cAAcb,GAAO;AAAA,kBAAA,CACtB;AAAA,kBAEA,UAAA;AAAA,oBAAAO,KACC,gBAAAO,EAACM,GAAA,EAAa,UAAAlB,GAAoB,OAAOH,GACtC,UAAAK,GACH;AAAA,oBAEF,gBAAAU;AAAA,sBAACO;AAAA,sBAAA;AAAA,wBACC,WAAU;AAAA,wBACV,WAAU;AAAA,wBACV,OAAOrB,GAAO,MAAM,UAAU;AAAA,wBAC9B,MAAK;AAAA,wBACL,OAAO,EAAE,QAAQQ,IAAa,YAAY,OAAA;AAAA,wBAC1C,UAAU;AAAA,wBACV,OAAM;AAAA,wBACN,SAAQ;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACV;AAAA,gBAAA;AAAA,cAAA;AAAA,YACF,EAAA,CACF;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAM,EAACQ,GAAA,EAAc,YAAAd,GAAyB,UAAAX,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGvD;"}

package/molecules/Cards/v2/Card.js

@@ -1,28 +1,28 @@
-import { jsx as c } from "react/jsx-runtime";
-import { c as m } from "../../../chunks/index.js";
+import { jsx as s } from "react/jsx-runtime";
+import { c as m } from "../../../chunks/clsx.js";
 import { CARD_ASPECT_RATIOS as l } from "../CardAspectRatios.js";
 function f({
   children: o,
-  className: e,
+  className: r,
   component: d = "div",
   format: i = "custom",
   theme: t = "bordered",
   ...n
 }) {
-  const s = d, r = [].concat(t).join(" ");
-  return /* @__PURE__ */ c(
-    s,
+  const c = d, e = [].concat(t).join(" ");
+  return /* @__PURE__ */ s(
+    c,
     {
       ...n,
       className: m(
         l[i],
         "relative isolate rounded-16",
         {
-          "bg-white": !e?.includes("bg-"),
-          "group overflow-hidden": r.includes("frame"),
-          "border border-lightGrey": r.includes("bordered")
+          "bg-white": !r?.includes("bg-"),
+          "group overflow-hidden": e.includes("frame"),
+          "border border-lightGrey": e.includes("bordered")
         },
-        e
+        r
       ),
       children: o
     }

package/molecules/Cards/v2/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../../lib/molecules/Cards/v2/Card.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ElementType } from 'react';\nimport cx from 'classnames';\nimport { CARD_ASPECT_RATIOS } from '../CardAspectRatios';\n\ntype CARD_THEME = 'none' | 'bordered' | 'frame';\n\nexport type CardProps<T extends ElementType = 'div'> = {\n  component?: string;\n  /**\n   * By default the card has a border.\n   * Set to false to remove it.\n   */\n  border?: boolean;\n  format?: keyof typeof CARD_ASPECT_RATIOS;\n  theme?: CARD_THEME | CARD_THEME[];\n} & ComponentPropsWithoutRef<T>;\n\nexport function Card<T extends ElementType = 'div'>({\n  children,\n  className,\n  component = 'div',\n  format = 'custom',\n  theme = 'bordered',\n  ...attrs\n}: CardProps<T>) {\n  const Cmp = component as ElementType;\n  const resolvedTheme = ([] as CARD_THEME[]).concat(theme).join(' ');\n\n  return (\n    <Cmp\n      {...attrs}\n      className={cx(\n        CARD_ASPECT_RATIOS[format],\n        'relative isolate rounded-16',\n        {\n          'bg-white': !className?.includes('bg-'),\n          'group overflow-hidden': resolvedTheme.includes('frame'),\n          'border border-lightGrey': resolvedTheme.includes('bordered'),\n        },\n        className,\n      )}\n    >\n      {children}\n    </Cmp>\n  );\n}\n"],"names":["Card","children","className","component","format","theme","attrs","Cmp","resolvedTheme","jsx","cx","CARD_ASPECT_RATIOS"],"mappings":";;;AAiBO,SAASA,EAAoC;AAAA,EAClD,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,QAAAC,IAAS;AAAA,EACT,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,GAAiB;AACf,QAAMC,IAAMJ,GACNK,IAAiB,CAAA,EAAoB,OAAOH,CAAK,EAAE,KAAK,GAAG;AAEjE,SACE,gBAAAI;AAAA,IAACF;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWI;AAAAA,QACTC,EAAmBP,CAAM;AAAA,QACzB;AAAA,QACA;AAAA,UACE,YAAY,CAACF,GAAW,SAAS,KAAK;AAAA,UACtC,yBAAyBM,EAAc,SAAS,OAAO;AAAA,UACvD,2BAA2BA,EAAc,SAAS,UAAU;AAAA,QAAA;AAAA,QAE9DN;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Card.js","sources":["../../../../lib/molecules/Cards/v2/Card.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ElementType } from 'react';\nimport cx from 'clsx';\nimport { CARD_ASPECT_RATIOS } from '../CardAspectRatios';\n\ntype CARD_THEME = 'none' | 'bordered' | 'frame';\n\nexport type CardProps<T extends ElementType = 'div'> = {\n  component?: string;\n  /**\n   * By default the card has a border.\n   * Set to false to remove it.\n   */\n  border?: boolean;\n  format?: keyof typeof CARD_ASPECT_RATIOS;\n  theme?: CARD_THEME | CARD_THEME[];\n} & ComponentPropsWithoutRef<T>;\n\nexport function Card<T extends ElementType = 'div'>({\n  children,\n  className,\n  component = 'div',\n  format = 'custom',\n  theme = 'bordered',\n  ...attrs\n}: CardProps<T>) {\n  const Cmp = component as ElementType;\n  const resolvedTheme = ([] as CARD_THEME[]).concat(theme).join(' ');\n\n  return (\n    <Cmp\n      {...attrs}\n      className={cx(\n        CARD_ASPECT_RATIOS[format],\n        'relative isolate rounded-16',\n        {\n          'bg-white': !className?.includes('bg-'),\n          'group overflow-hidden': resolvedTheme.includes('frame'),\n          'border border-lightGrey': resolvedTheme.includes('bordered'),\n        },\n        className,\n      )}\n    >\n      {children}\n    </Cmp>\n  );\n}\n"],"names":["Card","children","className","component","format","theme","attrs","Cmp","resolvedTheme","jsx","cx","CARD_ASPECT_RATIOS"],"mappings":";;;AAiBO,SAASA,EAAoC;AAAA,EAClD,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,QAAAC,IAAS;AAAA,EACT,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,GAAiB;AACf,QAAMC,IAAMJ,GACNK,IAAiB,CAAA,EAAoB,OAAOH,CAAK,EAAE,KAAK,GAAG;AAEjE,SACE,gBAAAI;AAAA,IAACF;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWI;AAAAA,QACTC,EAAmBP,CAAM;AAAA,QACzB;AAAA,QACA;AAAA,UACE,YAAY,CAACF,GAAW,SAAS,KAAK;AAAA,UACtC,yBAAyBM,EAAc,SAAS,OAAO;AAAA,UACvD,2BAA2BA,EAAc,SAAS,UAAU;AAAA,QAAA;AAAA,QAE9DN;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/molecules/Chip.js

@@ -1,23 +1,23 @@
 import { jsx as a } from "react/jsx-runtime";
-import { c as m } from "../chunks/index.js";
+import { c as m } from "../chunks/clsx.js";
 import { getTheme as c } from "./Chip.themes.js";
 const f = ({
   className: e,
-  color: s = "sienna",
-  size: r = "size-32",
-  theme: o = "solid",
+  color: r = "sienna",
+  size: o = "size-32",
+  theme: s = "solid",
   children: t,
-  ...n
+  ...i
 }) => {
-  const { thRoot: i } = c(o, { color: s });
+  const { thRoot: n } = c(s, { color: r });
   return /* @__PURE__ */ a(
     "span",
     {
-      ...n,
+      ...i,
       className: m(
         "inline-flex aspect-square shrink-0 items-center justify-center overflow-hidden rounded-full border",
-        r,
-        i,
+        o,
+        n,
         e
       ),
       "data-name": "Chip",

package/molecules/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sources":["../../lib/molecules/Chip.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport type { ComponentPropsWithoutRef } from 'react';\n\nimport { getTheme, type Theme } from './Chip.themes';\n\nimport type { Colors } from '@/types/Colors';\n\nexport interface ChipProps extends ComponentPropsWithoutRef<'span'> {\n  color?: Colors;\n  size?: string;\n  theme?: Theme;\n}\n\nexport const Chip = ({\n  className,\n  color = 'sienna',\n  size = 'size-32',\n  theme = 'solid',\n  children,\n  ...attrs\n}: ChipProps) => {\n  const { thRoot } = getTheme(theme, { color });\n\n  return (\n    <span\n      {...attrs}\n      className={classNames(\n        'inline-flex aspect-square shrink-0 items-center justify-center overflow-hidden rounded-full border',\n        size,\n        thRoot,\n        className,\n      )}\n      data-name=\"Chip\"\n    >\n      {children}\n    </span>\n  );\n};\n"],"names":["Chip","className","color","size","theme","children","attrs","thRoot","getTheme","jsx","classNames"],"mappings":";;;AAaO,MAAMA,IAAO,CAAC;AAAA,EACnB,WAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,GAAGC;AACL,MAAiB;AACf,QAAM,EAAE,QAAAC,EAAA,IAAWC,EAASJ,GAAO,EAAE,OAAAF,GAAO;AAE5C,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGH;AAAA,MACJ,WAAWI;AAAAA,QACT;AAAA,QACAP;AAAA,QACAI;AAAA,QACAN;AAAA,MAAA;AAAA,MAEF,aAAU;AAAA,MAET,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Chip.js","sources":["../../lib/molecules/Chip.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ComponentPropsWithoutRef } from 'react';\n\nimport { getTheme, type Theme } from './Chip.themes';\n\nimport type { Colors } from '@/types/Colors';\n\nexport interface ChipProps extends ComponentPropsWithoutRef<'span'> {\n  color?: Colors;\n  size?: string;\n  theme?: Theme;\n}\n\nexport const Chip = ({\n  className,\n  color = 'sienna',\n  size = 'size-32',\n  theme = 'solid',\n  children,\n  ...attrs\n}: ChipProps) => {\n  const { thRoot } = getTheme(theme, { color });\n\n  return (\n    <span\n      {...attrs}\n      className={clsx(\n        'inline-flex aspect-square shrink-0 items-center justify-center overflow-hidden rounded-full border',\n        size,\n        thRoot,\n        className,\n      )}\n      data-name=\"Chip\"\n    >\n      {children}\n    </span>\n  );\n};\n"],"names":["Chip","className","color","size","theme","children","attrs","thRoot","getTheme","jsx","clsx"],"mappings":";;;AAaO,MAAMA,IAAO,CAAC;AAAA,EACnB,WAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,GAAGC;AACL,MAAiB;AACf,QAAM,EAAE,QAAAC,EAAA,IAAWC,EAASJ,GAAO,EAAE,OAAAF,GAAO;AAE5C,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGH;AAAA,MACJ,WAAWI;AAAA,QACT;AAAA,QACAP;AAAA,QACAI;AAAA,QACAN;AAAA,MAAA;AAAA,MAEF,aAAU;AAAA,MAET,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/molecules/Chip.themes.js

@@ -1,11 +1,11 @@
-import { c as e } from "../chunks/index.js";
-import { getBorderColor as r, getTextColor as n, getBgColor as g, getComplementaryTextColor as i } from "../helpers/colors/colors.js";
+import { c as e } from "../chunks/clsx.js";
+import { getBorderColor as r, getTextColor as g, getBgColor as n, getComplementaryTextColor as i } from "../helpers/colors/colors.js";
 const l = (t) => ({
   solid: {
-    thRoot: e(g(t), r(t), i(t))
+    thRoot: e(n(t), r(t), i(t))
   },
   outline: {
-    thRoot: e("bg-transparent", r(t), n(t))
+    thRoot: e("bg-transparent", r(t), g(t))
   },
   light: {
     thRoot: e("bg-lightSand text-black border-lightSand")
@@ -13,12 +13,12 @@ const l = (t) => ({
   dark: {
     thRoot: e("bg-ultramarine text-white border-ultramarine")
   }
-}), h = (t, { color: a }) => {
+}), s = (t, { color: a }) => {
   const o = l(a);
   return o[t] || o.solid;
 };
 export {
-  h as getTheme,
+  s as getTheme,
   l as themes
 };
 //# sourceMappingURL=Chip.themes.js.map

package/molecules/Chip.themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.themes.js","sources":["../../lib/molecules/Chip.themes.ts"],"sourcesContent":["import classnames from 'classnames';\nimport type { Colors } from '@/types/Colors';\nimport {\n  getBgColor,\n  getBorderColor,\n  getComplementaryTextColor,\n  getTextColor,\n} from '@/helpers/colors/colors';\n\nexport type Theme = 'solid' | 'outline' | 'light' | 'dark';\n\ntype Options = { color: Colors };\n\nexport const themes = (color: Colors): Record<Theme, { thRoot: string }> => ({\n  solid: {\n    thRoot: classnames(getBgColor(color), getBorderColor(color), getComplementaryTextColor(color)),\n  },\n  outline: {\n    thRoot: classnames('bg-transparent', getBorderColor(color), getTextColor(color)),\n  },\n  light: {\n    thRoot: classnames('bg-lightSand text-black border-lightSand'),\n  },\n  dark: {\n    thRoot: classnames('bg-ultramarine text-white border-ultramarine'),\n  },\n});\n\nexport const getTheme = (theme: Theme, { color }: Options) => {\n  const THEMES = themes(color);\n\n  return THEMES[theme] || THEMES.solid;\n};\n"],"names":["themes","color","classnames","getBgColor","getBorderColor","getComplementaryTextColor","getTextColor","getTheme","theme","THEMES"],"mappings":";;AAaO,MAAMA,IAAS,CAACC,OAAsD;AAAA,EAC3E,OAAO;AAAA,IACL,QAAQC,EAAWC,EAAWF,CAAK,GAAGG,EAAeH,CAAK,GAAGI,EAA0BJ,CAAK,CAAC;AAAA,EAAA;AAAA,EAE/F,SAAS;AAAA,IACP,QAAQC,EAAW,kBAAkBE,EAAeH,CAAK,GAAGK,EAAaL,CAAK,CAAC;AAAA,EAAA;AAAA,EAEjF,OAAO;AAAA,IACL,QAAQC,EAAW,0CAA0C;AAAA,EAAA;AAAA,EAE/D,MAAM;AAAA,IACJ,QAAQA,EAAW,8CAA8C;AAAA,EAAA;AAErE,IAEaK,IAAW,CAACC,GAAc,EAAE,OAAAP,QAAqB;AAC5D,QAAMQ,IAAST,EAAOC,CAAK;AAE3B,SAAOQ,EAAOD,CAAK,KAAKC,EAAO;AACjC;"}
+{"version":3,"file":"Chip.themes.js","sources":["../../lib/molecules/Chip.themes.ts"],"sourcesContent":["import clsx from 'clsx';\nimport type { Colors } from '@/types/Colors';\nimport {\n  getBgColor,\n  getBorderColor,\n  getComplementaryTextColor,\n  getTextColor,\n} from '@/helpers/colors/colors';\n\nexport type Theme = 'solid' | 'outline' | 'light' | 'dark';\n\ntype Options = { color: Colors };\n\nexport const themes = (color: Colors): Record<Theme, { thRoot: string }> => ({\n  solid: {\n    thRoot: clsx(getBgColor(color), getBorderColor(color), getComplementaryTextColor(color)),\n  },\n  outline: {\n    thRoot: clsx('bg-transparent', getBorderColor(color), getTextColor(color)),\n  },\n  light: {\n    thRoot: clsx('bg-lightSand text-black border-lightSand'),\n  },\n  dark: {\n    thRoot: clsx('bg-ultramarine text-white border-ultramarine'),\n  },\n});\n\nexport const getTheme = (theme: Theme, { color }: Options) => {\n  const THEMES = themes(color);\n\n  return THEMES[theme] || THEMES.solid;\n};\n"],"names":["themes","color","clsx","getBgColor","getBorderColor","getComplementaryTextColor","getTextColor","getTheme","theme","THEMES"],"mappings":";;AAaO,MAAMA,IAAS,CAACC,OAAsD;AAAA,EAC3E,OAAO;AAAA,IACL,QAAQC,EAAKC,EAAWF,CAAK,GAAGG,EAAeH,CAAK,GAAGI,EAA0BJ,CAAK,CAAC;AAAA,EAAA;AAAA,EAEzF,SAAS;AAAA,IACP,QAAQC,EAAK,kBAAkBE,EAAeH,CAAK,GAAGK,EAAaL,CAAK,CAAC;AAAA,EAAA;AAAA,EAE3E,OAAO;AAAA,IACL,QAAQC,EAAK,0CAA0C;AAAA,EAAA;AAAA,EAEzD,MAAM;AAAA,IACJ,QAAQA,EAAK,8CAA8C;AAAA,EAAA;AAE/D,IAEaK,IAAW,CAACC,GAAc,EAAE,OAAAP,QAAqB;AAC5D,QAAMQ,IAAST,EAAOC,CAAK;AAE3B,SAAOQ,EAAOD,CAAK,KAAKC,EAAO;AACjC;"}

package/molecules/ElasticHeight.js

@@ -1,14 +1,14 @@
 "use client";
 import { jsx as s } from "react/jsx-runtime";
-import { c as u } from "../chunks/index.js";
+import { c as u } from "../chunks/clsx.js";
 import { useRef as l, useState as m, useLayoutEffect as d } from "react";
 import h from "../hooks/useResizeObserver.js";
 const H = ({
   className: i,
   children: o,
-  innerClassName: a,
+  innerClassName: n,
   isExpanded: t = !1,
-  min: n = 0,
+  min: a = 0,
   ...f
 }) => {
   const e = l(null), [c, r] = m(0);
@@ -25,8 +25,8 @@ const H = ({
       ...f,
       className: u("overflow-hidden transition-all duration-500", i),
       "data-expanded": t,
-      style: { height: t ? c : n },
-      children: /* @__PURE__ */ s("div", { className: a, ref: e, children: o })
+      style: { height: t ? c : a },
+      children: /* @__PURE__ */ s("div", { className: n, ref: e, children: o })
     }
   );
 };

package/molecules/ElasticHeight.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElasticHeight.js","sources":["../../lib/molecules/ElasticHeight.tsx"],"sourcesContent":["'use client';\n\nimport classnames from 'classnames';\nimport {\n  type ComponentPropsWithoutRef,\n  type FunctionComponent,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\nimport useResizeObserver from '@/hooks/useResizeObserver';\n\ninterface ElasticHeightProps extends ComponentPropsWithoutRef<'div'> {\n  innerClassName?: string;\n  isExpanded?: boolean;\n  min?: number;\n}\n\nexport const ElasticHeight: FunctionComponent<ElasticHeightProps> = ({\n  className,\n  children,\n  innerClassName,\n  isExpanded = false,\n  min = 0,\n  ...attrs\n}) => {\n  const ref = useRef<HTMLDivElement>(null as any);\n  const [max, setMax] = useState(0);\n\n  useResizeObserver<HTMLDivElement>({\n    ref: ref,\n    onResize: () => {\n      if (ref.current) {\n        setMax(ref.current?.offsetHeight);\n      }\n    },\n  });\n\n  useLayoutEffect(() => {\n    if (!ref.current) {\n      return;\n    }\n    setMax(ref.current.offsetHeight);\n  }, [ref]);\n\n  return (\n    <div\n      {...attrs}\n      className={classnames('overflow-hidden transition-all duration-500', className)}\n      data-expanded={isExpanded}\n      style={{ height: isExpanded ? max : min }}\n    >\n      <div className={innerClassName} ref={ref}>\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"names":["ElasticHeight","className","children","innerClassName","isExpanded","min","attrs","ref","useRef","max","setMax","useState","useResizeObserver","useLayoutEffect","jsx","classnames"],"mappings":";;;;;AAkBO,MAAMA,IAAuD,CAAC;AAAA,EACnE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,KAAAC,IAAM;AAAA,EACN,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAMC,EAAuB,IAAW,GACxC,CAACC,GAAKC,CAAM,IAAIC,EAAS,CAAC;AAEhC,SAAAC,EAAkC;AAAA,IAChC,KAAAL;AAAA,IACA,UAAU,MAAM;AACd,MAAIA,EAAI,WACNG,EAAOH,EAAI,SAAS,YAAY;AAAA,IAEpC;AAAA,EAAA,CACD,GAEDM,EAAgB,MAAM;AACpB,IAAKN,EAAI,WAGTG,EAAOH,EAAI,QAAQ,YAAY;AAAA,EACjC,GAAG,CAACA,CAAG,CAAC,GAGN,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGR;AAAA,MACJ,WAAWS,EAAW,+CAA+Cd,CAAS;AAAA,MAC9E,iBAAeG;AAAA,MACf,OAAO,EAAE,QAAQA,IAAaK,IAAMJ,EAAA;AAAA,MAEpC,UAAA,gBAAAS,EAAC,OAAA,EAAI,WAAWX,GAAgB,KAAAI,GAC7B,UAAAL,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"ElasticHeight.js","sources":["../../lib/molecules/ElasticHeight.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport {\n  type ComponentPropsWithoutRef,\n  type FunctionComponent,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\nimport useResizeObserver from '@/hooks/useResizeObserver';\n\ninterface ElasticHeightProps extends ComponentPropsWithoutRef<'div'> {\n  innerClassName?: string;\n  isExpanded?: boolean;\n  min?: number;\n}\n\nexport const ElasticHeight: FunctionComponent<ElasticHeightProps> = ({\n  className,\n  children,\n  innerClassName,\n  isExpanded = false,\n  min = 0,\n  ...attrs\n}) => {\n  const ref = useRef<HTMLDivElement>(null as any);\n  const [max, setMax] = useState(0);\n\n  useResizeObserver<HTMLDivElement>({\n    ref: ref,\n    onResize: () => {\n      if (ref.current) {\n        setMax(ref.current?.offsetHeight);\n      }\n    },\n  });\n\n  useLayoutEffect(() => {\n    if (!ref.current) {\n      return;\n    }\n    setMax(ref.current.offsetHeight);\n  }, [ref]);\n\n  return (\n    <div\n      {...attrs}\n      className={clsx('overflow-hidden transition-all duration-500', className)}\n      data-expanded={isExpanded}\n      style={{ height: isExpanded ? max : min }}\n    >\n      <div className={innerClassName} ref={ref}>\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"names":["ElasticHeight","className","children","innerClassName","isExpanded","min","attrs","ref","useRef","max","setMax","useState","useResizeObserver","useLayoutEffect","jsx","clsx"],"mappings":";;;;;AAkBO,MAAMA,IAAuD,CAAC;AAAA,EACnE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,KAAAC,IAAM;AAAA,EACN,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAMC,EAAuB,IAAW,GACxC,CAACC,GAAKC,CAAM,IAAIC,EAAS,CAAC;AAEhC,SAAAC,EAAkC;AAAA,IAChC,KAAAL;AAAA,IACA,UAAU,MAAM;AACd,MAAIA,EAAI,WACNG,EAAOH,EAAI,SAAS,YAAY;AAAA,IAEpC;AAAA,EAAA,CACD,GAEDM,EAAgB,MAAM;AACpB,IAAKN,EAAI,WAGTG,EAAOH,EAAI,QAAQ,YAAY;AAAA,EACjC,GAAG,CAACA,CAAG,CAAC,GAGN,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGR;AAAA,MACJ,WAAWS,EAAK,+CAA+Cd,CAAS;AAAA,MACxE,iBAAeG;AAAA,MACf,OAAO,EAAE,QAAQA,IAAaK,IAAMJ,EAAA;AAAA,MAEpC,UAAA,gBAAAS,EAAC,OAAA,EAAI,WAAWX,GAAgB,KAAAI,GAC7B,UAAAL,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}