@ahrowe/ui 0.11.0 → 0.13.0

package/dist/esm/common/accordion/accordion.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.module.mjs","names":[],"sources":["../../../../package/common/accordion/accordion.module.pcss"],"sourcesContent":["\n.accordion {\n  transition: margin 0.2s;\n  margin: -1px;\n  color: var(--text-color);\n\n  &-title {\n    width: 100%;\n  }\n\n  &-active {\n    margin: 10px 0;\n  }\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px;\n    cursor: pointer;\n    background: var(--background);\n    border-radius: var(--default-border-radius);\n    border: 1px solid var(--border-color);\n    font-size: 16px;\n    font-weight: 400;\n    transition: all 0.2s;\n\n    &-active {\n      border: 1px solid var(--primary-color);\n      background: var(--background-accent);\n      border-radius: var(--default-border-radius) var(--default-border-radius) 0px 0px;\n    }\n  }\n\n  &-body {\n    overflow: hidden;\n    transition: all 0.2s ease;\n    position: relative;\n    border-radius: 0px 0px var(--default-border-radius) var(--default-border-radius);\n    border: 1px solid var(--border-color);\n    border-top: none;\n    border-bottom: none;\n\n    &-inner {\n      padding: 16px;\n    }\n\n    &-active {\n      border: 1px solid var(--primary-color);\n      border-top: none;\n    }\n  }\n\n  &-icon {\n    transition: transform 0.2s;\n    transform: rotate(0deg);\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    color: var(--border-color);\n    &-active {\n      transform: rotate(180deg);\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"accordion.module.mjs","names":[],"sources":["../../../../package/common/accordion/accordion.module.pcss"],"sourcesContent":["\n.accordion {\n  transition: margin 0.2s;\n  margin: -1px;\n  color: var(--text-color);\n\n  &-title {\n    width: 100%;\n  }\n\n  &-active {\n    margin: 10px 0;\n  }\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    background: var(--background);\n    border-radius: var(--default-border-radius);\n    border: 1px solid var(--border-color);\n    font-size: 16px;\n    font-weight: 400;\n    transition: all 0.2s;\n\n    &-active {\n      border: 1px solid var(--primary-color);\n      background: var(--background-accent);\n      border-radius: var(--default-border-radius) var(--default-border-radius) 0px 0px;\n    }\n  }\n\n  &-body {\n    overflow: hidden;\n    transition: all 0.2s ease;\n    position: relative;\n    border-radius: 0px 0px var(--default-border-radius) var(--default-border-radius);\n    border: 1px solid var(--border-color);\n    border-top: none;\n    border-bottom: none;\n\n    &-inner {\n      padding: 16px;\n    }\n\n    &-active {\n      border: 1px solid var(--primary-color);\n      border-top: none;\n    }\n  }\n\n  &-icon {\n    transition: transform 0.2s;\n    transform: rotate(0deg);\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    color: var(--border-color);\n    &-active {\n      transform: rotate(180deg);\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/accordion/accordion.plain.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.plain.module.mjs","names":[],"sources":["../../../../package/common/accordion/accordion.plain.module.pcss"],"sourcesContent":["\n.accordion {\n  transition: margin 0.2s;\n  margin: -1px;\n\n  &-title {\n    width: 100%;\n  }\n\n  &-active {\n    margin: 10px 0;\n  }\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    cursor: pointer;\n    border-radius: var(--default-border-radius);\n    font-size: 16px;\n    font-weight: 400;\n    transition: all 0.2s;\n\n    &-active {\n      border-radius: var(--default-border-radius) var(--default-border-radius) 0px 0px;\n    }\n  }\n\n  &-body {\n    overflow: hidden;\n    transition: all 0.2s ease;\n    position: relative;\n    border-radius: 0px 0px var(--default-border-radius) var(--default-border-radius);\n\n    &-inner {\n      padding: 0px;\n    }\n  }\n\n  &-icon {\n    transition: transform 0.2s;\n    transform: rotate(0deg);\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    color: var(--primary-color);\n    &-active {\n      transform: rotate(180deg);\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"accordion.plain.module.mjs","names":[],"sources":["../../../../package/common/accordion/accordion.plain.module.pcss"],"sourcesContent":["\n.accordion {\n  transition: margin 0.2s;\n  margin: -1px;\n\n  &-title {\n    width: 100%;\n  }\n\n  &-active {\n    margin: 10px 0;\n  }\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    border-radius: var(--default-border-radius);\n    font-size: 16px;\n    font-weight: 400;\n    transition: all 0.2s;\n\n    &-active {\n      border-radius: var(--default-border-radius) var(--default-border-radius) 0px 0px;\n    }\n  }\n\n  &-body {\n    overflow: hidden;\n    transition: all 0.2s ease;\n    position: relative;\n    border-radius: 0px 0px var(--default-border-radius) var(--default-border-radius);\n\n    &-inner {\n      padding: 0px;\n    }\n  }\n\n  &-icon {\n    transition: transform 0.2s;\n    transform: rotate(0deg);\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    color: var(--primary-color);\n    &-active {\n      transform: rotate(180deg);\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/accordion/accordion.primary.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.primary.module.mjs","names":[],"sources":["../../../../package/common/accordion/accordion.primary.module.pcss"],"sourcesContent":["\n.accordion {\n  transition: margin 0.2s;\n  margin: -1px;\n\n  &-title {\n    width: 100%;\n  }\n\n  &-active {\n    margin: 10px 0;\n    border: 2px solid var(--primary-color);\n    border-radius: var(--default-border-radius);\n  }\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px;\n    cursor: pointer;\n    background: var(--background);\n    border-radius: var(--default-border-radius);\n    font-size: 16px;\n    font-weight: 400;\n    transition: all 0.2s;\n\n    &-active {\n      background: var(--background-accent);\n      border-radius: var(--default-border-radius) var(--default-border-radius) 0px 0px;\n    }\n  }\n\n  &-body {\n    overflow: hidden;\n    transition: all 0.2s ease;\n    position: relative;\n    border-radius: 0px 0px var(--default-border-radius) var(--default-border-radius);\n    border-top: none;\n    border-bottom: none;\n\n    &-inner {\n      padding: 16px;\n    }\n\n    &-active {\n      border-top: none;\n    }\n  }\n\n  &-icon {\n    transition: transform 0.2s;\n    transform: rotate(0deg);\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    color: var(--primary-color);\n    &-active {\n      transform: rotate(180deg);\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"accordion.primary.module.mjs","names":[],"sources":["../../../../package/common/accordion/accordion.primary.module.pcss"],"sourcesContent":["\n.accordion {\n  transition: margin 0.2s;\n  margin: -1px;\n\n  &-title {\n    width: 100%;\n  }\n\n  &-active {\n    margin: 10px 0;\n    border: 2px solid var(--primary-color);\n    border-radius: var(--default-border-radius);\n  }\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    background: var(--background);\n    border-radius: var(--default-border-radius);\n    font-size: 16px;\n    font-weight: 400;\n    transition: all 0.2s;\n\n    &-active {\n      background: var(--background-accent);\n      border-radius: var(--default-border-radius) var(--default-border-radius) 0px 0px;\n    }\n  }\n\n  &-body {\n    overflow: hidden;\n    transition: all 0.2s ease;\n    position: relative;\n    border-radius: 0px 0px var(--default-border-radius) var(--default-border-radius);\n    border-top: none;\n    border-bottom: none;\n\n    &-inner {\n      padding: 16px;\n    }\n\n    &-active {\n      border-top: none;\n    }\n  }\n\n  &-icon {\n    transition: transform 0.2s;\n    transform: rotate(0deg);\n    flex-shrink: 0;\n    width: 16px;\n    height: 16px;\n    color: var(--primary-color);\n    &-active {\n      transform: rotate(180deg);\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/actionIcon/actionIcon.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"actionIcon.module.mjs","names":[],"sources":["../../../../package/common/actionIcon/actionIcon.module.pcss"],"sourcesContent":[".actionIcon {\n  cursor: pointer;\n  padding: 4px;\n  &:hover {\n    filter: brightness(0.8);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"actionIcon.module.mjs","names":[],"sources":["../../../../package/common/actionIcon/actionIcon.module.pcss"],"sourcesContent":[".actionIcon {\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  padding: 4px;\n  &:hover {\n    filter: brightness(0.8);\n  }\n}\n"],"mappings":""}

package/dist/esm/common/alert/alert.mjs

@@ -0,0 +1,2 @@
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../actionIcon/actionIcon.mjs";import{AlertStyleType as n}from"./alert.types.mjs";import r from"./alert.module.mjs";import i from"classnames";import{FontAwesomeIcon as a}from"@fortawesome/react-fontawesome";import{faBell as o,faCircleCheck as s,faCircleInfo as c,faCircleXmark as l,faTriangleExclamation as u,faXmark as d}from"@fortawesome/free-solid-svg-icons";import{jsx as f,jsxs as p}from"react/jsx-runtime";var m={[n.Default]:o,[n.Info]:c,[n.Success]:s,[n.Warn]:u,[n.Error]:l},h={[n.Default]:r.alertStyleDefault,[n.Info]:r.alertStyleInfo,[n.Success]:r.alertStyleSuccess,[n.Warn]:r.alertStyleWarn,[n.Error]:r.alertStyleError};function g(o){let{title:s,children:c=null,styleType:l=n.Default,icon:u,hideIcon:g=!1,onClose:_,className:v,style:y,classNames:b,styles:x,...S}=e(`Alert`,o);return p(`div`,{...S,role:`alert`,className:i(r.alert,h[l],b?.root,v),style:{...y,...x?.root},children:[!g&&f(a,{icon:u??m[l],className:i(r.alertIcon,b?.icon),style:x?.icon}),p(`div`,{className:i(r.alertContent,b?.content),style:x?.content,children:[s&&f(`div`,{className:i(r.alertTitle,b?.title),style:x?.title,children:s}),c&&f(`div`,{className:i(r.alertDescription,b?.description),style:x?.description,children:c})]}),_&&f(t,{icon:d,onClick:_,className:i(r.alertCloseButton,b?.closeButton),style:x?.closeButton,"aria-label":`Dismiss`})]})}export{g as default};
+//# sourceMappingURL=alert.mjs.map

package/dist/esm/common/alert/alert.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.mjs","names":[],"sources":["../../../../package/common/alert/alert.tsx"],"sourcesContent":["import type { CSSProperties, ReactElement } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  faCircleInfo,\n  faCircleCheck,\n  faCircleXmark,\n  faTriangleExclamation,\n  faBell,\n  faXmark,\n} from '@fortawesome/free-solid-svg-icons';\n\nimport { AlertStyleType } from './alert.types';\nimport type { AlertProps } from './alert.types';\nimport styles from './alert.module.pcss';\nimport ActionIcon from '../actionIcon';\nimport { useComponentDefaults } from '../configProvider';\n\nconst ICON_BY_STYLE: Record<AlertStyleType, typeof faBell> = {\n  [AlertStyleType.Default]: faBell,\n  [AlertStyleType.Info]: faCircleInfo,\n  [AlertStyleType.Success]: faCircleCheck,\n  [AlertStyleType.Warn]: faTriangleExclamation,\n  [AlertStyleType.Error]: faCircleXmark,\n};\n\nconst CLASS_BY_STYLE: Record<AlertStyleType, string> = {\n  [AlertStyleType.Default]: styles.alertStyleDefault,\n  [AlertStyleType.Info]: styles.alertStyleInfo,\n  [AlertStyleType.Success]: styles.alertStyleSuccess,\n  [AlertStyleType.Warn]: styles.alertStyleWarn,\n  [AlertStyleType.Error]: styles.alertStyleError,\n};\n\nfunction Alert(props: AlertProps): ReactElement {\n  const {\n  title,\n  children = null,\n  styleType = AlertStyleType.Default,\n  icon,\n  hideIcon = false,\n  onClose,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n  } = useComponentDefaults('Alert', props);\n\n  return (\n    <div\n      {...rest}\n      role=\"alert\"\n      className={cx(styles.alert, CLASS_BY_STYLE[styleType], classNames?.root, className)}\n      style={{ ...style, ...slotStyles?.root }}\n    >\n      {!hideIcon && (\n        <FontAwesomeIcon\n          icon={icon ?? ICON_BY_STYLE[styleType]}\n          className={cx(styles.alertIcon, classNames?.icon)}\n          style={slotStyles?.icon as CSSProperties & Record<`--fa-font-${string}`, string>}\n        />\n      )}\n\n      <div className={cx(styles.alertContent, classNames?.content)} style={slotStyles?.content}>\n        {title && (\n          <div className={cx(styles.alertTitle, classNames?.title)} style={slotStyles?.title}>\n            {title}\n          </div>\n        )}\n        {children && (\n          <div className={cx(styles.alertDescription, classNames?.description)} style={slotStyles?.description}>\n            {children}\n          </div>\n        )}\n      </div>\n\n      {onClose && (\n        <ActionIcon\n          icon={faXmark}\n          onClick={onClose}\n          className={cx(styles.alertCloseButton, classNames?.closeButton)}\n          style={slotStyles?.closeButton}\n          aria-label=\"Dismiss\"\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Alert;\n"],"mappings":"2fAkBA,IAAM,EAAuD,EAC1D,EAAe,SAAU,GACzB,EAAe,MAAO,GACtB,EAAe,SAAU,GACzB,EAAe,MAAO,GACtB,EAAe,OAAQ,CAC1B,EAEM,EAAiD,EACpD,EAAe,SAAU,EAAO,mBAChC,EAAe,MAAO,EAAO,gBAC7B,EAAe,SAAU,EAAO,mBAChC,EAAe,MAAO,EAAO,gBAC7B,EAAe,OAAQ,EAAO,eACjC,EAEA,SAAS,EAAM,EAAiC,CAC9C,GAAM,CACN,QACA,WAAW,KACX,YAAY,EAAe,QAC3B,OACA,WAAW,GACX,UACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACC,EAAqB,QAAS,CAAK,EAEvC,OACE,EAAC,MAAD,CACE,GAAI,EACJ,KAAK,QACL,UAAW,EAAG,EAAO,MAAO,EAAe,GAAY,GAAY,KAAM,CAAS,EAClF,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,WAJzC,CAMG,CAAC,GACA,EAAC,EAAD,CACE,KAAM,GAAQ,EAAc,GAC5B,UAAW,EAAG,EAAO,UAAW,GAAY,IAAI,EAChD,MAAO,GAAY,IACpB,CAAA,EAGH,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,aAAc,GAAY,OAAO,EAAG,MAAO,GAAY,iBAAjF,CACG,GACC,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,WAAY,GAAY,KAAK,EAAG,MAAO,GAAY,eAC1E,CACE,CAAA,EAEN,GACC,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAAG,MAAO,GAAY,YACtF,UACE,CAAA,CAEJ,IAEJ,GACC,EAAC,EAAD,CACE,KAAM,EACN,QAAS,EACT,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,GAAY,YACnB,aAAW,SACZ,CAAA,CAEA,GAET"}

package/dist/esm/common/alert/alert.module.mjs

@@ -0,0 +1,2 @@
+var e={alert:`alert_nX-Fv`,"alert-icon":`alert-icon_mzjuj`,alertIcon:`alert-icon_mzjuj`,"alert-content":`alert-content_-94Ey`,alertContent:`alert-content_-94Ey`,"alert-title":`alert-title_TqdRL`,alertTitle:`alert-title_TqdRL`,"alert-description":`alert-description_N5LkS`,alertDescription:`alert-description_N5LkS`,"alert-closeButton":`alert-closeButton_RQvYS`,alertCloseButton:`alert-closeButton_RQvYS`,"alert-style-default":`alert-style-default_KFyzb`,alertStyleDefault:`alert-style-default_KFyzb`,"alert-style-info":`alert-style-info_P-XG-`,alertStyleInfo:`alert-style-info_P-XG-`,"alert-style-success":`alert-style-success_zomWm`,alertStyleSuccess:`alert-style-success_zomWm`,"alert-style-warn":`alert-style-warn_jRYe5`,alertStyleWarn:`alert-style-warn_jRYe5`,"alert-style-error":`alert-style-error_Nk4As`,alertStyleError:`alert-style-error_Nk4As`};export{e as default};
+//# sourceMappingURL=alert.module.mjs.map

package/dist/esm/common/alert/alert.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.module.mjs","names":[],"sources":["../../../../package/common/alert/alert.module.pcss"],"sourcesContent":[".alert {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 12px 14px;\n  border-radius: var(--default-border-radius);\n  background: var(--background-accent);\n  color: var(--text-color);\n  font-family: var(--default-font);\n  box-sizing: border-box;\n\n  &-icon {\n    flex-shrink: 0;\n    margin-top: 2px;\n    font-size: 15px;\n  }\n\n  &-content {\n    flex: 1;\n    font-size: 14px;\n    line-height: 1.4;\n  }\n\n  &-title {\n    font-weight: var(--header-font-weight, 600);\n\n    &:not(:only-child) {\n      margin-bottom: 2px;\n    }\n  }\n\n  &-description {\n    color: var(--text-dark);\n  }\n\n  &-closeButton {\n    flex-shrink: 0;\n    background: none;\n    border: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    padding: 0;\n    color: var(--text-dark);\n    font-size: 13px;\n    opacity: 0.6;\n    transition: opacity 0.15s;\n    margin-top: 2px;\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n\n  &-style {\n    &-default {\n      border-left: 3px solid var(--primary-color);\n\n      .alert-icon {\n        color: var(--primary-color);\n      }\n    }\n\n    &-info {\n      border-left: 3px solid var(--info-color, #3b82f6);\n\n      .alert-icon {\n        color: var(--info-color, #3b82f6);\n      }\n    }\n\n    &-success {\n      border-left: 3px solid var(--success-color);\n\n      .alert-icon {\n        color: var(--success-color);\n      }\n    }\n\n    &-warn {\n      border-left: 3px solid var(--warn-color);\n\n      .alert-icon {\n        color: var(--warn-color);\n      }\n    }\n\n    &-error {\n      border-left: 3px solid var(--error-color, #ef4444);\n\n      .alert-icon {\n        color: var(--error-color, #ef4444);\n      }\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/alert/alert.types.mjs

@@ -0,0 +1,2 @@
+var e=function(e){return e.Default=`default`,e.Info=`info`,e.Success=`success`,e.Warn=`warn`,e.Error=`error`,e}({});export{e as AlertStyleType};
+//# sourceMappingURL=alert.types.mjs.map

package/dist/esm/common/alert/alert.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.types.mjs","names":[],"sources":["../../../../package/common/alert/alert.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport type { IconDefinition } from '@fortawesome/fontawesome-svg-core';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\nexport enum AlertStyleType {\n  Default = 'default',\n  Info = 'info',\n  Success = 'success',\n  Warn = 'warn',\n  Error = 'error',\n}\n\nexport type AlertSlots = 'root' | 'icon' | 'content' | 'title' | 'description' | 'closeButton';\n\nexport interface AlertProps extends HtmlProps {\n  title?: ReactNode;\n  children?: ReactNode;\n  styleType?: AlertStyleType;\n  icon?: IconDefinition;\n  hideIcon?: boolean;\n  onClose?: () => void;\n  className?: string;\n  style?: CSSProperties;\n  classNames?: SlotClassNames<AlertSlots>;\n  styles?: SlotStyles<AlertSlots>;\n}\n"],"mappings":"AAIA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,QAAA,UACA,EAAA,KAAA,OACA,EAAA,QAAA,UACA,EAAA,KAAA,OACA,EAAA,MAAA,SACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/animatedText/animatedText.mjs

@@ -1,2 +1,2 @@
-import{AnimatedTextUnit as e,AnimatedTextVariant as t}from"./animatedText.types.mjs";import n from"./animatedText.module.mjs";import{Fragment as r,useEffect as i,useMemo as a,useState as o}from"react";import s from"classnames";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";function d(){return typeof window<`u`&&typeof window.matchMedia==`function`?window.matchMedia(`(prefers-reduced-motion: reduce)`).matches:!1}var f={[t.RiseUp]:n.animatedTextVariantRiseUp,[t.BlurIn]:n.animatedTextVariantBlurIn,[t.Bounce]:n.animatedTextVariantBounce,[t.Glitch]:n.animatedTextVariantGlitch};function p(t,n){return n===e.Word?t.split(` `).filter(Boolean):Array.from(t)}function m({units:t,unit:a,staggerDelay:f,classNames:p,slotStyles:m}){let[h,g]=o(()=>t.length===0?0:d()?t.length:1);i(()=>{if(t.length<=1||d())return;let e=1,n=setInterval(()=>{e+=1,g(e),e>=t.length&&clearInterval(n)},f);return()=>clearInterval(n)},[t,f]);let _=h>=t.length;return u(c,{children:[t.slice(0,h).map((t,i)=>u(r,{children:[l(`span`,{className:s(n.animatedTextTypewriterLetter,p?.letter),style:m?.letter,children:t}),a===e.Word&&i<h-1?` `:null]},i)),l(`span`,{className:s(n.animatedTextCursor,_&&n.animatedTextCursorBlinking,p?.cursor),style:m?.cursor})]})}var h=`ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%&*`,g=35;function _(e){return Array.from({length:e},()=>h[Math.floor(Math.random()*69)]).join(``)}function v({units:t,unit:a,staggerDelay:f,classNames:p,slotStyles:m}){let[h]=o(d),[v,y]=o(0);i(()=>{if(t.length===0||h)return;let e=0,n=Math.ceil(t.length*f/g)+1,r=setInterval(()=>{e+=1,y(e),e>=n&&clearInterval(r)},g);return()=>clearInterval(r)},[t,f,h]);let b=Math.min(t.length,Math.floor(v*g/f));return l(c,{children:t.map((i,o)=>{let c=h||o<b;return u(r,{children:[l(`span`,{className:s(n.animatedTextScrambleLetter,p?.letter),style:m?.letter,children:i===` `?` `:c?i:_(i.length)}),a===e.Word&&o<t.length-1?` `:null]},o)})})}function y({text:i,variant:o=t.RiseUp,unit:c=e.Letter,staggerDelay:d=40,duration:h,className:g,style:_,classNames:y,styles:b,...x}){let S=a(()=>p(i,c),[i,c]),C=`${o} ${i} ${c} ${d} ${h??``}`;if(o===t.Shine)return u(`span`,{...x,className:s(n.animatedText,g),style:_,children:[l(`span`,{className:n.animatedTextVisuallyHidden,children:i}),l(`span`,{"aria-hidden":`true`,className:s(n.animatedTextShine,y?.letter),style:{animationDuration:`${h??2e3}ms`,...b?.letter},children:i},C)]});if(o===t.Highlight)return u(`span`,{...x,className:s(n.animatedText,g),style:_,children:[l(`span`,{className:n.animatedTextVisuallyHidden,children:i}),l(`span`,{"aria-hidden":`true`,className:s(n.animatedTextHighlight,y?.letter),style:{animationDuration:`${h??600}ms`,...b?.letter},children:i},C)]});if(o===t.Typewriter)return u(`span`,{...x,className:s(n.animatedText,g),style:_,children:[l(`span`,{className:n.animatedTextVisuallyHidden,children:i}),l(`span`,{"aria-hidden":`true`,children:l(m,{units:S,unit:c,staggerDelay:d,classNames:y,slotStyles:b})},C)]});if(o===t.Scramble)return u(`span`,{...x,className:s(n.animatedText,g),style:_,children:[l(`span`,{className:n.animatedTextVisuallyHidden,children:i}),l(`span`,{"aria-hidden":`true`,children:l(v,{units:S,unit:c,staggerDelay:d,classNames:y,slotStyles:b})},C)]});if(o===t.Wave)return u(`span`,{...x,className:s(n.animatedText,g),style:_,children:[l(`span`,{className:n.animatedTextVisuallyHidden,children:i}),l(`span`,{"aria-hidden":`true`,children:S.map((t,i)=>u(r,{children:[l(`span`,{className:s(n.animatedTextLetter,n.animatedTextVariantWave,y?.letter),style:{animationDelay:`-${i*d}ms`,animationDuration:`${h??1200}ms`,...b?.letter},children:t===` `?` `:t}),c===e.Word&&i<S.length-1?` `:null]},i))},C)]});let w=f[o]??n.animatedTextVariantRiseUp;return u(`span`,{...x,className:s(n.animatedText,g),style:_,children:[l(`span`,{className:n.animatedTextVisuallyHidden,children:i}),l(`span`,{"aria-hidden":`true`,children:S.map((t,i)=>u(r,{children:[l(`span`,{className:s(n.animatedTextLetter,w,y?.letter),style:{animationDelay:`${i*d}ms`,animationDuration:`${h??500}ms`,...b?.letter},children:t===` `?` `:t}),c===e.Word&&i<S.length-1?` `:null]},i))},C)]})}export{y as default};
+import{AnimatedTextUnit as e,AnimatedTextVariant as t}from"./animatedText.types.mjs";import n from"./animatedText.module.mjs";import{Fragment as r,useEffect as i,useMemo as a,useRef as o,useState as s}from"react";import c from"classnames";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";function f(){return typeof window<`u`&&typeof window.matchMedia==`function`?window.matchMedia(`(prefers-reduced-motion: reduce)`).matches:!1}var p={[t.RiseUp]:n.animatedTextVariantRiseUp,[t.BlurIn]:n.animatedTextVariantBlurIn,[t.Bounce]:n.animatedTextVariantBounce,[t.Glitch]:n.animatedTextVariantGlitch};function m(t,n){return n===e.Word?t.split(` `).filter(Boolean):Array.from(t)}function h({units:t,unit:a,staggerDelay:o,classNames:p,slotStyles:m}){let[h,g]=s(()=>t.length===0?0:f()?t.length:1);i(()=>{if(t.length<=1||f())return;let e=1,n=setInterval(()=>{e+=1,g(e),e>=t.length&&clearInterval(n)},o);return()=>clearInterval(n)},[t,o]);let _=h>=t.length;return d(l,{children:[t.slice(0,h).map((t,i)=>d(r,{children:[u(`span`,{className:c(n.animatedTextTypewriterLetter,p?.letter),style:m?.letter,children:t}),a===e.Word&&i<h-1?` `:null]},i)),u(`span`,{className:c(n.animatedTextCursor,_&&n.animatedTextCursorBlinking,p?.cursor),style:m?.cursor})]})}var g=`ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%&*`,_=35;function v(e){return Array.from({length:e},()=>g[Math.floor(Math.random()*69)]).join(``)}function y({units:t,unit:a,staggerDelay:o,classNames:p,slotStyles:m}){let[h]=s(f),[g,y]=s(0);i(()=>{if(t.length===0||h)return;let e=0,n=Math.ceil(t.length*o/_)+1,r=setInterval(()=>{e+=1,y(e),e>=n&&clearInterval(r)},_);return()=>clearInterval(r)},[t,o,h]);let b=Math.min(t.length,Math.floor(g*_/o));return u(l,{children:t.map((i,o)=>{let s=h||o<b;return d(r,{children:[u(`span`,{className:c(n.animatedTextScrambleLetter,p?.letter),style:m?.letter,children:i===` `?` `:s?i:v(i.length)}),a===e.Word&&o<t.length-1?` `:null]},o)})})}function b({text:l,variant:f=t.RiseUp,unit:g=e.Letter,staggerDelay:_=40,duration:v,triggerOnView:b=!0,className:x,style:S,classNames:C,styles:w,...T}){let E=a(()=>m(l,g),[l,g]),D=o(null),[O,k]=s(()=>!b||typeof IntersectionObserver>`u`);i(()=>{if(O)return;let e=D.current;if(!e)return;let t=new IntersectionObserver(([e])=>{e?.isIntersecting&&(k(!0),t.disconnect())});return t.observe(e),()=>t.disconnect()},[O]);let A=`${f} ${l} ${g} ${_} ${v??``}`,j;if(!O)j=u(`span`,{"aria-hidden":`true`,style:{opacity:0},children:l});else if(f===t.Shine)j=u(`span`,{"aria-hidden":`true`,className:c(n.animatedTextShine,C?.letter),style:{animationDuration:`${v??2e3}ms`,...w?.letter},children:l},A);else if(f===t.Highlight)j=u(`span`,{"aria-hidden":`true`,className:c(n.animatedTextHighlight,C?.letter),style:{animationDuration:`${v??600}ms`,...w?.letter},children:l},A);else if(f===t.Typewriter)j=u(`span`,{"aria-hidden":`true`,children:u(h,{units:E,unit:g,staggerDelay:_,classNames:C,slotStyles:w})},A);else if(f===t.Scramble)j=u(`span`,{"aria-hidden":`true`,children:u(y,{units:E,unit:g,staggerDelay:_,classNames:C,slotStyles:w})},A);else if(f===t.Wave)j=u(`span`,{"aria-hidden":`true`,children:E.map((t,i)=>d(r,{children:[u(`span`,{className:c(n.animatedTextLetter,n.animatedTextVariantWave,C?.letter),style:{animationDelay:`-${i*_}ms`,animationDuration:`${v??1200}ms`,...w?.letter},children:t===` `?` `:t}),g===e.Word&&i<E.length-1?` `:null]},i))},A);else{let t=p[f]??n.animatedTextVariantRiseUp;j=u(`span`,{"aria-hidden":`true`,children:E.map((i,a)=>d(r,{children:[u(`span`,{className:c(n.animatedTextLetter,t,C?.letter),style:{animationDelay:`${a*_}ms`,animationDuration:`${v??500}ms`,...w?.letter},children:i===` `?` `:i}),g===e.Word&&a<E.length-1?` `:null]},a))},A)}return d(`span`,{...T,ref:D,className:c(n.animatedText,x),style:S,children:[u(`span`,{className:n.animatedTextVisuallyHidden,children:l}),j]})}export{b as default};
 //# sourceMappingURL=animatedText.mjs.map

package/dist/esm/common/animatedText/animatedText.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"animatedText.mjs","names":[],"sources":["../../../../package/common/animatedText/animatedText.tsx"],"sourcesContent":["import { Fragment, useEffect, useMemo, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { AnimatedTextVariant, AnimatedTextUnit } from './animatedText.types';\nimport type { AnimatedTextProps } from './animatedText.types';\nimport styles from './animatedText.module.pcss';\n\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined' && typeof window.matchMedia === 'function'\n    ? window.matchMedia('(prefers-reduced-motion: reduce)').matches\n    : false;\n}\n\n// CSS-driven one-shot entrance variants: identical rendering, only the keyframe (via this class)\n// differs. RiseUp/BlurIn/Bounce/Glitch all animate opacity 0 -> 1 with `animation-fill-mode:\n// forwards`, staggered per unit via `animation-delay`.\nconst ENTRANCE_VARIANT_CLASS: Partial<Record<AnimatedTextVariant, string>> = {\n  [AnimatedTextVariant.RiseUp]: styles.animatedTextVariantRiseUp,\n  [AnimatedTextVariant.BlurIn]: styles.animatedTextVariantBlurIn,\n  [AnimatedTextVariant.Bounce]: styles.animatedTextVariantBounce,\n  [AnimatedTextVariant.Glitch]: styles.animatedTextVariantGlitch,\n};\n\nfunction splitUnits(text: string, unit: AnimatedTextUnit): string[] {\n  return unit === AnimatedTextUnit.Word ? text.split(' ').filter(Boolean) : Array.from(text);\n}\n\ninterface TypewriterProps {\n  units: string[];\n  unit: AnimatedTextUnit;\n  staggerDelay: number;\n  classNames: AnimatedTextProps['classNames'];\n  slotStyles: AnimatedTextProps['styles'];\n}\n\n// Split out so its wrapper (keyed by `replayKey`, see below) can be remounted on prop change to\n// reset this component's reveal state, the idiomatic React way to reset state on prop change.\n// It also keeps the reveal-count updates that happen over time (inside the interval callback) as\n// the only setState calls, none of them synchronous-in-effect.\nfunction Typewriter({ units, unit, staggerDelay, classNames, slotStyles }: TypewriterProps) {\n  const [revealCount, setRevealCount] = useState(() => {\n    if (units.length === 0) return 0;\n    return prefersReducedMotion() ? units.length : 1;\n  });\n\n  useEffect(() => {\n    if (units.length <= 1 || prefersReducedMotion()) return;\n    let revealed = 1;\n    const id = setInterval(() => {\n      revealed += 1;\n      setRevealCount(revealed);\n      if (revealed >= units.length) clearInterval(id);\n    }, staggerDelay);\n    return () => clearInterval(id);\n  }, [units, staggerDelay]);\n\n  const isDone = revealCount >= units.length;\n\n  return (\n    <>\n      {units.slice(0, revealCount).map((unitText, index) => (\n        <Fragment key={index}>\n          <span className={cx(styles.animatedTextTypewriterLetter, classNames?.letter)} style={slotStyles?.letter}>\n            {unitText}\n          </span>\n          {unit === AnimatedTextUnit.Word && index < revealCount - 1 ? ' ' : null}\n        </Fragment>\n      ))}\n      <span\n        className={cx(styles.animatedTextCursor, isDone && styles.animatedTextCursorBlinking, classNames?.cursor)}\n        style={slotStyles?.cursor}\n      />\n    </>\n  );\n}\n\nconst SCRAMBLE_CHARSET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%&*';\nconst SCRAMBLE_TICK_MS = 35;\n\nfunction randomScrambleText(length: number): string {\n  return Array.from({ length }, () => SCRAMBLE_CHARSET[Math.floor(Math.random() * SCRAMBLE_CHARSET.length)]).join('');\n}\n\ninterface ScrambleProps {\n  units: string[];\n  unit: AnimatedTextUnit;\n  staggerDelay: number;\n  classNames: AnimatedTextProps['classNames'];\n  slotStyles: AnimatedTextProps['styles'];\n}\n\n// Same keyed-remount-on-prop-change approach as Typewriter. Every unit starts scrambled and\n// \"locks in\" left to right; the scramble refresh (SCRAMBLE_TICK_MS) is a separate, faster cadence\n// than the per-unit settle pacing (staggerDelay) so still-scrambling units keep visibly flickering.\nfunction Scramble({ units, unit, staggerDelay, classNames, slotStyles }: ScrambleProps) {\n  const [reduceMotion] = useState(prefersReducedMotion);\n  const [tick, setTick] = useState(0);\n\n  useEffect(() => {\n    if (units.length === 0 || reduceMotion) return;\n    let t = 0;\n    const totalTicks = Math.ceil((units.length * staggerDelay) / SCRAMBLE_TICK_MS) + 1;\n    const id = setInterval(() => {\n      t += 1;\n      setTick(t);\n      if (t >= totalTicks) clearInterval(id);\n    }, SCRAMBLE_TICK_MS);\n    return () => clearInterval(id);\n  }, [units, staggerDelay, reduceMotion]);\n\n  const settledCount = Math.min(units.length, Math.floor((tick * SCRAMBLE_TICK_MS) / staggerDelay));\n\n  return (\n    <>\n      {units.map((unitText, index) => {\n        const isSettled = reduceMotion || index < settledCount;\n        return (\n          <Fragment key={index}>\n            <span className={cx(styles.animatedTextScrambleLetter, classNames?.letter)} style={slotStyles?.letter}>\n              {unitText === ' ' ? ' ' : isSettled ? unitText : randomScrambleText(unitText.length)}\n            </span>\n            {unit === AnimatedTextUnit.Word && index < units.length - 1 ? ' ' : null}\n          </Fragment>\n        );\n      })}\n    </>\n  );\n}\n\nfunction AnimatedText({\n  text,\n  variant = AnimatedTextVariant.RiseUp,\n  unit = AnimatedTextUnit.Letter,\n  staggerDelay = 40,\n  duration,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: AnimatedTextProps): ReactElement {\n  const units = useMemo(() => splitUnits(text, unit), [text, unit]);\n\n  // Forces the animated subtree (not the whole component) to remount whenever anything that\n  // affects the animation changes, most commonly `text`. Without this, CSS entrance variants\n  // rely on `animation-fill-mode: forwards`, which just holds the prior end state instead of\n  // replaying when the letters underneath it change; keying on these values makes every variant\n  // (CSS-driven and JS-driven alike) replay consistently, matching what a component named\n  // AnimatedText should do when the text it's animating actually changes.\n  const replayKey = `${variant} ${text} ${unit} ${staggerDelay} ${duration ?? ''}`;\n\n  if (variant === AnimatedTextVariant.Shine) {\n    return (\n      <span {...rest} className={cx(styles.animatedText, className)} style={style}>\n        <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n        <span\n          key={replayKey}\n          aria-hidden=\"true\"\n          className={cx(styles.animatedTextShine, classNames?.letter)}\n          style={{ animationDuration: `${duration ?? 2000}ms`, ...slotStyles?.letter }}\n        >\n          {text}\n        </span>\n      </span>\n    );\n  }\n\n  if (variant === AnimatedTextVariant.Highlight) {\n    return (\n      <span {...rest} className={cx(styles.animatedText, className)} style={style}>\n        <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n        <span\n          key={replayKey}\n          aria-hidden=\"true\"\n          className={cx(styles.animatedTextHighlight, classNames?.letter)}\n          style={{ animationDuration: `${duration ?? 600}ms`, ...slotStyles?.letter }}\n        >\n          {text}\n        </span>\n      </span>\n    );\n  }\n\n  if (variant === AnimatedTextVariant.Typewriter) {\n    return (\n      <span {...rest} className={cx(styles.animatedText, className)} style={style}>\n        <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n        <span key={replayKey} aria-hidden=\"true\">\n          <Typewriter\n            units={units}\n            unit={unit}\n            staggerDelay={staggerDelay}\n            classNames={classNames}\n            slotStyles={slotStyles}\n          />\n        </span>\n      </span>\n    );\n  }\n\n  if (variant === AnimatedTextVariant.Scramble) {\n    return (\n      <span {...rest} className={cx(styles.animatedText, className)} style={style}>\n        <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n        <span key={replayKey} aria-hidden=\"true\">\n          <Scramble units={units} unit={unit} staggerDelay={staggerDelay} classNames={classNames} slotStyles={slotStyles} />\n        </span>\n      </span>\n    );\n  }\n\n  if (variant === AnimatedTextVariant.Wave) {\n    return (\n      <span {...rest} className={cx(styles.animatedText, className)} style={style}>\n        <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n        <span key={replayKey} aria-hidden=\"true\">\n          {units.map((unitText, index) => (\n            <Fragment key={index}>\n              <span\n                className={cx(styles.animatedTextLetter, styles.animatedTextVariantWave, classNames?.letter)}\n                style={{\n                  // Negative delay starts the loop already mid-cycle, phase-shifted per unit.\n                  // That's what makes it read as a travelling wave from the very first frame,\n                  // instead of every unit bobbing in lockstep or staggering in once and then syncing.\n                  animationDelay: `-${index * staggerDelay}ms`,\n                  animationDuration: `${duration ?? 1200}ms`,\n                  ...slotStyles?.letter,\n                }}\n              >\n                {unitText === ' ' ? ' ' : unitText}\n              </span>\n              {unit === AnimatedTextUnit.Word && index < units.length - 1 ? ' ' : null}\n            </Fragment>\n          ))}\n        </span>\n      </span>\n    );\n  }\n\n  const entranceClass = ENTRANCE_VARIANT_CLASS[variant] ?? styles.animatedTextVariantRiseUp;\n\n  return (\n    <span {...rest} className={cx(styles.animatedText, className)} style={style}>\n      <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n      <span key={replayKey} aria-hidden=\"true\">\n        {units.map((unitText, index) => (\n          <Fragment key={index}>\n            <span\n              className={cx(styles.animatedTextLetter, entranceClass, classNames?.letter)}\n              style={{\n                animationDelay: `${index * staggerDelay}ms`,\n                animationDuration: `${duration ?? 500}ms`,\n                ...slotStyles?.letter,\n              }}\n            >\n              {unitText === ' ' ? ' ' : unitText}\n            </span>\n            {unit === AnimatedTextUnit.Word && index < units.length - 1 ? ' ' : null}\n          </Fragment>\n        ))}\n      </span>\n    </span>\n  );\n}\n\nexport default AnimatedText;\n"],"mappings":"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"}
+{"version":3,"file":"animatedText.mjs","names":[],"sources":["../../../../package/common/animatedText/animatedText.tsx"],"sourcesContent":["import { Fragment, useEffect, useMemo, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { AnimatedTextVariant, AnimatedTextUnit } from './animatedText.types';\nimport type { AnimatedTextProps } from './animatedText.types';\nimport styles from './animatedText.module.pcss';\n\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined' && typeof window.matchMedia === 'function'\n    ? window.matchMedia('(prefers-reduced-motion: reduce)').matches\n    : false;\n}\n\n// CSS-driven one-shot entrance variants: identical rendering, only the keyframe (via this class)\n// differs. RiseUp/BlurIn/Bounce/Glitch all animate opacity 0 -> 1 with `animation-fill-mode:\n// forwards`, staggered per unit via `animation-delay`.\nconst ENTRANCE_VARIANT_CLASS: Partial<Record<AnimatedTextVariant, string>> = {\n  [AnimatedTextVariant.RiseUp]: styles.animatedTextVariantRiseUp,\n  [AnimatedTextVariant.BlurIn]: styles.animatedTextVariantBlurIn,\n  [AnimatedTextVariant.Bounce]: styles.animatedTextVariantBounce,\n  [AnimatedTextVariant.Glitch]: styles.animatedTextVariantGlitch,\n};\n\nfunction splitUnits(text: string, unit: AnimatedTextUnit): string[] {\n  return unit === AnimatedTextUnit.Word ? text.split(' ').filter(Boolean) : Array.from(text);\n}\n\ninterface TypewriterProps {\n  units: string[];\n  unit: AnimatedTextUnit;\n  staggerDelay: number;\n  classNames: AnimatedTextProps['classNames'];\n  slotStyles: AnimatedTextProps['styles'];\n}\n\n// Split out so its wrapper (keyed by `replayKey`, see below) can be remounted on prop change to\n// reset this component's reveal state, the idiomatic React way to reset state on prop change.\n// It also keeps the reveal-count updates that happen over time (inside the interval callback) as\n// the only setState calls, none of them synchronous-in-effect.\nfunction Typewriter({ units, unit, staggerDelay, classNames, slotStyles }: TypewriterProps) {\n  const [revealCount, setRevealCount] = useState(() => {\n    if (units.length === 0) return 0;\n    return prefersReducedMotion() ? units.length : 1;\n  });\n\n  useEffect(() => {\n    if (units.length <= 1 || prefersReducedMotion()) return;\n    let revealed = 1;\n    const id = setInterval(() => {\n      revealed += 1;\n      setRevealCount(revealed);\n      if (revealed >= units.length) clearInterval(id);\n    }, staggerDelay);\n    return () => clearInterval(id);\n  }, [units, staggerDelay]);\n\n  const isDone = revealCount >= units.length;\n\n  return (\n    <>\n      {units.slice(0, revealCount).map((unitText, index) => (\n        <Fragment key={index}>\n          <span className={cx(styles.animatedTextTypewriterLetter, classNames?.letter)} style={slotStyles?.letter}>\n            {unitText}\n          </span>\n          {unit === AnimatedTextUnit.Word && index < revealCount - 1 ? ' ' : null}\n        </Fragment>\n      ))}\n      <span\n        className={cx(styles.animatedTextCursor, isDone && styles.animatedTextCursorBlinking, classNames?.cursor)}\n        style={slotStyles?.cursor}\n      />\n    </>\n  );\n}\n\nconst SCRAMBLE_CHARSET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%&*';\nconst SCRAMBLE_TICK_MS = 35;\n\nfunction randomScrambleText(length: number): string {\n  return Array.from({ length }, () => SCRAMBLE_CHARSET[Math.floor(Math.random() * SCRAMBLE_CHARSET.length)]).join('');\n}\n\ninterface ScrambleProps {\n  units: string[];\n  unit: AnimatedTextUnit;\n  staggerDelay: number;\n  classNames: AnimatedTextProps['classNames'];\n  slotStyles: AnimatedTextProps['styles'];\n}\n\n// Same keyed-remount-on-prop-change approach as Typewriter. Every unit starts scrambled and\n// \"locks in\" left to right; the scramble refresh (SCRAMBLE_TICK_MS) is a separate, faster cadence\n// than the per-unit settle pacing (staggerDelay) so still-scrambling units keep visibly flickering.\nfunction Scramble({ units, unit, staggerDelay, classNames, slotStyles }: ScrambleProps) {\n  const [reduceMotion] = useState(prefersReducedMotion);\n  const [tick, setTick] = useState(0);\n\n  useEffect(() => {\n    if (units.length === 0 || reduceMotion) return;\n    let t = 0;\n    const totalTicks = Math.ceil((units.length * staggerDelay) / SCRAMBLE_TICK_MS) + 1;\n    const id = setInterval(() => {\n      t += 1;\n      setTick(t);\n      if (t >= totalTicks) clearInterval(id);\n    }, SCRAMBLE_TICK_MS);\n    return () => clearInterval(id);\n  }, [units, staggerDelay, reduceMotion]);\n\n  const settledCount = Math.min(units.length, Math.floor((tick * SCRAMBLE_TICK_MS) / staggerDelay));\n\n  return (\n    <>\n      {units.map((unitText, index) => {\n        const isSettled = reduceMotion || index < settledCount;\n        return (\n          <Fragment key={index}>\n            <span className={cx(styles.animatedTextScrambleLetter, classNames?.letter)} style={slotStyles?.letter}>\n              {unitText === ' ' ? ' ' : isSettled ? unitText : randomScrambleText(unitText.length)}\n            </span>\n            {unit === AnimatedTextUnit.Word && index < units.length - 1 ? ' ' : null}\n          </Fragment>\n        );\n      })}\n    </>\n  );\n}\n\nfunction AnimatedText({\n  text,\n  variant = AnimatedTextVariant.RiseUp,\n  unit = AnimatedTextUnit.Letter,\n  staggerDelay = 40,\n  duration,\n  triggerOnView = true,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: AnimatedTextProps): ReactElement {\n  const units = useMemo(() => splitUnits(text, unit), [text, unit]);\n  const rootRef = useRef<HTMLSpanElement>(null);\n\n  // When `triggerOnView` is on, the animated subtree stays unmounted (see `isVisible` below)\n  // until the root first scrolls into the viewport, so the entrance/loop only plays once someone\n  // can actually see it instead of burning its one-shot animation off-screen on mount. Falls back\n  // to immediately visible when IntersectionObserver isn't available (SSR, old browsers, jsdom).\n  const [isVisible, setIsVisible] = useState(() => !triggerOnView || typeof IntersectionObserver === 'undefined');\n\n  useEffect(() => {\n    if (isVisible) return;\n    const node = rootRef.current;\n    if (!node) return;\n    const observer = new IntersectionObserver(([entry]) => {\n      if (entry?.isIntersecting) {\n        setIsVisible(true);\n        observer.disconnect();\n      }\n    });\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [isVisible]);\n\n  // Forces the animated subtree (not the whole component) to remount whenever anything that\n  // affects the animation changes, most commonly `text`. Without this, CSS entrance variants\n  // rely on `animation-fill-mode: forwards`, which just holds the prior end state instead of\n  // replaying when the letters underneath it change; keying on these values makes every variant\n  // (CSS-driven and JS-driven alike) replay consistently, matching what a component named\n  // AnimatedText should do when the text it's animating actually changes.\n  const replayKey = `${variant} ${text} ${unit} ${staggerDelay} ${duration ?? ''}`;\n\n  let content: ReactElement;\n\n  if (!isVisible) {\n    // Reserves the same layout space as the real content without playing anything yet.\n    content = (\n      <span aria-hidden=\"true\" style={{ opacity: 0 }}>\n        {text}\n      </span>\n    );\n  } else if (variant === AnimatedTextVariant.Shine) {\n    content = (\n      <span\n        key={replayKey}\n        aria-hidden=\"true\"\n        className={cx(styles.animatedTextShine, classNames?.letter)}\n        style={{ animationDuration: `${duration ?? 2000}ms`, ...slotStyles?.letter }}\n      >\n        {text}\n      </span>\n    );\n  } else if (variant === AnimatedTextVariant.Highlight) {\n    content = (\n      <span\n        key={replayKey}\n        aria-hidden=\"true\"\n        className={cx(styles.animatedTextHighlight, classNames?.letter)}\n        style={{ animationDuration: `${duration ?? 600}ms`, ...slotStyles?.letter }}\n      >\n        {text}\n      </span>\n    );\n  } else if (variant === AnimatedTextVariant.Typewriter) {\n    content = (\n      <span key={replayKey} aria-hidden=\"true\">\n        <Typewriter units={units} unit={unit} staggerDelay={staggerDelay} classNames={classNames} slotStyles={slotStyles} />\n      </span>\n    );\n  } else if (variant === AnimatedTextVariant.Scramble) {\n    content = (\n      <span key={replayKey} aria-hidden=\"true\">\n        <Scramble units={units} unit={unit} staggerDelay={staggerDelay} classNames={classNames} slotStyles={slotStyles} />\n      </span>\n    );\n  } else if (variant === AnimatedTextVariant.Wave) {\n    content = (\n      <span key={replayKey} aria-hidden=\"true\">\n        {units.map((unitText, index) => (\n          <Fragment key={index}>\n            <span\n              className={cx(styles.animatedTextLetter, styles.animatedTextVariantWave, classNames?.letter)}\n              style={{\n                // Negative delay starts the loop already mid-cycle, phase-shifted per unit.\n                // That's what makes it read as a travelling wave from the very first frame,\n                // instead of every unit bobbing in lockstep or staggering in once and then syncing.\n                animationDelay: `-${index * staggerDelay}ms`,\n                animationDuration: `${duration ?? 1200}ms`,\n                ...slotStyles?.letter,\n              }}\n            >\n              {unitText === ' ' ? ' ' : unitText}\n            </span>\n            {unit === AnimatedTextUnit.Word && index < units.length - 1 ? ' ' : null}\n          </Fragment>\n        ))}\n      </span>\n    );\n  } else {\n    const entranceClass = ENTRANCE_VARIANT_CLASS[variant] ?? styles.animatedTextVariantRiseUp;\n    content = (\n      <span key={replayKey} aria-hidden=\"true\">\n        {units.map((unitText, index) => (\n          <Fragment key={index}>\n            <span\n              className={cx(styles.animatedTextLetter, entranceClass, classNames?.letter)}\n              style={{\n                animationDelay: `${index * staggerDelay}ms`,\n                animationDuration: `${duration ?? 500}ms`,\n                ...slotStyles?.letter,\n              }}\n            >\n              {unitText === ' ' ? ' ' : unitText}\n            </span>\n            {unit === AnimatedTextUnit.Word && index < units.length - 1 ? ' ' : null}\n          </Fragment>\n        ))}\n      </span>\n    );\n  }\n\n  return (\n    <span {...rest} ref={rootRef} className={cx(styles.animatedText, className)} style={style}>\n      <span className={styles.animatedTextVisuallyHidden}>{text}</span>\n      {content}\n    </span>\n  );\n}\n\nexport default AnimatedText;\n"],"mappings":"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"}

package/dist/esm/common/animatedText/animatedText.types.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"animatedText.types.mjs","names":[],"sources":["../../../../package/common/animatedText/animatedText.types.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\n/** Which animation plays across the text. */\nexport enum AnimatedTextVariant {\n  /** Each unit rises up from below its baseline, staggered left to right. */\n  RiseUp = 'rise-up',\n  /** Each unit fades in from a blur, staggered left to right. */\n  BlurIn = 'blur-in',\n  /** Each unit drops in from above with a spring overshoot, staggered left to right. */\n  Bounce = 'bounce',\n  /** Each unit pops in in order, like it's being typed, with a blinking cursor at the end. */\n  Typewriter = 'typewriter',\n  /** Each unit resolves from random characters to its real value, staggered left to right. */\n  Scramble = 'scramble',\n  /** Each unit briefly RGB-splits and jitters before settling, staggered left to right. */\n  Glitch = 'glitch',\n  /** Every unit continuously bobs up and down in a travelling wave, on a loop. */\n  Wave = 'wave',\n  /** A highlight sweeps across the text, left to right, on a loop. */\n  Shine = 'shine',\n  /** A marker-style highlight block wipes in behind the whole string, once, left to right. */\n  Highlight = 'highlight',\n}\n\n/**\n * What gets staggered and animated as one entrance unit. Applies to every variant except\n * `Shine` and `Highlight`, which always animate the whole string as a single run.\n */\nexport enum AnimatedTextUnit {\n  /** Every letter animates on its own. */\n  Letter = 'letter',\n  /** Every word animates as a whole block. */\n  Word = 'word',\n}\n\nexport type AnimatedTextSlots = 'letter' | 'cursor';\n\nexport interface AnimatedTextProps extends HtmlProps {\n  /** The text to animate. Split and animated one unit at a time for every variant but `Shine`/`Highlight`. */\n  text: string;\n  /** Which animation plays (default `RiseUp`). */\n  variant?: AnimatedTextVariant;\n  /** Whether entrance/loop variants stagger by letter or by word (default `Letter`). Ignored by `Shine`/`Highlight`. */\n  unit?: AnimatedTextUnit;\n  /**\n   * Delay in ms between each unit's animation start. Applies to every variant except `Shine`\n   * and `Highlight`, which animate as a single run (default `40`).\n   */\n  staggerDelay?: number;\n  /**\n   * Duration in ms of one animation cycle: a single unit's entrance for `RiseUp`/`BlurIn`/\n   * `Bounce`/`Glitch` (default `500`), one bob cycle for `Wave` (default `1200`), one sweep of\n   * the highlight for `Shine` (default `2000`), or the one-shot wipe-in for `Highlight` (default\n   * `600`). Ignored by `Typewriter` and `Scramble`, since each unit resolves instantly; use\n   * `staggerDelay` to control their pacing.\n   */\n  duration?: number;\n\n  className?: string;\n  style?: CSSProperties;\n  classNames?: SlotClassNames<AnimatedTextSlots>;\n  styles?: SlotStyles<AnimatedTextSlots>;\n}\n"],"mappings":"AAIA,IAAY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,UAEA,EAAA,OAAA,UAEA,EAAA,OAAA,SAEA,EAAA,WAAA,aAEA,EAAA,SAAA,WAEA,EAAA,OAAA,SAEA,EAAA,KAAA,OAEA,EAAA,MAAA,QAEA,EAAA,UAAA,aACF,EAAA,CAAA,CAAA,EAMY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,SAEA,EAAA,KAAA,QACF,EAAA,CAAA,CAAA"}
+{"version":3,"file":"animatedText.types.mjs","names":[],"sources":["../../../../package/common/animatedText/animatedText.types.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\n/** Which animation plays across the text. */\nexport enum AnimatedTextVariant {\n  /** Each unit rises up from below its baseline, staggered left to right. */\n  RiseUp = 'rise-up',\n  /** Each unit fades in from a blur, staggered left to right. */\n  BlurIn = 'blur-in',\n  /** Each unit drops in from above with a spring overshoot, staggered left to right. */\n  Bounce = 'bounce',\n  /** Each unit pops in in order, like it's being typed, with a blinking cursor at the end. */\n  Typewriter = 'typewriter',\n  /** Each unit resolves from random characters to its real value, staggered left to right. */\n  Scramble = 'scramble',\n  /** Each unit briefly RGB-splits and jitters before settling, staggered left to right. */\n  Glitch = 'glitch',\n  /** Every unit continuously bobs up and down in a travelling wave, on a loop. */\n  Wave = 'wave',\n  /** A highlight sweeps across the text, left to right, on a loop. */\n  Shine = 'shine',\n  /** A marker-style highlight block wipes in behind the whole string, once, left to right. */\n  Highlight = 'highlight',\n}\n\n/**\n * What gets staggered and animated as one entrance unit. Applies to every variant except\n * `Shine` and `Highlight`, which always animate the whole string as a single run.\n */\nexport enum AnimatedTextUnit {\n  /** Every letter animates on its own. */\n  Letter = 'letter',\n  /** Every word animates as a whole block. */\n  Word = 'word',\n}\n\nexport type AnimatedTextSlots = 'letter' | 'cursor';\n\nexport interface AnimatedTextProps extends HtmlProps {\n  /** The text to animate. Split and animated one unit at a time for every variant but `Shine`/`Highlight`. */\n  text: string;\n  /** Which animation plays (default `RiseUp`). */\n  variant?: AnimatedTextVariant;\n  /** Whether entrance/loop variants stagger by letter or by word (default `Letter`). Ignored by `Shine`/`Highlight`. */\n  unit?: AnimatedTextUnit;\n  /**\n   * Delay in ms between each unit's animation start. Applies to every variant except `Shine`\n   * and `Highlight`, which animate as a single run (default `40`).\n   */\n  staggerDelay?: number;\n  /**\n   * Duration in ms of one animation cycle: a single unit's entrance for `RiseUp`/`BlurIn`/\n   * `Bounce`/`Glitch` (default `500`), one bob cycle for `Wave` (default `1200`), one sweep of\n   * the highlight for `Shine` (default `2000`), or the one-shot wipe-in for `Highlight` (default\n   * `600`). Ignored by `Typewriter` and `Scramble`, since each unit resolves instantly; use\n   * `staggerDelay` to control their pacing.\n   */\n  duration?: number;\n  /**\n   * When `true` (default), the animation doesn't start until the component first scrolls into\n   * the viewport. Set to `false` to play immediately on mount, e.g. for text already in view\n   * above the fold.\n   */\n  triggerOnView?: boolean;\n\n  className?: string;\n  style?: CSSProperties;\n  classNames?: SlotClassNames<AnimatedTextSlots>;\n  styles?: SlotStyles<AnimatedTextSlots>;\n}\n"],"mappings":"AAIA,IAAY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,UAEA,EAAA,OAAA,UAEA,EAAA,OAAA,SAEA,EAAA,WAAA,aAEA,EAAA,SAAA,WAEA,EAAA,OAAA,SAEA,EAAA,KAAA,OAEA,EAAA,MAAA,QAEA,EAAA,UAAA,aACF,EAAA,CAAA,CAAA,EAMY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,SAEA,EAAA,KAAA,QACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/breadcrumb/breadcrumb.mjs

@@ -0,0 +1,2 @@
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../interactableDiv/index.mjs";import n from"../actionIcon/actionIcon.mjs";import r from"../floatingMenu/floatingMenu.mjs";import i from"./breadcrumb.module.mjs";import{useState as a}from"react";import o from"classnames";import{FontAwesomeIcon as s}from"@fortawesome/react-fontawesome";import{faChevronRight as c,faEllipsis as l}from"@fortawesome/free-solid-svg-icons";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";function p(e,t){let n=e.map((e,t)=>({item:e,index:t}));if(!t||e.length<=t)return{leading:n,hidden:[],trailing:[]};let r=Math.max(1,t-2),i=e.length-1-r;return i<=0?{leading:n,hidden:[],trailing:[]}:{leading:n.slice(0,1),hidden:n.slice(1,1+i),trailing:n.slice(1+i)}}function m(t){let{items:u=[],separator:m,maxItems:g,"aria-label":_=`Breadcrumb`,className:v,style:y,classNames:b,styles:x,...S}=e(`Breadcrumb`,t),[C,w]=a(!1),{leading:T,hidden:E,trailing:D}=p(u,g),O=u.length-1;function k(e){return e===O?null:d(`span`,{className:o(i.breadcrumbSeparator,b?.separator),style:x?.separator,children:m??d(s,{icon:c})})}function A({item:e,index:t}){return f(`li`,{className:o(i.breadcrumbItem,b?.item),style:x?.item,children:[h(e,t===O,i,b,x),k(t)]},e.id??t)}return d(`nav`,{...S,"aria-label":_,className:o(i.breadcrumb,b?.root,v),style:{...y,...x?.root},children:f(`ol`,{className:o(i.breadcrumbList,b?.list),style:x?.list,children:[T.map(A),E.length>0&&f(`li`,{className:o(i.breadcrumbItem,b?.item),style:x?.item,children:[d(r,{isOpen:C,onOpenChange:w,content:d(`ul`,{className:o(i.breadcrumbHiddenList,b?.hiddenList),style:x?.hiddenList,children:E.map(({item:e,index:t})=>d(`li`,{className:o(i.breadcrumbHiddenItem,b?.hiddenItem),style:x?.hiddenItem,children:h({...e,onClick:t=>{e.onClick?.(t),w(!1)}},!1,i,b,x)},e.id??t))}),children:d(n,{icon:l,title:`Show hidden breadcrumbs`,"aria-label":`Show hidden breadcrumbs`,className:o(i.breadcrumbEllipsis,b?.ellipsis),style:x?.ellipsis})}),k(E[E.length-1].index)]}),D.map(A)]})})}function h(e,n,r,i,a){let c=f(u,{children:[e.icon&&d(s,{icon:e.icon,className:o(r.breadcrumbIcon,i?.icon),style:a?.icon}),e.label]});return n?d(`span`,{"aria-current":`page`,className:o(r.breadcrumbCurrent,i?.current),style:a?.current,children:c}):e.disabled?d(`span`,{className:o(r.breadcrumbLink,r.breadcrumbLinkDisabled,i?.link),style:a?.link,children:c}):e.href?d(`a`,{href:e.href,onClick:e.onClick,className:o(r.breadcrumbLink,i?.link),style:a?.link,children:c}):e.onClick?d(t,{onClick:e.onClick,className:o(r.breadcrumbLink,i?.link),style:a?.link,children:c}):d(`span`,{className:o(r.breadcrumbLink,r.breadcrumbLinkDisabled,i?.link),style:a?.link,children:c})}export{m as default};
+//# sourceMappingURL=breadcrumb.mjs.map

package/dist/esm/common/breadcrumb/breadcrumb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.mjs","names":[],"sources":["../../../../package/common/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { CSSProperties, ReactElement } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronRight, faEllipsis } from '@fortawesome/free-solid-svg-icons';\n\nimport InteractableDiv from '../interactableDiv';\nimport ActionIcon from '../actionIcon';\nimport FloatingMenu from '../floatingMenu';\nimport { useComponentDefaults } from '../configProvider';\nimport type { BreadcrumbItem, BreadcrumbProps } from './breadcrumb.types';\n\nimport styles from './breadcrumb.module.pcss';\n\ninterface IndexedItem {\n  item: BreadcrumbItem;\n  index: number;\n}\n\nfunction getGroups(items: BreadcrumbItem[], maxItems?: number) {\n  const indexed = items.map((item, index) => ({ item, index }));\n  if (!maxItems || items.length <= maxItems) {\n    return { leading: indexed, hidden: [] as IndexedItem[], trailing: [] as IndexedItem[] };\n  }\n\n  const trailingCount = Math.max(1, maxItems - 2);\n  const hiddenCount = items.length - 1 - trailingCount;\n  if (hiddenCount <= 0) {\n    return { leading: indexed, hidden: [] as IndexedItem[], trailing: [] as IndexedItem[] };\n  }\n\n  return {\n    leading: indexed.slice(0, 1),\n    hidden: indexed.slice(1, 1 + hiddenCount),\n    trailing: indexed.slice(1 + hiddenCount),\n  };\n}\n\nfunction Breadcrumb(props: BreadcrumbProps): ReactElement {\n  const {\n    items = [],\n    separator,\n    maxItems,\n    'aria-label': ariaLabel = 'Breadcrumb',\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Breadcrumb', props);\n\n  const [isHiddenMenuOpen, setIsHiddenMenuOpen] = useState(false);\n  const { leading, hidden, trailing } = getGroups(items, maxItems);\n  const lastIndex = items.length - 1;\n\n  function renderSeparatorAfter(index: number) {\n    if (index === lastIndex) return null;\n    return (\n      <span className={cx(styles.breadcrumbSeparator, classNames?.separator)} style={slotStyles?.separator}>\n        {separator ?? <FontAwesomeIcon icon={faChevronRight} />}\n      </span>\n    );\n  }\n\n  function renderItem({ item, index }: IndexedItem) {\n    return (\n      <li key={item.id ?? index} className={cx(styles.breadcrumbItem, classNames?.item)} style={slotStyles?.item}>\n        {renderCrumb(item, index === lastIndex, styles, classNames, slotStyles)}\n        {renderSeparatorAfter(index)}\n      </li>\n    );\n  }\n\n  return (\n    <nav\n      {...rest}\n      aria-label={ariaLabel}\n      className={cx(styles.breadcrumb, classNames?.root, className)}\n      style={{ ...style, ...slotStyles?.root }}\n    >\n      <ol className={cx(styles.breadcrumbList, classNames?.list)} style={slotStyles?.list}>\n        {leading.map(renderItem)}\n\n        {hidden.length > 0 && (\n          <li className={cx(styles.breadcrumbItem, classNames?.item)} style={slotStyles?.item}>\n            <FloatingMenu\n              isOpen={isHiddenMenuOpen}\n              onOpenChange={setIsHiddenMenuOpen}\n              content={\n                <ul className={cx(styles.breadcrumbHiddenList, classNames?.hiddenList)} style={slotStyles?.hiddenList}>\n                  {hidden.map(({ item, index }) => (\n                    <li\n                      key={item.id ?? index}\n                      className={cx(styles.breadcrumbHiddenItem, classNames?.hiddenItem)}\n                      style={slotStyles?.hiddenItem}\n                    >\n                      {renderCrumb(\n                        {\n                          ...item,\n                          onClick: (event) => {\n                            item.onClick?.(event);\n                            setIsHiddenMenuOpen(false);\n                          },\n                        },\n                        false,\n                        styles,\n                        classNames,\n                        slotStyles\n                      )}\n                    </li>\n                  ))}\n                </ul>\n              }\n            >\n              <ActionIcon\n                icon={faEllipsis}\n                title=\"Show hidden breadcrumbs\"\n                aria-label=\"Show hidden breadcrumbs\"\n                className={cx(styles.breadcrumbEllipsis, classNames?.ellipsis)}\n                style={slotStyles?.ellipsis}\n              />\n            </FloatingMenu>\n            {renderSeparatorAfter(hidden[hidden.length - 1].index)}\n          </li>\n        )}\n\n        {trailing.map(renderItem)}\n      </ol>\n    </nav>\n  );\n}\n\nfunction renderCrumb(\n  item: BreadcrumbItem,\n  isCurrent: boolean,\n  styles: Record<string, string>,\n  classNames: BreadcrumbProps['classNames'],\n  slotStyles: BreadcrumbProps['styles']\n) {\n  const content = (\n    <>\n      {item.icon && (\n        <FontAwesomeIcon\n          icon={item.icon}\n          className={cx(styles.breadcrumbIcon, classNames?.icon)}\n          style={slotStyles?.icon as CSSProperties & Record<`--fa-font-${string}`, string>}\n        />\n      )}\n      {item.label}\n    </>\n  );\n\n  if (isCurrent) {\n    return (\n      <span\n        aria-current=\"page\"\n        className={cx(styles.breadcrumbCurrent, classNames?.current)}\n        style={slotStyles?.current}\n      >\n        {content}\n      </span>\n    );\n  }\n\n  if (item.disabled) {\n    return (\n      <span className={cx(styles.breadcrumbLink, styles.breadcrumbLinkDisabled, classNames?.link)} style={slotStyles?.link}>\n        {content}\n      </span>\n    );\n  }\n\n  if (item.href) {\n    return (\n      <a\n        href={item.href}\n        onClick={item.onClick}\n        className={cx(styles.breadcrumbLink, classNames?.link)}\n        style={slotStyles?.link}\n      >\n        {content}\n      </a>\n    );\n  }\n\n  if (item.onClick) {\n    return (\n      <InteractableDiv\n        onClick={item.onClick}\n        className={cx(styles.breadcrumbLink, classNames?.link)}\n        style={slotStyles?.link}\n      >\n        {content}\n      </InteractableDiv>\n    );\n  }\n\n  return (\n    <span className={cx(styles.breadcrumbLink, styles.breadcrumbLinkDisabled, classNames?.link)} style={slotStyles?.link}>\n      {content}\n    </span>\n  );\n}\n\nexport default Breadcrumb;\n"],"mappings":"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"}

package/dist/esm/common/breadcrumb/breadcrumb.module.mjs

@@ -0,0 +1,2 @@
+var e={breadcrumb:`breadcrumb_yQM0Q`,"breadcrumb-list":`breadcrumb-list_2ah0w`,breadcrumbList:`breadcrumb-list_2ah0w`,"breadcrumb-item":`breadcrumb-item_gBLc-`,breadcrumbItem:`breadcrumb-item_gBLc-`,"breadcrumb-icon":`breadcrumb-icon_wFm8s`,breadcrumbIcon:`breadcrumb-icon_wFm8s`,"breadcrumb-link":`breadcrumb-link_eBWl3`,breadcrumbLink:`breadcrumb-link_eBWl3`,"breadcrumb-link-disabled":`breadcrumb-link-disabled_Ca-E6`,breadcrumbLinkDisabled:`breadcrumb-link-disabled_Ca-E6`,"breadcrumb-current":`breadcrumb-current_8tlun`,breadcrumbCurrent:`breadcrumb-current_8tlun`,"breadcrumb-separator":`breadcrumb-separator_akfqn`,breadcrumbSeparator:`breadcrumb-separator_akfqn`,"breadcrumb-ellipsis":`breadcrumb-ellipsis_6fvn8`,breadcrumbEllipsis:`breadcrumb-ellipsis_6fvn8`,"breadcrumb-hiddenList":`breadcrumb-hiddenList_5reEH`,breadcrumbHiddenList:`breadcrumb-hiddenList_5reEH`,"breadcrumb-hiddenItem":`breadcrumb-hiddenItem_ZGRnB`,breadcrumbHiddenItem:`breadcrumb-hiddenItem_ZGRnB`};export{e as default};
+//# sourceMappingURL=breadcrumb.module.mjs.map

package/dist/esm/common/breadcrumb/breadcrumb.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.module.mjs","names":[],"sources":["../../../../package/common/breadcrumb/breadcrumb.module.pcss"],"sourcesContent":[".breadcrumb {\n  font-family: var(--default-font);\n  font-size: var(--default-font-size);\n\n  &-list {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 6px;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  &-item {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n  }\n\n  &-icon {\n    margin-right: 6px;\n    font-size: 0.9em;\n  }\n\n  &-link {\n    display: flex;\n    align-items: center;\n    text-decoration: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    transition: color 0.15s;\n\n    /* Explicit :link/:visited beats the browser default a:visited { color: purple } on\n       specificity, otherwise every crumb using the same href (e.g. \"#\") turns purple as\n       soon as any one of them is clicked. */\n    &:link,\n    &:visited {\n      color: var(--text-dark);\n    }\n\n    &:hover {\n      color: var(--primary-color);\n    }\n\n    &-disabled {\n      color: var(--text-dark);\n      opacity: 0.5;\n      cursor: default;\n      pointer-events: none;\n    }\n  }\n\n  &-current {\n    display: flex;\n    align-items: center;\n    color: var(--text-color);\n    font-weight: var(--header-font-weight, 600);\n  }\n\n  &-separator {\n    display: flex;\n    align-items: center;\n    color: var(--text-dark);\n    font-size: 0.75em;\n    opacity: 0.7;\n  }\n\n  &-ellipsis {\n    width: 1.8em;\n    height: 1.8em;\n    font-size: 1em;\n    color: var(--text-dark);\n\n    &:hover {\n      color: var(--primary-color);\n    }\n  }\n\n  &-hiddenList {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    margin: 0;\n    padding: 6px;\n    list-style: none;\n    min-width: 160px;\n  }\n\n  &-hiddenItem {\n    display: flex;\n\n    .breadcrumb-link {\n      width: 100%;\n      padding: 6px 8px;\n      border-radius: var(--default-border-radius);\n\n      &:hover {\n        background: var(--background-accent-light);\n      }\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/button/button.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.module.mjs","names":[],"sources":["../../../../package/common/button/button.module.pcss"],"sourcesContent":[".button {\n  appearance: none;\n  -webkit-appearance: none;\n  box-sizing: border-box;\n  font-size: 16px;\n  background: transparent;\n  color: var(--text-color);\n  border: 1px solid transparent;\n  padding: 0;\n  font-family: var(--default-font);\n  border-radius: var(--default-border-radius);\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n\n  &-notAllowed {\n    cursor: not-allowed;\n    filter: opacity(0.8);\n  }\n\n  &-loading-icon {\n    width: 100% !important;\n    height: 100% !important;\n  }\n\n  &-content {\n    position: relative;\n    white-space: break-spaces;\n\n    div {\n      text-overflow: ellipsis;\n      overflow: hidden;\n    }\n  }\n\n  &-loading {\n    visibility: hidden;\n\n    &-container {\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n\n  &-withIcon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--spacing-s);\n  }\n\n  &-style {\n    &-default {\n      background: var(--button-default-background, transparent);\n      color: var(--button-default-color, var(--text-color));\n      border: var(--button-default-border, 1px solid transparent);\n    }\n\n    &-primary {\n      background: var(--primary-color);\n      color: var(--text-color);\n      color: var(--text-on-primary);\n\n      .button-loading-icon {\n        stroke: var(--text-on-primary);\n      }\n    }\n\n    &-delete {\n      background: var(--error-color);\n      color: var(--text-on-delete);\n\n      .button-loading-icon {\n        stroke: var(--text-on-delete);\n      }\n    }\n  }\n\n  &-background {\n    display: block;\n    padding: 8px 12px;\n  }\n\n  &-size {\n    &-default {\n      font-size: 16px;\n    }\n\n    &-small {\n      /* Small button is same as default for now */\n      font-size: 12px;\n\n      &-background {\n        display: block;\n        padding: 0px;\n      }\n    }\n\n    &-medium {\n      /* Medium button is same as default for now */\n      font-size: 16px;\n    }\n\n    &-large {\n      /* Large button is same as default for now */\n      font-size: 20px;\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"button.module.mjs","names":[],"sources":["../../../../package/common/button/button.module.pcss"],"sourcesContent":[".button {\n  appearance: none;\n  -webkit-appearance: none;\n  box-sizing: border-box;\n  font-size: 16px;\n  background: transparent;\n  color: var(--text-color);\n  border: 1px solid transparent;\n  padding: 0;\n  font-family: var(--default-font);\n  border-radius: var(--default-border-radius);\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  position: relative;\n  overflow: hidden;\n\n  &-notAllowed {\n    cursor: not-allowed;\n    filter: opacity(0.8);\n  }\n\n  &-loading-icon {\n    width: 100% !important;\n    height: 100% !important;\n  }\n\n  &-content {\n    position: relative;\n    white-space: break-spaces;\n\n    div {\n      text-overflow: ellipsis;\n      overflow: hidden;\n    }\n  }\n\n  &-loading {\n    visibility: hidden;\n\n    &-container {\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n\n  &-withIcon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--spacing-s);\n  }\n\n  &-style {\n    &-default {\n      background: var(--button-default-background, transparent);\n      color: var(--button-default-color, var(--text-color));\n      border: var(--button-default-border, 1px solid transparent);\n    }\n\n    &-primary {\n      background: var(--primary-color);\n      color: var(--text-color);\n      color: var(--text-on-primary);\n\n      .button-loading-icon {\n        stroke: var(--text-on-primary);\n      }\n    }\n\n    &-delete {\n      background: var(--error-color);\n      color: var(--text-on-delete);\n\n      .button-loading-icon {\n        stroke: var(--text-on-delete);\n      }\n    }\n  }\n\n  &-background {\n    display: block;\n    padding: 8px 12px;\n  }\n\n  &-size {\n    &-default {\n      font-size: 16px;\n    }\n\n    &-small {\n      /* Small button is same as default for now */\n      font-size: 12px;\n\n      &-background {\n        display: block;\n        padding: 0px;\n      }\n    }\n\n    &-medium {\n      /* Medium button is same as default for now */\n      font-size: 16px;\n    }\n\n    &-large {\n      /* Large button is same as default for now */\n      font-size: 20px;\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/card/card.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card.module.mjs","names":[],"sources":["../../../../package/common/card/card.module.pcss"],"sourcesContent":[".card {\n  border-radius: var(--default-border-radius);\n  color: var(--text-color);\n  border: 1px solid transparent;\n  box-sizing: border-box;\n\n  &-clip {\n    overflow: hidden;\n  }\n\n  &-padding {\n    padding: 16px;\n  }\n\n  &-gaps {\n    display: flex;\n    flex-direction: column;\n    gap: var(--spacing-s);\n  }\n\n  &-style {\n    &-elevated {\n      background: var(--background-card-elevated, var(--background-accent-light));\n      box-shadow: var(--card-shadow);\n    }\n\n    &-outlined {\n      background: var(--background-card-outlined, transparent);\n      border-color: var(--border-color);\n    }\n\n    &-filled {\n      background: var(--background-card-filled, var(--background-accent));\n    }\n  }\n\n  &-interactable {\n    cursor: pointer;\n  }\n\n  &-hover {\n    transition:\n      transform 0.15s ease,\n      box-shadow 0.15s ease,\n      filter 0.3s ease;\n\n    &:hover {\n      transform: translateY(-2px);\n      background: var(--background-accent);\n    }\n  }\n}\n\n.cardHeader {\n  display: flex;\n  gap: 16px;\n  align-items: center;\n\n  &-thumbnail {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 40px;\n    height: 40px;\n    background: rgba(0, 0, 0, 0.08);\n    border-radius: 40px;\n    overflow: hidden;\n    background-size: cover;\n    background-position: center;\n    flex-shrink: 0;\n  }\n\n  &-actions {\n    display: flex;\n    gap: var(--spacing-s);\n    flex-wrap: wrap;\n    flex-shrink: 1;\n    align-items: center;\n    justify-content: flex-end;\n  }\n\n  &-titles {\n    display: flex;\n    flex-flow: column;\n    flex: 1;\n    gap: 4px;\n    overflow: hidden;\n\n    &-main {\n      font-size: 18px;\n      font-weight: 600;\n      min-width: 3ch;\n      flex-shrink: 100000;\n      overflow: hidden;\n      text-overflow: ellipsis;\n\n      &-container {\n        display: flex;\n        align-items: center;\n        gap: var(--spacing-m);\n        justify-content: space-between;\n      }\n    }\n\n    &-sub {\n      font-weight: 300;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n}\n\n.cardMedia {\n  width: calc(100% + 32px);\n  margin: 0 -16px 0 -16px;\n}\n\n.cardActions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n"],"mappings":""}
+{"version":3,"file":"card.module.mjs","names":[],"sources":["../../../../package/common/card/card.module.pcss"],"sourcesContent":[".card {\n  border-radius: var(--default-border-radius);\n  color: var(--text-color);\n  border: 1px solid transparent;\n  box-sizing: border-box;\n\n  &-clip {\n    overflow: hidden;\n  }\n\n  &-padding {\n    padding: 16px;\n  }\n\n  &-gaps {\n    display: flex;\n    flex-direction: column;\n    gap: var(--spacing-s);\n  }\n\n  &-style {\n    &-elevated {\n      background: var(--background-card-elevated, var(--background-accent-light));\n      box-shadow: var(--card-shadow);\n    }\n\n    &-outlined {\n      background: var(--background-card-outlined, transparent);\n      border-color: var(--border-color);\n    }\n\n    &-filled {\n      background: var(--background-card-filled, var(--background-accent));\n    }\n  }\n\n  &-interactable {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &-hover {\n    transition:\n      transform 0.15s ease,\n      box-shadow 0.15s ease,\n      filter 0.3s ease;\n\n    &:hover {\n      transform: translateY(-2px);\n      background: var(--background-accent);\n    }\n  }\n}\n\n.cardHeader {\n  display: flex;\n  gap: 16px;\n  align-items: center;\n\n  &-thumbnail {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 40px;\n    height: 40px;\n    background: rgba(0, 0, 0, 0.08);\n    border-radius: 40px;\n    overflow: hidden;\n    background-size: cover;\n    background-position: center;\n    flex-shrink: 0;\n  }\n\n  &-actions {\n    display: flex;\n    gap: var(--spacing-s);\n    flex-wrap: wrap;\n    flex-shrink: 1;\n    align-items: center;\n    justify-content: flex-end;\n  }\n\n  &-titles {\n    display: flex;\n    flex-flow: column;\n    flex: 1;\n    gap: 4px;\n    overflow: hidden;\n\n    &-main {\n      font-size: 18px;\n      font-weight: 600;\n      min-width: 3ch;\n      flex-shrink: 100000;\n      overflow: hidden;\n      text-overflow: ellipsis;\n\n      &-container {\n        display: flex;\n        align-items: center;\n        gap: var(--spacing-m);\n        justify-content: space-between;\n      }\n    }\n\n    &-sub {\n      font-weight: 300;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n}\n\n.cardMedia {\n  width: calc(100% + 32px);\n  margin: 0 -16px 0 -16px;\n}\n\n.cardActions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n"],"mappings":""}

package/dist/esm/common/carousel/carousel.mjs

@@ -0,0 +1,2 @@
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../interactableDiv/index.mjs";import n from"../actionIcon/actionIcon.mjs";import r from"./carousel.module.mjs";import i,{useEffect as a,useRef as o,useState as s}from"react";import c from"classnames";import{faChevronLeft as ee,faChevronRight as te}from"@fortawesome/free-solid-svg-icons";import{Fragment as ne,jsx as l,jsxs as u}from"react/jsx-runtime";var d=10,re=.2;function f(f){let{children:ie,currentIndex:m,defaultIndex:ae=0,onChange:h=()=>{},loop:oe=!0,autoPlay:g=!1,autoPlayInterval:_=4e3,pauseOnHover:v=!0,showArrows:y=!0,showDots:se=!0,swipeable:ce=!0,className:le,style:ue,classNames:b,styles:x,...de}=e(`Carousel`,f),S=i.Children.toArray(ie),C=S.length,w=oe&&C>1,T=+!!w,E=w?[S[C-1],...S,S[0]]:S,D=m!==void 0,[O,k]=s(()=>p(ae,C,w)),A=p(D?m:O,C,w),[j,M]=s(A+T),[fe,N]=s(!0),P=o(A),[F,I]=s(!1),[L,R]=s(!1),[z,B]=s(!1),[V,H]=s(0),U=o(null);a(()=>{let e=P.current;if(P.current=A,e===A)return;let t=w&&e===C-1&&A===0,n=w&&e===0&&A===C-1;N(!0),M(t?e=>e+1:n?e=>e-1:A+T)},[A]);function W(e){let t=p(e,C,w);D||k(t),h(t)}function G(){!w&&A>=C-1||W(A+1)}function K(){!w&&A<=0||W(A-1)}function pe(e){e.target!==e.currentTarget||!w||(j===0?(N(!1),M(C)):j===E.length-1&&(N(!1),M(1)))}let q=v&&(F||L)||z;a(()=>{if(!g||C<=1||q)return;let e=setInterval(G,_);return()=>clearInterval(e)},[g,_,q,A,C]);let J=o(null);function me(e){!ce||C<=1||(J.current={startX:e.clientX,startY:e.clientY,axisLocked:!1,active:!0},e.currentTarget.setPointerCapture?.(e.pointerId))}function he(e){let t=J.current;if(!t||!t.active)return;let n=e.clientX-t.startX,r=e.clientY-t.startY;if(!t.axisLocked){if(Math.abs(n)<d&&Math.abs(r)<d)return;if(Math.abs(r)>Math.abs(n)){t.active=!1;return}t.axisLocked=!0,B(!0),N(!1)}H(n/(U.current?.getBoundingClientRect().width||1)*100)}function Y(){let e=J.current;if(J.current=null,!e||!e.axisLocked){B(!1);return}let t=Math.abs(V)>=re*100;H(0),N(!0),B(!1),t&&(V<0?G():K())}function X(e){e.key===`ArrowLeft`?(e.preventDefault(),K()):e.key===`ArrowRight`&&(e.preventDefault(),G())}let Z=!w&&A<=0,Q=!w&&A>=C-1,$=E.length>0?100/E.length:100,ge=`translateX(calc(${-j*$}% + ${$/100*V}%))`;return u(`div`,{...de,ref:U,role:`region`,"aria-roledescription":`carousel`,className:c(r.carousel,b?.root,le),style:{...ue,...x?.root},onMouseEnter:v?()=>I(!0):void 0,onMouseLeave:v?()=>I(!1):void 0,onFocus:v?()=>R(!0):void 0,onBlur:v?()=>R(!1):void 0,onKeyDown:X,children:[l(`div`,{className:c(r.carouselTrack,b?.track),style:{width:`${E.length*100}%`,transform:ge,transition:fe?void 0:`none`,...x?.track},onTransitionEnd:pe,onPointerDown:me,onPointerMove:he,onPointerUp:Y,onPointerCancel:Y,children:E.map((e,t)=>{let n=w&&(t===0||t===E.length-1),i=t-T,a=!n&&i===A;return l(`div`,{className:c(r.carouselSlide,b?.slide),style:{width:`${100/E.length}%`,...x?.slide},inert:a?void 0:!0,children:e},`carousel-slide-${t}`)})}),y&&C>1&&u(ne,{children:[l(n,{icon:ee,title:`Previous slide`,"aria-label":`Previous slide`,"aria-disabled":Z||void 0,onClick:()=>!Z&&K(),className:c(r.carouselPrevButton,Z&&r.carouselButtonDisabled,b?.prevButton),style:x?.prevButton}),l(n,{icon:te,title:`Next slide`,"aria-label":`Next slide`,"aria-disabled":Q||void 0,onClick:()=>!Q&&G(),className:c(r.carouselNextButton,Q&&r.carouselButtonDisabled,b?.nextButton),style:x?.nextButton})]}),se&&C>1&&l(`div`,{className:c(r.carouselDots,b?.dots),style:x?.dots,children:S.map((e,n)=>l(t,{"aria-label":`Go to slide ${n+1}`,"aria-current":n===A,onClick:()=>W(n),className:c(r.carouselDot,n===A&&r.carouselDotActive,b?.dot),style:x?.dot},`carousel-dot-${n}`))})]})}function p(e,t,n){return t===0?0:n?(e%t+t)%t:Math.max(0,Math.min(t-1,e))}export{f as default};
+//# sourceMappingURL=carousel.mjs.map

package/dist/esm/common/carousel/carousel.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.mjs","names":[],"sources":["../../../../package/common/carousel/carousel.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport { faChevronLeft, faChevronRight } from '@fortawesome/free-solid-svg-icons';\n\nimport ActionIcon from '../actionIcon';\nimport InteractableDiv from '../interactableDiv';\nimport { useComponentDefaults } from '../configProvider';\nimport type { CarouselProps } from './carousel.types';\n\nimport styles from './carousel.module.pcss';\n\nconst AXIS_LOCK_THRESHOLD = 10;\nconst DRAG_COMMIT_RATIO = 0.2;\n\nfunction Carousel(props: CarouselProps) {\n  const {\n    children,\n    currentIndex,\n    defaultIndex = 0,\n    onChange = () => {},\n    loop = true,\n    autoPlay = false,\n    autoPlayInterval = 4000,\n    pauseOnHover = true,\n    showArrows = true,\n    showDots = true,\n    swipeable = true,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Carousel', props);\n\n  const slides = React.Children.toArray(children);\n  const count = slides.length;\n  const canLoop = loop && count > 1;\n  const offset = canLoop ? 1 : 0;\n  const extendedSlides = canLoop ? [slides[count - 1], ...slides, slides[0]] : slides;\n\n  const isControlled = currentIndex !== undefined;\n  const [internalIndex, setInternalIndex] = useState(() => clampIndex(defaultIndex, count, canLoop));\n  const realIndex = clampIndex(isControlled ? currentIndex! : internalIndex, count, canLoop);\n\n  const [displayIndex, setDisplayIndex] = useState(realIndex + offset);\n  const [transitionEnabled, setTransitionEnabled] = useState(true);\n  const prevRealIndexRef = useRef(realIndex);\n\n  const [hovered, setHovered] = useState(false);\n  const [focused, setFocused] = useState(false);\n  const [dragging, setDragging] = useState(false);\n  const [dragOffsetPercent, setDragOffsetPercent] = useState(0);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const prevReal = prevRealIndexRef.current;\n    prevRealIndexRef.current = realIndex;\n    if (prevReal === realIndex) return;\n\n    const forwardWrap = canLoop && prevReal === count - 1 && realIndex === 0;\n    const backwardWrap = canLoop && prevReal === 0 && realIndex === count - 1;\n\n    setTransitionEnabled(true);\n    if (forwardWrap) {\n      setDisplayIndex((d) => d + 1);\n    } else if (backwardWrap) {\n      setDisplayIndex((d) => d - 1);\n    } else {\n      setDisplayIndex(realIndex + offset);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [realIndex]);\n\n  function goToIndex(nextIndex: number) {\n    const clamped = clampIndex(nextIndex, count, canLoop);\n    if (!isControlled) setInternalIndex(clamped);\n    onChange(clamped);\n  }\n\n  function goNext() {\n    if (!canLoop && realIndex >= count - 1) return;\n    goToIndex(realIndex + 1);\n  }\n\n  function goPrev() {\n    if (!canLoop && realIndex <= 0) return;\n    goToIndex(realIndex - 1);\n  }\n\n  function handleTrackTransitionEnd(event: React.TransitionEvent<HTMLDivElement>) {\n    if (event.target !== event.currentTarget || !canLoop) return;\n    if (displayIndex === 0) {\n      setTransitionEnabled(false);\n      setDisplayIndex(count);\n    } else if (displayIndex === extendedSlides.length - 1) {\n      setTransitionEnabled(false);\n      setDisplayIndex(1);\n    }\n  }\n\n  const isPaused = (pauseOnHover && (hovered || focused)) || dragging;\n  useEffect(() => {\n    if (!autoPlay || count <= 1 || isPaused) return;\n    const timer = setInterval(goNext, autoPlayInterval);\n    return () => clearInterval(timer);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [autoPlay, autoPlayInterval, isPaused, realIndex, count]);\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    axisLocked: boolean;\n    active: boolean;\n  } | null>(null);\n\n  function handlePointerDown(event: React.PointerEvent<HTMLDivElement>) {\n    if (!swipeable || count <= 1) return;\n    dragRef.current = { startX: event.clientX, startY: event.clientY, axisLocked: false, active: true };\n    event.currentTarget.setPointerCapture?.(event.pointerId);\n  }\n\n  function handlePointerMove(event: React.PointerEvent<HTMLDivElement>) {\n    const drag = dragRef.current;\n    if (!drag || !drag.active) return;\n\n    const deltaX = event.clientX - drag.startX;\n    const deltaY = event.clientY - drag.startY;\n\n    if (!drag.axisLocked) {\n      if (Math.abs(deltaX) < AXIS_LOCK_THRESHOLD && Math.abs(deltaY) < AXIS_LOCK_THRESHOLD) return;\n      if (Math.abs(deltaY) > Math.abs(deltaX)) {\n        drag.active = false;\n        return;\n      }\n      drag.axisLocked = true;\n      setDragging(true);\n      setTransitionEnabled(false);\n    }\n\n    const width = containerRef.current?.getBoundingClientRect().width || 1;\n    setDragOffsetPercent((deltaX / width) * 100);\n  }\n\n  function handlePointerUp() {\n    const drag = dragRef.current;\n    dragRef.current = null;\n    if (!drag || !drag.axisLocked) {\n      setDragging(false);\n      return;\n    }\n\n    const committed = Math.abs(dragOffsetPercent) >= DRAG_COMMIT_RATIO * 100;\n    setDragOffsetPercent(0);\n    setTransitionEnabled(true);\n    setDragging(false);\n    if (committed) {\n      if (dragOffsetPercent < 0) goNext();\n      else goPrev();\n    }\n  }\n\n  function handleKeyDown(event: React.KeyboardEvent<HTMLDivElement>) {\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      goPrev();\n    } else if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      goNext();\n    }\n  }\n\n  const isPrevDisabled = !canLoop && realIndex <= 0;\n  const isNextDisabled = !canLoop && realIndex >= count - 1;\n\n  const slideWidthPercent = extendedSlides.length > 0 ? 100 / extendedSlides.length : 100;\n  const trackTransform = `translateX(calc(${-displayIndex * slideWidthPercent}% + ${dragOffsetPercent * (slideWidthPercent / 100)}%))`;\n\n  return (\n    <div\n      {...rest}\n      ref={containerRef}\n      role=\"region\"\n      aria-roledescription=\"carousel\"\n      className={cx(styles.carousel, classNames?.root, className)}\n      style={{ ...style, ...slotStyles?.root }}\n      onMouseEnter={pauseOnHover ? () => setHovered(true) : undefined}\n      onMouseLeave={pauseOnHover ? () => setHovered(false) : undefined}\n      onFocus={pauseOnHover ? () => setFocused(true) : undefined}\n      onBlur={pauseOnHover ? () => setFocused(false) : undefined}\n      onKeyDown={handleKeyDown}\n    >\n      <div\n        className={cx(styles.carouselTrack, classNames?.track)}\n        style={{\n          width: `${extendedSlides.length * 100}%`,\n          transform: trackTransform,\n          transition: transitionEnabled ? undefined : 'none',\n          ...slotStyles?.track,\n        }}\n        onTransitionEnd={handleTrackTransitionEnd}\n        onPointerDown={handlePointerDown}\n        onPointerMove={handlePointerMove}\n        onPointerUp={handlePointerUp}\n        onPointerCancel={handlePointerUp}\n      >\n        {extendedSlides.map((slide, idx) => {\n          const isClonePosition = canLoop && (idx === 0 || idx === extendedSlides.length - 1);\n          const logicalIndex = idx - offset;\n          const isActive = !isClonePosition && logicalIndex === realIndex;\n\n          return (\n            <div\n              key={`carousel-slide-${idx}`}\n              className={cx(styles.carouselSlide, classNames?.slide)}\n              style={{ width: `${100 / extendedSlides.length}%`, ...slotStyles?.slide }}\n              inert={isActive ? undefined : true}\n            >\n              {slide}\n            </div>\n          );\n        })}\n      </div>\n\n      {showArrows && count > 1 && (\n        <>\n          <ActionIcon\n            icon={faChevronLeft}\n            title=\"Previous slide\"\n            aria-label=\"Previous slide\"\n            aria-disabled={isPrevDisabled || undefined}\n            onClick={() => !isPrevDisabled && goPrev()}\n            className={cx(styles.carouselPrevButton, isPrevDisabled && styles.carouselButtonDisabled, classNames?.prevButton)}\n            style={slotStyles?.prevButton}\n          />\n          <ActionIcon\n            icon={faChevronRight}\n            title=\"Next slide\"\n            aria-label=\"Next slide\"\n            aria-disabled={isNextDisabled || undefined}\n            onClick={() => !isNextDisabled && goNext()}\n            className={cx(styles.carouselNextButton, isNextDisabled && styles.carouselButtonDisabled, classNames?.nextButton)}\n            style={slotStyles?.nextButton}\n          />\n        </>\n      )}\n\n      {showDots && count > 1 && (\n        <div className={cx(styles.carouselDots, classNames?.dots)} style={slotStyles?.dots}>\n          {slides.map((_, index) => (\n            <InteractableDiv\n              key={`carousel-dot-${index}`}\n              aria-label={`Go to slide ${index + 1}`}\n              aria-current={index === realIndex}\n              onClick={() => goToIndex(index)}\n              className={cx(styles.carouselDot, index === realIndex && styles.carouselDotActive, classNames?.dot)}\n              style={slotStyles?.dot}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction clampIndex(index: number, count: number, canLoop: boolean): number {\n  if (count === 0) return 0;\n  if (canLoop) return ((index % count) + count) % count;\n  return Math.max(0, Math.min(count - 1, index));\n}\n\nexport default Carousel;\n"],"mappings":"icAWA,IAAM,EAAsB,GACtB,GAAoB,GAE1B,SAAS,EAAS,EAAsB,CACtC,GAAM,CACJ,YACA,eACA,gBAAe,EACf,eAAiB,CAAC,EAClB,QAAO,GACP,WAAW,GACX,mBAAmB,IACnB,eAAe,GACf,aAAa,GACb,YAAW,GACX,aAAY,GACZ,aACA,SACA,aACA,OAAQ,EACR,GAAG,IACD,EAAqB,WAAY,CAAK,EAEpC,EAAS,EAAM,SAAS,QAAQ,EAAQ,EACxC,EAAQ,EAAO,OACf,EAAU,IAAQ,EAAQ,EAC1B,EAAS,KACT,EAAiB,EAAU,CAAC,EAAO,EAAQ,GAAI,GAAG,EAAQ,EAAO,EAAE,EAAI,EAEvE,EAAe,IAAiB,IAAA,GAChC,CAAC,EAAe,GAAoB,MAAe,EAAW,GAAc,EAAO,CAAO,CAAC,EAC3F,EAAY,EAAW,EAAe,EAAgB,EAAe,EAAO,CAAO,EAEnF,CAAC,EAAc,GAAmB,EAAS,EAAY,CAAM,EAC7D,CAAC,GAAmB,GAAwB,EAAS,EAAI,EACzD,EAAmB,EAAO,CAAS,EAEnC,CAAC,EAAS,GAAc,EAAS,EAAK,EACtC,CAAC,EAAS,GAAc,EAAS,EAAK,EACtC,CAAC,EAAU,GAAe,EAAS,EAAK,EACxC,CAAC,EAAmB,GAAwB,EAAS,CAAC,EAEtD,EAAe,EAAuB,IAAI,EAEhD,MAAgB,CACd,IAAM,EAAW,EAAiB,QAElC,GADA,EAAiB,QAAU,EACvB,IAAa,EAAW,OAE5B,IAAM,EAAc,GAAW,IAAa,EAAQ,GAAK,IAAc,EACjE,EAAe,GAAW,IAAa,GAAK,IAAc,EAAQ,EAExE,EAAqB,EAAI,EAEvB,EADE,EACe,GAAM,EAAI,EAClB,EACQ,GAAM,EAAI,EAEX,EAAY,CAAM,CAGtC,EAAG,CAAC,CAAS,CAAC,EAEd,SAAS,EAAU,EAAmB,CACpC,IAAM,EAAU,EAAW,EAAW,EAAO,CAAO,EAC/C,GAAc,EAAiB,CAAO,EAC3C,EAAS,CAAO,CAClB,CAEA,SAAS,GAAS,CACZ,CAAC,GAAW,GAAa,EAAQ,GACrC,EAAU,EAAY,CAAC,CACzB,CAEA,SAAS,GAAS,CACZ,CAAC,GAAW,GAAa,GAC7B,EAAU,EAAY,CAAC,CACzB,CAEA,SAAS,GAAyB,EAA8C,CAC1E,EAAM,SAAW,EAAM,eAAiB,CAAC,IACzC,IAAiB,GACnB,EAAqB,EAAK,EAC1B,EAAgB,CAAK,GACZ,IAAiB,EAAe,OAAS,IAClD,EAAqB,EAAK,EAC1B,EAAgB,CAAC,GAErB,CAEA,IAAM,EAAY,IAAiB,GAAW,IAAa,EAC3D,MAAgB,CACd,GAAI,CAAC,GAAY,GAAS,GAAK,EAAU,OACzC,IAAM,EAAQ,YAAY,EAAQ,CAAgB,EAClD,UAAa,cAAc,CAAK,CAElC,EAAG,CAAC,EAAU,EAAkB,EAAU,EAAW,CAAK,CAAC,EAE3D,IAAM,EAAU,EAKN,IAAI,EAEd,SAAS,GAAkB,EAA2C,CAChE,CAAC,IAAa,GAAS,IAC3B,EAAQ,QAAU,CAAE,OAAQ,EAAM,QAAS,OAAQ,EAAM,QAAS,WAAY,GAAO,OAAQ,EAAK,EAClG,EAAM,cAAc,oBAAoB,EAAM,SAAS,EACzD,CAEA,SAAS,GAAkB,EAA2C,CACpE,IAAM,EAAO,EAAQ,QACrB,GAAI,CAAC,GAAQ,CAAC,EAAK,OAAQ,OAE3B,IAAM,EAAS,EAAM,QAAU,EAAK,OAC9B,EAAS,EAAM,QAAU,EAAK,OAEpC,GAAI,CAAC,EAAK,WAAY,CACpB,GAAI,KAAK,IAAI,CAAM,EAAI,GAAuB,KAAK,IAAI,CAAM,EAAI,EAAqB,OACtF,GAAI,KAAK,IAAI,CAAM,EAAI,KAAK,IAAI,CAAM,EAAG,CACvC,EAAK,OAAS,GACd,MACF,CACA,EAAK,WAAa,GAClB,EAAY,EAAI,EAChB,EAAqB,EAAK,CAC5B,CAGA,EAAsB,GADR,EAAa,SAAS,sBAAsB,EAAE,OAAS,GAC7B,GAAG,CAC7C,CAEA,SAAS,GAAkB,CACzB,IAAM,EAAO,EAAQ,QAErB,GADA,EAAQ,QAAU,KACd,CAAC,GAAQ,CAAC,EAAK,WAAY,CAC7B,EAAY,EAAK,EACjB,MACF,CAEA,IAAM,EAAY,KAAK,IAAI,CAAiB,GAAK,GAAoB,IACrE,EAAqB,CAAC,EACtB,EAAqB,EAAI,EACzB,EAAY,EAAK,EACb,IACE,EAAoB,EAAG,EAAO,EAC7B,EAAO,EAEhB,CAEA,SAAS,EAAc,EAA4C,CAC7D,EAAM,MAAQ,aAChB,EAAM,eAAe,EACrB,EAAO,GACE,EAAM,MAAQ,eACvB,EAAM,eAAe,EACrB,EAAO,EAEX,CAEA,IAAM,EAAiB,CAAC,GAAW,GAAa,EAC1C,EAAiB,CAAC,GAAW,GAAa,EAAQ,EAElD,EAAoB,EAAe,OAAS,EAAI,IAAM,EAAe,OAAS,IAC9E,GAAiB,mBAAmB,CAAC,EAAe,EAAkB,MAA2B,EAAoB,IAAzC,EAA8C,KAEhI,OACE,EAAC,MAAD,CACE,GAAI,GACJ,IAAK,EACL,KAAK,SACL,uBAAqB,WACrB,UAAW,EAAG,EAAO,SAAU,GAAY,KAAM,EAAS,EAC1D,MAAO,CAAE,GAAG,GAAO,GAAG,GAAY,IAAK,EACvC,aAAc,MAAqB,EAAW,EAAI,EAAI,IAAA,GACtD,aAAc,MAAqB,EAAW,EAAK,EAAI,IAAA,GACvD,QAAS,MAAqB,EAAW,EAAI,EAAI,IAAA,GACjD,OAAQ,MAAqB,EAAW,EAAK,EAAI,IAAA,GACjD,UAAW,WAXb,CAaE,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,cAAe,GAAY,KAAK,EACrD,MAAO,CACL,MAAO,GAAG,EAAe,OAAS,IAAI,GACtC,UAAW,GACX,WAAY,GAAoB,IAAA,GAAY,OAC5C,GAAG,GAAY,KACjB,EACA,gBAAiB,GACjB,cAAe,GACf,cAAe,GACf,YAAa,EACb,gBAAiB,WAEhB,EAAe,KAAK,EAAO,IAAQ,CAClC,IAAM,EAAkB,IAAY,IAAQ,GAAK,IAAQ,EAAe,OAAS,GAC3E,EAAe,EAAM,EACrB,EAAW,CAAC,GAAmB,IAAiB,EAEtD,OACE,EAAC,MAAD,CAEE,UAAW,EAAG,EAAO,cAAe,GAAY,KAAK,EACrD,MAAO,CAAE,MAAO,GAAG,IAAM,EAAe,OAAO,GAAI,GAAG,GAAY,KAAM,EACxE,MAAO,EAAW,IAAA,GAAY,YAE7B,CACE,EANE,kBAAkB,GAMpB,CAET,CAAC,CACE,CAAA,EAEJ,GAAc,EAAQ,GACrB,EAAA,GAAA,CAAA,SAAA,CACE,EAAC,EAAD,CACE,KAAM,GACN,MAAM,iBACN,aAAW,iBACX,gBAAe,GAAkB,IAAA,GACjC,YAAe,CAAC,GAAkB,EAAO,EACzC,UAAW,EAAG,EAAO,mBAAoB,GAAkB,EAAO,uBAAwB,GAAY,UAAU,EAChH,MAAO,GAAY,UACpB,CAAA,EACD,EAAC,EAAD,CACE,KAAM,GACN,MAAM,aACN,aAAW,aACX,gBAAe,GAAkB,IAAA,GACjC,YAAe,CAAC,GAAkB,EAAO,EACzC,UAAW,EAAG,EAAO,mBAAoB,GAAkB,EAAO,uBAAwB,GAAY,UAAU,EAChH,MAAO,GAAY,UACpB,CAAA,CACD,CAAA,CAAA,EAGH,IAAY,EAAQ,GACnB,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,aAAc,GAAY,IAAI,EAAG,MAAO,GAAY,cAC3E,EAAO,KAAK,EAAG,IACd,EAAC,EAAD,CAEE,aAAY,eAAe,EAAQ,IACnC,eAAc,IAAU,EACxB,YAAe,EAAU,CAAK,EAC9B,UAAW,EAAG,EAAO,YAAa,IAAU,GAAa,EAAO,kBAAmB,GAAY,GAAG,EAClG,MAAO,GAAY,GACpB,EANM,gBAAgB,GAMtB,CACF,CACE,CAAA,CAEJ,GAET,CAEA,SAAS,EAAW,EAAe,EAAe,EAA0B,CAG1E,OAFI,IAAU,EAAU,EACpB,GAAkB,EAAQ,EAAS,GAAS,EACzC,KAAK,IAAI,EAAG,KAAK,IAAI,EAAQ,EAAG,CAAK,CAAC,CAC/C"}

package/dist/esm/common/carousel/carousel.module.mjs

@@ -0,0 +1,2 @@
+var e={carousel:`carousel_-oOBA`,"carousel-track":`carousel-track_tmtQz`,carouselTrack:`carousel-track_tmtQz`,"carousel-slide":`carousel-slide_Qpgjn`,carouselSlide:`carousel-slide_Qpgjn`,"carousel-prevButton":`carousel-prevButton_P9QsH`,carouselPrevButton:`carousel-prevButton_P9QsH`,"carousel-nextButton":`carousel-nextButton_FgVo7`,carouselNextButton:`carousel-nextButton_FgVo7`,"carousel-buttonDisabled":`carousel-buttonDisabled_rGyW-`,carouselButtonDisabled:`carousel-buttonDisabled_rGyW-`,"carousel-dots":`carousel-dots_xyfSx`,carouselDots:`carousel-dots_xyfSx`,"carousel-dot":`carousel-dot_kPnww`,carouselDot:`carousel-dot_kPnww`,"carousel-dot-active":`carousel-dot-active_f9EJ1`,carouselDotActive:`carousel-dot-active_f9EJ1`};export{e as default};
+//# sourceMappingURL=carousel.module.mjs.map

package/dist/esm/common/carousel/carousel.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.module.mjs","names":[],"sources":["../../../../package/common/carousel/carousel.module.pcss"],"sourcesContent":[".carousel {\n  position: relative;\n  overflow: hidden;\n  border-radius: var(--default-border-radius);\n\n  &-track {\n    display: flex;\n    align-items: stretch;\n    transition: transform 0.4s ease;\n    touch-action: pan-y;\n    user-select: none;\n  }\n\n  &-slide {\n    flex-shrink: 0;\n    box-sizing: border-box;\n  }\n\n  &-prevButton,\n  &-nextButton {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    z-index: 1;\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    background: var(--background-accent);\n    color: var(--text-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    transition: opacity 0.15s, background 0.15s;\n\n    &:hover {\n      background: var(--background-accent-light);\n    }\n  }\n\n  &-buttonDisabled {\n    opacity: 0.35;\n    pointer-events: none;\n  }\n\n  &-prevButton {\n    left: 12px;\n  }\n\n  &-nextButton {\n    right: 12px;\n  }\n\n  &-dots {\n    position: absolute;\n    bottom: 12px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 1;\n    display: flex;\n    gap: 8px;\n  }\n\n  &-dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 2000px;\n    background: var(--background-accent);\n    opacity: 0.6;\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    transition: opacity 0.15s, background 0.15s, width 0.15s;\n\n    &:hover {\n      opacity: 0.85;\n    }\n\n    &-active {\n      background: var(--primary-color);\n      opacity: 1;\n      width: 20px;\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/checkbox/checkbox.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.module.mjs","names":[],"sources":["../../../../package/common/checkbox/checkbox.module.pcss"],"sourcesContent":["\n.checkbox {\n  user-select: none;\n  display: flex;\n  align-items: center;\n  column-gap: 10px;\n  margin: -1px;\n  border: 1px solid transparent;\n  width: fit-content;\n\n  &-icon {\n    color: #a3a9b9;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 6px;\n    background-color: var(--light-background-color);\n    width: fit-content;\n    height: fit-content;\n    /* width: 16px;\n        height: 16px; */\n  }\n\n  &-loading {\n    background: transparent;\n\n    &-spinner {\n      width: 100%;\n      height: 100%;\n    }\n  }\n\n  &-pointer {\n    cursor: pointer;\n  }\n\n  &:focus-visible {\n    outline: none;\n    border: 1px solid var(--primary-color);\n    border-radius: 6px;\n  }\n\n  &-disabled {\n    filter: brightness(0.8);\n    cursor: not-allowed;\n  }\n\n  &-checkmark {\n    border: 1.8px solid var(--text-color);\n    border-radius: var(--default-border-radius);\n    position: relative;\n\n    svg {\n      stroke: var(--text-on-primary);\n      stroke-dasharray: 5;\n      stroke-dashoffset: 5;\n      transition:\n        transform 0.1s,\n        stroke-dashoffset 0.4s;\n      transition-delay: 0s, 0.2s;\n      background: var(--primary-color);\n      transform: scale(0);\n      box-sizing: content-box;\n      padding: 2px;\n      border-radius: var(--default-border-radius);\n    }\n\n    &-checked {\n      svg {\n        stroke-dashoffset: 0;\n        transform: scale(1) translate(-3px, -3px);\n      }\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"checkbox.module.mjs","names":[],"sources":["../../../../package/common/checkbox/checkbox.module.pcss"],"sourcesContent":["\n.checkbox {\n  user-select: none;\n  display: flex;\n  align-items: center;\n  column-gap: 10px;\n  margin: -1px;\n  border: 1px solid transparent;\n  width: fit-content;\n\n  &-icon {\n    color: #a3a9b9;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 6px;\n    background-color: var(--light-background-color);\n    width: fit-content;\n    height: fit-content;\n    /* width: 16px;\n        height: 16px; */\n  }\n\n  &-loading {\n    background: transparent;\n\n    &-spinner {\n      width: 100%;\n      height: 100%;\n    }\n  }\n\n  &-pointer {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &:focus-visible {\n    outline: none;\n    border: 1px solid var(--primary-color);\n    border-radius: 6px;\n  }\n\n  &-disabled {\n    filter: brightness(0.8);\n    cursor: not-allowed;\n  }\n\n  &-checkmark {\n    border: 1.8px solid var(--text-color);\n    border-radius: var(--default-border-radius);\n    position: relative;\n\n    svg {\n      stroke: var(--text-on-primary);\n      stroke-dasharray: 5;\n      stroke-dashoffset: 5;\n      transition:\n        transform 0.1s,\n        stroke-dashoffset 0.4s;\n      transition-delay: 0s, 0.2s;\n      background: var(--primary-color);\n      transform: scale(0);\n      box-sizing: content-box;\n      padding: 2px;\n      border-radius: var(--default-border-radius);\n    }\n\n    &-checked {\n      svg {\n        stroke-dashoffset: 0;\n        transform: scale(1) translate(-3px, -3px);\n      }\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/chip/chip.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"chip.module.mjs","names":[],"sources":["../../../../package/common/chip/chip.module.pcss"],"sourcesContent":[".chip {\n  background: rgba(0, 0, 0, 0.08);\n  border-radius: 99999px;\n  width: fit-content;\n  position: relative;\n  box-sizing: border-box;\n  max-width: 100%;\n\n  &-clickable {\n    cursor: pointer;\n  }\n\n  &-style {\n    &-default {\n      background: rgba(0, 0, 0, 0.08);\n      color: var(--text-color);\n    }\n\n    &-primary {\n      background: var(--primary-color);\n      color: var(--text-on-primary);\n    }\n\n    &-info {\n      background: var(--info-lighter);\n      color: var(--info-color);\n    }\n\n    &-warn {\n      background: var(--warn-lighter);\n      color: var(--warn-color);\n    }\n\n    &-error {\n      background: var(--error-lighter);\n      color: var(--error-color);\n    }\n  }\n\n  &-inner {\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    padding: 4px 8px;\n\n    & > * {\n      white-space: nowrap;\n    }\n  }\n\n  &-text {\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n\n  &-thumbnail {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 18px;\n    height: 18px;\n    background: rgba(0, 0, 0, 0.08);\n    border-radius: 18px;\n    overflow: hidden;\n    background-size: cover;\n  }\n\n  &-container {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n\n    &-inline {\n      flex-wrap: nowrap;\n      overflow: auto;\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"chip.module.mjs","names":[],"sources":["../../../../package/common/chip/chip.module.pcss"],"sourcesContent":[".chip {\n  background: rgba(0, 0, 0, 0.08);\n  border-radius: 99999px;\n  width: fit-content;\n  position: relative;\n  box-sizing: border-box;\n  max-width: 100%;\n\n  &-clickable {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &-style {\n    &-default {\n      background: rgba(0, 0, 0, 0.08);\n      color: var(--text-color);\n    }\n\n    &-primary {\n      background: var(--primary-color);\n      color: var(--text-on-primary);\n    }\n\n    &-info {\n      background: var(--info-lighter);\n      color: var(--info-color);\n    }\n\n    &-warn {\n      background: var(--warn-lighter);\n      color: var(--warn-color);\n    }\n\n    &-error {\n      background: var(--error-lighter);\n      color: var(--error-color);\n    }\n  }\n\n  &-inner {\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    padding: 4px 8px;\n\n    & > * {\n      white-space: nowrap;\n    }\n  }\n\n  &-text {\n    text-overflow: ellipsis;\n    overflow: hidden;\n  }\n\n  &-thumbnail {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 18px;\n    height: 18px;\n    background: rgba(0, 0, 0, 0.08);\n    border-radius: 18px;\n    overflow: hidden;\n    background-size: cover;\n  }\n\n  &-container {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n\n    &-inline {\n      flex-wrap: nowrap;\n      overflow: auto;\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/colorPicker/colorPicker.mjs

@@ -1,2 +1,2 @@
-import e from"../interactableDiv/index.mjs";import{Align as t}from"../floatingMenu/floatingMenu.types.mjs";import n from"../floatingMenu/floatingMenu.mjs";import r from"../input/input.mjs";import i from"./colorPicker.module.mjs";import{useEffect as a,useRef as o,useState as s}from"react";import c from"classnames";import{jsx as l,jsxs as u}from"react/jsx-runtime";function d(e){return/^#[0-9a-fA-F]{6}$/.test(e)||/^#[0-9a-fA-F]{8}$/.test(e)}function f(e){return/^#[0-9a-fA-F]{8}$/.test(e)?{hex6:e.slice(0,7),alpha:Math.round(parseInt(e.slice(7,9),16)/255*100)}:{hex6:e.slice(0,7),alpha:100}}function p(e,t,n){return!n||t>=100?e:`${e}${Math.round(t/100*255).toString(16).padStart(2,`0`)}`}function m(e,t){return`rgba(${parseInt(e.slice(1,3),16)}, ${parseInt(e.slice(3,5),16)}, ${parseInt(e.slice(5,7),16)}, ${t/100})`}function h(e){let t=parseInt(e.slice(1,3),16)/255,n=parseInt(e.slice(3,5),16)/255,r=parseInt(e.slice(5,7),16)/255,i=Math.max(t,n,r),a=i-Math.min(t,n,r),o=0;a!==0&&(o=i===t?(n-r)/a%6:i===n?(r-t)/a+2:(t-n)/a+4,o=Math.round(o*60),o<0&&(o+=360));let s=i===0?0:Math.round(a/i*100),c=Math.round(i*100);return{h:o,s,v:c}}function g(e,t,n){let r=t/100,i=n/100,a=i*r,o=a*(1-Math.abs(e/60%2-1)),s=i-a,c=0,l=0,u=0;e<60?(c=a,l=o,u=0):e<120?(c=o,l=a,u=0):e<180?(c=0,l=a,u=o):e<240?(c=0,l=o,u=a):e<300?(c=o,l=0,u=a):(c=a,l=0,u=o);let d=e=>Math.round((e+s)*255).toString(16).padStart(2,`0`);return`#${d(c)}${d(l)}${d(u)}`}function _({hex:e,onChange:t,useInputComponent:n=!1}){let[o,c]=s(e);a(()=>{c(e)},[e]);function u(e){c(e);let n=e.startsWith(`#`)?e:`#${e}`;d(n)&&t(n)}function f(){d(o.startsWith(`#`)?o:`#${o}`)||c(e)}return n?l(r,{value:o,onChange:e=>u(e),onBlur:f}):l(`input`,{type:`text`,value:o,onChange:e=>u(e.target.value),onBlur:f,className:i.hexInput,spellCheck:!1})}function v({hue:e,sat:t,val:n,alpha:r,onHueChange:a,onSVChange:s,onAlphaChange:c,showInput:d=!0,showAlpha:m=!1}){let v=o(null);function y(e){let t=v.current.getBoundingClientRect(),n=Math.max(0,Math.min(1,(e.clientX-t.left)/t.width)),r=Math.max(0,Math.min(1,(e.clientY-t.top)/t.height));return{s:n*100,v:(1-r)*100}}function b(e){let{s:t,v:n}=y(e.nativeEvent);s(t,n);let r=e=>{let{s:t,v:n}=y(e);s(t,n)},i=()=>{window.removeEventListener(`mousemove`,r),window.removeEventListener(`mouseup`,i)};window.addEventListener(`mousemove`,r),window.addEventListener(`mouseup`,i)}function x(e){let{hex6:t,alpha:n}=f(e),{h:r,s:i,v:o}=h(t);a(r),s(i,o),m&&c(n)}let S=g(e,t,n),C=m?p(S,r,!0):S;return u(`div`,{className:i.panel,children:[u(`div`,{ref:v,className:i.gradientArea,style:{"--hue":e},onMouseDown:b,children:[l(`div`,{className:i.gradientOverlay}),l(`div`,{className:i.cursor,style:{left:`${t}%`,top:`${100-n}%`}})]}),l(`input`,{type:`range`,min:0,max:359,value:e,onChange:e=>a(Number(e.target.value)),className:i.hueSlider}),m&&l(`input`,{type:`range`,min:0,max:100,value:r,onChange:e=>c(Number(e.target.value)),className:i.alphaSlider,style:{"--alpha-color":S}}),d&&l(_,{hex:C,onChange:x})]})}var y=`#3b82f6`;function b({className:r,value:a=y,onChange:b,showInput:x=!1,showAlpha:S=!1,inline:C=!1,...w}){let[T,E]=s(!1),{hex6:D,alpha:O}=f(d(a)?a:y),k=h(D),[A,j]=s({h:k.h,s:k.s,v:k.v,a:O}),M=o(A),[N,P]=s(a);if(a!==N){P(a);let{hex6:e,alpha:t}=f(d(a)?a:y);if(e!==g(A.h,A.s,A.v)||t!==A.a){let n=h(e);j({h:n.h,s:n.s,v:n.v,a:t})}}let{h:F,s:I,v:L,a:R}=A;function z(e,t,n,r){b?.(p(g(e,t,n),r,S))}function B(e){M.current.h=e,j(t=>({...t,h:e})),z(e,M.current.s,M.current.v,M.current.a)}function V(e,t){M.current.s=e,M.current.v=t,j(n=>({...n,s:e,v:t})),z(M.current.h,e,t,M.current.a)}function H(e){M.current.a=e,j(t=>({...t,a:e})),z(M.current.h,M.current.s,M.current.v,e)}let U=g(F,I,L),W=S?m(U,R):U,G=p(U,R,S),K={hue:F,sat:I,val:L,alpha:R,onHueChange:B,onSVChange:V,onAlphaChange:H,showAlpha:S};return C?l(`div`,{...w,className:c(i.colorPicker,r),children:l(v,{...K,showInput:x})}):u(`div`,{...w,className:c(i.colorPicker,r),children:[l(n,{isOpen:T,onOpenChange:E,dontCloseOnChildClick:!0,align:t.Left,content:l(v,{...K}),children:u(e,{className:i.swatch,children:[l(`div`,{className:i.swatchFill,style:{background:W}}),l(`span`,{className:i.swatchHex,children:G})]})}),x&&l(_,{hex:G,onChange:e=>b?.(e),useInputComponent:!0})]})}export{b as default};
+import e from"../interactableDiv/index.mjs";import{Align as t}from"../floatingMenu/floatingMenu.types.mjs";import n from"../floatingMenu/floatingMenu.mjs";import r from"../input/input.mjs";import i from"./colorPicker.module.mjs";import{useRef as a,useState as o}from"react";import s from"classnames";import{FontAwesomeIcon as c}from"@fortawesome/react-fontawesome";import{faEyeDropper as l}from"@fortawesome/free-solid-svg-icons";import{jsx as u,jsxs as d}from"react/jsx-runtime";var f=typeof window<`u`&&`EyeDropper`in window;async function p(){let e=window.EyeDropper;if(!e)return null;try{return(await new e().open()).sRGBHex}catch{return null}}function m(e){return/^#[0-9a-fA-F]{6}$/.test(e)||/^#[0-9a-fA-F]{8}$/.test(e)}function h(e){return/^#[0-9a-fA-F]{8}$/.test(e)?{hex6:e.slice(0,7),alpha:Math.round(parseInt(e.slice(7,9),16)/255*100)}:{hex6:e.slice(0,7),alpha:100}}function g(e,t,n){return!n||t>=100?e:`${e}${Math.round(t/100*255).toString(16).padStart(2,`0`)}`}function _(e,t){return`rgba(${parseInt(e.slice(1,3),16)}, ${parseInt(e.slice(3,5),16)}, ${parseInt(e.slice(5,7),16)}, ${t/100})`}function v(e){let t=parseInt(e.slice(1,3),16)/255,n=parseInt(e.slice(3,5),16)/255,r=parseInt(e.slice(5,7),16)/255,i=Math.max(t,n,r),a=i-Math.min(t,n,r),o=0;a!==0&&(o=i===t?(n-r)/a%6:i===n?(r-t)/a+2:(t-n)/a+4,o=Math.round(o*60),o<0&&(o+=360));let s=i===0?0:Math.round(a/i*100),c=Math.round(i*100);return{h:o,s,v:c}}function y(e,t,n){let r=t/100,i=n/100,a=i*r,o=a*(1-Math.abs(e/60%2-1)),s=i-a,c=0,l=0,u=0;e<60?(c=a,l=o,u=0):e<120?(c=o,l=a,u=0):e<180?(c=0,l=a,u=o):e<240?(c=0,l=o,u=a):e<300?(c=o,l=0,u=a):(c=a,l=0,u=o);let d=e=>Math.round((e+s)*255).toString(16).padStart(2,`0`);return`#${d(c)}${d(l)}${d(u)}`}function b({hex:e,onChange:t,useInputComponent:n=!1}){let[a,s]=o(e),[c,l]=o(e);e!==c&&(l(e),s(e));function d(e){s(e);let n=e.startsWith(`#`)?e:`#${e}`;m(n)&&t(n)}function f(){m(a.startsWith(`#`)?a:`#${a}`)||s(e)}return n?u(r,{value:a,onChange:e=>d(e),onBlur:f}):u(`input`,{type:`text`,value:a,onChange:e=>d(e.target.value),onBlur:f,className:i.hexInput,spellCheck:!1})}function x({hue:e,sat:t,val:n,alpha:r,onHueChange:o,onSVChange:s,onAlphaChange:m,showInput:_=!0,showAlpha:x=!1}){let S=a(null);function C(e){let t=S.current.getBoundingClientRect(),n=Math.max(0,Math.min(1,(e.clientX-t.left)/t.width)),r=Math.max(0,Math.min(1,(e.clientY-t.top)/t.height));return{s:n*100,v:(1-r)*100}}function w(e){e.currentTarget.setPointerCapture(e.pointerId);let{s:t,v:n}=C(e);s(t,n);let r=e=>{let{s:t,v:n}=C(e);s(t,n)},i=()=>{window.removeEventListener(`pointermove`,r),window.removeEventListener(`pointerup`,i)};window.addEventListener(`pointermove`,r),window.addEventListener(`pointerup`,i)}function T(e){let{hex6:t,alpha:n}=h(e),{h:r,s:i,v:a}=v(t);o(r),s(i,a),x&&m(n)}let E=y(e,t,n),D=x?g(E,r,!0):E;return d(`div`,{className:i.panel,children:[d(`div`,{ref:S,className:i.gradientArea,style:{"--hue":e},onPointerDown:w,children:[u(`div`,{className:i.gradientOverlay}),u(`div`,{className:i.cursor,style:{left:`${t}%`,top:`${100-n}%`}})]}),u(`input`,{type:`range`,min:0,max:359,value:e,onChange:e=>o(Number(e.target.value)),className:i.hueSlider}),x&&u(`input`,{type:`range`,min:0,max:100,value:r,onChange:e=>m(Number(e.target.value)),className:i.alphaSlider,style:{"--alpha-color":E}}),(_||f)&&d(`div`,{className:i.hexRow,children:[_&&u(b,{hex:D,onChange:T}),f&&u(`button`,{type:`button`,className:i.eyeDropperButton,onClick:async()=>{let e=await p();e&&T(e)},"aria-label":`Pick color from screen`,children:u(c,{icon:l})})]})]})}var S=`#3b82f6`;function C({className:r,value:c=S,onChange:l,showInput:f=!1,showAlpha:p=!1,inline:C=!1,...w}){let[T,E]=o(!1),{hex6:D,alpha:O}=h(m(c)?c:S),k=v(D),[A,j]=o({h:k.h,s:k.s,v:k.v,a:O}),M=a(A),[N,P]=o(c);if(c!==N){P(c);let{hex6:e,alpha:t}=h(m(c)?c:S);if(e!==y(A.h,A.s,A.v)||t!==A.a){let n=v(e);j({h:n.h,s:n.s,v:n.v,a:t})}}let{h:F,s:I,v:L,a:R}=A;function z(e,t,n,r){l?.(g(y(e,t,n),r,p))}function B(e){M.current.h=e,j(t=>({...t,h:e})),z(e,M.current.s,M.current.v,M.current.a)}function V(e,t){M.current.s=e,M.current.v=t,j(n=>({...n,s:e,v:t})),z(M.current.h,e,t,M.current.a)}function H(e){M.current.a=e,j(t=>({...t,a:e})),z(M.current.h,M.current.s,M.current.v,e)}let U=y(F,I,L),W=p?_(U,R):U,G=g(U,R,p),K={hue:F,sat:I,val:L,alpha:R,onHueChange:B,onSVChange:V,onAlphaChange:H,showAlpha:p};return C?u(`div`,{...w,className:s(i.colorPicker,r),children:u(x,{...K,showInput:f})}):d(`div`,{...w,className:s(i.colorPicker,r),children:[u(n,{isOpen:T,onOpenChange:E,dontCloseOnChildClick:!0,align:t.Left,content:u(x,{...K}),children:d(e,{className:i.swatch,children:[u(`div`,{className:i.swatchFill,style:{background:W}}),u(`span`,{className:i.swatchHex,children:G})]})}),f&&u(b,{hex:G,onChange:e=>l?.(e),useInputComponent:!0})]})}export{C as default};
 //# sourceMappingURL=colorPicker.mjs.map

package/dist/esm/common/colorPicker/colorPicker.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"colorPicker.mjs","names":[],"sources":["../../../../package/common/colorPicker/colorPicker.tsx"],"sourcesContent":["import { useState, useRef, useEffect, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport InteractableDiv from 'components/common/interactableDiv';\nimport FloatingMenu from 'components/common/floatingMenu';\nimport Input from 'components/common/input';\nimport { Align } from 'components/common/floatingMenu/floatingMenu.types';\nimport type { ColorPickerProps } from './colorPicker.types';\n\nimport styles from './colorPicker.module.pcss';\n\n// ── Color utilities ──────────────────────────────────────────────────────────\n\nfunction isValidHex(s: string): boolean {\n  return /^#[0-9a-fA-F]{6}$/.test(s) || /^#[0-9a-fA-F]{8}$/.test(s);\n}\n\n/** Split any valid hex into its 6-digit base and 0-100 alpha. */\nfunction parseHex(hex: string): { hex6: string; alpha: number } {\n  if (/^#[0-9a-fA-F]{8}$/.test(hex)) {\n    return {\n      hex6: hex.slice(0, 7),\n      alpha: Math.round((parseInt(hex.slice(7, 9), 16) / 255) * 100),\n    };\n  }\n  return { hex6: hex.slice(0, 7), alpha: 100 };\n}\n\n/** Combine a 6-digit hex + 0-100 alpha into the right output format.\n *  Full opacity (alpha === 100) is omitted — 6-digit hex implies opaque. */\nfunction buildValue(hex6: string, alpha: number, showAlpha: boolean): string {\n  if (!showAlpha || alpha >= 100) return hex6;\n  const a = Math.round((alpha / 100) * 255).toString(16).padStart(2, '0');\n  return `${hex6}${a}`;\n}\n\nfunction hexToRgba(hex6: string, alpha: number): string {\n  const r = parseInt(hex6.slice(1, 3), 16);\n  const g = parseInt(hex6.slice(3, 5), 16);\n  const b = parseInt(hex6.slice(5, 7), 16);\n  return `rgba(${r}, ${g}, ${b}, ${alpha / 100})`;\n}\n\nfunction hexToHsv(hex6: string): { h: number; s: number; v: number } {\n  const r = parseInt(hex6.slice(1, 3), 16) / 255;\n  const g = parseInt(hex6.slice(3, 5), 16) / 255;\n  const b = parseInt(hex6.slice(5, 7), 16) / 255;\n\n  const max = Math.max(r, g, b);\n  const min = Math.min(r, g, b);\n  const delta = max - min;\n\n  let h = 0;\n  if (delta !== 0) {\n    if (max === r) h = ((g - b) / delta) % 6;\n    else if (max === g) h = (b - r) / delta + 2;\n    else h = (r - g) / delta + 4;\n    h = Math.round(h * 60);\n    if (h < 0) h += 360;\n  }\n\n  const s = max === 0 ? 0 : Math.round((delta / max) * 100);\n  const v = Math.round(max * 100);\n\n  return { h, s, v };\n}\n\nfunction hsvToHex(h: number, s: number, v: number): string {\n  const sv = s / 100;\n  const vv = v / 100;\n  const c = vv * sv;\n  const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n  const m = vv - c;\n\n  let r = 0, g = 0, b = 0;\n  if (h < 60)       { r = c; g = x; b = 0; }\n  else if (h < 120) { r = x; g = c; b = 0; }\n  else if (h < 180) { r = 0; g = c; b = x; }\n  else if (h < 240) { r = 0; g = x; b = c; }\n  else if (h < 300) { r = x; g = 0; b = c; }\n  else              { r = c; g = 0; b = x; }\n\n  const toHex = (n: number) => Math.round((n + m) * 255).toString(16).padStart(2, '0');\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\n// ── HexInput ─────────────────────────────────────────────────────────────────\n\ninterface HexInputProps {\n  hex: string;\n  onChange: (hex: string) => void;\n  useInputComponent?: boolean;\n}\n\nfunction HexInput({ hex, onChange, useInputComponent = false }: HexInputProps): ReactElement {\n  const [draft, setDraft] = useState(hex);\n\n  useEffect(() => {\n    setDraft(hex);\n  }, [hex]);\n\n  function handleChange(raw: string) {\n    setDraft(raw);\n    const normalized = raw.startsWith('#') ? raw : `#${raw}`;\n    if (isValidHex(normalized)) onChange(normalized);\n  }\n\n  function handleBlur() {\n    const normalized = draft.startsWith('#') ? draft : `#${draft}`;\n    if (!isValidHex(normalized)) setDraft(hex);\n  }\n\n  if (useInputComponent) {\n    return (\n      <Input\n        value={draft}\n        onChange={(value: string) => handleChange(value)}\n        onBlur={handleBlur}\n      />\n    );\n  }\n\n  return (\n    <input\n      type=\"text\"\n      value={draft}\n      onChange={(e) => handleChange(e.target.value)}\n      onBlur={handleBlur}\n      className={styles.hexInput}\n      spellCheck={false}\n    />\n  );\n}\n\n// ── Picker panel ─────────────────────────────────────────────────────────────\n\ninterface PickerPanelProps {\n  hue: number;\n  sat: number;\n  val: number;\n  alpha: number;\n  onHueChange: (h: number) => void;\n  onSVChange: (s: number, v: number) => void;\n  onAlphaChange: (a: number) => void;\n  showInput?: boolean;\n  showAlpha?: boolean;\n}\n\nfunction PickerPanel({\n  hue, sat, val, alpha,\n  onHueChange, onSVChange, onAlphaChange,\n  showInput = true, showAlpha = false,\n}: PickerPanelProps): ReactElement {\n  const gradientRef = useRef<HTMLDivElement>(null);\n\n  function getSVFromEvent(e: MouseEvent): { s: number; v: number } {\n    const rect = gradientRef.current!.getBoundingClientRect();\n    const x = Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));\n    const y = Math.max(0, Math.min(1, (e.clientY - rect.top) / rect.height));\n    return { s: x * 100, v: (1 - y) * 100 };\n  }\n\n  function onGradientMouseDown(e: React.MouseEvent) {\n    const { s, v } = getSVFromEvent(e.nativeEvent);\n    onSVChange(s, v);\n\n    const onMove = (ev: MouseEvent) => {\n      const { s, v } = getSVFromEvent(ev);\n      onSVChange(s, v);\n    };\n    const onUp = () => {\n      window.removeEventListener('mousemove', onMove);\n      window.removeEventListener('mouseup', onUp);\n    };\n    window.addEventListener('mousemove', onMove);\n    window.addEventListener('mouseup', onUp);\n  }\n\n  function onHexChange(normalized: string) {\n    const { hex6, alpha: parsedAlpha } = parseHex(normalized);\n    const { h, s, v } = hexToHsv(hex6);\n    onHueChange(h);\n    onSVChange(s, v);\n    if (showAlpha) onAlphaChange(parsedAlpha);\n  }\n\n  const hex6 = hsvToHex(hue, sat, val);\n  const hexInputValue = showAlpha ? buildValue(hex6, alpha, true) : hex6;\n\n  return (\n    <div className={styles.panel}>\n      <div\n        ref={gradientRef}\n        className={styles.gradientArea}\n        style={{ '--hue': hue } as React.CSSProperties}\n        onMouseDown={onGradientMouseDown}\n      >\n        <div className={styles.gradientOverlay} />\n        <div\n          className={styles.cursor}\n          style={{ left: `${sat}%`, top: `${100 - val}%` }}\n        />\n      </div>\n\n      <input\n        type=\"range\"\n        min={0}\n        max={359}\n        value={hue}\n        onChange={(e) => onHueChange(Number(e.target.value))}\n        className={styles.hueSlider}\n      />\n\n      {showAlpha && (\n        <input\n          type=\"range\"\n          min={0}\n          max={100}\n          value={alpha}\n          onChange={(e) => onAlphaChange(Number(e.target.value))}\n          className={styles.alphaSlider}\n          style={{ '--alpha-color': hex6 } as React.CSSProperties}\n        />\n      )}\n\n      {showInput && <HexInput hex={hexInputValue} onChange={onHexChange} />}\n    </div>\n  );\n}\n\n// ── ColorPicker ───────────────────────────────────────────────────────────────\n\nconst DEFAULT_COLOR = '#3b82f6';\n\nfunction ColorPicker({\n  className,\n  value = DEFAULT_COLOR,\n  onChange,\n  showInput = false,\n  showAlpha = false,\n  inline = false,\n  ...rest\n}: ColorPickerProps): ReactElement {\n  const [isOpen, setIsOpen] = useState(false);\n\n  const initSafe = isValidHex(value) ? value : DEFAULT_COLOR;\n  const { hex6: initHex6, alpha: initAlpha } = parseHex(initSafe);\n  const initHsv = hexToHsv(initHex6);\n\n  // Single state object so hue survives when saturation/value hit 0\n  // (hexToHsv of any grey returns h=0, which would corrupt hue if derived from props).\n  const [hsva, setHsva] = useState({ h: initHsv.h, s: initHsv.s, v: initHsv.v, a: initAlpha });\n\n  // Ref mirrors state so drag callbacks never read stale closure values.\n  const cur = useRef(hsva);\n\n  // Sync from external prop changes: \"derive state during render\" pattern\n  // avoids setState-in-effect. We compare the incoming hex against what our\n  // current state produces — if they match, the change came from us and we skip.\n  const [prevValue, setPrevValue] = useState(value);\n  if (value !== prevValue) {\n    setPrevValue(value);\n    const safe = isValidHex(value) ? value : DEFAULT_COLOR;\n    const { hex6: incomingHex6, alpha: incomingA } = parseHex(safe);\n    const currentHex6 = hsvToHex(hsva.h, hsva.s, hsva.v);\n    if (incomingHex6 !== currentHex6 || incomingA !== hsva.a) {\n      const hsv = hexToHsv(incomingHex6);\n      const next = { h: hsv.h, s: hsv.s, v: hsv.v, a: incomingA };\n      setHsva(next);\n    }\n  }\n\n  const { h: hue, s: sat, v: val, a: alpha } = hsva;\n\n  function emit(h: number, s: number, v: number, a: number) {\n    onChange?.(buildValue(hsvToHex(h, s, v), a, showAlpha));\n  }\n\n  function handleHueChange(h: number) {\n    cur.current.h = h;\n    setHsva(prev => ({ ...prev, h }));\n    emit(h, cur.current.s, cur.current.v, cur.current.a);\n  }\n\n  function handleSVChange(s: number, v: number) {\n    cur.current.s = s;\n    cur.current.v = v;\n    setHsva(prev => ({ ...prev, s, v }));\n    emit(cur.current.h, s, v, cur.current.a);\n  }\n\n  function handleAlphaChange(a: number) {\n    cur.current.a = a;\n    setHsva(prev => ({ ...prev, a }));\n    emit(cur.current.h, cur.current.s, cur.current.v, a);\n  }\n\n  const hex6 = hsvToHex(hue, sat, val);\n  const swatchBackground = showAlpha ? hexToRgba(hex6, alpha) : hex6;\n  const displayValue = buildValue(hex6, alpha, showAlpha);\n\n  const pickerPanelProps: PickerPanelProps = {\n    hue, sat, val, alpha,\n    onHueChange: handleHueChange,\n    onSVChange: handleSVChange,\n    onAlphaChange: handleAlphaChange,\n    showAlpha,\n  };\n\n  if (inline) {\n    return (\n      <div {...rest} className={cx(styles.colorPicker, className)}>\n        <PickerPanel {...pickerPanelProps} showInput={showInput} />\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={cx(styles.colorPicker, className)}>\n      <FloatingMenu\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n        dontCloseOnChildClick\n        align={Align.Left}\n        content={<PickerPanel {...pickerPanelProps} />}\n      >\n        <InteractableDiv className={styles.swatch}>\n          <div className={styles.swatchFill} style={{ background: swatchBackground }} />\n          <span className={styles.swatchHex}>{displayValue}</span>\n        </InteractableDiv>\n      </FloatingMenu>\n\n      {showInput && (\n        <HexInput\n          hex={displayValue}\n          onChange={(v) => onChange?.(v)}\n          useInputComponent\n        />\n      )}\n    </div>\n  );\n}\n\nexport default ColorPicker;\n"],"mappings":"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"}
+{"version":3,"file":"colorPicker.mjs","names":[],"sources":["../../../../package/common/colorPicker/colorPicker.tsx"],"sourcesContent":["import { useState, useRef, type ReactElement } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faEyeDropper } from '@fortawesome/free-solid-svg-icons';\n\nimport InteractableDiv from 'components/common/interactableDiv';\nimport FloatingMenu from 'components/common/floatingMenu';\nimport Input from 'components/common/input';\nimport { Align } from 'components/common/floatingMenu/floatingMenu.types';\nimport type { ColorPickerProps } from './colorPicker.types';\n\nimport styles from './colorPicker.module.pcss';\n\ninterface EyeDropperConstructor {\n  new (): { open: (options?: { signal?: AbortSignal }) => Promise<{ sRGBHex: string }> };\n}\n\nconst eyeDropperSupported = typeof window !== 'undefined' && 'EyeDropper' in window;\n\nasync function pickColorFromScreen(): Promise<string | null> {\n  const EyeDropperCtor = (window as unknown as { EyeDropper?: EyeDropperConstructor }).EyeDropper;\n  if (!EyeDropperCtor) return null;\n  try {\n    const result = await new EyeDropperCtor().open();\n    return result.sRGBHex;\n  } catch {\n    return null; // user cancelled or picker failed\n  }\n}\n\n// ── Color utilities ──────────────────────────────────────────────────────────\n\nfunction isValidHex(s: string): boolean {\n  return /^#[0-9a-fA-F]{6}$/.test(s) || /^#[0-9a-fA-F]{8}$/.test(s);\n}\n\n/** Split any valid hex into its 6-digit base and 0-100 alpha. */\nfunction parseHex(hex: string): { hex6: string; alpha: number } {\n  if (/^#[0-9a-fA-F]{8}$/.test(hex)) {\n    return {\n      hex6: hex.slice(0, 7),\n      alpha: Math.round((parseInt(hex.slice(7, 9), 16) / 255) * 100),\n    };\n  }\n  return { hex6: hex.slice(0, 7), alpha: 100 };\n}\n\n/** Combine a 6-digit hex + 0-100 alpha into the right output format.\n *  Full opacity (alpha === 100) is omitted — 6-digit hex implies opaque. */\nfunction buildValue(hex6: string, alpha: number, showAlpha: boolean): string {\n  if (!showAlpha || alpha >= 100) return hex6;\n  const a = Math.round((alpha / 100) * 255).toString(16).padStart(2, '0');\n  return `${hex6}${a}`;\n}\n\nfunction hexToRgba(hex6: string, alpha: number): string {\n  const r = parseInt(hex6.slice(1, 3), 16);\n  const g = parseInt(hex6.slice(3, 5), 16);\n  const b = parseInt(hex6.slice(5, 7), 16);\n  return `rgba(${r}, ${g}, ${b}, ${alpha / 100})`;\n}\n\nfunction hexToHsv(hex6: string): { h: number; s: number; v: number } {\n  const r = parseInt(hex6.slice(1, 3), 16) / 255;\n  const g = parseInt(hex6.slice(3, 5), 16) / 255;\n  const b = parseInt(hex6.slice(5, 7), 16) / 255;\n\n  const max = Math.max(r, g, b);\n  const min = Math.min(r, g, b);\n  const delta = max - min;\n\n  let h = 0;\n  if (delta !== 0) {\n    if (max === r) h = ((g - b) / delta) % 6;\n    else if (max === g) h = (b - r) / delta + 2;\n    else h = (r - g) / delta + 4;\n    h = Math.round(h * 60);\n    if (h < 0) h += 360;\n  }\n\n  const s = max === 0 ? 0 : Math.round((delta / max) * 100);\n  const v = Math.round(max * 100);\n\n  return { h, s, v };\n}\n\nfunction hsvToHex(h: number, s: number, v: number): string {\n  const sv = s / 100;\n  const vv = v / 100;\n  const c = vv * sv;\n  const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n  const m = vv - c;\n\n  let r = 0, g = 0, b = 0;\n  if (h < 60)       { r = c; g = x; b = 0; }\n  else if (h < 120) { r = x; g = c; b = 0; }\n  else if (h < 180) { r = 0; g = c; b = x; }\n  else if (h < 240) { r = 0; g = x; b = c; }\n  else if (h < 300) { r = x; g = 0; b = c; }\n  else              { r = c; g = 0; b = x; }\n\n  const toHex = (n: number) => Math.round((n + m) * 255).toString(16).padStart(2, '0');\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\n// ── HexInput ─────────────────────────────────────────────────────────────────\n\ninterface HexInputProps {\n  hex: string;\n  onChange: (hex: string) => void;\n  useInputComponent?: boolean;\n}\n\nfunction HexInput({ hex, onChange, useInputComponent = false }: HexInputProps): ReactElement {\n  const [draft, setDraft] = useState(hex);\n\n  const [prevHex, setPrevHex] = useState(hex);\n  if (hex !== prevHex) {\n    setPrevHex(hex);\n    setDraft(hex);\n  }\n\n  function handleChange(raw: string) {\n    setDraft(raw);\n    const normalized = raw.startsWith('#') ? raw : `#${raw}`;\n    if (isValidHex(normalized)) onChange(normalized);\n  }\n\n  function handleBlur() {\n    const normalized = draft.startsWith('#') ? draft : `#${draft}`;\n    if (!isValidHex(normalized)) setDraft(hex);\n  }\n\n  if (useInputComponent) {\n    return (\n      <Input\n        value={draft}\n        onChange={(value: string) => handleChange(value)}\n        onBlur={handleBlur}\n      />\n    );\n  }\n\n  return (\n    <input\n      type=\"text\"\n      value={draft}\n      onChange={(e) => handleChange(e.target.value)}\n      onBlur={handleBlur}\n      className={styles.hexInput}\n      spellCheck={false}\n    />\n  );\n}\n\n// ── Picker panel ─────────────────────────────────────────────────────────────\n\ninterface PickerPanelProps {\n  hue: number;\n  sat: number;\n  val: number;\n  alpha: number;\n  onHueChange: (h: number) => void;\n  onSVChange: (s: number, v: number) => void;\n  onAlphaChange: (a: number) => void;\n  showInput?: boolean;\n  showAlpha?: boolean;\n}\n\nfunction PickerPanel({\n  hue, sat, val, alpha,\n  onHueChange, onSVChange, onAlphaChange,\n  showInput = true, showAlpha = false,\n}: PickerPanelProps): ReactElement {\n  const gradientRef = useRef<HTMLDivElement>(null);\n\n  function getSVFromEvent(e: { clientX: number; clientY: number }): { s: number; v: number } {\n    const rect = gradientRef.current!.getBoundingClientRect();\n    const x = Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));\n    const y = Math.max(0, Math.min(1, (e.clientY - rect.top) / rect.height));\n    return { s: x * 100, v: (1 - y) * 100 };\n  }\n\n  // Pointer Events (not mouse events) so dragging works for touch/pen too.\n  function onGradientPointerDown(e: React.PointerEvent) {\n    e.currentTarget.setPointerCapture(e.pointerId);\n    const { s, v } = getSVFromEvent(e);\n    onSVChange(s, v);\n\n    const onMove = (ev: PointerEvent) => {\n      const { s, v } = getSVFromEvent(ev);\n      onSVChange(s, v);\n    };\n    const onUp = () => {\n      window.removeEventListener('pointermove', onMove);\n      window.removeEventListener('pointerup', onUp);\n    };\n    window.addEventListener('pointermove', onMove);\n    window.addEventListener('pointerup', onUp);\n  }\n\n  function onHexChange(normalized: string) {\n    const { hex6, alpha: parsedAlpha } = parseHex(normalized);\n    const { h, s, v } = hexToHsv(hex6);\n    onHueChange(h);\n    onSVChange(s, v);\n    if (showAlpha) onAlphaChange(parsedAlpha);\n  }\n\n  const hex6 = hsvToHex(hue, sat, val);\n  const hexInputValue = showAlpha ? buildValue(hex6, alpha, true) : hex6;\n\n  return (\n    <div className={styles.panel}>\n      <div\n        ref={gradientRef}\n        className={styles.gradientArea}\n        style={{ '--hue': hue } as React.CSSProperties}\n        onPointerDown={onGradientPointerDown}\n      >\n        <div className={styles.gradientOverlay} />\n        <div\n          className={styles.cursor}\n          style={{ left: `${sat}%`, top: `${100 - val}%` }}\n        />\n      </div>\n\n      <input\n        type=\"range\"\n        min={0}\n        max={359}\n        value={hue}\n        onChange={(e) => onHueChange(Number(e.target.value))}\n        className={styles.hueSlider}\n      />\n\n      {showAlpha && (\n        <input\n          type=\"range\"\n          min={0}\n          max={100}\n          value={alpha}\n          onChange={(e) => onAlphaChange(Number(e.target.value))}\n          className={styles.alphaSlider}\n          style={{ '--alpha-color': hex6 } as React.CSSProperties}\n        />\n      )}\n\n      {(showInput || eyeDropperSupported) && (\n        <div className={styles.hexRow}>\n          {showInput && <HexInput hex={hexInputValue} onChange={onHexChange} />}\n          {eyeDropperSupported && (\n            <button\n              type=\"button\"\n              className={styles.eyeDropperButton}\n              onClick={async () => {\n                const hex = await pickColorFromScreen();\n                if (hex) onHexChange(hex);\n              }}\n              aria-label=\"Pick color from screen\"\n            >\n              <FontAwesomeIcon icon={faEyeDropper} />\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n\n// ── ColorPicker ───────────────────────────────────────────────────────────────\n\nconst DEFAULT_COLOR = '#3b82f6';\n\nfunction ColorPicker({\n  className,\n  value = DEFAULT_COLOR,\n  onChange,\n  showInput = false,\n  showAlpha = false,\n  inline = false,\n  ...rest\n}: ColorPickerProps): ReactElement {\n  const [isOpen, setIsOpen] = useState(false);\n\n  const initSafe = isValidHex(value) ? value : DEFAULT_COLOR;\n  const { hex6: initHex6, alpha: initAlpha } = parseHex(initSafe);\n  const initHsv = hexToHsv(initHex6);\n\n  // Single state object so hue survives when saturation/value hit 0\n  // (hexToHsv of any grey returns h=0, which would corrupt hue if derived from props).\n  const [hsva, setHsva] = useState({ h: initHsv.h, s: initHsv.s, v: initHsv.v, a: initAlpha });\n\n  // Ref mirrors state so drag callbacks never read stale closure values.\n  const cur = useRef(hsva);\n\n  // Sync from external prop changes: \"derive state during render\" pattern\n  // avoids setState-in-effect. We compare the incoming hex against what our\n  // current state produces — if they match, the change came from us and we skip.\n  const [prevValue, setPrevValue] = useState(value);\n  if (value !== prevValue) {\n    setPrevValue(value);\n    const safe = isValidHex(value) ? value : DEFAULT_COLOR;\n    const { hex6: incomingHex6, alpha: incomingA } = parseHex(safe);\n    const currentHex6 = hsvToHex(hsva.h, hsva.s, hsva.v);\n    if (incomingHex6 !== currentHex6 || incomingA !== hsva.a) {\n      const hsv = hexToHsv(incomingHex6);\n      const next = { h: hsv.h, s: hsv.s, v: hsv.v, a: incomingA };\n      setHsva(next);\n    }\n  }\n\n  const { h: hue, s: sat, v: val, a: alpha } = hsva;\n\n  function emit(h: number, s: number, v: number, a: number) {\n    onChange?.(buildValue(hsvToHex(h, s, v), a, showAlpha));\n  }\n\n  function handleHueChange(h: number) {\n    cur.current.h = h;\n    setHsva(prev => ({ ...prev, h }));\n    emit(h, cur.current.s, cur.current.v, cur.current.a);\n  }\n\n  function handleSVChange(s: number, v: number) {\n    cur.current.s = s;\n    cur.current.v = v;\n    setHsva(prev => ({ ...prev, s, v }));\n    emit(cur.current.h, s, v, cur.current.a);\n  }\n\n  function handleAlphaChange(a: number) {\n    cur.current.a = a;\n    setHsva(prev => ({ ...prev, a }));\n    emit(cur.current.h, cur.current.s, cur.current.v, a);\n  }\n\n  const hex6 = hsvToHex(hue, sat, val);\n  const swatchBackground = showAlpha ? hexToRgba(hex6, alpha) : hex6;\n  const displayValue = buildValue(hex6, alpha, showAlpha);\n\n  const pickerPanelProps: PickerPanelProps = {\n    hue, sat, val, alpha,\n    onHueChange: handleHueChange,\n    onSVChange: handleSVChange,\n    onAlphaChange: handleAlphaChange,\n    showAlpha,\n  };\n\n  if (inline) {\n    return (\n      <div {...rest} className={cx(styles.colorPicker, className)}>\n        <PickerPanel {...pickerPanelProps} showInput={showInput} />\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={cx(styles.colorPicker, className)}>\n      <FloatingMenu\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n        dontCloseOnChildClick\n        align={Align.Left}\n        content={<PickerPanel {...pickerPanelProps} />}\n      >\n        <InteractableDiv className={styles.swatch}>\n          <div className={styles.swatchFill} style={{ background: swatchBackground }} />\n          <span className={styles.swatchHex}>{displayValue}</span>\n        </InteractableDiv>\n      </FloatingMenu>\n\n      {showInput && (\n        <HexInput\n          hex={displayValue}\n          onChange={(v) => onChange?.(v)}\n          useInputComponent\n        />\n      )}\n    </div>\n  );\n}\n\nexport default ColorPicker;\n"],"mappings":"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"}

package/dist/esm/common/colorPicker/colorPicker.module.mjs

@@ -1,2 +1,2 @@
-var e={colorPicker:`colorPicker_Ts3an`,swatch:`swatch_NW78g`,swatchHex:`swatchHex_j7-i5`,swatchFill:`swatchFill_oNtHf`,panel:`panel_WXEvY`,gradientArea:`gradientArea_qEZim`,gradientOverlay:`gradientOverlay_ZQybe`,cursor:`cursor_m67Lm`,hueSlider:`hueSlider_k3Knb`,alphaSlider:`alphaSlider_OT2sD`,hexInput:`hexInput_zQw4s`};export{e as default};
+var e={colorPicker:`colorPicker_Ts3an`,swatch:`swatch_NW78g`,swatchHex:`swatchHex_j7-i5`,swatchFill:`swatchFill_oNtHf`,panel:`panel_WXEvY`,gradientArea:`gradientArea_qEZim`,gradientOverlay:`gradientOverlay_ZQybe`,cursor:`cursor_m67Lm`,hueSlider:`hueSlider_k3Knb`,alphaSlider:`alphaSlider_OT2sD`,hexRow:`hexRow_L4bZU`,hexInput:`hexInput_zQw4s`,eyeDropperButton:`eyeDropperButton_dOyRX`};export{e as default};
 //# sourceMappingURL=colorPicker.module.mjs.map

package/dist/esm/common/colorPicker/colorPicker.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"colorPicker.module.mjs","names":[],"sources":["../../../../package/common/colorPicker/colorPicker.module.pcss"],"sourcesContent":[".colorPicker {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.swatch {\n  width: 32px;\n  height: 32px;\n  border-radius: var(--default-border-radius);\n  position: relative;\n  cursor: pointer;\n  flex-shrink: 0;\n  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);\n  /* checkerboard so transparency is visible */\n  background-image:\n    linear-gradient(45deg, #bbb 25%, transparent 25%),\n    linear-gradient(-45deg, #bbb 25%, transparent 25%),\n    linear-gradient(45deg, transparent 75%, #bbb 75%),\n    linear-gradient(-45deg, transparent 75%, #bbb 75%);\n  background-size: 8px 8px;\n  background-position: 0 0, 0 4px, 4px -4px, -4px 0;\n  background-color: white;\n\n  &:hover {\n    & .swatchHex {\n      opacity: 1;\n    }\n  }\n}\n\n.swatchFill {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n}\n\n.swatchHex {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 8px;\n  font-family: monospace;\n  background: rgba(0, 0, 0, 0.55);\n  color: white;\n  border-radius: inherit;\n  opacity: 0;\n  transition: opacity 0.15s;\n  user-select: none;\n  pointer-events: none;\n  z-index: 1;\n}\n\n.panel {\n  padding: 12px;\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  width: 224px;\n}\n\n.gradientArea {\n  width: 200px;\n  height: 160px;\n  position: relative;\n  cursor: crosshair;\n  border-radius: 4px;\n  overflow: hidden;\n  background: linear-gradient(to right, white, hsl(calc(var(--hue) * 1deg), 100%, 50%));\n}\n\n.gradientOverlay {\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(to bottom, transparent, black);\n}\n\n.cursor {\n  position: absolute;\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n  border: 2px solid white;\n  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n  z-index: 1;\n}\n\n.hueSlider {\n  -webkit-appearance: none;\n  appearance: none;\n  width: 100%;\n  height: 10px;\n  border-radius: var(--default-border-radius);\n  outline: none;\n  cursor: pointer;\n  background: linear-gradient(\n    to right,\n    hsl(0, 100%, 50%),\n    hsl(60, 100%, 50%),\n    hsl(120, 100%, 50%),\n    hsl(180, 100%, 50%),\n    hsl(240, 100%, 50%),\n    hsl(300, 100%, 50%),\n    hsl(360, 100%, 50%)\n  );\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n  }\n}\n\n.alphaSlider {\n  -webkit-appearance: none;\n  appearance: none;\n  width: 100%;\n  height: 10px;\n  border-radius: var(--default-border-radius);\n  outline: none;\n  cursor: pointer;\n  /* checkerboard base so transparency is visible under the gradient */\n  background-image:\n    linear-gradient(to right, transparent, var(--alpha-color)),\n    linear-gradient(45deg, #bbb 25%, transparent 25%),\n    linear-gradient(-45deg, #bbb 25%, transparent 25%),\n    linear-gradient(45deg, transparent 75%, #bbb 75%),\n    linear-gradient(-45deg, transparent 75%, #bbb 75%);\n  background-size: 100% 100%, 8px 8px, 8px 8px, 8px 8px, 8px 8px;\n  background-position: 0 0, 0 0, 0 4px, 4px -4px, -4px 0;\n  background-color: white;\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n  }\n\n  &::-moz-range-thumb {\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n  }\n}\n\n.hexInput {\n  width: 100%;\n  padding: 5px 8px;\n  border-radius: var(--default-border-radius);\n  border: 1px solid var(--border-color);\n  background: var(--input-background);\n  color: var(--text-color);\n  font-size: 13px;\n  font-family: monospace;\n  box-sizing: border-box;\n  outline: none;\n\n  &:focus {\n    border-color: var(--primary-color);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"colorPicker.module.mjs","names":[],"sources":["../../../../package/common/colorPicker/colorPicker.module.pcss"],"sourcesContent":[".colorPicker {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.swatch {\n  width: 32px;\n  height: 32px;\n  border-radius: var(--default-border-radius);\n  position: relative;\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  flex-shrink: 0;\n  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);\n  /* checkerboard so transparency is visible */\n  background-image:\n    linear-gradient(45deg, #bbb 25%, transparent 25%),\n    linear-gradient(-45deg, #bbb 25%, transparent 25%),\n    linear-gradient(45deg, transparent 75%, #bbb 75%),\n    linear-gradient(-45deg, transparent 75%, #bbb 75%);\n  background-size: 8px 8px;\n  background-position: 0 0, 0 4px, 4px -4px, -4px 0;\n  background-color: white;\n\n  &:hover {\n    & .swatchHex {\n      opacity: 1;\n    }\n  }\n}\n\n.swatchFill {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n}\n\n.swatchHex {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 8px;\n  font-family: monospace;\n  background: rgba(0, 0, 0, 0.55);\n  color: white;\n  border-radius: inherit;\n  opacity: 0;\n  transition: opacity 0.15s;\n  user-select: none;\n  pointer-events: none;\n  z-index: 1;\n}\n\n.panel {\n  padding: 12px;\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  width: 224px;\n}\n\n.gradientArea {\n  width: 200px;\n  height: 160px;\n  position: relative;\n  cursor: crosshair;\n  border-radius: 4px;\n  overflow: hidden;\n  touch-action: none;\n  background: linear-gradient(to right, white, hsl(calc(var(--hue) * 1deg), 100%, 50%));\n}\n\n.gradientOverlay {\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(to bottom, transparent, black);\n}\n\n.cursor {\n  position: absolute;\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n  border: 2px solid white;\n  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n  z-index: 1;\n}\n\n.hueSlider {\n  -webkit-appearance: none;\n  appearance: none;\n  width: 100%;\n  height: 10px;\n  border-radius: var(--default-border-radius);\n  outline: none;\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  background: linear-gradient(\n    to right,\n    hsl(0, 100%, 50%),\n    hsl(60, 100%, 50%),\n    hsl(120, 100%, 50%),\n    hsl(180, 100%, 50%),\n    hsl(240, 100%, 50%),\n    hsl(300, 100%, 50%),\n    hsl(360, 100%, 50%)\n  );\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &::-moz-range-thumb {\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n}\n\n.alphaSlider {\n  -webkit-appearance: none;\n  appearance: none;\n  width: 100%;\n  height: 10px;\n  border-radius: var(--default-border-radius);\n  outline: none;\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  /* checkerboard base so transparency is visible under the gradient */\n  background-image:\n    linear-gradient(to right, transparent, var(--alpha-color)),\n    linear-gradient(45deg, #bbb 25%, transparent 25%),\n    linear-gradient(-45deg, #bbb 25%, transparent 25%),\n    linear-gradient(45deg, transparent 75%, #bbb 75%),\n    linear-gradient(-45deg, transparent 75%, #bbb 75%);\n  background-size: 100% 100%, 8px 8px, 8px 8px, 8px 8px, 8px 8px;\n  background-position: 0 0, 0 0, 0 4px, 4px -4px, -4px 0;\n  background-color: white;\n\n  &::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &::-moz-range-thumb {\n    width: 6px;\n    height: 20px;\n    border-radius: var(--default-border-radius);\n    background: var(--primary-color);\n    box-shadow: var(--card-shadow);\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n}\n\n.hexRow {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.hexInput {\n  width: 100%;\n  padding: 5px 8px;\n  border-radius: var(--default-border-radius);\n  border: 1px solid var(--border-color);\n  background: var(--input-background);\n  color: var(--text-color);\n  font-size: 13px;\n  font-family: monospace;\n  box-sizing: border-box;\n  outline: none;\n\n  &:focus {\n    border-color: var(--primary-color);\n  }\n}\n\n.eyeDropperButton {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  border-radius: var(--default-border-radius);\n  border: 1px solid var(--border-color);\n  background: var(--input-background);\n  color: var(--text-color);\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n\n  &:hover {\n    border-color: var(--primary-color);\n    color: var(--primary-color);\n  }\n}\n"],"mappings":""}

package/dist/esm/common/datePicker/components/datePickerMonth/datePickerMonth.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"datePickerMonth.module.mjs","names":[],"sources":["../../../../../../package/common/datePicker/components/datePickerMonth/datePickerMonth.module.pcss"],"sourcesContent":["\n.datePickerMonth {\n  &-item {\n    aspect-ratio: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 1px 0;\n  }\n\n  &-content {\n    display: grid;\n    text-align: center;\n    grid-template-columns: repeat(7, minmax(0, 1fr));\n    gap: 0px;\n  }\n\n  &-day {\n    cursor: pointer;\n\n    &:hover {\n      /* background-color: var(--primary-color);\n      border-radius: 800px; */\n    }\n\n    &-today {\n      background-color: var(--background-accent-light);\n      border-radius: var(--default-border-radius);\n    }\n\n    &-selected {\n      background-color: var(--primary-color);\n      color: var(--text-on-primary);\n      border-radius: 0;\n\n      &-start {\n        border-top-left-radius: var(--default-border-radius);\n        border-bottom-left-radius: var(--default-border-radius);\n      }\n\n      &-end {\n        border-top-right-radius: var(--default-border-radius);\n        border-bottom-right-radius: var(--default-border-radius);\n      }\n    }\n\n    &-disabled {\n      filter: brightness(0.5);\n      cursor: not-allowed;\n    }\n  }\n\n  &-placeholder {\n    user-select: none;\n    pointer-events: none;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"datePickerMonth.module.mjs","names":[],"sources":["../../../../../../package/common/datePicker/components/datePickerMonth/datePickerMonth.module.pcss"],"sourcesContent":["\n.datePickerMonth {\n  &-item {\n    aspect-ratio: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 1px 0;\n  }\n\n  &-content {\n    display: grid;\n    text-align: center;\n    grid-template-columns: repeat(7, minmax(0, 1fr));\n    gap: 0px;\n  }\n\n  &-day {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n\n    &:hover {\n      /* background-color: var(--primary-color);\n      border-radius: 800px; */\n    }\n\n    &-today {\n      background-color: var(--background-accent-light);\n      border-radius: var(--default-border-radius);\n    }\n\n    &-selected {\n      background-color: var(--primary-color);\n      color: var(--text-on-primary);\n      border-radius: 0;\n\n      &-start {\n        border-top-left-radius: var(--default-border-radius);\n        border-bottom-left-radius: var(--default-border-radius);\n      }\n\n      &-end {\n        border-top-right-radius: var(--default-border-radius);\n        border-bottom-right-radius: var(--default-border-radius);\n      }\n    }\n\n    &-disabled {\n      filter: brightness(0.5);\n      cursor: not-allowed;\n    }\n  }\n\n  &-placeholder {\n    user-select: none;\n    pointer-events: none;\n  }\n}\n"],"mappings":""}

package/dist/esm/common/datePicker/datePicker.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"datePicker.module.mjs","names":[],"sources":["../../../../package/common/datePicker/datePicker.module.pcss"],"sourcesContent":[".datePicker {\n  position: relative;\n  width: 100%;\n  flex: 1;\n  min-width: 105px;\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin: 8px 0;\n\n    &-monthAndYear {\n      display: flex;\n\n      &-container {\n        display: flex;\n        gap: 16px;\n        position: relative;\n      }\n    }\n\n    &-month {\n      width: 120px;\n    }\n\n    &-year {\n      width: 75px;\n    }\n  }\n\n  &-month {\n    min-width: 185px;\n  }\n\n  &-modalInput {\n    cursor: pointer;\n    color: var(--text-color);\n    -webkit-text-fill-color: var(--text-color);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"datePicker.module.mjs","names":[],"sources":["../../../../package/common/datePicker/datePicker.module.pcss"],"sourcesContent":[".datePicker {\n  position: relative;\n  width: 100%;\n  flex: 1;\n  min-width: 105px;\n\n  &-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin: 8px 0;\n\n    &-monthAndYear {\n      display: flex;\n\n      &-container {\n        display: flex;\n        gap: 16px;\n        position: relative;\n      }\n    }\n\n    &-month {\n      width: 120px;\n    }\n\n    &-year {\n      width: 75px;\n    }\n  }\n\n  &-month {\n    min-width: 185px;\n  }\n\n  &-modalInput {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    color: var(--text-color);\n    -webkit-text-fill-color: var(--text-color);\n  }\n}\n"],"mappings":""}

package/dist/esm/common/dropZone/dropZone.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropZone.module.mjs","names":[],"sources":["../../../../package/common/dropZone/dropZone.module.pcss"],"sourcesContent":[".dropZone {\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  outline: none;\n\n  &-clickable {\n    cursor: pointer;\n  }\n\n  &-disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  &-default {\n    padding: var(--spacing-l, 24px);\n    border: 1px dashed var(--border-color);\n    border-radius: var(--default-border-radius);\n    background: transparent;\n    color: var(--text-dark);\n    transition: border-color 0.2s, background 0.2s, color 0.2s;\n  }\n\n  &-default&-clickable:hover {\n    border-color: var(--primary-color);\n    background: var(--background-accent-light);\n  }\n\n  /* A drag is somewhere in the window — the zone is armed. */\n  &-dragging {\n    border-color: var(--primary-color);\n  }\n\n  /* A drag is hovering directly over this zone. */\n  &-active {\n    border-width: 2px;\n    border-color: var(--primary-color);\n    background: var(--background-accent-light);\n    color: var(--text-color);\n  }\n\n  &-error {\n    border-color: var(--error-color);\n    color: var(--error-color);\n  }\n\n  &-error&-clickable:hover {\n    border-color: var(--error-color);\n    background: var(--error-lighter);\n  }\n\n  &-content {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n\n    /* While dragging, let drop events fall through to the root instead of child elements. */\n    &-dragging {\n      pointer-events: none;\n    }\n  }\n\n  &-fileList {\n    width: 100%;\n    margin-top: var(--spacing-s, 8px);\n    pointer-events: none;\n  }\n\n  &-fileItem {\n    font-size: var(--text-small-font-size);\n    color: var(--text-dark);\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n  }\n\n  &-input {\n    display: none;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"dropZone.module.mjs","names":[],"sources":["../../../../package/common/dropZone/dropZone.module.pcss"],"sourcesContent":[".dropZone {\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  outline: none;\n\n  &-clickable {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &-disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  &-default {\n    padding: var(--spacing-l, 24px);\n    border: 1px dashed var(--border-color);\n    border-radius: var(--default-border-radius);\n    background: transparent;\n    color: var(--text-dark);\n    transition: border-color 0.2s, background 0.2s, color 0.2s;\n  }\n\n  &-default&-clickable:hover {\n    border-color: var(--primary-color);\n    background: var(--background-accent-light);\n  }\n\n  /* A drag is somewhere in the window — the zone is armed. */\n  &-dragging {\n    border-color: var(--primary-color);\n  }\n\n  /* A drag is hovering directly over this zone. */\n  &-active {\n    border-width: 2px;\n    border-color: var(--primary-color);\n    background: var(--background-accent-light);\n    color: var(--text-color);\n  }\n\n  &-error {\n    border-color: var(--error-color);\n    color: var(--error-color);\n  }\n\n  &-error&-clickable:hover {\n    border-color: var(--error-color);\n    background: var(--error-lighter);\n  }\n\n  &-content {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n\n    /* While dragging, let drop events fall through to the root instead of child elements. */\n    &-dragging {\n      pointer-events: none;\n    }\n  }\n\n  &-fileList {\n    width: 100%;\n    margin-top: var(--spacing-s, 8px);\n    pointer-events: none;\n  }\n\n  &-fileItem {\n    font-size: var(--text-small-font-size);\n    color: var(--text-dark);\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n  }\n\n  &-input {\n    display: none;\n  }\n}\n"],"mappings":""}