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

package/molecules/Tabs/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sources":["../../../lib/molecules/Tabs/Tab.tsx"],"sourcesContent":["'use client';\n\nimport classnames from 'classnames';\nimport {\n  type ComponentPropsWithoutRef,\n  type CSSProperties,\n  type FunctionComponent,\n  type PropsWithChildren,\n  useCallback,\n  useEffect,\n  useRef,\n  type KeyboardEvent,\n} from 'react';\n\nimport { useActiveTab, useRegisterTabControl, useTabsUid } from './hooks/tabControl';\nimport { getTheme, type Theme } from './theme';\nimport { useKeyboardControls } from '../../hooks/useKeyboardControls';\n\nimport './Tab.css';\n\nconst BACKGROUND_PILL_CLASSNAME = '-z-1 rounded-pill absolute inset-0 duration-300';\n\ninterface Props extends Omit<ComponentPropsWithoutRef<'div'>, 'onSelect'> {\n  /**\n   * Tab Heading text\n   */\n  label?: string;\n  /**\n   * Tab heading index<br/>\n   * _Can be **0** or **1** indexed_\n   */\n  value: number;\n  /**\n   * on tab select handler\n   */\n  onSelect?: (context: { value: Props['value']; label: Props['label'] }) => void;\n  /**\n   * Tab theme\n   */\n  theme?: Theme;\n  /**\n   * Heading type\n   * _default: **h2**_\n   */\n  as?: 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5';\n}\n\nexport const Tab: FunctionComponent<PropsWithChildren<Props>> = ({\n  label,\n  children,\n  value,\n  onSelect,\n  as: TagName = 'h2',\n  theme = 'yellow',\n  ...attr\n}) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const activeTab = useActiveTab();\n  const uid = useTabsUid();\n  const dispatch = useRegisterTabControl({ value, ref });\n  const previousActiveTab = useRef(activeTab);\n\n  const isActive = useRef(activeTab === value);\n  isActive.current = activeTab === value;\n\n  const pillStyle = { '--tab-index': value } as CSSProperties;\n  const { textColor, textColorActive, bgColor } = getTheme(theme);\n\n  useEffect(() => {\n    if (previousActiveTab.current !== activeTab && value === activeTab) {\n      ref.current?.focus();\n      onSelect?.({ value, label });\n    }\n    if (previousActiveTab.current !== activeTab) {\n      previousActiveTab.current = activeTab;\n    }\n  }, [label, value, onSelect, activeTab]);\n\n  const start = useCallback(() => {\n    dispatch({ type: 'start' });\n  }, [dispatch]);\n\n  const end = useCallback(() => {\n    dispatch({ type: 'end' });\n  }, [dispatch]);\n\n  const up = useCallback(() => {\n    dispatch({ type: 'previous' });\n  }, [dispatch]);\n\n  const down = useCallback(() => {\n    dispatch({ type: 'next' });\n  }, [dispatch]);\n\n  const left = useCallback(() => {\n    const isRTL = document.documentElement.dir === 'rtl';\n\n    dispatch({ type: isRTL ? 'next' : 'previous' });\n  }, [dispatch]);\n\n  const right = useCallback(() => {\n    const isRTL = document.documentElement.dir === 'rtl';\n\n    dispatch({ type: isRTL ? 'previous' : 'next' });\n  }, [dispatch]);\n\n  const keyboardHandler = useKeyboardControls({\n    start,\n    end,\n    up,\n    down,\n    left,\n    right,\n  });\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLDivElement>) => {\n      const isSpace = e.key === ' ' || e.key === 'Spacebar' || e.code === 'Space';\n      const isEnter = e.key === 'Enter' || e.code === 'Enter';\n\n      if (isActive.current && (isSpace || isEnter)) {\n        e.preventDefault();\n        return;\n      }\n\n      keyboardHandler(e);\n    },\n    [keyboardHandler],\n  );\n\n  const handleClick = () => {\n    if (isActive.current) {\n      return;\n    }\n\n    dispatch({ type: 'update', payload: value });\n  };\n\n  return (\n    <div\n      {...attr}\n      id={attr.id || `Tab_${value}_${uid}`}\n      data-name=\"Tab\"\n      ref={ref}\n      role=\"tab\"\n      aria-selected={isActive.current}\n      aria-controls={`TabPanel_${value}_${uid}`}\n      tabIndex={isActive.current ? 0 : -1}\n      className={classnames(\n        'group inline-block cursor-pointer overflow-hidden whitespace-nowrap bg-transparent pe-4 align-middle text-b3 font-semibold outline-none',\n        {\n          [textColor]: !isActive,\n          [textColorActive]: isActive,\n          'transition-transform active:scale-[1.03]': isActive,\n        },\n      )}\n      onKeyDown={handleKeyDown}\n      onClick={handleClick}\n    >\n      <TagName\n        className=\"relative inline-block px-20 py-12\"\n        {...(!isActive ? { role: 'presentation' } : {})}\n      >\n        <span\n          className={classnames(\n            'transition-colors group-focus-within:bg-pearl group-hover:bg-pearl',\n            BACKGROUND_PILL_CLASSNAME,\n          )}\n        />\n        <span\n          className={classnames(\n            'tab-focus-pill ease transition-transform/colors',\n            BACKGROUND_PILL_CLASSNAME,\n            bgColor,\n          )}\n          style={pillStyle}\n        />\n        {children ?? label}\n      </TagName>\n    </div>\n  );\n};\n"],"names":["BACKGROUND_PILL_CLASSNAME","Tab","label","children","value","onSelect","TagName","theme","attr","ref","useRef","activeTab","useActiveTab","uid","useTabsUid","dispatch","useRegisterTabControl","previousActiveTab","isActive","pillStyle","textColor","textColorActive","bgColor","getTheme","useEffect","start","useCallback","end","up","down","left","isRTL","right","keyboardHandler","useKeyboardControls","handleKeyDown","isSpace","isEnter","handleClick","jsx","classnames","jsxs"],"mappings":"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"}
+{"version":3,"file":"Tab.js","sources":["../../../lib/molecules/Tabs/Tab.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport {\n  type ComponentPropsWithoutRef,\n  type CSSProperties,\n  type FunctionComponent,\n  type PropsWithChildren,\n  useCallback,\n  useEffect,\n  useRef,\n  type KeyboardEvent,\n} from 'react';\n\nimport { useActiveTab, useRegisterTabControl, useTabsUid } from './hooks/tabControl';\nimport { getTheme, type Theme } from './theme';\nimport { useKeyboardControls } from '../../hooks/useKeyboardControls';\n\nimport './Tab.css';\n\nconst BACKGROUND_PILL_CLASSNAME = '-z-1 rounded-pill absolute inset-0 duration-300';\n\ninterface Props extends Omit<ComponentPropsWithoutRef<'div'>, 'onSelect'> {\n  /**\n   * Tab Heading text\n   */\n  label?: string;\n  /**\n   * Tab heading index<br/>\n   * _Can be **0** or **1** indexed_\n   */\n  value: number;\n  /**\n   * on tab select handler\n   */\n  onSelect?: (context: { value: Props['value']; label: Props['label'] }) => void;\n  /**\n   * Tab theme\n   */\n  theme?: Theme;\n  /**\n   * Heading type\n   * _default: **h2**_\n   */\n  as?: 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5';\n}\n\nexport const Tab: FunctionComponent<PropsWithChildren<Props>> = ({\n  label,\n  children,\n  value,\n  onSelect,\n  as: TagName = 'h2',\n  theme = 'yellow',\n  ...attr\n}) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const activeTab = useActiveTab();\n  const uid = useTabsUid();\n  const dispatch = useRegisterTabControl({ value, ref });\n  const previousActiveTab = useRef(activeTab);\n\n  const isActive = useRef(activeTab === value);\n  isActive.current = activeTab === value;\n\n  const pillStyle = { '--tab-index': value } as CSSProperties;\n  const { textColor, textColorActive, bgColor } = getTheme(theme);\n\n  useEffect(() => {\n    if (previousActiveTab.current !== activeTab && value === activeTab) {\n      ref.current?.focus();\n      onSelect?.({ value, label });\n    }\n    if (previousActiveTab.current !== activeTab) {\n      previousActiveTab.current = activeTab;\n    }\n  }, [label, value, onSelect, activeTab]);\n\n  const start = useCallback(() => {\n    dispatch({ type: 'start' });\n  }, [dispatch]);\n\n  const end = useCallback(() => {\n    dispatch({ type: 'end' });\n  }, [dispatch]);\n\n  const up = useCallback(() => {\n    dispatch({ type: 'previous' });\n  }, [dispatch]);\n\n  const down = useCallback(() => {\n    dispatch({ type: 'next' });\n  }, [dispatch]);\n\n  const left = useCallback(() => {\n    const isRTL = document.documentElement.dir === 'rtl';\n\n    dispatch({ type: isRTL ? 'next' : 'previous' });\n  }, [dispatch]);\n\n  const right = useCallback(() => {\n    const isRTL = document.documentElement.dir === 'rtl';\n\n    dispatch({ type: isRTL ? 'previous' : 'next' });\n  }, [dispatch]);\n\n  const keyboardHandler = useKeyboardControls({\n    start,\n    end,\n    up,\n    down,\n    left,\n    right,\n  });\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLDivElement>) => {\n      const isSpace = e.key === ' ' || e.key === 'Spacebar' || e.code === 'Space';\n      const isEnter = e.key === 'Enter' || e.code === 'Enter';\n\n      if (isActive.current && (isSpace || isEnter)) {\n        e.preventDefault();\n        return;\n      }\n\n      keyboardHandler(e);\n    },\n    [keyboardHandler],\n  );\n\n  const handleClick = () => {\n    if (isActive.current) {\n      return;\n    }\n\n    dispatch({ type: 'update', payload: value });\n  };\n\n  return (\n    <div\n      {...attr}\n      id={attr.id || `Tab_${value}_${uid}`}\n      data-name=\"Tab\"\n      ref={ref}\n      role=\"tab\"\n      aria-selected={isActive.current}\n      aria-controls={`TabPanel_${value}_${uid}`}\n      tabIndex={isActive.current ? 0 : -1}\n      className={clsx(\n        'group inline-block cursor-pointer overflow-hidden whitespace-nowrap bg-transparent pe-4 align-middle text-b3 font-semibold outline-none',\n        {\n          [textColor]: !isActive,\n          [textColorActive]: isActive,\n          'transition-transform active:scale-[1.03]': isActive,\n        },\n      )}\n      onKeyDown={handleKeyDown}\n      onClick={handleClick}\n    >\n      <TagName\n        className=\"relative inline-block px-20 py-12\"\n        {...(!isActive ? { role: 'presentation' } : {})}\n      >\n        <span\n          className={clsx(\n            'transition-colors group-focus-within:bg-pearl group-hover:bg-pearl',\n            BACKGROUND_PILL_CLASSNAME,\n          )}\n        />\n        <span\n          className={clsx(\n            'tab-focus-pill ease transition-transform/colors',\n            BACKGROUND_PILL_CLASSNAME,\n            bgColor,\n          )}\n          style={pillStyle}\n        />\n        {children ?? label}\n      </TagName>\n    </div>\n  );\n};\n"],"names":["BACKGROUND_PILL_CLASSNAME","Tab","label","children","value","onSelect","TagName","theme","attr","ref","useRef","activeTab","useActiveTab","uid","useTabsUid","dispatch","useRegisterTabControl","previousActiveTab","isActive","pillStyle","textColor","textColorActive","bgColor","getTheme","useEffect","start","useCallback","end","up","down","left","isRTL","right","keyboardHandler","useKeyboardControls","handleKeyDown","isSpace","isEnter","handleClick","jsx","clsx","jsxs"],"mappings":"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"}

package/molecules/Tabs/TabList.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as r, jsxs as d } from "react/jsx-runtime";
-import { c } from "../../chunks/index.js";
+import { c } from "../../chunks/clsx.js";
 import { useRef as n, useEffect as w } from "react";
 import { useActiveTabControl as v } from "./hooks/tabControl.js";
 const C = ({

package/molecules/Tabs/TabList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabList.js","sources":["../../../lib/molecules/Tabs/TabList.tsx"],"sourcesContent":["'use client';\n\nimport classnames from 'classnames';\nimport {\n  type CSSProperties,\n  useEffect,\n  useRef,\n  type FunctionComponent,\n  type PropsWithChildren,\n} from 'react';\n\nimport { useActiveTabControl } from './hooks/tabControl';\n\ninterface Props {\n  className?: string;\n  /**\n   * Remove filler placeholders\n   */\n  constrained?: boolean;\n}\n\nexport const TabList: FunctionComponent<PropsWithChildren<Props>> = ({\n  className,\n  constrained = false,\n  children,\n}) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const spacerRef = useRef<HTMLDivElement>(null);\n  const [currentTab, currentControl] = useActiveTabControl();\n\n  useEffect(() => {\n    if (!currentControl?.current || !ref.current) {\n      return;\n    }\n\n    const spacerWidth = spacerRef.current!.offsetWidth ?? 0;\n    const currentRect = currentControl.current.getBoundingClientRect();\n    const containerRect = ref.current!.getBoundingClientRect();\n    const scroll = ref.current!.scrollLeft;\n\n    ref.current.scrollLeft = scroll + (currentRect.left - containerRect.left) - spacerWidth;\n  }, [currentControl]);\n\n  const style = { '--active-tab': currentTab } as CSSProperties;\n\n  return (\n    <div\n      data-name=\"TabsHeader\"\n      className={classnames(\n        'scrollbar-hidden relative isolate flex max-w-full overflow-x-scroll scroll-smooth py-20',\n        className,\n      )}\n      ref={ref}\n    >\n      <div role=\"tablist\" className=\"flex flex-row\" style={style}>\n        <div\n          ref={spacerRef}\n          className={classnames('shrink-0', {\n            'w-16 lg:w-[max(calc((100vw-1212px)/2),116px)] xl:w-[max(calc((100vw-1212px)/2),156px)]':\n              !constrained,\n          })}\n        />\n        {children}\n        <div\n          className={classnames('shrink-0', {\n            'w-16 lg:w-[max(calc((100vw-1212px)/2),116px)] xl:w-[max(calc((100vw-1212px)/2),156px)]':\n              !constrained,\n          })}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["TabList","className","constrained","children","ref","useRef","spacerRef","currentTab","currentControl","useActiveTabControl","useEffect","spacerWidth","currentRect","containerRect","scroll","style","jsx","classnames"],"mappings":";;;;;AAqBO,MAAMA,IAAuD,CAAC;AAAA,EACnE,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAMC,EAAuB,IAAI,GACjCC,IAAYD,EAAuB,IAAI,GACvC,CAACE,GAAYC,CAAc,IAAIC,EAAA;AAErC,EAAAC,EAAU,MAAM;AACd,QAAI,CAACF,GAAgB,WAAW,CAACJ,EAAI;AACnC;AAGF,UAAMO,IAAcL,EAAU,QAAS,eAAe,GAChDM,IAAcJ,EAAe,QAAQ,sBAAA,GACrCK,IAAgBT,EAAI,QAAS,sBAAA,GAC7BU,IAASV,EAAI,QAAS;AAE5B,IAAAA,EAAI,QAAQ,aAAaU,KAAUF,EAAY,OAAOC,EAAc,QAAQF;AAAA,EAC9E,GAAG,CAACH,CAAc,CAAC;AAEnB,QAAMO,IAAQ,EAAE,gBAAgBR,EAAA;AAEhC,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAhB;AAAA,MAAA;AAAA,MAEF,KAAAG;AAAA,MAEA,4BAAC,OAAA,EAAI,MAAK,WAAU,WAAU,iBAAgB,OAAAW,GAC5C,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKV;AAAA,YACL,WAAWW,EAAW,YAAY;AAAA,cAChC,0FACE,CAACf;AAAA,YAAA,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,QAEFC;AAAA,QACD,gBAAAa;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAW,YAAY;AAAA,cAChC,0FACE,CAACf;AAAA,YAAA,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"TabList.js","sources":["../../../lib/molecules/Tabs/TabList.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport {\n  type CSSProperties,\n  useEffect,\n  useRef,\n  type FunctionComponent,\n  type PropsWithChildren,\n} from 'react';\n\nimport { useActiveTabControl } from './hooks/tabControl';\n\ninterface Props {\n  className?: string;\n  /**\n   * Remove filler placeholders\n   */\n  constrained?: boolean;\n}\n\nexport const TabList: FunctionComponent<PropsWithChildren<Props>> = ({\n  className,\n  constrained = false,\n  children,\n}) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const spacerRef = useRef<HTMLDivElement>(null);\n  const [currentTab, currentControl] = useActiveTabControl();\n\n  useEffect(() => {\n    if (!currentControl?.current || !ref.current) {\n      return;\n    }\n\n    const spacerWidth = spacerRef.current!.offsetWidth ?? 0;\n    const currentRect = currentControl.current.getBoundingClientRect();\n    const containerRect = ref.current!.getBoundingClientRect();\n    const scroll = ref.current!.scrollLeft;\n\n    ref.current.scrollLeft = scroll + (currentRect.left - containerRect.left) - spacerWidth;\n  }, [currentControl]);\n\n  const style = { '--active-tab': currentTab } as CSSProperties;\n\n  return (\n    <div\n      data-name=\"TabsHeader\"\n      className={clsx(\n        'scrollbar-hidden relative isolate flex max-w-full overflow-x-scroll scroll-smooth py-20',\n        className,\n      )}\n      ref={ref}\n    >\n      <div role=\"tablist\" className=\"flex flex-row\" style={style}>\n        <div\n          ref={spacerRef}\n          className={clsx('shrink-0', {\n            'w-16 lg:w-[max(calc((100vw-1212px)/2),116px)] xl:w-[max(calc((100vw-1212px)/2),156px)]':\n              !constrained,\n          })}\n        />\n        {children}\n        <div\n          className={clsx('shrink-0', {\n            'w-16 lg:w-[max(calc((100vw-1212px)/2),116px)] xl:w-[max(calc((100vw-1212px)/2),156px)]':\n              !constrained,\n          })}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["TabList","className","constrained","children","ref","useRef","spacerRef","currentTab","currentControl","useActiveTabControl","useEffect","spacerWidth","currentRect","containerRect","scroll","style","jsx","clsx"],"mappings":";;;;;AAqBO,MAAMA,IAAuD,CAAC;AAAA,EACnE,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAMC,EAAuB,IAAI,GACjCC,IAAYD,EAAuB,IAAI,GACvC,CAACE,GAAYC,CAAc,IAAIC,EAAA;AAErC,EAAAC,EAAU,MAAM;AACd,QAAI,CAACF,GAAgB,WAAW,CAACJ,EAAI;AACnC;AAGF,UAAMO,IAAcL,EAAU,QAAS,eAAe,GAChDM,IAAcJ,EAAe,QAAQ,sBAAA,GACrCK,IAAgBT,EAAI,QAAS,sBAAA,GAC7BU,IAASV,EAAI,QAAS;AAE5B,IAAAA,EAAI,QAAQ,aAAaU,KAAUF,EAAY,OAAOC,EAAc,QAAQF;AAAA,EAC9E,GAAG,CAACH,CAAc,CAAC;AAEnB,QAAMO,IAAQ,EAAE,gBAAgBR,EAAA;AAEhC,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAhB;AAAA,MAAA;AAAA,MAEF,KAAAG;AAAA,MAEA,4BAAC,OAAA,EAAI,MAAK,WAAU,WAAU,iBAAgB,OAAAW,GAC5C,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKV;AAAA,YACL,WAAWW,EAAK,YAAY;AAAA,cAC1B,0FACE,CAACf;AAAA,YAAA,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,QAEFC;AAAA,QACD,gBAAAa;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAK,YAAY;AAAA,cAC1B,0FACE,CAACf;AAAA,YAAA,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/molecules/Tabs/TabPanel.js

@@ -1,18 +1,18 @@
 "use client";
 import { jsx as s } from "react/jsx-runtime";
-import { c } from "../../chunks/index.js";
+import { c } from "../../chunks/clsx.js";
 import { useRef as d, useEffect as b } from "react";
 import { useTabsUid as m, useActiveTab as p } from "./hooks/tabControl.js";
 const $ = ({
   value: t,
-  className: o,
+  className: i,
   onSelect: a,
-  children: i
+  children: n
 }) => {
-  const r = m(), n = d(!1), e = p() === t;
+  const r = m(), o = d(!1), e = p() === t;
   return b(() => {
-    if (!n.current) {
-      n.current = !0;
+    if (!o.current) {
+      o.current = !0;
       return;
     }
     e && a?.({ value: t });
@@ -26,14 +26,14 @@ const $ = ({
       "aria-labelledby": `Tab_${t}_${r}`,
       tabIndex: e ? 0 : -1,
       className: c(
-        o,
+        i,
         "relative col-start-1 row-start-1 transition-opacity duration-500",
         {
           "pointer-events-none z-0 h-0 opacity-0": !e,
           "pointer-events-auto z-1 h-auto opacity-100": e
         }
       ),
-      children: i
+      children: n
     }
   );
 };

package/molecules/Tabs/TabPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabPanel.js","sources":["../../../lib/molecules/Tabs/TabPanel.tsx"],"sourcesContent":["'use client';\n\nimport classnames from 'classnames';\nimport { type FunctionComponent, type PropsWithChildren, useEffect, useRef } from 'react';\n\nimport { useActiveTab, useTabsUid } from './hooks/tabControl';\n\ninterface Props {\n  className?: string;\n  /**\n   * Tab panel index<br/>\n   * _Can be **0** or **1** indexed_\n   */\n  value: number;\n  /**\n   * on panel select handler\n   */\n  onSelect?: (context: { value: Props['value'] }) => void;\n}\n\nexport const TabPanel: FunctionComponent<PropsWithChildren<Props>> = ({\n  value,\n  className,\n  onSelect,\n  children,\n}) => {\n  const uid = useTabsUid();\n  const mounted = useRef(false);\n  const tabSelected = useActiveTab();\n  const isActive = tabSelected === value;\n\n  useEffect(() => {\n    if (!mounted.current) {\n      mounted.current = true;\n      return;\n    }\n\n    if (isActive) {\n      onSelect?.({ value });\n    }\n  }, [isActive, value, onSelect]);\n\n  return (\n    <div\n      id={`TabPanel_${value}_${uid}`}\n      data-name={`TabPanel_${value}`}\n      role=\"tabpanel\"\n      aria-hidden={!isActive}\n      aria-labelledby={`Tab_${value}_${uid}`}\n      tabIndex={isActive ? 0 : -1}\n      className={classnames(\n        className,\n        'relative col-start-1 row-start-1 transition-opacity duration-500',\n        {\n          'pointer-events-none z-0 h-0 opacity-0': !isActive,\n          'pointer-events-auto z-1 h-auto opacity-100': isActive,\n        },\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["TabPanel","value","className","onSelect","children","uid","useTabsUid","mounted","useRef","isActive","useActiveTab","useEffect","jsx","classnames"],"mappings":";;;;;AAoBO,MAAMA,IAAwD,CAAC;AAAA,EACpE,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAMC,EAAA,GACNC,IAAUC,EAAO,EAAK,GAEtBC,IADcC,EAAA,MACaT;AAEjC,SAAAU,EAAU,MAAM;AACd,QAAI,CAACJ,EAAQ,SAAS;AACpB,MAAAA,EAAQ,UAAU;AAClB;AAAA,IACF;AAEA,IAAIE,KACFN,IAAW,EAAE,OAAAF,GAAO;AAAA,EAExB,GAAG,CAACQ,GAAUR,GAAOE,CAAQ,CAAC,GAG5B,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,YAAYX,CAAK,IAAII,CAAG;AAAA,MAC5B,aAAW,YAAYJ,CAAK;AAAA,MAC5B,MAAK;AAAA,MACL,eAAa,CAACQ;AAAA,MACd,mBAAiB,OAAOR,CAAK,IAAII,CAAG;AAAA,MACpC,UAAUI,IAAW,IAAI;AAAA,MACzB,WAAWI;AAAA,QACTX;AAAA,QACA;AAAA,QACA;AAAA,UACE,yCAAyC,CAACO;AAAA,UAC1C,8CAA8CA;AAAA,QAAA;AAAA,MAChD;AAAA,MAGD,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"TabPanel.js","sources":["../../../lib/molecules/Tabs/TabPanel.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type FunctionComponent, type PropsWithChildren, useEffect, useRef } from 'react';\n\nimport { useActiveTab, useTabsUid } from './hooks/tabControl';\n\ninterface Props {\n  className?: string;\n  /**\n   * Tab panel index<br/>\n   * _Can be **0** or **1** indexed_\n   */\n  value: number;\n  /**\n   * on panel select handler\n   */\n  onSelect?: (context: { value: Props['value'] }) => void;\n}\n\nexport const TabPanel: FunctionComponent<PropsWithChildren<Props>> = ({\n  value,\n  className,\n  onSelect,\n  children,\n}) => {\n  const uid = useTabsUid();\n  const mounted = useRef(false);\n  const tabSelected = useActiveTab();\n  const isActive = tabSelected === value;\n\n  useEffect(() => {\n    if (!mounted.current) {\n      mounted.current = true;\n      return;\n    }\n\n    if (isActive) {\n      onSelect?.({ value });\n    }\n  }, [isActive, value, onSelect]);\n\n  return (\n    <div\n      id={`TabPanel_${value}_${uid}`}\n      data-name={`TabPanel_${value}`}\n      role=\"tabpanel\"\n      aria-hidden={!isActive}\n      aria-labelledby={`Tab_${value}_${uid}`}\n      tabIndex={isActive ? 0 : -1}\n      className={clsx(\n        className,\n        'relative col-start-1 row-start-1 transition-opacity duration-500',\n        {\n          'pointer-events-none z-0 h-0 opacity-0': !isActive,\n          'pointer-events-auto z-1 h-auto opacity-100': isActive,\n        },\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["TabPanel","value","className","onSelect","children","uid","useTabsUid","mounted","useRef","isActive","useActiveTab","useEffect","jsx","clsx"],"mappings":";;;;;AAoBO,MAAMA,IAAwD,CAAC;AAAA,EACpE,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAMC,EAAA,GACNC,IAAUC,EAAO,EAAK,GAEtBC,IADcC,EAAA,MACaT;AAEjC,SAAAU,EAAU,MAAM;AACd,QAAI,CAACJ,EAAQ,SAAS;AACpB,MAAAA,EAAQ,UAAU;AAClB;AAAA,IACF;AAEA,IAAIE,KACFN,IAAW,EAAE,OAAAF,GAAO;AAAA,EAExB,GAAG,CAACQ,GAAUR,GAAOE,CAAQ,CAAC,GAG5B,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,YAAYX,CAAK,IAAII,CAAG;AAAA,MAC5B,aAAW,YAAYJ,CAAK;AAAA,MAC5B,MAAK;AAAA,MACL,eAAa,CAACQ;AAAA,MACd,mBAAiB,OAAOR,CAAK,IAAII,CAAG;AAAA,MACpC,UAAUI,IAAW,IAAI;AAAA,MACzB,WAAWI;AAAA,QACTX;AAAA,QACA;AAAA,QACA;AAAA,UACE,yCAAyC,CAACO;AAAA,UAC1C,8CAA8CA;AAAA,QAAA;AAAA,MAChD;AAAA,MAGD,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/molecules/Tabs/Tabs.js

@@ -1,17 +1,17 @@
-import { jsx as a } from "react/jsx-runtime";
-import { c as o } from "../../chunks/index.js";
+import { jsx as r } from "react/jsx-runtime";
+import { c as m } from "../../chunks/clsx.js";
 import { TabsProvider as l } from "./context/TabControl.js";
 const i = ({
-  className: s,
-  compacted: r = !1,
-  selected: e,
-  children: m
-}) => /* @__PURE__ */ a(
+  className: a,
+  compacted: s = !1,
+  selected: o,
+  children: e
+}) => /* @__PURE__ */ r(
   "div",
   {
-    className: o("flex flex-col", s, { "sm:gap-y-20": !r }),
+    className: m("flex flex-col", a, { "sm:gap-y-20": !s }),
     "data-name": "Tabs",
-    children: /* @__PURE__ */ a(l, { selected: e, children: m })
+    children: /* @__PURE__ */ r(l, { selected: o, children: e })
   }
 );
 export {

package/molecules/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sources":["../../../lib/molecules/Tabs/Tabs.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport type { ComponentProps, FunctionComponent, PropsWithChildren } from 'react';\n\nimport { TabsProvider } from './context/TabControl';\n\ntype ProviderProps = ComponentProps<typeof TabsProvider>;\n\ninterface Props extends ProviderProps {\n  className?: string;\n  /**\n   * Shrink the spacing between tabs and panels\n   */\n  compacted?: boolean;\n}\n\nexport const Tabs: FunctionComponent<PropsWithChildren<Props>> = ({\n  className,\n  compacted = false,\n  selected,\n  children,\n}) => {\n  return (\n    <div\n      className={classnames('flex flex-col', className, { 'sm:gap-y-20': !compacted })}\n      data-name=\"Tabs\"\n    >\n      <TabsProvider selected={selected}>{children}</TabsProvider>\n    </div>\n  );\n};\n"],"names":["Tabs","className","compacted","selected","children","jsx","classnames","TabsProvider"],"mappings":";;;AAeO,MAAMA,IAAoD,CAAC;AAAA,EAChE,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,UAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAW,iBAAiBL,GAAW,EAAE,eAAe,CAACC,GAAW;AAAA,IAC/E,aAAU;AAAA,IAEV,UAAA,gBAAAG,EAACE,GAAA,EAAa,UAAAJ,GAAqB,UAAAC,EAAA,CAAS;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"Tabs.js","sources":["../../../lib/molecules/Tabs/Tabs.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ComponentProps, FunctionComponent, PropsWithChildren } from 'react';\n\nimport { TabsProvider } from './context/TabControl';\n\ntype ProviderProps = ComponentProps<typeof TabsProvider>;\n\ninterface Props extends ProviderProps {\n  className?: string;\n  /**\n   * Shrink the spacing between tabs and panels\n   */\n  compacted?: boolean;\n}\n\nexport const Tabs: FunctionComponent<PropsWithChildren<Props>> = ({\n  className,\n  compacted = false,\n  selected,\n  children,\n}) => {\n  return (\n    <div\n      className={clsx('flex flex-col', className, { 'sm:gap-y-20': !compacted })}\n      data-name=\"Tabs\"\n    >\n      <TabsProvider selected={selected}>{children}</TabsProvider>\n    </div>\n  );\n};\n"],"names":["Tabs","className","compacted","selected","children","jsx","clsx","TabsProvider"],"mappings":";;;AAeO,MAAMA,IAAoD,CAAC;AAAA,EAChE,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,UAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAK,iBAAiBL,GAAW,EAAE,eAAe,CAACC,GAAW;AAAA,IACzE,aAAU;AAAA,IAEV,UAAA,gBAAAG,EAACE,GAAA,EAAa,UAAAJ,GAAqB,UAAAC,EAAA,CAAS;AAAA,EAAA;AAAA;"}

package/molecules/Tabs/TabsBody.js

@@ -1,7 +1,7 @@
 import { jsx as s } from "react/jsx-runtime";
-import { c as a } from "../../chunks/index.js";
-const m = ({ className: o, children: r }) => /* @__PURE__ */ s("div", { "data-name": "TabsBody", className: a("grid grid-rows-1 overflow-hidden", o), children: r });
+import { c as a } from "../../chunks/clsx.js";
+const i = ({ className: o, children: r }) => /* @__PURE__ */ s("div", { "data-name": "TabsBody", className: a("grid grid-rows-1 overflow-hidden", o), children: r });
 export {
-  m as TabsBody
+  i as TabsBody
 };
 //# sourceMappingURL=TabsBody.js.map

package/molecules/Tabs/TabsBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabsBody.js","sources":["../../../lib/molecules/Tabs/TabsBody.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport type { FunctionComponent, PropsWithChildren } from 'react';\n\ninterface Props {\n  className?: string;\n}\n\nexport const TabsBody: FunctionComponent<PropsWithChildren<Props>> = ({ className, children }) => {\n  return (\n    <div data-name=\"TabsBody\" className={classnames('grid grid-rows-1 overflow-hidden', className)}>\n      {children}\n    </div>\n  );\n};\n"],"names":["TabsBody","className","children","jsx","classnames"],"mappings":";;AAOO,MAAMA,IAAwD,CAAC,EAAE,WAAAC,GAAW,UAAAC,QAE/E,gBAAAC,EAAC,SAAI,aAAU,YAAW,WAAWC,EAAW,oCAAoCH,CAAS,GAC1F,UAAAC,EAAA,CACH;"}
+{"version":3,"file":"TabsBody.js","sources":["../../../lib/molecules/Tabs/TabsBody.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { FunctionComponent, PropsWithChildren } from 'react';\n\ninterface Props {\n  className?: string;\n}\n\nexport const TabsBody: FunctionComponent<PropsWithChildren<Props>> = ({ className, children }) => {\n  return (\n    <div data-name=\"TabsBody\" className={clsx('grid grid-rows-1 overflow-hidden', className)}>\n      {children}\n    </div>\n  );\n};\n"],"names":["TabsBody","className","children","jsx","clsx"],"mappings":";;AAOO,MAAMA,IAAwD,CAAC,EAAE,WAAAC,GAAW,UAAAC,QAE/E,gBAAAC,EAAC,SAAI,aAAU,YAAW,WAAWC,EAAK,oCAAoCH,CAAS,GACpF,UAAAC,EAAA,CACH;"}

package/molecules/Tag.js

@@ -1,6 +1,6 @@
 import { jsxs as y, jsx as s } from "react/jsx-runtime";
 import { Icon as N } from "@clubmed/trident-icons";
-import { c as n } from "../chunks/index.js";
+import { c as n } from "../chunks/clsx.js";
 import { getBorderColor as j, getBgColor as B, getTextColor as I } from "../helpers/colors/colors.js";
 const q = ({
   className: i,
@@ -13,16 +13,16 @@ const q = ({
   iconClassName: d,
   labelClassName: b,
   iconWidth: h,
-  ...f
+  ...x
 }) => {
   if (!e && !t)
     return null;
-  const x = j(m), g = B(l), w = I(c), a = !!t, o = r === "both" && !a ? "label" : r, p = o === "both" || o === "swap" || o === "unfold" || o === "none", u = a && (o === "icon" || p), C = o === "label" || o === "pill" || p;
+  const f = j(m), g = B(l), w = I(c), a = !!t, o = r === "both" && !a ? "label" : r, p = o === "both" || o === "swap" || o === "unfold" || o === "none", u = a && (o === "icon" || p), C = o === "label" || o === "pill" || p;
   return /* @__PURE__ */ y(
     "span",
     {
       role: "note",
-      ...f,
+      ...x,
       "data-name": "Tag",
       className: n(
         "box-border inline-flex items-center justify-center gap-x-4 whitespace-nowrap rounded-pill border align-middle font-sans font-semibold",
@@ -38,7 +38,7 @@ const q = ({
           "sm:px-16": o === "swap",
           "sm:pe-16 sm:ps-12": o === "unfold"
         },
-        x,
+        f,
         g,
         w,
         i

package/molecules/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../lib/molecules/Tag.tsx"],"sourcesContent":["import { Icon, type IconicNames } from '@clubmed/trident-icons';\nimport classNames from 'classnames';\nimport type { ComponentPropsWithoutRef, FunctionComponent } from 'react';\n\nimport {\n  type BgColor,\n  type BorderColor,\n  getBgColor,\n  getBorderColor,\n  getTextColor,\n  type TextColor,\n} from '@/helpers/colors/colors.js';\nimport type { LiteralUnion } from '@/types/LiteralUnion';\nimport type { IconProps } from '@/atoms/Icons/contexts/IconsContext';\n\nexport interface TagProps extends Omit<ComponentPropsWithoutRef<'span'>, 'color'> {\n  /**\n   * Additional class names\n   */\n  className?: string;\n  /**\n   * Background color\n   */\n  backgroundColor?: LiteralUnion<BgColor>;\n  /**\n   * Text color\n   */\n  color?: LiteralUnion<TextColor>;\n  /**\n   * Border color\n   */\n  border?: LiteralUnion<BorderColor>;\n  /**\n   * Optional icon name\n   */\n  icon?: IconicNames;\n  /**\n   * Tag label\n   */\n  label?: string;\n  /**\n   * theme mode\n   */\n  theme?: 'icon' | 'label' | 'both' | 'swap' | 'unfold' | 'monogram' | 'pill' | 'none';\n  /**\n   * Icon class name\n   */\n  iconClassName?: string;\n  iconWidth?: IconProps['width'];\n  /**\n   * Label class name\n   */\n  labelClassName?: string;\n}\n\nexport const Tag: FunctionComponent<TagProps> = ({\n  className,\n  backgroundColor = 'saffron',\n  border = backgroundColor,\n  color = 'black',\n  icon,\n  label = '',\n  theme = 'both',\n  iconClassName,\n  labelClassName,\n  iconWidth,\n  ...attrs\n}) => {\n  if (!label && !icon) {\n    return null;\n  }\n\n  const borderColor = getBorderColor(border);\n  const bgColor = getBgColor(backgroundColor);\n  const textColor = getTextColor(color);\n\n  const hasIcon = !!icon;\n  const mode = theme === 'both' && !hasIcon ? 'label' : theme;\n\n  const withBoth = mode === 'both' || mode === 'swap' || mode === 'unfold' || mode === 'none';\n  const withIcon = hasIcon && (mode === 'icon' || withBoth);\n  const withLabel = mode === 'label' || mode === 'pill' || withBoth;\n\n  return (\n    <span\n      role=\"note\"\n      {...attrs}\n      data-name=\"Tag\"\n      className={classNames(\n        'box-border inline-flex items-center justify-center gap-x-4 whitespace-nowrap rounded-pill border align-middle font-sans font-semibold',\n        {\n          'text-b4': mode !== 'pill',\n          'text-b5': mode === 'pill',\n        },\n        {\n          'p-4': mode !== 'label' && mode !== 'both',\n          'px-16 py-6': mode === 'label',\n          'py-4 pe-16 ps-12': mode === 'both',\n          'px-8 py-4': mode === 'pill',\n          'sm:px-16': mode === 'swap',\n          'sm:pe-16 sm:ps-12': mode === 'unfold',\n        },\n        borderColor,\n        bgColor,\n        textColor,\n        className,\n      )}\n      title={label}\n    >\n      {mode === 'monogram' && <span className=\"size-24 text-center leading-[1.5rem]\">{label}</span>}\n      {withIcon && (\n        <Icon\n          width={iconWidth ?? '1.5rem'}\n          name={icon}\n          className={classNames({ 'sm:hidden': mode === 'swap' }, iconClassName)}\n        />\n      )}\n      {withLabel && (\n        <span\n          className={classNames(\n            {\n              'hidden sm:block': mode === 'swap' || mode === 'unfold',\n            },\n            labelClassName,\n          )}\n        >\n          {label}\n        </span>\n      )}\n    </span>\n  );\n};\n"],"names":["Tag","className","backgroundColor","border","color","icon","label","theme","iconClassName","labelClassName","iconWidth","attrs","borderColor","getBorderColor","bgColor","getBgColor","textColor","getTextColor","hasIcon","mode","withBoth","withIcon","withLabel","jsxs","classNames","jsx","Icon"],"mappings":";;;;AAuDO,MAAMA,IAAmC,CAAC;AAAA,EAC/C,WAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,QAAAC,IAASD;AAAA,EACT,OAAAE,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,OAAAC,IAAQ;AAAA,EACR,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,MAAI,CAACL,KAAS,CAACD;AACb,WAAO;AAGT,QAAMO,IAAcC,EAAeV,CAAM,GACnCW,IAAUC,EAAWb,CAAe,GACpCc,IAAYC,EAAab,CAAK,GAE9Bc,IAAU,CAAC,CAACb,GACZc,IAAOZ,MAAU,UAAU,CAACW,IAAU,UAAUX,GAEhDa,IAAWD,MAAS,UAAUA,MAAS,UAAUA,MAAS,YAAYA,MAAS,QAC/EE,IAAWH,MAAYC,MAAS,UAAUC,IAC1CE,IAAYH,MAAS,WAAWA,MAAS,UAAUC;AAEzD,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAGZ;AAAA,MACJ,aAAU;AAAA,MACV,WAAWa;AAAAA,QACT;AAAA,QACA;AAAA,UACE,WAAWL,MAAS;AAAA,UACpB,WAAWA,MAAS;AAAA,QAAA;AAAA,QAEtB;AAAA,UACE,OAAOA,MAAS,WAAWA,MAAS;AAAA,UACpC,cAAcA,MAAS;AAAA,UACvB,oBAAoBA,MAAS;AAAA,UAC7B,aAAaA,MAAS;AAAA,UACtB,YAAYA,MAAS;AAAA,UACrB,qBAAqBA,MAAS;AAAA,QAAA;AAAA,QAEhCP;AAAA,QACAE;AAAA,QACAE;AAAA,QACAf;AAAA,MAAA;AAAA,MAEF,OAAOK;AAAA,MAEN,UAAA;AAAA,QAAAa,MAAS,cAAc,gBAAAM,EAAC,QAAA,EAAK,WAAU,wCAAwC,UAAAnB,GAAM;AAAA,QACrFe,KACC,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAOhB,KAAa;AAAA,YACpB,MAAML;AAAA,YACN,WAAWmB,EAAW,EAAE,aAAaL,MAAS,OAAA,GAAUX,CAAa;AAAA,UAAA;AAAA,QAAA;AAAA,QAGxEc,KACC,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD;AAAAA,cACT;AAAA,gBACE,mBAAmBL,MAAS,UAAUA,MAAS;AAAA,cAAA;AAAA,cAEjDV;AAAA,YAAA;AAAA,YAGD,UAAAH;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"Tag.js","sources":["../../lib/molecules/Tag.tsx"],"sourcesContent":["import { Icon, type IconicNames } from '@clubmed/trident-icons';\nimport clsx from 'clsx';\nimport type { ComponentPropsWithoutRef, FunctionComponent } from 'react';\n\nimport {\n  type BgColor,\n  type BorderColor,\n  getBgColor,\n  getBorderColor,\n  getTextColor,\n  type TextColor,\n} from '@/helpers/colors/colors.js';\nimport type { LiteralUnion } from '@/types/LiteralUnion';\nimport type { IconProps } from '@/atoms/Icons/contexts/IconsContext';\n\nexport interface TagProps extends Omit<ComponentPropsWithoutRef<'span'>, 'color'> {\n  /**\n   * Additional class names\n   */\n  className?: string;\n  /**\n   * Background color\n   */\n  backgroundColor?: LiteralUnion<BgColor>;\n  /**\n   * Text color\n   */\n  color?: LiteralUnion<TextColor>;\n  /**\n   * Border color\n   */\n  border?: LiteralUnion<BorderColor>;\n  /**\n   * Optional icon name\n   */\n  icon?: IconicNames;\n  /**\n   * Tag label\n   */\n  label?: string;\n  /**\n   * theme mode\n   */\n  theme?: 'icon' | 'label' | 'both' | 'swap' | 'unfold' | 'monogram' | 'pill' | 'none';\n  /**\n   * Icon class name\n   */\n  iconClassName?: string;\n  iconWidth?: IconProps['width'];\n  /**\n   * Label class name\n   */\n  labelClassName?: string;\n}\n\nexport const Tag: FunctionComponent<TagProps> = ({\n  className,\n  backgroundColor = 'saffron',\n  border = backgroundColor,\n  color = 'black',\n  icon,\n  label = '',\n  theme = 'both',\n  iconClassName,\n  labelClassName,\n  iconWidth,\n  ...attrs\n}) => {\n  if (!label && !icon) {\n    return null;\n  }\n\n  const borderColor = getBorderColor(border);\n  const bgColor = getBgColor(backgroundColor);\n  const textColor = getTextColor(color);\n\n  const hasIcon = !!icon;\n  const mode = theme === 'both' && !hasIcon ? 'label' : theme;\n\n  const withBoth = mode === 'both' || mode === 'swap' || mode === 'unfold' || mode === 'none';\n  const withIcon = hasIcon && (mode === 'icon' || withBoth);\n  const withLabel = mode === 'label' || mode === 'pill' || withBoth;\n\n  return (\n    <span\n      role=\"note\"\n      {...attrs}\n      data-name=\"Tag\"\n      className={clsx(\n        'box-border inline-flex items-center justify-center gap-x-4 whitespace-nowrap rounded-pill border align-middle font-sans font-semibold',\n        {\n          'text-b4': mode !== 'pill',\n          'text-b5': mode === 'pill',\n        },\n        {\n          'p-4': mode !== 'label' && mode !== 'both',\n          'px-16 py-6': mode === 'label',\n          'py-4 pe-16 ps-12': mode === 'both',\n          'px-8 py-4': mode === 'pill',\n          'sm:px-16': mode === 'swap',\n          'sm:pe-16 sm:ps-12': mode === 'unfold',\n        },\n        borderColor,\n        bgColor,\n        textColor,\n        className,\n      )}\n      title={label}\n    >\n      {mode === 'monogram' && <span className=\"size-24 text-center leading-[1.5rem]\">{label}</span>}\n      {withIcon && (\n        <Icon\n          width={iconWidth ?? '1.5rem'}\n          name={icon}\n          className={clsx({ 'sm:hidden': mode === 'swap' }, iconClassName)}\n        />\n      )}\n      {withLabel && (\n        <span\n          className={clsx(\n            {\n              'hidden sm:block': mode === 'swap' || mode === 'unfold',\n            },\n            labelClassName,\n          )}\n        >\n          {label}\n        </span>\n      )}\n    </span>\n  );\n};\n"],"names":["Tag","className","backgroundColor","border","color","icon","label","theme","iconClassName","labelClassName","iconWidth","attrs","borderColor","getBorderColor","bgColor","getBgColor","textColor","getTextColor","hasIcon","mode","withBoth","withIcon","withLabel","jsxs","clsx","jsx","Icon"],"mappings":";;;;AAuDO,MAAMA,IAAmC,CAAC;AAAA,EAC/C,WAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,QAAAC,IAASD;AAAA,EACT,OAAAE,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,OAAAC,IAAQ;AAAA,EACR,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,MAAI,CAACL,KAAS,CAACD;AACb,WAAO;AAGT,QAAMO,IAAcC,EAAeV,CAAM,GACnCW,IAAUC,EAAWb,CAAe,GACpCc,IAAYC,EAAab,CAAK,GAE9Bc,IAAU,CAAC,CAACb,GACZc,IAAOZ,MAAU,UAAU,CAACW,IAAU,UAAUX,GAEhDa,IAAWD,MAAS,UAAUA,MAAS,UAAUA,MAAS,YAAYA,MAAS,QAC/EE,IAAWH,MAAYC,MAAS,UAAUC,IAC1CE,IAAYH,MAAS,WAAWA,MAAS,UAAUC;AAEzD,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAGZ;AAAA,MACJ,aAAU;AAAA,MACV,WAAWa;AAAA,QACT;AAAA,QACA;AAAA,UACE,WAAWL,MAAS;AAAA,UACpB,WAAWA,MAAS;AAAA,QAAA;AAAA,QAEtB;AAAA,UACE,OAAOA,MAAS,WAAWA,MAAS;AAAA,UACpC,cAAcA,MAAS;AAAA,UACvB,oBAAoBA,MAAS;AAAA,UAC7B,aAAaA,MAAS;AAAA,UACtB,YAAYA,MAAS;AAAA,UACrB,qBAAqBA,MAAS;AAAA,QAAA;AAAA,QAEhCP;AAAA,QACAE;AAAA,QACAE;AAAA,QACAf;AAAA,MAAA;AAAA,MAEF,OAAOK;AAAA,MAEN,UAAA;AAAA,QAAAa,MAAS,cAAc,gBAAAM,EAAC,QAAA,EAAK,WAAU,wCAAwC,UAAAnB,GAAM;AAAA,QACrFe,KACC,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAOhB,KAAa;AAAA,YACpB,MAAML;AAAA,YACN,WAAWmB,EAAK,EAAE,aAAaL,MAAS,OAAA,GAAUX,CAAa;AAAA,UAAA;AAAA,QAAA;AAAA,QAGlEc,KACC,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD;AAAA,cACT;AAAA,gBACE,mBAAmBL,MAAS,UAAUA,MAAS;AAAA,cAAA;AAAA,cAEjDV;AAAA,YAAA;AAAA,YAGD,UAAAH;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clubmed/trident-ui",
-  "version": "1.5.0",
+  "version": "1.6.0-beta.1",
   "type": "module",
   "description": "Shared ClubMed React UI components",
   "keywords": [
@@ -31,16 +31,16 @@
       "import": "./atoms/Icons/index.js",
       "default": "./atoms/Icons/index.js"
     },
-    "./atoms/Icons/svg-use": {
-      "types": "./atoms/Icons/svg-use/index.d.ts",
-      "import": "./atoms/Icons/svg-use/index.js",
-      "default": "./atoms/Icons/svg-use/index.js"
-    },
     "./atoms/Icons/svg": {
       "types": "./atoms/Icons/svg/index.d.ts",
       "import": "./atoms/Icons/svg/index.js",
       "default": "./atoms/Icons/svg/index.js"
     },
+    "./atoms/Icons/svg-use": {
+      "types": "./atoms/Icons/svg-use/index.d.ts",
+      "import": "./atoms/Icons/svg-use/index.js",
+      "default": "./atoms/Icons/svg-use/index.js"
+    },
     "./molecules/Tabs": {
       "types": "./molecules/Tabs/index.d.ts",
       "import": "./molecules/Tabs/index.js",
@@ -116,15 +116,17 @@
     "chromatic": "chromatic"
   },
   "dependencies": {
-    "@juggle/resize-observer": "^3.4.0",
-    "@use-gesture/react": "^10.2.26",
-    "classnames": "^2.3.2",
-    "date-fns": "^2.30.0",
-    "react-day-picker": "^8.10.0",
-    "react-hot-toast": "^2.4.1",
-    "react-use-measure": "^2.1.1",
-    "use-boop": "^1.1.1",
-    "use-resize-observer": "^9.1.0"
+    "@juggle/resize-observer": ">=3.4.0",
+    "@use-gesture/react": ">=10.2.26",
+    "clsx": ">=2.1.1",
+    "date-fns": ">=2.30.0",
+    "react-day-picker": ">=8.10.0",
+    "react-hot-toast": ">=2.4.1",
+    "react-transition-state": ">=2.3.2",
+    "react-use-measure": ">=2.1.1",
+    "use-boop": ">=1.1.1",
+    "use-resize-observer": ">=9.1.0",
+    "tailwind-merge": ">=3.4.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.1.1",
@@ -180,6 +182,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-syntax-highlighter": "^15.5.0",
+    "remark-gfm": "^4.0.1",
     "rollup-preserve-directives": "^1.1.1",
     "storybook": "9.1.7",
     "svgtofont": "^4.2.0",

package/chunks/index.js

@@ -1,46 +0,0 @@
-import { g as c } from "./_commonjsHelpers.js";
-var e = { exports: {} };
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/
-var a;
-function p() {
-  return a || (a = 1, function(o) {
-    (function() {
-      var f = {}.hasOwnProperty;
-      function s() {
-        for (var t = "", r = 0; r < arguments.length; r++) {
-          var n = arguments[r];
-          n && (t = i(t, u(n)));
-        }
-        return t;
-      }
-      function u(t) {
-        if (typeof t == "string" || typeof t == "number")
-          return t;
-        if (typeof t != "object")
-          return "";
-        if (Array.isArray(t))
-          return s.apply(null, t);
-        if (t.toString !== Object.prototype.toString && !t.toString.toString().includes("[native code]"))
-          return t.toString();
-        var r = "";
-        for (var n in t)
-          f.call(t, n) && t[n] && (r = i(r, n));
-        return r;
-      }
-      function i(t, r) {
-        return r ? t ? t + " " + r : t + r : t;
-      }
-      o.exports ? (s.default = s, o.exports = s) : window.classNames = s;
-    })();
-  }(e)), e.exports;
-}
-var l = p();
-const x = /* @__PURE__ */ c(l);
-export {
-  x as c
-};
-//# sourceMappingURL=index.js.map

package/chunks/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../node_modules/classnames/index.js"],"sourcesContent":["/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue(arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(null, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n"],"names":["hasOwn","classNames","classes","i","arg","appendClass","parseValue","key","value","newClass","module"],"mappings":";;;;;;;;;;AAOA,KAAC,WAAY;AAGZ,UAAIA,IAAS,CAAA,EAAG;AAEhB,eAASC,IAAc;AAGtB,iBAFIC,IAAU,IAELC,IAAI,GAAGA,IAAI,UAAU,QAAQA,KAAK;AAC1C,cAAIC,IAAM,UAAUD,CAAC;AACrB,UAAIC,MACHF,IAAUG,EAAYH,GAASI,EAAWF,CAAG,CAAC;AAAA,QAElD;AAEE,eAAOF;AAAA,MACT;AAEC,eAASI,EAAYF,GAAK;AACzB,YAAI,OAAOA,KAAQ,YAAY,OAAOA,KAAQ;AAC7C,iBAAOA;AAGR,YAAI,OAAOA,KAAQ;AAClB,iBAAO;AAGR,YAAI,MAAM,QAAQA,CAAG;AACpB,iBAAOH,EAAW,MAAM,MAAMG,CAAG;AAGlC,YAAIA,EAAI,aAAa,OAAO,UAAU,YAAY,CAACA,EAAI,SAAS,SAAQ,EAAG,SAAS,eAAe;AAClG,iBAAOA,EAAI,SAAQ;AAGpB,YAAIF,IAAU;AAEd,iBAASK,KAAOH;AACf,UAAIJ,EAAO,KAAKI,GAAKG,CAAG,KAAKH,EAAIG,CAAG,MACnCL,IAAUG,EAAYH,GAASK,CAAG;AAIpC,eAAOL;AAAA,MACT;AAEC,eAASG,EAAaG,GAAOC,GAAU;AACtC,eAAKA,IAIDD,IACIA,IAAQ,MAAMC,IAGfD,IAAQC,IAPPD;AAAA,MAQV;AAEC,MAAqCE,EAAO,WAC3CT,EAAW,UAAUA,GACrBS,YAAiBT,KAOjB,OAAO,aAAaA;AAAA,IAEtB;;;;;","x_google_ignoreList":[0]}