@vibe/core 3.62.0 → 3.62.1-alpha-ab54f.0

package/dist/mocked_classnames/src/components/Checkbox/Checkbox.js

@@ -1,2 +1,2 @@
-import e,{forwardRef as a,useRef as t,useCallback as o,useEffect as n,useMemo as i}from"react";import r from"classnames";import{isNil as l,noop as s}from"lodash-es";import c from"../Icon/Icon.js";import{useSupportFirefoxLabelClick as m}from"./hooks/useSupportFirefoxLabelClick.js";import d from"../../hooks/useMergeRef.js";import{getTestId as u}from"../../tests/testIds.js";import{ComponentDefaultTestId as p,ComponentVibeId as C}from"../../tests/constants.js";import b from"../Text/Text.js";import f from"./Checkbox.module.scss.js";import E from"../../../icons/dist/react/Remove.js";import h from"../../../icons/dist/react/Check.js";var k=a((function(a,k){var v=a.className,x=a.checkboxClassName,B=a.labelClassName,N=a.ariaLabel,y=a.label,H=a.ariaLabelledBy,F=a.onChange,K=void 0===F?s:F,O=a.checked,X=a.autoFocus,g=a.indeterminate,j=void 0!==g&&g,L=a.disabled,w=void 0!==L&&L,I=a.defaultChecked,S=a.tabIndex,A=a.value,M=void 0===A?"":A,T=a.name,_=void 0===T?"":T,R=a.id,U=a.separateLabel,q=void 0!==U&&U,z=a["data-testid"],D=t(null),G=d(k,D),J=t(null),P=o((function(){var e=D.current;e&&window.requestAnimationFrame((function(){window.requestAnimationFrame((function(){e.blur()}))}))}),[D]),Q=I;l(Q)&&l(O)&&(Q=!1),n((function(){D.current&&(D.current.indeterminate=j)}),[D,j]);var V=m({inputRef:D}).onClickCapture,W=i((function(){return N||("string"==typeof y?y:"")}),[N,y]);return q?e.createElement("div",{className:r(f.wrapper,v),"data-testid":z||u(p.CHECKBOX,R),"data-vibe":C.CHECKBOX},e.createElement("input",{ref:G,id:R,className:f.input,value:M,name:_,type:"checkbox",autoFocus:X,onChange:K,defaultChecked:Q,disabled:w,"aria-label":W,"aria-labelledby":H,checked:O,tabIndex:S}),e.createElement("label",{htmlFor:R,className:r(f.checkbox,x),"data-testid":u(p.CHECKBOX_CHECKBOX,R),onMouseUp:P,onClickCapture:V},e.createElement(c,{className:f.icon,iconType:"svg",icon:j?E:h,ignoreFocusStyle:!0,ariaHidden:!0,iconSize:"16"})),!1===y?null:e.createElement("label",{htmlFor:R,className:r(f.label,B),"data-testid":u(p.CHECKBOX_LABEL,R),onMouseUp:P,onClickCapture:V},e.createElement(b,{element:"span",type:"text2"},y))):e.createElement("label",{className:r(f.wrapper,v),onMouseUp:P,"data-testid":z||u(p.CHECKBOX,R),htmlFor:R,onClickCapture:V,"data-vibe":C.CHECKBOX},e.createElement("input",{ref:G,id:R,className:f.input,value:M,name:_,type:"checkbox",autoFocus:X,onChange:K,defaultChecked:Q,disabled:w,"aria-label":W,"aria-labelledby":H,checked:O,tabIndex:S}),e.createElement("div",{className:r(f.checkbox,x),ref:J,"data-testid":u(p.CHECKBOX_CHECKBOX,R)},e.createElement(c,{className:f.icon,iconType:"svg",icon:j?E:h,ignoreFocusStyle:!0,ariaHidden:!0,iconSize:"16"})),!1===y?null:e.createElement(b,{element:"span",type:"text2",className:r(f.label,B),"data-testid":u(p.CHECKBOX_LABEL,R)},y))}));export{k as default};
+import e,{forwardRef as a,useRef as t,useCallback as o,useEffect as i,useMemo as n}from"react";import r from"classnames";import{isNil as l,noop as s}from"es-toolkit/compat";import c from"../Icon/Icon.js";import{useSupportFirefoxLabelClick as m}from"./hooks/useSupportFirefoxLabelClick.js";import d from"../../hooks/useMergeRef.js";import{getTestId as u}from"../../tests/testIds.js";import{ComponentDefaultTestId as p,ComponentVibeId as C}from"../../tests/constants.js";import b from"../Text/Text.js";import f from"./Checkbox.module.scss.js";import E from"../../../icons/dist/react/Remove.js";import h from"../../../icons/dist/react/Check.js";var k=a((function(a,k){var v=a.className,x=a.checkboxClassName,B=a.labelClassName,N=a.ariaLabel,y=a.label,H=a.ariaLabelledBy,F=a.onChange,K=void 0===F?s:F,O=a.checked,X=a.autoFocus,g=a.indeterminate,j=void 0!==g&&g,L=a.disabled,w=void 0!==L&&L,I=a.defaultChecked,S=a.tabIndex,A=a.value,M=void 0===A?"":A,T=a.name,_=void 0===T?"":T,R=a.id,U=a.separateLabel,q=void 0!==U&&U,z=a["data-testid"],D=t(null),G=d(k,D),J=t(null),P=o((function(){var e=D.current;e&&window.requestAnimationFrame((function(){window.requestAnimationFrame((function(){e.blur()}))}))}),[D]),Q=I;l(Q)&&l(O)&&(Q=!1),i((function(){D.current&&(D.current.indeterminate=j)}),[D,j]);var V=m({inputRef:D}).onClickCapture,W=n((function(){return N||("string"==typeof y?y:"")}),[N,y]);return q?e.createElement("div",{className:r(f.wrapper,v),"data-testid":z||u(p.CHECKBOX,R),"data-vibe":C.CHECKBOX},e.createElement("input",{ref:G,id:R,className:f.input,value:M,name:_,type:"checkbox",autoFocus:X,onChange:K,defaultChecked:Q,disabled:w,"aria-label":W,"aria-labelledby":H,checked:O,tabIndex:S}),e.createElement("label",{htmlFor:R,className:r(f.checkbox,x),"data-testid":u(p.CHECKBOX_CHECKBOX,R),onMouseUp:P,onClickCapture:V},e.createElement(c,{className:f.icon,iconType:"svg",icon:j?E:h,ignoreFocusStyle:!0,ariaHidden:!0,iconSize:"16"})),!1===y?null:e.createElement("label",{htmlFor:R,className:r(f.label,B),"data-testid":u(p.CHECKBOX_LABEL,R),onMouseUp:P,onClickCapture:V},e.createElement(b,{element:"span",type:"text2"},y))):e.createElement("label",{className:r(f.wrapper,v),onMouseUp:P,"data-testid":z||u(p.CHECKBOX,R),htmlFor:R,onClickCapture:V,"data-vibe":C.CHECKBOX},e.createElement("input",{ref:G,id:R,className:f.input,value:M,name:_,type:"checkbox",autoFocus:X,onChange:K,defaultChecked:Q,disabled:w,"aria-label":W,"aria-labelledby":H,checked:O,tabIndex:S}),e.createElement("div",{className:r(f.checkbox,x),ref:J,"data-testid":u(p.CHECKBOX_CHECKBOX,R)},e.createElement(c,{className:f.icon,iconType:"svg",icon:j?E:h,ignoreFocusStyle:!0,ariaHidden:!0,iconSize:"16"})),!1===y?null:e.createElement(b,{element:"span",type:"text2",className:r(f.label,B),"data-testid":u(p.CHECKBOX_LABEL,R)},y))}));export{k as default};
 //# sourceMappingURL=Checkbox.js.map

package/dist/mocked_classnames/src/components/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { isNil, noop as NOOP } from \"lodash-es\";\nimport Icon from \"../Icon/Icon\";\nimport { Check, Remove } from \"@vibe/icons\";\nimport { useSupportFirefoxLabelClick } from \"./hooks/useSupportFirefoxLabelClick\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Checkbox.module.scss\";\n\nexport interface CheckBoxProps extends VibeComponentProps {\n  /**\n   * Class name applied to the checkbox element.\n   */\n  checkboxClassName?: string;\n  /**\n   * Class name applied to the label element.\n   */\n  labelClassName?: string;\n  /**\n   * The label of the checkbox for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * The content displayed next to the checkbox.\n   */\n  label?: React.ReactNode | Array<React.ReactNode>;\n  /**\n   * The ID of an element describing the checkbox.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * Callback fired when the checkbox value changes.\n   */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * If true, controls the checked state of the checkbox.\n   */\n  checked?: boolean;\n  /**\n   * If true, displays an indeterminate state.\n   */\n  indeterminate?: boolean;\n  /**\n   * If true, the checkbox automatically receives focus.\n   */\n  autoFocus?: boolean;\n  /**\n   * If true, the checkbox is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The initial checked state of the checkbox.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The value submitted with the form when checked.\n   */\n  value?: string;\n  /**\n   * The name of the checkbox, used for form submission.\n   */\n  name?: string;\n  /**\n   * The tab order of the checkbox.\n   */\n  tabIndex?: number;\n  /**\n   * If true, uses separate labels with htmlFor/id association instead of wrapping the input.\n   * If using this the id prop is required for it to function correctly.\n   */\n  separateLabel?: boolean;\n}\n\nconst Checkbox = forwardRef(\n  (\n    {\n      className,\n      checkboxClassName,\n      labelClassName,\n      ariaLabel,\n      label,\n      ariaLabelledBy,\n      onChange = NOOP,\n      checked,\n      autoFocus,\n      indeterminate = false,\n      disabled = false,\n      defaultChecked,\n      tabIndex,\n      value = \"\",\n      name = \"\",\n      id,\n      separateLabel = false,\n      \"data-testid\": dataTestId\n    }: CheckBoxProps,\n    ref: React.ForwardedRef<HTMLInputElement>\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    const mergedInputRef = useMergeRef(ref, inputRef);\n    const iconContainerRef = useRef<HTMLDivElement>(null);\n\n    const onMouseUpCallback = useCallback(() => {\n      const input = inputRef.current;\n      if (!input) return;\n\n      window.requestAnimationFrame(() => {\n        window.requestAnimationFrame(() => {\n          input.blur();\n        });\n      });\n    }, [inputRef]);\n    let overrideDefaultChecked = defaultChecked;\n\n    // If component did not receive default checked and checked props, choose default checked as\n    // default behavior (handle isChecked logic inside input) and set default value\n    if (isNil(overrideDefaultChecked) && isNil(checked)) {\n      overrideDefaultChecked = false;\n    }\n\n    useEffect(() => {\n      if (inputRef.current) {\n        inputRef.current.indeterminate = indeterminate;\n      }\n    }, [inputRef, indeterminate]);\n\n    const { onClickCapture: onClickCaptureLabel } = useSupportFirefoxLabelClick({ inputRef });\n\n    const finalAriaLabel = useMemo(() => {\n      if (ariaLabel) return ariaLabel;\n      if (typeof label === \"string\") return label;\n      return \"\";\n    }, [ariaLabel, label]);\n\n    if (separateLabel) {\n      return (\n        <div\n          className={cx(styles.wrapper, className)}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n          data-vibe={ComponentVibeId.CHECKBOX}\n        >\n          <input\n            ref={mergedInputRef}\n            id={id}\n            className={styles.input}\n            value={value}\n            name={name}\n            type=\"checkbox\"\n            autoFocus={autoFocus}\n            onChange={onChange}\n            defaultChecked={overrideDefaultChecked}\n            disabled={disabled}\n            aria-label={finalAriaLabel}\n            aria-labelledby={ariaLabelledBy}\n            checked={checked}\n            tabIndex={tabIndex}\n          />\n          {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}\n          <label\n            htmlFor={id}\n            className={cx(styles.checkbox, checkboxClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n            onMouseUp={onMouseUpCallback}\n            onClickCapture={onClickCaptureLabel}\n          >\n            <Icon\n              className={styles.icon}\n              iconType=\"svg\"\n              icon={indeterminate ? Remove : Check}\n              ignoreFocusStyle\n              ariaHidden={true}\n              iconSize=\"16\"\n            />\n          </label>\n          {label === false ? null : (\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n            <label\n              htmlFor={id}\n              className={cx(styles.label, labelClassName)}\n              data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n              onMouseUp={onMouseUpCallback}\n              onClickCapture={onClickCaptureLabel}\n            >\n              <Text element=\"span\" type=\"text2\">\n                {label}\n              </Text>\n            </label>\n          )}\n        </div>\n      );\n    }\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n      <label\n        className={cx(styles.wrapper, className)}\n        onMouseUp={onMouseUpCallback}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n        htmlFor={id}\n        onClickCapture={onClickCaptureLabel}\n        data-vibe={ComponentVibeId.CHECKBOX}\n      >\n        <input\n          ref={mergedInputRef}\n          id={id}\n          className={styles.input}\n          value={value}\n          name={name}\n          type=\"checkbox\"\n          autoFocus={autoFocus}\n          onChange={onChange}\n          defaultChecked={overrideDefaultChecked}\n          disabled={disabled}\n          aria-label={finalAriaLabel}\n          aria-labelledby={ariaLabelledBy}\n          checked={checked}\n          tabIndex={tabIndex}\n        />\n        <div\n          className={cx(styles.checkbox, checkboxClassName)}\n          ref={iconContainerRef}\n          data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n        >\n          <Icon\n            className={styles.icon}\n            iconType=\"svg\"\n            icon={indeterminate ? Remove : Check}\n            ignoreFocusStyle\n            ariaHidden={true}\n            iconSize=\"16\"\n          />\n        </div>\n        {label === false ? null : (\n          <Text\n            element=\"span\"\n            type=\"text2\"\n            className={cx(styles.label, labelClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n          >\n            {label}\n          </Text>\n        )}\n      </label>\n    );\n  }\n);\n\nexport default Checkbox;\n"],"names":["Checkbox","forwardRef","_ref","ref","className","checkboxClassName","labelClassName","ariaLabel","label","ariaLabelledBy","_ref$onChange","onChange","NOOP","checked","autoFocus","_ref$indeterminate","indeterminate","_ref$disabled","disabled","defaultChecked","tabIndex","_ref$value","value","_ref$name","name","id","_ref$separateLabel","separateLabel","dataTestId","inputRef","useRef","mergedInputRef","useMergeRef","iconContainerRef","onMouseUpCallback","useCallback","input","current","window","requestAnimationFrame","blur","overrideDefaultChecked","isNil","useEffect","onClickCaptureLabel","useSupportFirefoxLabelClick","onClickCapture","finalAriaLabel","useMemo","React","createElement","cx","styles","wrapper","getTestId","ComponentDefaultTestId","CHECKBOX","ComponentVibeId","type","htmlFor","checkbox","CHECKBOX_CHECKBOX","onMouseUp","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","CHECKBOX_LABEL","Text","element"],"mappings":"0nBA6EMA,IAAAA,EAAWC,GACf,SAAAC,EAqBEC,GACE,IApBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAcJ,EAAdI,eACAC,EAASL,EAATK,UACAC,EAAKN,EAALM,MACAC,EAAcP,EAAdO,eAAcC,EAAAR,EACdS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAOX,EAAPW,QACAC,EAASZ,EAATY,UAASC,EAAAb,EACTc,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAf,EACrBgB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAcjB,EAAdiB,eACAC,EAAQlB,EAARkB,SAAQC,EAAAnB,EACRoB,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACVsB,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAEvB,EAAFuB,GAAEC,EAAAxB,EACFyB,cAAAA,OAAgB,IAAHD,GAAQA,EACNE,EAAU1B,EAAzB,eAII2B,EAAWC,EAAyB,MACpCC,EAAiBC,EAAY7B,EAAK0B,GAClCI,EAAmBH,EAAuB,MAE1CI,EAAoBC,GAAY,WACpC,IAAMC,EAAQP,EAASQ,QAClBD,GAELE,OAAOC,uBAAsB,WAC3BD,OAAOC,uBAAsB,WAC3BH,EAAMI,MACR,GACF,GACF,GAAG,CAACX,IACAY,EAAyBtB,EAIzBuB,EAAMD,IAA2BC,EAAM7B,KACzC4B,GAAyB,GAG3BE,GAAU,WACJd,EAASQ,UACXR,EAASQ,QAAQrB,cAAgBA,EAErC,GAAG,CAACa,EAAUb,IAEd,IAAwB4B,EAAwBC,EAA4B,CAAEhB,SAAAA,IAAtEiB,eAEFC,EAAiBC,GAAQ,WAC7B,OAAIzC,IACiB,iBAAVC,EAA2BA,EAC/B,GACT,GAAG,CAACD,EAAWC,IAEf,OAAImB,EAEAsB,EACEC,cAAA,MAAA,CAAA9C,UAAW+C,EAAGC,EAAOC,QAASjD,GAAU,cAC3BwB,GAAc0B,EAAUC,EAAuBC,SAAU/B,GAAG,YAC9DgC,EAAgBD,UAE3BP,EACEC,cAAA,QAAA,CAAA/C,IAAK4B,EACLN,GAAIA,EACJrB,UAAWgD,EAAOhB,MAClBd,MAAOA,EACPE,KAAMA,EACNkC,KAAK,WACL5C,UAAWA,EACXH,SAAUA,EACVQ,eAAgBsB,EAChBvB,SAAUA,EACE,aAAA6B,EACK,kBAAAtC,EACjBI,QAASA,EACTO,SAAUA,IAGZ6B,EAAAC,cAAA,QAAA,CACES,QAASlC,EACTrB,UAAW+C,EAAGC,EAAOQ,SAAUvD,GAAkB,cACpCiD,EAAUC,EAAuBM,kBAAmBpC,GACjEqC,UAAW5B,EACXY,eAAgBF,GAEhBK,EAAAC,cAACa,EAAI,CACH3D,UAAWgD,EAAOY,KAClBC,SAAS,MACTD,KAAMhD,EAAgBkD,EAASC,EAC/BC,kBAAgB,EAChBC,YAAY,EACZC,SAAS,SAGF,IAAV9D,EAAkB,KAEjByC,EAAAC,cAAA,QAAA,CACES,QAASlC,EACTrB,UAAW+C,EAAGC,EAAO5C,MAAOF,GAAe,cAC9BgD,EAAUC,EAAuBgB,eAAgB9C,GAC9DqC,UAAW5B,EACXY,eAAgBF,GAEhBK,EAAAC,cAACsB,EAAK,CAAAC,QAAQ,OAAOf,KAAK,SACvBlD,KAUXyC,EAAAC,cAAA,QAAA,CACE9C,UAAW+C,EAAGC,EAAOC,QAASjD,GAC9B0D,UAAW5B,EAAiB,cACfN,GAAc0B,EAAUC,EAAuBC,SAAU/B,GACtEkC,QAASlC,EACTqB,eAAgBF,EACL,YAAAa,EAAgBD,UAE3BP,EACEC,cAAA,QAAA,CAAA/C,IAAK4B,EACLN,GAAIA,EACJrB,UAAWgD,EAAOhB,MAClBd,MAAOA,EACPE,KAAMA,EACNkC,KAAK,WACL5C,UAAWA,EACXH,SAAUA,EACVQ,eAAgBsB,EAChBvB,SAAUA,EACE,aAAA6B,EACK,kBAAAtC,EACjBI,QAASA,EACTO,SAAUA,IAEZ6B,EACEC,cAAA,MAAA,CAAA9C,UAAW+C,EAAGC,EAAOQ,SAAUvD,GAC/BF,IAAK8B,gBACQqB,EAAUC,EAAuBM,kBAAmBpC,IAEjEwB,EAAAC,cAACa,EAAI,CACH3D,UAAWgD,EAAOY,KAClBC,SAAS,MACTD,KAAMhD,EAAgBkD,EAASC,EAC/BC,kBAAgB,EAChBC,YAAY,EACZC,SAAS,SAGF,IAAV9D,EAAkB,KACjByC,gBAACuB,EAAI,CACHC,QAAQ,OACRf,KAAK,QACLtD,UAAW+C,EAAGC,EAAO5C,MAAOF,GAAe,cAC9BgD,EAAUC,EAAuBgB,eAAgB9C,IAE7DjB,GAKX"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { isNil, noop as NOOP } from \"es-toolkit/compat\";\nimport Icon from \"../Icon/Icon\";\nimport { Check, Remove } from \"@vibe/icons\";\nimport { useSupportFirefoxLabelClick } from \"./hooks/useSupportFirefoxLabelClick\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Checkbox.module.scss\";\n\nexport interface CheckBoxProps extends VibeComponentProps {\n  /**\n   * Class name applied to the checkbox element.\n   */\n  checkboxClassName?: string;\n  /**\n   * Class name applied to the label element.\n   */\n  labelClassName?: string;\n  /**\n   * The label of the checkbox for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * The content displayed next to the checkbox.\n   */\n  label?: React.ReactNode | Array<React.ReactNode>;\n  /**\n   * The ID of an element describing the checkbox.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * Callback fired when the checkbox value changes.\n   */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * If true, controls the checked state of the checkbox.\n   */\n  checked?: boolean;\n  /**\n   * If true, displays an indeterminate state.\n   */\n  indeterminate?: boolean;\n  /**\n   * If true, the checkbox automatically receives focus.\n   */\n  autoFocus?: boolean;\n  /**\n   * If true, the checkbox is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The initial checked state of the checkbox.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The value submitted with the form when checked.\n   */\n  value?: string;\n  /**\n   * The name of the checkbox, used for form submission.\n   */\n  name?: string;\n  /**\n   * The tab order of the checkbox.\n   */\n  tabIndex?: number;\n  /**\n   * If true, uses separate labels with htmlFor/id association instead of wrapping the input.\n   * If using this the id prop is required for it to function correctly.\n   */\n  separateLabel?: boolean;\n}\n\nconst Checkbox = forwardRef(\n  (\n    {\n      className,\n      checkboxClassName,\n      labelClassName,\n      ariaLabel,\n      label,\n      ariaLabelledBy,\n      onChange = NOOP,\n      checked,\n      autoFocus,\n      indeterminate = false,\n      disabled = false,\n      defaultChecked,\n      tabIndex,\n      value = \"\",\n      name = \"\",\n      id,\n      separateLabel = false,\n      \"data-testid\": dataTestId\n    }: CheckBoxProps,\n    ref: React.ForwardedRef<HTMLInputElement>\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    const mergedInputRef = useMergeRef(ref, inputRef);\n    const iconContainerRef = useRef<HTMLDivElement>(null);\n\n    const onMouseUpCallback = useCallback(() => {\n      const input = inputRef.current;\n      if (!input) return;\n\n      window.requestAnimationFrame(() => {\n        window.requestAnimationFrame(() => {\n          input.blur();\n        });\n      });\n    }, [inputRef]);\n    let overrideDefaultChecked = defaultChecked;\n\n    // If component did not receive default checked and checked props, choose default checked as\n    // default behavior (handle isChecked logic inside input) and set default value\n    if (isNil(overrideDefaultChecked) && isNil(checked)) {\n      overrideDefaultChecked = false;\n    }\n\n    useEffect(() => {\n      if (inputRef.current) {\n        inputRef.current.indeterminate = indeterminate;\n      }\n    }, [inputRef, indeterminate]);\n\n    const { onClickCapture: onClickCaptureLabel } = useSupportFirefoxLabelClick({ inputRef });\n\n    const finalAriaLabel = useMemo(() => {\n      if (ariaLabel) return ariaLabel;\n      if (typeof label === \"string\") return label;\n      return \"\";\n    }, [ariaLabel, label]);\n\n    if (separateLabel) {\n      return (\n        <div\n          className={cx(styles.wrapper, className)}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n          data-vibe={ComponentVibeId.CHECKBOX}\n        >\n          <input\n            ref={mergedInputRef}\n            id={id}\n            className={styles.input}\n            value={value}\n            name={name}\n            type=\"checkbox\"\n            autoFocus={autoFocus}\n            onChange={onChange}\n            defaultChecked={overrideDefaultChecked}\n            disabled={disabled}\n            aria-label={finalAriaLabel}\n            aria-labelledby={ariaLabelledBy}\n            checked={checked}\n            tabIndex={tabIndex}\n          />\n          {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}\n          <label\n            htmlFor={id}\n            className={cx(styles.checkbox, checkboxClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n            onMouseUp={onMouseUpCallback}\n            onClickCapture={onClickCaptureLabel}\n          >\n            <Icon\n              className={styles.icon}\n              iconType=\"svg\"\n              icon={indeterminate ? Remove : Check}\n              ignoreFocusStyle\n              ariaHidden={true}\n              iconSize=\"16\"\n            />\n          </label>\n          {label === false ? null : (\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n            <label\n              htmlFor={id}\n              className={cx(styles.label, labelClassName)}\n              data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n              onMouseUp={onMouseUpCallback}\n              onClickCapture={onClickCaptureLabel}\n            >\n              <Text element=\"span\" type=\"text2\">\n                {label}\n              </Text>\n            </label>\n          )}\n        </div>\n      );\n    }\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n      <label\n        className={cx(styles.wrapper, className)}\n        onMouseUp={onMouseUpCallback}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n        htmlFor={id}\n        onClickCapture={onClickCaptureLabel}\n        data-vibe={ComponentVibeId.CHECKBOX}\n      >\n        <input\n          ref={mergedInputRef}\n          id={id}\n          className={styles.input}\n          value={value}\n          name={name}\n          type=\"checkbox\"\n          autoFocus={autoFocus}\n          onChange={onChange}\n          defaultChecked={overrideDefaultChecked}\n          disabled={disabled}\n          aria-label={finalAriaLabel}\n          aria-labelledby={ariaLabelledBy}\n          checked={checked}\n          tabIndex={tabIndex}\n        />\n        <div\n          className={cx(styles.checkbox, checkboxClassName)}\n          ref={iconContainerRef}\n          data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n        >\n          <Icon\n            className={styles.icon}\n            iconType=\"svg\"\n            icon={indeterminate ? Remove : Check}\n            ignoreFocusStyle\n            ariaHidden={true}\n            iconSize=\"16\"\n          />\n        </div>\n        {label === false ? null : (\n          <Text\n            element=\"span\"\n            type=\"text2\"\n            className={cx(styles.label, labelClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n          >\n            {label}\n          </Text>\n        )}\n      </label>\n    );\n  }\n);\n\nexport default Checkbox;\n"],"names":["Checkbox","forwardRef","_ref","ref","className","checkboxClassName","labelClassName","ariaLabel","label","ariaLabelledBy","_ref$onChange","onChange","NOOP","checked","autoFocus","_ref$indeterminate","indeterminate","_ref$disabled","disabled","defaultChecked","tabIndex","_ref$value","value","_ref$name","name","id","_ref$separateLabel","separateLabel","dataTestId","inputRef","useRef","mergedInputRef","useMergeRef","iconContainerRef","onMouseUpCallback","useCallback","input","current","window","requestAnimationFrame","blur","overrideDefaultChecked","isNil","useEffect","onClickCaptureLabel","useSupportFirefoxLabelClick","onClickCapture","finalAriaLabel","useMemo","React","createElement","cx","styles","wrapper","getTestId","ComponentDefaultTestId","CHECKBOX","ComponentVibeId","type","htmlFor","checkbox","CHECKBOX_CHECKBOX","onMouseUp","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","CHECKBOX_LABEL","Text","element"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Checkbox/Checkbox.module.scss.js

@@ -1,2 +1,2 @@
-var n={wrapper:"wrapper",checkbox:"checkbox",icon:"icon",label:"label",input:"input",checkboxGrowAnimation:"checkboxGrowAnimation"};!function(n){const o="s_id-3c767214051a_3_61_1";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const r=document.createElement("style");r.id=o,e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}('/* stylelint-disable selector-class-pattern */\n.wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n.checkbox {\n  cursor: pointer;\n  visibility: visible;\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 16px;\n  width: 16px;\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  border-radius: 2px;\n  transition: transform var(--motion-productive-short) var(--motion-timing-enter);\n  position: relative;\n  overflow: hidden;\n  background-color: var(--secondary-background-color);\n}\n.checkbox:after {\n  content: " ";\n  background-color: transparent;\n  position: absolute;\n  height: 16px;\n  z-index: 2;\n  left: 0;\n  right: 0;\n  width: 100%;\n}\n.checkbox:hover {\n  border-color: var(--secondary-text-color);\n}\n.icon {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n.label {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  cursor: pointer;\n  user-select: none;\n  margin-inline-start: var(--spacing-small);\n}\n/* Since it is not possible to change the design of the checkbox according to the requirements using css, */\n/* we hide the checkbox and draw a new one instead. */\n/* In order to allow accessibility, all operations will be performed on the hidden checkbox and be reflected */\n.input {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}\n/* For any active attribute in the hidden checkbox, we will change the appearance of the checkbox we drew in its place. */\n.input:focus + .checkbox {\n  border-color: var(--secondary-text-color);\n}\n.input:focus:checked + .checkbox {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input:focus-visible + .checkbox {\n  outline: none;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5);\n  border-radius: 2px;\n}\n.input:checked:focus + .checkbox:after,\n.input:indeterminate:focus + .checkbox:after {\n  background-color: var(--primary-hover-color);\n}\n.input:checked + .checkbox,\n.input:indeterminate + .checkbox {\n  animation: checkboxGrowAnimation var(--motion-productive-short);\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n.input:checked + .checkbox:hover,\n.input:indeterminate + .checkbox:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input:checked + .checkbox:hover:after,\n.input:indeterminate + .checkbox:hover:after {\n  background-color: var(--primary-hover-color);\n}\n.input:checked + .checkbox:after,\n.input:indeterminate + .checkbox:after {\n  content: " ";\n  background-color: var(--primary-color);\n  height: 16px;\n  transform: scaleX(0);\n  transition: transform var(--motion-productive-long);\n  transform-origin: right;\n  left: 0;\n}\n.input:checked + .checkbox > .icon,\n.input:indeterminate + .checkbox > .icon {\n  visibility: visible;\n}\n.input:checked:disabled + .checkbox:after,\n.input:indeterminate:disabled + .checkbox:after {\n  background-color: var(--disabled-background-color);\n}\n.input:disabled + .checkbox .icon,\n.input:disabled + .checkbox:hover .icon {\n  color: var(--disabled-text-color);\n}\n.input:disabled + .checkbox,\n.input:disabled + .checkbox:hover {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n.input:disabled ~ .label {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n@keyframes checkboxGrowAnimation {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{n as default};
+var n={wrapper:"wrapper",checkbox:"checkbox",icon:"icon",label:"label",input:"input",checkboxGrowAnimation:"checkboxGrowAnimation"};!function(n){const o="s_id-3c767214051a_3_62_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const r=document.createElement("style");r.id=o,e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}('/* stylelint-disable selector-class-pattern */\n.wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n.checkbox {\n  cursor: pointer;\n  visibility: visible;\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  height: 16px;\n  width: 16px;\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  border-radius: 2px;\n  transition: transform var(--motion-productive-short) var(--motion-timing-enter);\n  position: relative;\n  overflow: hidden;\n  background-color: var(--secondary-background-color);\n}\n.checkbox:after {\n  content: " ";\n  background-color: transparent;\n  position: absolute;\n  height: 16px;\n  z-index: 2;\n  left: 0;\n  right: 0;\n  width: 100%;\n}\n.checkbox:hover {\n  border-color: var(--secondary-text-color);\n}\n.icon {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n.label {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  cursor: pointer;\n  user-select: none;\n  margin-inline-start: var(--spacing-small);\n}\n/* Since it is not possible to change the design of the checkbox according to the requirements using css, */\n/* we hide the checkbox and draw a new one instead. */\n/* In order to allow accessibility, all operations will be performed on the hidden checkbox and be reflected */\n.input {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}\n/* For any active attribute in the hidden checkbox, we will change the appearance of the checkbox we drew in its place. */\n.input:focus + .checkbox {\n  border-color: var(--secondary-text-color);\n}\n.input:focus:checked + .checkbox {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input:focus-visible + .checkbox {\n  outline: none;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5);\n  border-radius: 2px;\n}\n.input:checked:focus + .checkbox:after,\n.input:indeterminate:focus + .checkbox:after {\n  background-color: var(--primary-hover-color);\n}\n.input:checked + .checkbox,\n.input:indeterminate + .checkbox {\n  animation: checkboxGrowAnimation var(--motion-productive-short);\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n.input:checked + .checkbox:hover,\n.input:indeterminate + .checkbox:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input:checked + .checkbox:hover:after,\n.input:indeterminate + .checkbox:hover:after {\n  background-color: var(--primary-hover-color);\n}\n.input:checked + .checkbox:after,\n.input:indeterminate + .checkbox:after {\n  content: " ";\n  background-color: var(--primary-color);\n  height: 16px;\n  transform: scaleX(0);\n  transition: transform var(--motion-productive-long);\n  transform-origin: right;\n  left: 0;\n}\n.input:checked + .checkbox > .icon,\n.input:indeterminate + .checkbox > .icon {\n  visibility: visible;\n}\n.input:checked:disabled + .checkbox:after,\n.input:indeterminate:disabled + .checkbox:after {\n  background-color: var(--disabled-background-color);\n}\n.input:disabled + .checkbox .icon,\n.input:disabled + .checkbox:hover .icon {\n  color: var(--disabled-text-color);\n}\n.input:disabled + .checkbox,\n.input:disabled + .checkbox:hover {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n.input:disabled ~ .label {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n@keyframes checkboxGrowAnimation {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{n as default};
 //# sourceMappingURL=Checkbox.module.scss.js.map

package/dist/mocked_classnames/src/components/Chips/Chips.module.scss.js

@@ -1,2 +1,2 @@
-var e={clickable:"clickable","focus-visible":"focus-visible",disabled:"disabled",disableTextSelection:"disableTextSelection",chips:"chips","chips-pop-in-emphasized":"chips-pop-in-emphasized",border:"border",withUserSelect:"withUserSelect",noMargin:"noMargin",label:"label",noAnimation:"noAnimation",icon:"icon",avatar:"avatar",customRenderer:"customRenderer",left:"left",right:"right",close:"close",defaultCursor:"defaultCursor"};!function(e){const n="s_id-b08f85dbbdad_3_61_1";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable {\n  cursor: pointer;\n}\n.clickable:focus-visible, .clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.clickable.disabled {\n  cursor: default;\n}\n.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n/* stylelint-disable selector-class-pattern */\n.chips {\n  display: inline-flex;\n  overflow: hidden;\n  height: 24px;\n  border-radius: 4px;\n  padding: 0 8px;\n  align-items: center;\n  justify-content: center;\n  margin: var(--chips-margin, 0 var(--spacing-xs));\n  user-select: none;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  color: var(--primary-text-color);\n  animation: chips-pop-in-emphasized var(--motion-productive-medium) var(--motion-timing-emphasize);\n}\n.chips.border {\n  border: 1px solid var(--primary-background-color);\n}\n.chips.withUserSelect {\n  user-select: text;\n  cursor: text;\n}\n.chips.noMargin {\n  margin: 0;\n}\n.chips .label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.chips.noAnimation {\n  animation: none;\n}\n.chips .icon,\n.chips .avatar,\n.chips .customRenderer {\n  min-width: 18px;\n}\n.chips .icon.left,\n.chips .avatar.left,\n.chips .customRenderer.left {\n  margin-right: var(--spacing-xs);\n}\n.chips .icon.right,\n.chips .avatar.right,\n.chips .customRenderer.right {\n  margin-left: var(--spacing-xs);\n}\n.chips .icon.close,\n.chips .avatar.close,\n.chips .customRenderer.close {\n  margin-left: var(--spacing-xs);\n  color: var(--primary-text-color);\n}\n.chips.disabled .icon {\n  color: var(--disabled-text-color);\n}\n.chips.disabled .label {\n  color: var(--disabled-text-color);\n}\n.chips.defaultCursor {\n  cursor: default;\n}\n.chips.clickable {\n  cursor: pointer;\n}\n.chips.clickable:focus-visible, .chips.clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.chips.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.chips.clickable.disabled {\n  cursor: default;\n}\n.chips.clickable.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n@keyframes chips-pop-in-emphasized {\n  0% {\n    transform: scale(0.3);\n    opacity: 0;\n  }\n  70% {\n    opacity: 1;\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{e as default};
+var e={clickable:"clickable","focus-visible":"focus-visible",disabled:"disabled",disableTextSelection:"disableTextSelection",chips:"chips","chips-pop-in-emphasized":"chips-pop-in-emphasized",border:"border",withUserSelect:"withUserSelect",noMargin:"noMargin",label:"label",noAnimation:"noAnimation",icon:"icon",avatar:"avatar",customRenderer:"customRenderer",left:"left",right:"right",close:"close",defaultCursor:"defaultCursor"};!function(e){const n="s_id-b08f85dbbdad_3_62_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable {\n  cursor: pointer;\n}\n.clickable:focus-visible, .clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.clickable.disabled {\n  cursor: default;\n}\n.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n/* stylelint-disable selector-class-pattern */\n.chips {\n  display: inline-flex;\n  overflow: hidden;\n  height: 24px;\n  border-radius: 4px;\n  padding: 0 8px;\n  align-items: center;\n  justify-content: center;\n  margin: var(--chips-margin, 0 var(--spacing-xs));\n  user-select: none;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  color: var(--primary-text-color);\n  animation: chips-pop-in-emphasized var(--motion-productive-medium) var(--motion-timing-emphasize);\n}\n.chips.border {\n  border: 1px solid var(--primary-background-color);\n}\n.chips.withUserSelect {\n  user-select: text;\n  cursor: text;\n}\n.chips.noMargin {\n  margin: 0;\n}\n.chips .label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.chips.noAnimation {\n  animation: none;\n}\n.chips .icon,\n.chips .avatar,\n.chips .customRenderer {\n  min-width: 18px;\n}\n.chips .icon.left,\n.chips .avatar.left,\n.chips .customRenderer.left {\n  margin-right: var(--spacing-xs);\n}\n.chips .icon.right,\n.chips .avatar.right,\n.chips .customRenderer.right {\n  margin-left: var(--spacing-xs);\n}\n.chips .icon.close,\n.chips .avatar.close,\n.chips .customRenderer.close {\n  margin-left: var(--spacing-xs);\n  color: var(--primary-text-color);\n}\n.chips.disabled .icon {\n  color: var(--disabled-text-color);\n}\n.chips.disabled .label {\n  color: var(--disabled-text-color);\n}\n.chips.defaultCursor {\n  cursor: default;\n}\n.chips.clickable {\n  cursor: pointer;\n}\n.chips.clickable:focus-visible, .chips.clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.chips.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.chips.clickable.disabled {\n  cursor: default;\n}\n.chips.clickable.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n@keyframes chips-pop-in-emphasized {\n  0% {\n    transform: scale(0.3);\n    opacity: 0;\n  }\n  70% {\n    opacity: 1;\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{e as default};
 //# sourceMappingURL=Chips.module.scss.js.map

package/dist/mocked_classnames/src/components/Clickable/Clickable.js

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import a from"classnames";import o,{forwardRef as i}from"react";import{noop as s}from"lodash-es";import d from"../../hooks/useClickableProps/useClickableProps.js";import r from"./Clickable.module.scss.js";var l=i((function(i,l){var t=i.elementType,n=void 0===t?"div":t,c=i.className,p=void 0===c?"":c,m=i.children,u=i.role,b=i.onClick,v=i.enableTextSelection,f=void 0!==v&&v,k=i.onMouseDown,x=i.onMouseEnter,M=i.onMouseLeave,P=i.tabIndex,j=i.disabled,C=void 0!==j&&j,E=i.style,H=d({onClick:void 0===b?s:b,onMouseDown:void 0===k?s:k,onMouseEnter:void 0===x?s:x,onMouseLeave:void 0===M?s:M,disabled:C,id:i.id,"data-testid":i["data-testid"],role:void 0===u?"button":u,tabIndex:void 0===P?"0":P,ariaLabel:i.ariaLabel,ariaHidden:i.ariaHidden,ariaHasPopup:i.ariaHasPopup,ariaExpanded:i.ariaExpanded},l),y=a(r.clickable,p,e(e({},r.disabled,C),r.disableTextSelection,!f));return o.createElement(n,Object.assign(Object.assign({},H),{className:y,style:E}),m)}));export{l as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import a from"classnames";import o,{forwardRef as i}from"react";import{noop as s}from"es-toolkit/compat";import r from"../../hooks/useClickableProps/useClickableProps.js";import t from"./Clickable.module.scss.js";var d=i((function(i,d){var l=i.elementType,n=void 0===l?"div":l,c=i.className,p=void 0===c?"":c,m=i.children,u=i.role,b=i.onClick,v=i.enableTextSelection,f=void 0!==v&&v,k=i.onMouseDown,x=i.onMouseEnter,M=i.onMouseLeave,P=i.tabIndex,j=i.disabled,C=void 0!==j&&j,E=i.style,H=r({onClick:void 0===b?s:b,onMouseDown:void 0===k?s:k,onMouseEnter:void 0===x?s:x,onMouseLeave:void 0===M?s:M,disabled:C,id:i.id,"data-testid":i["data-testid"],role:void 0===u?"button":u,tabIndex:void 0===P?"0":P,ariaLabel:i.ariaLabel,ariaHidden:i.ariaHidden,ariaHasPopup:i.ariaHasPopup,ariaExpanded:i.ariaExpanded},d),y=a(t.clickable,p,e(e({},t.disabled,C),t.disableTextSelection,!f));return o.createElement(n,Object.assign(Object.assign({},H),{className:y,style:E}),m)}));export{d as default};
 //# sourceMappingURL=Clickable.js.map

package/dist/mocked_classnames/src/components/Clickable/Clickable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Clickable.js","sources":["../../../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type AriaRole, forwardRef } from \"react\";\nimport { noop as NOOP } from \"lodash-es\";\nimport { type VibeComponentProps } from \"../../types\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Clickable.module.scss\";\n\nexport interface ClickableProps extends VibeComponentProps {\n  /**\n   * The HTML element or custom component used as the root.\n   */\n  elementType?: keyof JSX.IntrinsicElements | string;\n  /**\n   * The content inside the clickable element.\n   */\n  children?: React.ReactNode;\n  /**\n   * The ARIA role of the element.\n   */\n  role?: AriaRole;\n  /**\n   * Callback fired when the element is clicked.\n   */\n  onClick?: (event: React.MouseEvent | React.KeyboardEvent) => void;\n  /**\n   * If true, allows text selection inside the element.\n   */\n  enableTextSelection?: boolean;\n  /**\n   * Callback fired when the mouse button is pressed down on the element.\n   */\n  onMouseDown?: (event: React.MouseEvent) => void;\n  /**\n   * Callback fired when the mouse enters the element.\n   */\n  onMouseEnter?: (event: React.MouseEvent) => void;\n  /**\n   * Callback fired when the mouse leaves the element.\n   */\n  onMouseLeave?: (event: React.MouseEvent) => void;\n  /**\n   * The label of the element for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * If true, hides the element from assistive technologies.\n   */\n  ariaHidden?: boolean;\n  // TODO: [breaking] remove string type\n  /**\n   * Indicates the presence of a popup associated with the element.\n   */\n  ariaHasPopup?: boolean | string;\n  /**\n   * If true, indicates that the associated popup is open.\n   */\n  ariaExpanded?: boolean;\n  // TODO: [breaking] remove string type\n  /**\n   * The tab order of the element.\n   */\n  tabIndex?: string | number;\n  /**\n   * If true, the element is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Inline styles applied to the element.\n   */\n  style?: React.CSSProperties;\n}\n\nconst Clickable = forwardRef(\n  (\n    {\n      elementType = \"div\",\n      className = \"\",\n      id,\n      children,\n      role = \"button\",\n      onClick = NOOP,\n      enableTextSelection = false,\n      onMouseDown = NOOP,\n      onMouseEnter = NOOP,\n      onMouseLeave = NOOP,\n      ariaLabel,\n      ariaHidden,\n      ariaHasPopup,\n      ariaExpanded,\n      tabIndex = \"0\",\n      disabled = false,\n      style,\n      \"data-testid\": dataTestId\n    }: ClickableProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const clickableProps = useClickableProps(\n      {\n        onClick,\n        onMouseDown,\n        onMouseEnter,\n        onMouseLeave,\n        disabled,\n        id,\n        \"data-testid\": dataTestId,\n        role,\n        tabIndex,\n        ariaLabel,\n        ariaHidden,\n        ariaHasPopup,\n        ariaExpanded\n      },\n      ref\n    );\n    const overrideClassName = cx(styles.clickable, className, {\n      [styles.disabled]: disabled,\n      [styles.disableTextSelection]: !enableTextSelection\n    });\n\n    return React.createElement(\n      elementType,\n      {\n        ...clickableProps,\n        className: overrideClassName,\n        style: style\n      },\n      children\n    );\n  }\n);\n\nexport default Clickable;\n"],"names":["Clickable","forwardRef","_ref","ref","_ref$elementType","elementType","_ref$className","className","children","_ref$role","role","_ref$onClick","onClick","_ref$enableTextSelect","enableTextSelection","_ref$onMouseDown","onMouseDown","_ref$onMouseEnter","onMouseEnter","_ref$onMouseLeave","onMouseLeave","_ref$tabIndex","tabIndex","_ref$disabled","disabled","style","clickableProps","useClickableProps","NOOP","id","ariaLabel","ariaHidden","ariaHasPopup","ariaExpanded","overrideClassName","cx","styles","clickable","_defineProperty","disableTextSelection","React","createElement","Object","assign"],"mappings":"6RAwEMA,IAAAA,EAAYC,GAChB,SAAAC,EAqBEC,GACE,IAAAC,EAAAF,EApBAG,YAAAA,OAAc,IAAHD,EAAG,MAAKA,EAAAE,EAAAJ,EACnBK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAEdE,EAAQN,EAARM,SAAQC,EAAAP,EACRQ,KAAeC,EAAAT,EACfU,QAAcC,EAAAX,EACdY,oBAAAA,OAAsB,IAAHD,GAAQA,EAAAE,EAAAb,EAC3Bc,YAAkBC,EAAAf,EAClBgB,aAAmBC,EAAAjB,EACnBkB,aAIYC,EAAAnB,EACZoB,SAAcC,EAAArB,EACdsB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAKvB,EAALuB,MAKIC,EAAiBC,EACrB,CACEf,aAlBQgB,IAAHjB,EAAGiB,EAAIjB,EAmBZK,iBAjBYY,IAAHb,EAAGa,EAAIb,EAkBhBG,kBAjBaU,IAAHX,EAAGW,EAAIX,EAkBjBG,kBAjBaQ,IAAHT,EAAGS,EAAIT,EAkBjBK,SAAAA,EACAK,GA1BA3B,EAAF2B,GA2BE,cAZuB3B,EAAzB,eAaEQ,UA1BK,IAAHD,EAAG,SAAQA,EA2Bba,cAjBS,IAAHD,EAAG,IAAGA,EAkBZS,UAtBO5B,EAAT4B,UAuBEC,WAtBQ7B,EAAV6B,WAuBEC,aAtBU9B,EAAZ8B,aAuBEC,aAtBU/B,EAAZ+B,cAwBA9B,GAEI+B,EAAoBC,EAAGC,EAAOC,UAAW9B,EAAS+B,EAAAA,EACrDF,CAAAA,EAAAA,EAAOZ,SAAWA,GAClBY,EAAOG,sBAAwBzB,IAGlC,OAAO0B,EAAMC,cACXpC,EAAWqC,OAAAC,OAAAD,OAAAC,OAAA,GAENjB,GACH,CAAAnB,UAAW2B,EACXT,MAAOA,IAETjB,EAEJ"}
+{"version":3,"file":"Clickable.js","sources":["../../../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type AriaRole, forwardRef } from \"react\";\nimport { noop as NOOP } from \"es-toolkit/compat\";\nimport { type VibeComponentProps } from \"../../types\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Clickable.module.scss\";\n\nexport interface ClickableProps extends VibeComponentProps {\n  /**\n   * The HTML element or custom component used as the root.\n   */\n  elementType?: keyof JSX.IntrinsicElements | string;\n  /**\n   * The content inside the clickable element.\n   */\n  children?: React.ReactNode;\n  /**\n   * The ARIA role of the element.\n   */\n  role?: AriaRole;\n  /**\n   * Callback fired when the element is clicked.\n   */\n  onClick?: (event: React.MouseEvent | React.KeyboardEvent) => void;\n  /**\n   * If true, allows text selection inside the element.\n   */\n  enableTextSelection?: boolean;\n  /**\n   * Callback fired when the mouse button is pressed down on the element.\n   */\n  onMouseDown?: (event: React.MouseEvent) => void;\n  /**\n   * Callback fired when the mouse enters the element.\n   */\n  onMouseEnter?: (event: React.MouseEvent) => void;\n  /**\n   * Callback fired when the mouse leaves the element.\n   */\n  onMouseLeave?: (event: React.MouseEvent) => void;\n  /**\n   * The label of the element for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * If true, hides the element from assistive technologies.\n   */\n  ariaHidden?: boolean;\n  // TODO: [breaking] remove string type\n  /**\n   * Indicates the presence of a popup associated with the element.\n   */\n  ariaHasPopup?: boolean | string;\n  /**\n   * If true, indicates that the associated popup is open.\n   */\n  ariaExpanded?: boolean;\n  // TODO: [breaking] remove string type\n  /**\n   * The tab order of the element.\n   */\n  tabIndex?: string | number;\n  /**\n   * If true, the element is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Inline styles applied to the element.\n   */\n  style?: React.CSSProperties;\n}\n\nconst Clickable = forwardRef(\n  (\n    {\n      elementType = \"div\",\n      className = \"\",\n      id,\n      children,\n      role = \"button\",\n      onClick = NOOP,\n      enableTextSelection = false,\n      onMouseDown = NOOP,\n      onMouseEnter = NOOP,\n      onMouseLeave = NOOP,\n      ariaLabel,\n      ariaHidden,\n      ariaHasPopup,\n      ariaExpanded,\n      tabIndex = \"0\",\n      disabled = false,\n      style,\n      \"data-testid\": dataTestId\n    }: ClickableProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const clickableProps = useClickableProps(\n      {\n        onClick,\n        onMouseDown,\n        onMouseEnter,\n        onMouseLeave,\n        disabled,\n        id,\n        \"data-testid\": dataTestId,\n        role,\n        tabIndex,\n        ariaLabel,\n        ariaHidden,\n        ariaHasPopup,\n        ariaExpanded\n      },\n      ref\n    );\n    const overrideClassName = cx(styles.clickable, className, {\n      [styles.disabled]: disabled,\n      [styles.disableTextSelection]: !enableTextSelection\n    });\n\n    return React.createElement(\n      elementType,\n      {\n        ...clickableProps,\n        className: overrideClassName,\n        style: style\n      },\n      children\n    );\n  }\n);\n\nexport default Clickable;\n"],"names":["Clickable","forwardRef","_ref","ref","_ref$elementType","elementType","_ref$className","className","children","_ref$role","role","_ref$onClick","onClick","_ref$enableTextSelect","enableTextSelection","_ref$onMouseDown","onMouseDown","_ref$onMouseEnter","onMouseEnter","_ref$onMouseLeave","onMouseLeave","_ref$tabIndex","tabIndex","_ref$disabled","disabled","style","clickableProps","useClickableProps","NOOP","id","ariaLabel","ariaHidden","ariaHasPopup","ariaExpanded","overrideClassName","cx","styles","clickable","_defineProperty","disableTextSelection","React","createElement","Object","assign"],"mappings":"qSAwEMA,IAAAA,EAAYC,GAChB,SAAAC,EAqBEC,GACE,IAAAC,EAAAF,EApBAG,YAAAA,OAAc,IAAHD,EAAG,MAAKA,EAAAE,EAAAJ,EACnBK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAEdE,EAAQN,EAARM,SAAQC,EAAAP,EACRQ,KAAeC,EAAAT,EACfU,QAAcC,EAAAX,EACdY,oBAAAA,OAAsB,IAAHD,GAAQA,EAAAE,EAAAb,EAC3Bc,YAAkBC,EAAAf,EAClBgB,aAAmBC,EAAAjB,EACnBkB,aAIYC,EAAAnB,EACZoB,SAAcC,EAAArB,EACdsB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAKvB,EAALuB,MAKIC,EAAiBC,EACrB,CACEf,aAlBQgB,IAAHjB,EAAGiB,EAAIjB,EAmBZK,iBAjBYY,IAAHb,EAAGa,EAAIb,EAkBhBG,kBAjBaU,IAAHX,EAAGW,EAAIX,EAkBjBG,kBAjBaQ,IAAHT,EAAGS,EAAIT,EAkBjBK,SAAAA,EACAK,GA1BA3B,EAAF2B,GA2BE,cAZuB3B,EAAzB,eAaEQ,UA1BK,IAAHD,EAAG,SAAQA,EA2Bba,cAjBS,IAAHD,EAAG,IAAGA,EAkBZS,UAtBO5B,EAAT4B,UAuBEC,WAtBQ7B,EAAV6B,WAuBEC,aAtBU9B,EAAZ8B,aAuBEC,aAtBU/B,EAAZ+B,cAwBA9B,GAEI+B,EAAoBC,EAAGC,EAAOC,UAAW9B,EAAS+B,EAAAA,EACrDF,CAAAA,EAAAA,EAAOZ,SAAWA,GAClBY,EAAOG,sBAAwBzB,IAGlC,OAAO0B,EAAMC,cACXpC,EAAWqC,OAAAC,OAAAD,OAAAC,OAAA,GAENjB,GACH,CAAAnB,UAAW2B,EACXT,MAAOA,IAETjB,EAEJ"}

package/dist/mocked_classnames/src/components/Clickable/Clickable.module.scss.js

@@ -1,2 +1,2 @@
-var e={clickable:"clickable","focus-visible":"focus-visible",disabled:"disabled",disableTextSelection:"disableTextSelection"};!function(e){const n="s_id-8d33a9ee9e1f_3_61_1";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const l=document.createElement("style");l.id=n,i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable {\n  cursor: pointer;\n}\n.clickable:focus-visible, .clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.clickable.disabled {\n  cursor: default;\n}\n.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}");export{e as default};
+var e={clickable:"clickable","focus-visible":"focus-visible",disabled:"disabled",disableTextSelection:"disableTextSelection"};!function(e){const n="s_id-8d33a9ee9e1f_3_62_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const l=document.createElement("style");l.id=n,i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable {\n  cursor: pointer;\n}\n.clickable:focus-visible, .clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.clickable.disabled {\n  cursor: default;\n}\n.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}");export{e as default};
 //# sourceMappingURL=Clickable.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/ColorPicker.module.scss.js

@@ -1,2 +1,2 @@
-var e={colorPicker:"colorPicker",colorPickerDialogContent:"colorPickerDialogContent"};!function(e){const t="s_id-ffacbf9b6446_3_61_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".colorPicker.colorPickerDialogContent {\n  z-index: 1;\n  padding: 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}");export{e as default};
+var e={colorPicker:"colorPicker",colorPickerDialogContent:"colorPickerDialogContent"};!function(e){const t="s_id-ffacbf9b6446_3_62_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".colorPicker.colorPickerDialogContent {\n  z-index: 1;\n  padding: 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}");export{e as default};
 //# sourceMappingURL=ColorPicker.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.module.scss.js

@@ -1,2 +1,2 @@
-var e={clearColorIcon:"clearColorIcon",clearColorButton:"clearColorButton"};!function(e){const n="s_id-774e60a23ee3_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".clearColorIcon {\n  margin-right: var(--spacing-small);\n}\n\n.clearColorButton {\n  margin-top: var(--spacing-small);\n}");export{e as default};
+var e={clearColorIcon:"clearColorIcon",clearColorButton:"clearColorButton"};!function(e){const n="s_id-774e60a23ee3_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".clearColorIcon {\n  margin-right: var(--spacing-small);\n}\n\n.clearColorButton {\n  margin-top: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=ColorPickerClearButton.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.module.scss.js

@@ -1,2 +1,2 @@
-var e={colorsGrid:"colorsGrid"};!function(e){const n="s_id-0a5f0eb78ee4_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".colorsGrid {\n  padding: 0;\n  outline: none;\n  display: flex;\n  flex-wrap: wrap;\n}");export{e as default};
+var e={colorsGrid:"colorsGrid"};!function(e){const n="s_id-0a5f0eb78ee4_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".colorsGrid {\n  padding: 0;\n  outline: none;\n  display: flex;\n  flex-wrap: wrap;\n}");export{e as default};
 //# sourceMappingURL=ColorPickerColorsGrid.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.js

@@ -1,2 +1,2 @@
-import{toConsumableArray as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{difference as r,intersection as e}from"lodash-es";import t,{forwardRef as i,useRef as l,useCallback as n,useMemo as s}from"react";import{BaseSizes as a}from"../../../../constants/sizes.js";import{ColorStyle as c,contentColors as d}from"../../../../utils/colors-vars-map.js";import{ColorShapes as m,DEFAULT_NUMBER_OF_COLORS_IN_LINE as u}from"../../ColorPickerConstants.js";import{calculateColorPickerWidth as f}from"../../services/ColorPickerStyleService.js";import{useGridKeyboardNavigationContext as p,GridKeyboardNavigationContext as C}from"../../../GridKeyboardNavigationContext/GridKeyboardNavigationContext.js";import v from"./ColorPickerClearButton.js";import I from"./ColorPickerColorsGrid.js";import{withStaticProps as h}from"../../../../types/withStaticProps.js";import S from"../../../../hooks/useMergeRef.js";import j from"../../../../../icons/dist/react/NoColor.js";var y=h(i((function(i,c){var m=i.className,h=i.onValueChange,y=i.value,k=i.noColorText,b=i.colorStyle,g=void 0===b?"regular":b,N=i.ColorIndicatorIcon,x=i.SelectedIndicatorIcon,B=i.shouldRenderIndicatorWithoutBackground,E=i.NoColorIcon,M=void 0===E?j:E,P=i.isBlackListMode,w=void 0===P||P,z=i.colorsList,L=i.isMultiselect,O=i.colorSize,R=void 0===O?a.MEDIUM:O,T=i.numberOfColorsInLine,G=void 0===T?u:T,K=i.tooltipContentByColor,U=void 0===K?{}:K,W=i.focusOnMount,_=i.colorShape,q=void 0===_?"square":_,A=i.forceUseRawColorList,D=i.showColorNameTooltip,H=i.id,V=i["data-testid"],F=l(null),J=S(c,F),Q=l(null),X=l(null),Y=n((function(){h(null)}),[h]),Z=s((function(){return A?z:w?r(d,z):e(d,z)}),[A,w,z]),$=n((function(r){if(L){var e=o(y);if(e.includes(r)){var t=e.indexOf(r);t>-1&&e.splice(t,1)}else e.push(r);h(e)}else h([r])}),[L,h,y]),oo=s((function(){return[{topElement:Q,bottomElement:X}]}),[]),ro=p(oo,F),eo=f(R,G);return t.createElement("div",{className:m,style:{width:eo},ref:J,tabIndex:-1},t.createElement(C.Provider,{value:ro},t.createElement(I,{ref:Q,onColorClicked:$,colorsToRender:Z,numberOfColorsInLine:G,focusOnMount:W,value:y,colorStyle:g,ColorIndicatorIcon:N,shouldRenderIndicatorWithoutBackground:B,SelectedIndicatorIcon:x,colorSize:R,tooltipContentByColor:U,colorShape:q,showColorNameTooltip:D,id:H,"data-testid":V}),k&&t.createElement(v,{Icon:M,onClick:Y,text:k,ref:X})))})),{sizes:a,colorStyles:c,colorSizes:a,colorShapes:m});export{y as default};
+import{toConsumableArray as o}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{difference as r,intersection as e}from"es-toolkit/compat";import t,{forwardRef as i,useRef as l,useCallback as n,useMemo as s}from"react";import{BaseSizes as a}from"../../../../constants/sizes.js";import{ColorStyle as c,contentColors as d}from"../../../../utils/colors-vars-map.js";import{ColorShapes as m,DEFAULT_NUMBER_OF_COLORS_IN_LINE as u}from"../../ColorPickerConstants.js";import{calculateColorPickerWidth as f}from"../../services/ColorPickerStyleService.js";import{useGridKeyboardNavigationContext as p,GridKeyboardNavigationContext as C}from"../../../GridKeyboardNavigationContext/GridKeyboardNavigationContext.js";import v from"./ColorPickerClearButton.js";import I from"./ColorPickerColorsGrid.js";import{withStaticProps as h}from"../../../../types/withStaticProps.js";import S from"../../../../hooks/useMergeRef.js";import j from"../../../../../icons/dist/react/NoColor.js";var k=h(i((function(i,c){var m=i.className,h=i.onValueChange,k=i.value,y=i.noColorText,b=i.colorStyle,g=void 0===b?"regular":b,N=i.ColorIndicatorIcon,x=i.SelectedIndicatorIcon,B=i.shouldRenderIndicatorWithoutBackground,E=i.NoColorIcon,M=void 0===E?j:E,P=i.isBlackListMode,w=void 0===P||P,z=i.colorsList,L=i.isMultiselect,O=i.colorSize,R=void 0===O?a.MEDIUM:O,T=i.numberOfColorsInLine,G=void 0===T?u:T,K=i.tooltipContentByColor,U=void 0===K?{}:K,W=i.focusOnMount,_=i.colorShape,q=void 0===_?"square":_,A=i.forceUseRawColorList,D=i.showColorNameTooltip,H=i.id,V=i["data-testid"],F=l(null),J=S(c,F),Q=l(null),X=l(null),Y=n((function(){h(null)}),[h]),Z=s((function(){return A?z:w?r(d,z):e(d,z)}),[A,w,z]),$=n((function(r){if(L){var e=o(k);if(e.includes(r)){var t=e.indexOf(r);t>-1&&e.splice(t,1)}else e.push(r);h(e)}else h([r])}),[L,h,k]),oo=s((function(){return[{topElement:Q,bottomElement:X}]}),[]),ro=p(oo,F),eo=f(R,G);return t.createElement("div",{className:m,style:{width:eo},ref:J,tabIndex:-1},t.createElement(C.Provider,{value:ro},t.createElement(I,{ref:Q,onColorClicked:$,colorsToRender:Z,numberOfColorsInLine:G,focusOnMount:W,value:k,colorStyle:g,ColorIndicatorIcon:N,shouldRenderIndicatorWithoutBackground:B,SelectedIndicatorIcon:x,colorSize:R,tooltipContentByColor:U,colorShape:q,showColorNameTooltip:D,id:H,"data-testid":V}),y&&t.createElement(v,{Icon:M,onClick:Y,text:y,ref:X})))})),{sizes:a,colorStyles:c,colorSizes:a,colorShapes:m});export{k as default};
 //# sourceMappingURL=ColorPickerContent.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPickerContent.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.tsx"],"sourcesContent":["import { difference as _difference, intersection as _intersection } from \"lodash-es\";\nimport React, { forwardRef, useCallback, useMemo, useRef } from \"react\";\nimport { BaseSizes } from \"../../../../constants\";\nimport {\n  ColorStyle as ColorStyleEnum,\n  type CONTENT_COLORS_VALUES,\n  contentColors\n} from \"../../../../utils/colors-vars-map\";\nimport { NoColor } from \"@vibe/icons\";\nimport { ColorShapes as ColorShapesEnum, DEFAULT_NUMBER_OF_COLORS_IN_LINE } from \"../../ColorPickerConstants\";\nimport {\n  type ColorShapes,\n  type ColorPickerSizes,\n  type ColorPickerValue,\n  type ColorPickerArrayValueOnly\n} from \"../../ColorPicker.types\";\nimport { calculateColorPickerWidth } from \"../../services/ColorPickerStyleService\";\nimport {\n  GridKeyboardNavigationContext,\n  useGridKeyboardNavigationContext\n} from \"../../../GridKeyboardNavigationContext\";\nimport ColorPickerClearButton from \"./ColorPickerClearButton\";\nimport ColorPickerColorsGrid from \"./ColorPickerColorsGrid\";\nimport { type VibeComponentProps, type SubIcon, withStaticProps } from \"../../../../types\";\nimport useMergeRef from \"../../../../hooks/useMergeRef\";\nimport { type ColorStyle } from \"../../../../types\";\n\nexport interface ColorPickerContentProps extends VibeComponentProps {\n  /**\n   * The selected color(s).\n   */\n  value: ColorPickerValue;\n  /**\n   * Callback fired when the selected color(s) change.\n   */\n  onValueChange: (value: ColorPickerArrayValueOnly) => void;\n  /**\n   * The list of colors available for selection.\n   */\n  colorsList: ColorPickerArrayValueOnly;\n  /**\n   * Icon displayed as an indicator inside the color.\n   */\n  ColorIndicatorIcon?: SubIcon;\n  /**\n   * Icon displayed when a color is selected.\n   */\n  SelectedIndicatorIcon?: SubIcon;\n  /**\n   * Icon used for clearing the color selection.\n   */\n  NoColorIcon?: SubIcon;\n  /**\n   * The style applied to the colors.\n   */\n  colorStyle?: ColorStyle;\n  /**\n   * The size of the color items.\n   */\n  colorSize?: ColorPickerSizes;\n  /**\n   * The shape of the color items.\n   */\n  colorShape?: ColorShapes;\n  /**\n   * Custom tooltip content for specific colors.\n   */\n  tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string>>;\n  /**\n   * Text displayed for the \"no color\" option.\n   */\n  noColorText?: string;\n  /**\n   * If true, renders the color indicator without a background.\n   */\n  shouldRenderIndicatorWithoutBackground?: boolean;\n  /**\n   * If true, treats the color list as a blacklist rather than a whitelist.\n   */\n  isBlackListMode?: boolean;\n  /**\n   * The number of colors displayed per row.\n   */\n  numberOfColorsInLine?: number;\n  /**\n   * If true, the first color is focused when the component mounts.\n   */\n  focusOnMount?: boolean;\n  /**\n   * If true, allows selecting multiple colors.\n   */\n  isMultiselect?: boolean;\n  /**\n   * Used to force the component render the colorList prop as is. Usually, this flag should not be used. It's intended only for edge cases.\n   * Usually, only \"monday colors\" will be rendered (unless blacklist mode is used). This flag will override this behavior.\n   */\n  forceUseRawColorList?: boolean;\n  /**\n   * Used to enable color name tooltip on each color in the component.\n   * When \"tooltipContentByColor\" is supplied, it will override the color name tooltip.\n   */\n  showColorNameTooltip?: boolean;\n}\n\nconst ColorPickerContent = forwardRef(\n  (\n    {\n      className,\n      onValueChange,\n      value,\n      noColorText,\n      colorStyle = \"regular\",\n      ColorIndicatorIcon,\n      SelectedIndicatorIcon,\n      shouldRenderIndicatorWithoutBackground,\n      NoColorIcon = NoColor,\n      isBlackListMode = true,\n      colorsList,\n      isMultiselect,\n      colorSize = BaseSizes.MEDIUM,\n      numberOfColorsInLine = DEFAULT_NUMBER_OF_COLORS_IN_LINE,\n      tooltipContentByColor = {},\n      focusOnMount,\n      colorShape = \"square\",\n      forceUseRawColorList,\n      showColorNameTooltip,\n      id,\n      \"data-testid\": dataTestId\n    }: ColorPickerContentProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const gridRef = useRef(null);\n    const mergedRef = useMergeRef(ref, gridRef);\n    const colorsRef = useRef(null);\n    const buttonRef = useRef(null);\n\n    const onClearButton = useCallback(() => {\n      onValueChange(null);\n    }, [onValueChange]);\n\n    const colorsToRender = useMemo(() => {\n      if (forceUseRawColorList) {\n        return colorsList;\n      }\n      return isBlackListMode ? _difference(contentColors, colorsList) : _intersection(contentColors, colorsList);\n    }, [forceUseRawColorList, isBlackListMode, colorsList]);\n\n    const onColorClicked = useCallback(\n      (color: CONTENT_COLORS_VALUES) => {\n        if (!isMultiselect) {\n          onValueChange([color]);\n          return;\n        }\n        const colors = [...value];\n        if (colors.includes(color)) {\n          const indexInSelected = colors.indexOf(color);\n          if (indexInSelected > -1) {\n            colors.splice(indexInSelected, 1);\n          }\n        } else {\n          colors.push(color);\n        }\n        onValueChange(colors);\n      },\n      [isMultiselect, onValueChange, value]\n    );\n\n    const positions = useMemo(() => [{ topElement: colorsRef, bottomElement: buttonRef }], []);\n    const keyboardContext = useGridKeyboardNavigationContext(positions, gridRef);\n    const width = calculateColorPickerWidth(colorSize as BaseSizes, numberOfColorsInLine);\n\n    return (\n      <div className={className} style={{ width }} ref={mergedRef} tabIndex={-1}>\n        <GridKeyboardNavigationContext.Provider value={keyboardContext}>\n          <ColorPickerColorsGrid\n            ref={colorsRef}\n            onColorClicked={onColorClicked}\n            colorsToRender={colorsToRender}\n            numberOfColorsInLine={numberOfColorsInLine}\n            focusOnMount={focusOnMount}\n            value={value}\n            colorStyle={colorStyle}\n            ColorIndicatorIcon={ColorIndicatorIcon}\n            shouldRenderIndicatorWithoutBackground={shouldRenderIndicatorWithoutBackground}\n            SelectedIndicatorIcon={SelectedIndicatorIcon}\n            colorSize={colorSize}\n            tooltipContentByColor={tooltipContentByColor}\n            colorShape={colorShape}\n            showColorNameTooltip={showColorNameTooltip}\n            id={id}\n            data-testid={dataTestId}\n          />\n          {noColorText && (\n            <ColorPickerClearButton Icon={NoColorIcon} onClick={onClearButton} text={noColorText} ref={buttonRef} />\n          )}\n        </GridKeyboardNavigationContext.Provider>\n      </div>\n    );\n  }\n);\n\ninterface ColorPickerContentStaticProps {\n  sizes: typeof BaseSizes;\n  colorStyles: typeof ColorStyleEnum;\n  colorSizes: typeof BaseSizes;\n  colorShapes: typeof ColorShapesEnum;\n}\n\nexport default withStaticProps<ColorPickerContentProps, ColorPickerContentStaticProps>(ColorPickerContent, {\n  sizes: BaseSizes,\n  colorStyles: ColorStyleEnum,\n  colorSizes: BaseSizes,\n  colorShapes: ColorShapesEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","onValueChange","value","noColorText","_ref$colorStyle","colorStyle","ColorIndicatorIcon","SelectedIndicatorIcon","shouldRenderIndicatorWithoutBackground","_ref$NoColorIcon","NoColorIcon","NoColor","_ref$isBlackListMode","isBlackListMode","colorsList","isMultiselect","_ref$colorSize","colorSize","BaseSizes","MEDIUM","_ref$numberOfColorsIn","numberOfColorsInLine","DEFAULT_NUMBER_OF_COLORS_IN_LINE","_ref$tooltipContentBy","tooltipContentByColor","focusOnMount","_ref$colorShape","colorShape","forceUseRawColorList","showColorNameTooltip","id","dataTestId","gridRef","useRef","mergedRef","useMergeRef","colorsRef","buttonRef","onClearButton","useCallback","colorsToRender","useMemo","_difference","contentColors","_intersection","onColorClicked","color","colors","_toConsumableArray","includes","indexInSelected","indexOf","splice","push","positions","topElement","bottomElement","keyboardContext","useGridKeyboardNavigationContext","width","calculateColorPickerWidth","React","createElement","style","tabIndex","GridKeyboardNavigationContext","Provider","ColorPickerColorsGrid","ColorPickerClearButton","Icon","onClick","text","sizes","colorStyles","ColorStyleEnum","colorSizes","colorShapes","ColorShapesEnum"],"mappings":"88BAwGA,IAwGeA,EAAAA,EAxGYC,GACzB,SAAAC,EAwBEC,GACE,IAvBAC,EAASF,EAATE,UACAC,EAAaH,EAAbG,cACAC,EAAKJ,EAALI,MACAC,EAAWL,EAAXK,YAAWC,EAAAN,EACXO,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAkBR,EAAlBQ,mBACAC,EAAqBT,EAArBS,sBACAC,EAAsCV,EAAtCU,uCAAsCC,EAAAX,EACtCY,YAAAA,OAAcC,IAAHF,EAAGE,EAAOF,EAAAG,EAAAd,EACrBe,gBAAAA,OAAkB,IAAHD,GAAOA,EACtBE,EAAUhB,EAAVgB,WACAC,EAAajB,EAAbiB,cAAaC,EAAAlB,EACbmB,UAAAA,OAAS,IAAAD,EAAGE,EAAUC,OAAMH,EAAAI,EAAAtB,EAC5BuB,qBAAAA,OAAuBC,IAAHF,EAAGE,EAAgCF,EAAAG,EAAAzB,EACvD0B,sBAAAA,OAAqB,IAAAD,EAAG,CAAE,EAAAA,EAC1BE,EAAY3B,EAAZ2B,aAAYC,EAAA5B,EACZ6B,WAAAA,OAAa,IAAHD,EAAG,SAAQA,EACrBE,EAAoB9B,EAApB8B,qBACAC,EAAoB/B,EAApB+B,qBACAC,EAAEhC,EAAFgC,GACeC,EAAUjC,EAAzB,eAIIkC,EAAUC,EAAO,MACjBC,EAAYC,EAAYpC,EAAKiC,GAC7BI,EAAYH,EAAO,MACnBI,EAAYJ,EAAO,MAEnBK,EAAgBC,GAAY,WAChCtC,EAAc,KAChB,GAAG,CAACA,IAEEuC,EAAiBC,GAAQ,WAC7B,OAAIb,EACKd,EAEFD,EAAkB6B,EAAYC,EAAe7B,GAAc8B,EAAcD,EAAe7B,EAChG,GAAE,CAACc,EAAsBf,EAAiBC,IAErC+B,EAAiBN,GACrB,SAACO,GACC,GAAK/B,EAAL,CAIA,IAAMgC,EAAMC,EAAO9C,GACnB,GAAI6C,EAAOE,SAASH,GAAQ,CAC1B,IAAMI,EAAkBH,EAAOI,QAAQL,GACnCI,GAAmB,GACrBH,EAAOK,OAAOF,EAAiB,EAElC,MACCH,EAAOM,KAAKP,GAEd7C,EAAc8C,EAVb,MAFC9C,EAAc,CAAC6C,GAalB,GACD,CAAC/B,EAAed,EAAeC,IAG3BoD,GAAYb,GAAQ,WAAA,MAAM,CAAC,CAAEc,WAAYnB,EAAWoB,cAAenB,GAAY,GAAE,IACjFoB,GAAkBC,EAAiCJ,GAAWtB,GAC9D2B,GAAQC,EAA0B3C,EAAwBI,GAEhE,OACEwC,EAAKC,cAAA,MAAA,CAAA9D,UAAWA,EAAW+D,MAAO,CAAEJ,MAAAA,IAAS5D,IAAKmC,EAAW8B,UAAW,GACtEH,EAAAC,cAACG,EAA8BC,SAAS,CAAAhE,MAAOuD,IAC7CI,EAAAC,cAACK,EAAqB,CACpBpE,IAAKqC,EACLS,eAAgBA,EAChBL,eAAgBA,EAChBnB,qBAAsBA,EACtBI,aAAcA,EACdvB,MAAOA,EACPG,WAAYA,EACZC,mBAAoBA,EACpBE,uCAAwCA,EACxCD,sBAAuBA,EACvBU,UAAWA,EACXO,sBAAuBA,EACvBG,WAAYA,EACZE,qBAAsBA,EACtBC,GAAIA,EAAE,cACOC,IAEd5B,GACC0D,EAAAC,cAACM,EAAsB,CAACC,KAAM3D,EAAa4D,QAAShC,EAAeiC,KAAMpE,EAAaJ,IAAKsC,KAKrG,IAUyG,CACzGmC,MAAOtD,EACPuD,YAAaC,EACbC,WAAYzD,EACZ0D,YAAaC"}
+{"version":3,"file":"ColorPickerContent.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.tsx"],"sourcesContent":["import { difference as _difference, intersection as _intersection } from \"es-toolkit/compat\";\nimport React, { forwardRef, useCallback, useMemo, useRef } from \"react\";\nimport { BaseSizes } from \"../../../../constants\";\nimport {\n  ColorStyle as ColorStyleEnum,\n  type CONTENT_COLORS_VALUES,\n  contentColors\n} from \"../../../../utils/colors-vars-map\";\nimport { NoColor } from \"@vibe/icons\";\nimport { ColorShapes as ColorShapesEnum, DEFAULT_NUMBER_OF_COLORS_IN_LINE } from \"../../ColorPickerConstants\";\nimport {\n  type ColorShapes,\n  type ColorPickerSizes,\n  type ColorPickerValue,\n  type ColorPickerArrayValueOnly\n} from \"../../ColorPicker.types\";\nimport { calculateColorPickerWidth } from \"../../services/ColorPickerStyleService\";\nimport {\n  GridKeyboardNavigationContext,\n  useGridKeyboardNavigationContext\n} from \"../../../GridKeyboardNavigationContext\";\nimport ColorPickerClearButton from \"./ColorPickerClearButton\";\nimport ColorPickerColorsGrid from \"./ColorPickerColorsGrid\";\nimport { type VibeComponentProps, type SubIcon, withStaticProps } from \"../../../../types\";\nimport useMergeRef from \"../../../../hooks/useMergeRef\";\nimport { type ColorStyle } from \"../../../../types\";\n\nexport interface ColorPickerContentProps extends VibeComponentProps {\n  /**\n   * The selected color(s).\n   */\n  value: ColorPickerValue;\n  /**\n   * Callback fired when the selected color(s) change.\n   */\n  onValueChange: (value: ColorPickerArrayValueOnly) => void;\n  /**\n   * The list of colors available for selection.\n   */\n  colorsList: ColorPickerArrayValueOnly;\n  /**\n   * Icon displayed as an indicator inside the color.\n   */\n  ColorIndicatorIcon?: SubIcon;\n  /**\n   * Icon displayed when a color is selected.\n   */\n  SelectedIndicatorIcon?: SubIcon;\n  /**\n   * Icon used for clearing the color selection.\n   */\n  NoColorIcon?: SubIcon;\n  /**\n   * The style applied to the colors.\n   */\n  colorStyle?: ColorStyle;\n  /**\n   * The size of the color items.\n   */\n  colorSize?: ColorPickerSizes;\n  /**\n   * The shape of the color items.\n   */\n  colorShape?: ColorShapes;\n  /**\n   * Custom tooltip content for specific colors.\n   */\n  tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string>>;\n  /**\n   * Text displayed for the \"no color\" option.\n   */\n  noColorText?: string;\n  /**\n   * If true, renders the color indicator without a background.\n   */\n  shouldRenderIndicatorWithoutBackground?: boolean;\n  /**\n   * If true, treats the color list as a blacklist rather than a whitelist.\n   */\n  isBlackListMode?: boolean;\n  /**\n   * The number of colors displayed per row.\n   */\n  numberOfColorsInLine?: number;\n  /**\n   * If true, the first color is focused when the component mounts.\n   */\n  focusOnMount?: boolean;\n  /**\n   * If true, allows selecting multiple colors.\n   */\n  isMultiselect?: boolean;\n  /**\n   * Used to force the component render the colorList prop as is. Usually, this flag should not be used. It's intended only for edge cases.\n   * Usually, only \"monday colors\" will be rendered (unless blacklist mode is used). This flag will override this behavior.\n   */\n  forceUseRawColorList?: boolean;\n  /**\n   * Used to enable color name tooltip on each color in the component.\n   * When \"tooltipContentByColor\" is supplied, it will override the color name tooltip.\n   */\n  showColorNameTooltip?: boolean;\n}\n\nconst ColorPickerContent = forwardRef(\n  (\n    {\n      className,\n      onValueChange,\n      value,\n      noColorText,\n      colorStyle = \"regular\",\n      ColorIndicatorIcon,\n      SelectedIndicatorIcon,\n      shouldRenderIndicatorWithoutBackground,\n      NoColorIcon = NoColor,\n      isBlackListMode = true,\n      colorsList,\n      isMultiselect,\n      colorSize = BaseSizes.MEDIUM,\n      numberOfColorsInLine = DEFAULT_NUMBER_OF_COLORS_IN_LINE,\n      tooltipContentByColor = {},\n      focusOnMount,\n      colorShape = \"square\",\n      forceUseRawColorList,\n      showColorNameTooltip,\n      id,\n      \"data-testid\": dataTestId\n    }: ColorPickerContentProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const gridRef = useRef(null);\n    const mergedRef = useMergeRef(ref, gridRef);\n    const colorsRef = useRef(null);\n    const buttonRef = useRef(null);\n\n    const onClearButton = useCallback(() => {\n      onValueChange(null);\n    }, [onValueChange]);\n\n    const colorsToRender = useMemo(() => {\n      if (forceUseRawColorList) {\n        return colorsList;\n      }\n      return isBlackListMode ? _difference(contentColors, colorsList) : _intersection(contentColors, colorsList);\n    }, [forceUseRawColorList, isBlackListMode, colorsList]);\n\n    const onColorClicked = useCallback(\n      (color: CONTENT_COLORS_VALUES) => {\n        if (!isMultiselect) {\n          onValueChange([color]);\n          return;\n        }\n        const colors = [...value];\n        if (colors.includes(color)) {\n          const indexInSelected = colors.indexOf(color);\n          if (indexInSelected > -1) {\n            colors.splice(indexInSelected, 1);\n          }\n        } else {\n          colors.push(color);\n        }\n        onValueChange(colors);\n      },\n      [isMultiselect, onValueChange, value]\n    );\n\n    const positions = useMemo(() => [{ topElement: colorsRef, bottomElement: buttonRef }], []);\n    const keyboardContext = useGridKeyboardNavigationContext(positions, gridRef);\n    const width = calculateColorPickerWidth(colorSize as BaseSizes, numberOfColorsInLine);\n\n    return (\n      <div className={className} style={{ width }} ref={mergedRef} tabIndex={-1}>\n        <GridKeyboardNavigationContext.Provider value={keyboardContext}>\n          <ColorPickerColorsGrid\n            ref={colorsRef}\n            onColorClicked={onColorClicked}\n            colorsToRender={colorsToRender}\n            numberOfColorsInLine={numberOfColorsInLine}\n            focusOnMount={focusOnMount}\n            value={value}\n            colorStyle={colorStyle}\n            ColorIndicatorIcon={ColorIndicatorIcon}\n            shouldRenderIndicatorWithoutBackground={shouldRenderIndicatorWithoutBackground}\n            SelectedIndicatorIcon={SelectedIndicatorIcon}\n            colorSize={colorSize}\n            tooltipContentByColor={tooltipContentByColor}\n            colorShape={colorShape}\n            showColorNameTooltip={showColorNameTooltip}\n            id={id}\n            data-testid={dataTestId}\n          />\n          {noColorText && (\n            <ColorPickerClearButton Icon={NoColorIcon} onClick={onClearButton} text={noColorText} ref={buttonRef} />\n          )}\n        </GridKeyboardNavigationContext.Provider>\n      </div>\n    );\n  }\n);\n\ninterface ColorPickerContentStaticProps {\n  sizes: typeof BaseSizes;\n  colorStyles: typeof ColorStyleEnum;\n  colorSizes: typeof BaseSizes;\n  colorShapes: typeof ColorShapesEnum;\n}\n\nexport default withStaticProps<ColorPickerContentProps, ColorPickerContentStaticProps>(ColorPickerContent, {\n  sizes: BaseSizes,\n  colorStyles: ColorStyleEnum,\n  colorSizes: BaseSizes,\n  colorShapes: ColorShapesEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","onValueChange","value","noColorText","_ref$colorStyle","colorStyle","ColorIndicatorIcon","SelectedIndicatorIcon","shouldRenderIndicatorWithoutBackground","_ref$NoColorIcon","NoColorIcon","NoColor","_ref$isBlackListMode","isBlackListMode","colorsList","isMultiselect","_ref$colorSize","colorSize","BaseSizes","MEDIUM","_ref$numberOfColorsIn","numberOfColorsInLine","DEFAULT_NUMBER_OF_COLORS_IN_LINE","_ref$tooltipContentBy","tooltipContentByColor","focusOnMount","_ref$colorShape","colorShape","forceUseRawColorList","showColorNameTooltip","id","dataTestId","gridRef","useRef","mergedRef","useMergeRef","colorsRef","buttonRef","onClearButton","useCallback","colorsToRender","useMemo","_difference","contentColors","_intersection","onColorClicked","color","colors","_toConsumableArray","includes","indexInSelected","indexOf","splice","push","positions","topElement","bottomElement","keyboardContext","useGridKeyboardNavigationContext","width","calculateColorPickerWidth","React","createElement","style","tabIndex","GridKeyboardNavigationContext","Provider","ColorPickerColorsGrid","ColorPickerClearButton","Icon","onClick","text","sizes","colorStyles","ColorStyleEnum","colorSizes","colorShapes","ColorShapesEnum"],"mappings":"s9BAwGA,IAwGeA,EAAAA,EAxGYC,GACzB,SAAAC,EAwBEC,GACE,IAvBAC,EAASF,EAATE,UACAC,EAAaH,EAAbG,cACAC,EAAKJ,EAALI,MACAC,EAAWL,EAAXK,YAAWC,EAAAN,EACXO,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAkBR,EAAlBQ,mBACAC,EAAqBT,EAArBS,sBACAC,EAAsCV,EAAtCU,uCAAsCC,EAAAX,EACtCY,YAAAA,OAAcC,IAAHF,EAAGE,EAAOF,EAAAG,EAAAd,EACrBe,gBAAAA,OAAkB,IAAHD,GAAOA,EACtBE,EAAUhB,EAAVgB,WACAC,EAAajB,EAAbiB,cAAaC,EAAAlB,EACbmB,UAAAA,OAAS,IAAAD,EAAGE,EAAUC,OAAMH,EAAAI,EAAAtB,EAC5BuB,qBAAAA,OAAuBC,IAAHF,EAAGE,EAAgCF,EAAAG,EAAAzB,EACvD0B,sBAAAA,OAAqB,IAAAD,EAAG,CAAE,EAAAA,EAC1BE,EAAY3B,EAAZ2B,aAAYC,EAAA5B,EACZ6B,WAAAA,OAAa,IAAHD,EAAG,SAAQA,EACrBE,EAAoB9B,EAApB8B,qBACAC,EAAoB/B,EAApB+B,qBACAC,EAAEhC,EAAFgC,GACeC,EAAUjC,EAAzB,eAIIkC,EAAUC,EAAO,MACjBC,EAAYC,EAAYpC,EAAKiC,GAC7BI,EAAYH,EAAO,MACnBI,EAAYJ,EAAO,MAEnBK,EAAgBC,GAAY,WAChCtC,EAAc,KAChB,GAAG,CAACA,IAEEuC,EAAiBC,GAAQ,WAC7B,OAAIb,EACKd,EAEFD,EAAkB6B,EAAYC,EAAe7B,GAAc8B,EAAcD,EAAe7B,EAChG,GAAE,CAACc,EAAsBf,EAAiBC,IAErC+B,EAAiBN,GACrB,SAACO,GACC,GAAK/B,EAAL,CAIA,IAAMgC,EAAMC,EAAO9C,GACnB,GAAI6C,EAAOE,SAASH,GAAQ,CAC1B,IAAMI,EAAkBH,EAAOI,QAAQL,GACnCI,GAAmB,GACrBH,EAAOK,OAAOF,EAAiB,EAElC,MACCH,EAAOM,KAAKP,GAEd7C,EAAc8C,EAVb,MAFC9C,EAAc,CAAC6C,GAalB,GACD,CAAC/B,EAAed,EAAeC,IAG3BoD,GAAYb,GAAQ,WAAA,MAAM,CAAC,CAAEc,WAAYnB,EAAWoB,cAAenB,GAAY,GAAE,IACjFoB,GAAkBC,EAAiCJ,GAAWtB,GAC9D2B,GAAQC,EAA0B3C,EAAwBI,GAEhE,OACEwC,EAAKC,cAAA,MAAA,CAAA9D,UAAWA,EAAW+D,MAAO,CAAEJ,MAAAA,IAAS5D,IAAKmC,EAAW8B,UAAW,GACtEH,EAAAC,cAACG,EAA8BC,SAAS,CAAAhE,MAAOuD,IAC7CI,EAAAC,cAACK,EAAqB,CACpBpE,IAAKqC,EACLS,eAAgBA,EAChBL,eAAgBA,EAChBnB,qBAAsBA,EACtBI,aAAcA,EACdvB,MAAOA,EACPG,WAAYA,EACZC,mBAAoBA,EACpBE,uCAAwCA,EACxCD,sBAAuBA,EACvBU,UAAWA,EACXO,sBAAuBA,EACvBG,WAAYA,EACZE,qBAAsBA,EACtBC,GAAIA,EAAE,cACOC,IAEd5B,GACC0D,EAAAC,cAACM,EAAsB,CAACC,KAAM3D,EAAa4D,QAAShC,EAAeiC,KAAMpE,EAAaJ,IAAKsC,KAKrG,IAUyG,CACzGmC,MAAOtD,EACPuD,YAAaC,EACbC,WAAYzD,EACZ0D,YAAaC"}

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.js

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as o}from"lodash-es";import{getStyle as t}from"../../../../helpers/typesciptCssModulesHelper.js";import r from"classnames";import l,{forwardRef as n,useMemo as s,useRef as c,useCallback as i,useEffect as a}from"react";import{contentColors as m}from"../../../../utils/colors-vars-map.js";import u from"../../../../utils/colors-utils.js";import d from"../../../Icon/Icon.js";import p from"../../../Tooltip/Tooltip.js";import f from"../../../Clickable/Clickable.js";import{getTestId as v}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as I}from"../../../../tests/constants.js";import C from"./ColorPickerItemComponent.module.scss.js";var g=n((function(n,g){var y=n.color,E=n.onColorClicked,j=n.colorStyle,k=void 0===j?"regular":j,b=n.shouldRenderIndicatorWithoutBackground,S=n.ColorIndicatorIcon,h=n.SelectedIndicatorIcon,L=void 0===h?S:h,M=n.isSelected,N=n.colorSize,P=n.tooltipContent,T=n.isActive,W=n.colorShape,_=n["data-testid"],x=s((function(){return m.includes(y)}),[y]),A=x?u.getMondayColorAsStyle(y,k):y,R=c(null),z=i((function(){return E(y)}),[E,y]);a((function(){if((null==R?void 0:R.current)&&!b&&x){var e=R.current,o=function(e){e.target.style.background=u.getMondayColorAsStyle(y,"selected"===k?"regular":"hover")},t=function(e){e.target.style.background=A};return e.addEventListener("mouseenter",o,!1),e.addEventListener("mouseleave",t,!1),function(){e.removeEventListener("mouseenter",o,!1),e.removeEventListener("mouseleave",t,!1)}}}),[y,A,k,x,R,b]);var B=M||S,D=b?{color:A}:{};return l.createElement(p,{content:P},l.createElement("li",{className:r(C.itemWrapper,e(e(e({},C.selectedColor,M),C.active,T),C.circle,"circle"===W)),"data-testid":_||v(I.COLOR_PICKER_ITEM,y)},l.createElement("div",{className:r(C.feedbackIndicator)}),l.createElement(f,{ref:R,ariaLabel:y,className:r(C.colorItem,t(C,o("color-item-size-"+N)),e({},C.colorItemTextMode,b)),style:{background:b?"transparent":A},onClick:z,tabIndex:"-1",onMouseDown:function(e){return e.preventDefault()}},l.createElement("div",{className:r(C.colorIndicatorWrapper),style:D},B&&l.createElement(d,{icon:M?L:S,className:r(e({},C.colorIconWhite,!b)),ignoreFocusStyle:!0})))))}));export{g as default};
+import{defineProperty as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as o}from"es-toolkit";import{getStyle as t}from"../../../../helpers/typesciptCssModulesHelper.js";import r from"classnames";import l,{forwardRef as n,useMemo as s,useRef as c,useCallback as i,useEffect as a}from"react";import{contentColors as m}from"../../../../utils/colors-vars-map.js";import u from"../../../../utils/colors-utils.js";import d from"../../../Icon/Icon.js";import p from"../../../Tooltip/Tooltip.js";import f from"../../../Clickable/Clickable.js";import{getTestId as v}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as I}from"../../../../tests/constants.js";import C from"./ColorPickerItemComponent.module.scss.js";var g=n((function(n,g){var y=n.color,E=n.onColorClicked,k=n.colorStyle,j=void 0===k?"regular":k,b=n.shouldRenderIndicatorWithoutBackground,S=n.ColorIndicatorIcon,h=n.SelectedIndicatorIcon,L=void 0===h?S:h,M=n.isSelected,N=n.colorSize,P=n.tooltipContent,T=n.isActive,W=n.colorShape,_=n["data-testid"],x=s((function(){return m.includes(y)}),[y]),A=x?u.getMondayColorAsStyle(y,j):y,R=c(null),z=i((function(){return E(y)}),[E,y]);a((function(){if((null==R?void 0:R.current)&&!b&&x){var e=R.current,o=function(e){e.target.style.background=u.getMondayColorAsStyle(y,"selected"===j?"regular":"hover")},t=function(e){e.target.style.background=A};return e.addEventListener("mouseenter",o,!1),e.addEventListener("mouseleave",t,!1),function(){e.removeEventListener("mouseenter",o,!1),e.removeEventListener("mouseleave",t,!1)}}}),[y,A,j,x,R,b]);var B=M||S,D=b?{color:A}:{};return l.createElement(p,{content:P},l.createElement("li",{className:r(C.itemWrapper,e(e(e({},C.selectedColor,M),C.active,T),C.circle,"circle"===W)),"data-testid":_||v(I.COLOR_PICKER_ITEM,y)},l.createElement("div",{className:r(C.feedbackIndicator)}),l.createElement(f,{ref:R,ariaLabel:y,className:r(C.colorItem,t(C,o("color-item-size-"+N)),e({},C.colorItemTextMode,b)),style:{background:b?"transparent":A},onClick:z,tabIndex:"-1",onMouseDown:function(e){return e.preventDefault()}},l.createElement("div",{className:r(C.colorIndicatorWrapper),style:D},B&&l.createElement(d,{icon:M?L:S,className:r(e({},C.colorIconWhite,!b)),ignoreFocusStyle:!0})))))}));export{g as default};
 //# sourceMappingURL=ColorPickerItemComponent.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPickerItemComponent.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport cx from \"classnames\";\nimport React, { useRef, useCallback, useMemo, forwardRef, useEffect } from \"react\";\nimport { contentColors } from \"../../../../utils/colors-vars-map\";\nimport ColorUtils from \"../../../../utils/colors-utils\";\nimport Icon from \"../../../Icon/Icon\";\nimport Tooltip from \"../../../Tooltip/Tooltip\";\nimport Clickable from \"../../../Clickable/Clickable\";\nimport { type ColorPickerValueOnly } from \"../../ColorPicker.types\";\nimport { type ColorShapes, type ColorPickerSizes } from \"../../ColorPicker.types\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport { type SubIcon, type VibeComponentProps, type ElementContent, type ColorStyle } from \"../../../../types\";\nimport styles from \"./ColorPickerItemComponent.module.scss\";\n\nexport interface ColorPickerItemComponentProps extends VibeComponentProps {\n  /**\n   * The color value of the item.\n   */\n  color: ColorPickerValueOnly;\n  /**\n   * Callback fired when the color is clicked.\n   */\n  onColorClicked: (color: ColorPickerValueOnly) => void;\n  /**\n   * The style applied to the color.\n   */\n  colorStyle: ColorStyle;\n  /**\n   * If true, renders the color indicator without a background.\n   */\n  shouldRenderIndicatorWithoutBackground: boolean;\n  /**\n   * Icon displayed inside the color item.\n   */\n  ColorIndicatorIcon: SubIcon;\n  /**\n   * Icon displayed when the color is selected.\n   */\n  SelectedIndicatorIcon: SubIcon;\n  /**\n   * If true, the color is marked as selected.\n   */\n  isSelected: boolean;\n  /**\n   * The size of the color item.\n   */\n  colorSize: ColorPickerSizes;\n  /**\n   * Tooltip content for the color item.\n   */\n  tooltipContent: ElementContent;\n  /**\n   * If true, the color item is currently active.\n   */\n  isActive: boolean;\n  /**\n   * The shape of the color item.\n   */\n  colorShape: ColorShapes;\n}\n\nconst ColorPickerItemComponent = forwardRef(\n  (\n    {\n      color,\n      onColorClicked,\n      colorStyle = \"regular\",\n      shouldRenderIndicatorWithoutBackground,\n      ColorIndicatorIcon,\n      SelectedIndicatorIcon = ColorIndicatorIcon,\n      isSelected,\n      colorSize,\n      tooltipContent,\n      isActive,\n      colorShape,\n      \"data-testid\": dataTestId\n    }: ColorPickerItemComponentProps,\n    _ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const isMondayColor = useMemo(() => (contentColors as readonly string[]).includes(color), [color]); // casting to any since color can be one of the system content colors but can also be a custom one\n    const colorAsStyle = isMondayColor ? ColorUtils.getMondayColorAsStyle(color, colorStyle) : color;\n    const itemRef = useRef<HTMLDivElement>(null);\n\n    const onClick = useCallback(() => onColorClicked(color), [onColorClicked, color]);\n\n    useEffect(() => {\n      if (!itemRef?.current || shouldRenderIndicatorWithoutBackground || !isMondayColor) return;\n      const item = itemRef.current;\n      const setHoverColor = (e: MouseEvent) => {\n        if (colorStyle === \"selected\") {\n          (e.target as HTMLDivElement).style.background = ColorUtils.getMondayColorAsStyle(color, \"regular\");\n        } else {\n          (e.target as HTMLDivElement).style.background = ColorUtils.getMondayColorAsStyle(color, \"hover\");\n        }\n      };\n      const restoreToOriginalColor = (e: MouseEvent) => {\n        (e.target as HTMLDivElement).style.background = colorAsStyle;\n      };\n      item.addEventListener(\"mouseenter\", setHoverColor, false);\n      item.addEventListener(\"mouseleave\", restoreToOriginalColor, false);\n\n      return () => {\n        item.removeEventListener(\"mouseenter\", setHoverColor, false);\n        item.removeEventListener(\"mouseleave\", restoreToOriginalColor, false);\n      };\n    }, [color, colorAsStyle, colorStyle, isMondayColor, itemRef, shouldRenderIndicatorWithoutBackground]);\n\n    const shouldRenderIcon = isSelected || ColorIndicatorIcon;\n    const colorIndicatorWrapperStyle = shouldRenderIndicatorWithoutBackground ? { color: colorAsStyle } : {};\n    return (\n      <Tooltip content={tooltipContent}>\n        <li\n          className={cx(styles.itemWrapper, {\n            [styles.selectedColor]: isSelected,\n            [styles.active]: isActive,\n            [styles.circle]: colorShape === \"circle\"\n          })}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.COLOR_PICKER_ITEM, color)}\n        >\n          <div className={cx(styles.feedbackIndicator)} />\n          <Clickable\n            ref={itemRef}\n            ariaLabel={color}\n            className={cx(styles.colorItem, getStyle(styles, camelCase(\"color-item-size-\" + colorSize)), {\n              [styles.colorItemTextMode]: shouldRenderIndicatorWithoutBackground\n            })}\n            style={{ background: shouldRenderIndicatorWithoutBackground ? \"transparent\" : colorAsStyle }}\n            onClick={onClick}\n            tabIndex=\"-1\"\n            onMouseDown={e => e.preventDefault()} // this is for quill to not lose the selection\n          >\n            <div className={cx(styles.colorIndicatorWrapper)} style={colorIndicatorWrapperStyle}>\n              {shouldRenderIcon && (\n                <Icon\n                  icon={isSelected ? SelectedIndicatorIcon : ColorIndicatorIcon}\n                  className={cx({\n                    [styles.colorIconWhite]: !shouldRenderIndicatorWithoutBackground\n                  })}\n                  ignoreFocusStyle\n                />\n              )}\n            </div>\n          </Clickable>\n        </li>\n      </Tooltip>\n    );\n  }\n);\n\nexport default ColorPickerItemComponent;\n"],"names":["ColorPickerItemComponent","forwardRef","_ref2","_ref","color","onColorClicked","_ref2$colorStyle","colorStyle","shouldRenderIndicatorWithoutBackground","ColorIndicatorIcon","_ref2$SelectedIndicat","SelectedIndicatorIcon","isSelected","colorSize","tooltipContent","isActive","colorShape","dataTestId","isMondayColor","useMemo","contentColors","includes","colorAsStyle","ColorUtils","getMondayColorAsStyle","itemRef","useRef","onClick","useCallback","useEffect","current","item","setHoverColor","e","target","style","background","restoreToOriginalColor","addEventListener","removeEventListener","shouldRenderIcon","colorIndicatorWrapperStyle","React","createElement","Tooltip","content","className","cx","styles","itemWrapper","_defineProperty","selectedColor","active","circle","getTestId","ComponentDefaultTestId","COLOR_PICKER_ITEM","feedbackIndicator","Clickable","ref","ariaLabel","colorItem","getStyle","camelCase","colorItemTextMode","tabIndex","onMouseDown","preventDefault","colorIndicatorWrapper","Icon","icon","colorIconWhite","ignoreFocusStyle"],"mappings":"gvBA+DMA,IAAAA,EAA2BC,GAC/B,SAAAC,EAeEC,GACE,IAdAC,EAAKF,EAALE,MACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAsCN,EAAtCM,uCACAC,EAAkBP,EAAlBO,mBAAkBC,EAAAR,EAClBS,sBAAAA,OAAwBF,IAAHC,EAAGD,EAAkBC,EAC1CE,EAAUV,EAAVU,WACAC,EAASX,EAATW,UACAC,EAAcZ,EAAdY,eACAC,EAAQb,EAARa,SACAC,EAAUd,EAAVc,WACeC,EAAUf,EAAzB,eAIIgB,EAAgBC,GAAQ,WAAA,OAAOC,EAAoCC,SAASjB,EAAM,GAAE,CAACA,IACrFkB,EAAeJ,EAAgBK,EAAWC,sBAAsBpB,EAAOG,GAAcH,EACrFqB,EAAUC,EAAuB,MAEjCC,EAAUC,GAAY,WAAA,OAAMvB,EAAeD,EAAM,GAAE,CAACC,EAAgBD,IAE1EyB,GAAU,WACR,IAAKJ,aAAA,EAAAA,EAASK,WAAWtB,GAA2CU,EAApE,CACA,IAAMa,EAAON,EAAQK,QACfE,EAAgB,SAACC,GAElBA,EAAEC,OAA0BC,MAAMC,WAAab,EAAWC,sBAAsBpB,EADhE,aAAfG,EACsF,UAEA,UAGtF8B,EAAyB,SAACJ,GAC7BA,EAAEC,OAA0BC,MAAMC,WAAad,GAKlD,OAHAS,EAAKO,iBAAiB,aAAcN,GAAe,GACnDD,EAAKO,iBAAiB,aAAcD,GAAwB,GAErD,WACLN,EAAKQ,oBAAoB,aAAcP,GAAe,GACtDD,EAAKQ,oBAAoB,aAAcF,GAAwB,GAjBkB,CAmBrF,GAAG,CAACjC,EAAOkB,EAAcf,EAAYW,EAAeO,EAASjB,IAE7D,IAAMgC,EAAmB5B,GAAcH,EACjCgC,EAA6BjC,EAAyC,CAAEJ,MAAOkB,GAAiB,GACtG,OACEoB,EAACC,cAAAC,EAAQ,CAAAC,QAAS/B,GAChB4B,EAAAC,cAAA,KAAA,CACEG,UAAWC,EAAGC,EAAOC,YAAWC,EAAAA,EAAAA,EAAA,CAAA,EAC7BF,EAAOG,cAAgBvC,GACvBoC,EAAOI,OAASrC,GAChBiC,EAAOK,OAAwB,WAAfrC,IACjB,cACWC,GAAcqC,EAAUC,EAAuBC,kBAAmBpD,IAE/EsC,EAAKC,cAAA,MAAA,CAAAG,UAAWC,EAAGC,EAAOS,qBAC1Bf,EAAAC,cAACe,EAAS,CACRC,IAAKlC,EACLmC,UAAWxD,EACX0C,UAAWC,EAAGC,EAAOa,UAAWC,EAASd,EAAQe,EAAU,mBAAqBlD,IAAWqC,EAAA,CAAA,EACxFF,EAAOgB,kBAAoBxD,IAE9B2B,MAAO,CAAEC,WAAY5B,EAAyC,cAAgBc,GAC9EK,QAASA,EACTsC,SAAS,KACTC,YAAa,SAAAjC,GAAC,OAAIA,EAAEkC,gBAAgB,GAEpCzB,EAAAC,cAAA,MAAA,CAAKG,UAAWC,EAAGC,EAAOoB,uBAAwBjC,MAAOM,GACtDD,GACCE,EAAAC,cAAC0B,EAAI,CACHC,KAAM1D,EAAaD,EAAwBF,EAC3CqC,UAAWC,EAAEG,EACVF,CAAAA,EAAAA,EAAOuB,gBAAkB/D,IAE5BgE,kBACA,OAOhB"}
+{"version":3,"file":"ColorPickerItemComponent.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport cx from \"classnames\";\nimport React, { useRef, useCallback, useMemo, forwardRef, useEffect } from \"react\";\nimport { contentColors } from \"../../../../utils/colors-vars-map\";\nimport ColorUtils from \"../../../../utils/colors-utils\";\nimport Icon from \"../../../Icon/Icon\";\nimport Tooltip from \"../../../Tooltip/Tooltip\";\nimport Clickable from \"../../../Clickable/Clickable\";\nimport { type ColorPickerValueOnly } from \"../../ColorPicker.types\";\nimport { type ColorShapes, type ColorPickerSizes } from \"../../ColorPicker.types\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport { type SubIcon, type VibeComponentProps, type ElementContent, type ColorStyle } from \"../../../../types\";\nimport styles from \"./ColorPickerItemComponent.module.scss\";\n\nexport interface ColorPickerItemComponentProps extends VibeComponentProps {\n  /**\n   * The color value of the item.\n   */\n  color: ColorPickerValueOnly;\n  /**\n   * Callback fired when the color is clicked.\n   */\n  onColorClicked: (color: ColorPickerValueOnly) => void;\n  /**\n   * The style applied to the color.\n   */\n  colorStyle: ColorStyle;\n  /**\n   * If true, renders the color indicator without a background.\n   */\n  shouldRenderIndicatorWithoutBackground: boolean;\n  /**\n   * Icon displayed inside the color item.\n   */\n  ColorIndicatorIcon: SubIcon;\n  /**\n   * Icon displayed when the color is selected.\n   */\n  SelectedIndicatorIcon: SubIcon;\n  /**\n   * If true, the color is marked as selected.\n   */\n  isSelected: boolean;\n  /**\n   * The size of the color item.\n   */\n  colorSize: ColorPickerSizes;\n  /**\n   * Tooltip content for the color item.\n   */\n  tooltipContent: ElementContent;\n  /**\n   * If true, the color item is currently active.\n   */\n  isActive: boolean;\n  /**\n   * The shape of the color item.\n   */\n  colorShape: ColorShapes;\n}\n\nconst ColorPickerItemComponent = forwardRef(\n  (\n    {\n      color,\n      onColorClicked,\n      colorStyle = \"regular\",\n      shouldRenderIndicatorWithoutBackground,\n      ColorIndicatorIcon,\n      SelectedIndicatorIcon = ColorIndicatorIcon,\n      isSelected,\n      colorSize,\n      tooltipContent,\n      isActive,\n      colorShape,\n      \"data-testid\": dataTestId\n    }: ColorPickerItemComponentProps,\n    _ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const isMondayColor = useMemo(() => (contentColors as readonly string[]).includes(color), [color]); // casting to any since color can be one of the system content colors but can also be a custom one\n    const colorAsStyle = isMondayColor ? ColorUtils.getMondayColorAsStyle(color, colorStyle) : color;\n    const itemRef = useRef<HTMLDivElement>(null);\n\n    const onClick = useCallback(() => onColorClicked(color), [onColorClicked, color]);\n\n    useEffect(() => {\n      if (!itemRef?.current || shouldRenderIndicatorWithoutBackground || !isMondayColor) return;\n      const item = itemRef.current;\n      const setHoverColor = (e: MouseEvent) => {\n        if (colorStyle === \"selected\") {\n          (e.target as HTMLDivElement).style.background = ColorUtils.getMondayColorAsStyle(color, \"regular\");\n        } else {\n          (e.target as HTMLDivElement).style.background = ColorUtils.getMondayColorAsStyle(color, \"hover\");\n        }\n      };\n      const restoreToOriginalColor = (e: MouseEvent) => {\n        (e.target as HTMLDivElement).style.background = colorAsStyle;\n      };\n      item.addEventListener(\"mouseenter\", setHoverColor, false);\n      item.addEventListener(\"mouseleave\", restoreToOriginalColor, false);\n\n      return () => {\n        item.removeEventListener(\"mouseenter\", setHoverColor, false);\n        item.removeEventListener(\"mouseleave\", restoreToOriginalColor, false);\n      };\n    }, [color, colorAsStyle, colorStyle, isMondayColor, itemRef, shouldRenderIndicatorWithoutBackground]);\n\n    const shouldRenderIcon = isSelected || ColorIndicatorIcon;\n    const colorIndicatorWrapperStyle = shouldRenderIndicatorWithoutBackground ? { color: colorAsStyle } : {};\n    return (\n      <Tooltip content={tooltipContent}>\n        <li\n          className={cx(styles.itemWrapper, {\n            [styles.selectedColor]: isSelected,\n            [styles.active]: isActive,\n            [styles.circle]: colorShape === \"circle\"\n          })}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.COLOR_PICKER_ITEM, color)}\n        >\n          <div className={cx(styles.feedbackIndicator)} />\n          <Clickable\n            ref={itemRef}\n            ariaLabel={color}\n            className={cx(styles.colorItem, getStyle(styles, camelCase(\"color-item-size-\" + colorSize)), {\n              [styles.colorItemTextMode]: shouldRenderIndicatorWithoutBackground\n            })}\n            style={{ background: shouldRenderIndicatorWithoutBackground ? \"transparent\" : colorAsStyle }}\n            onClick={onClick}\n            tabIndex=\"-1\"\n            onMouseDown={e => e.preventDefault()} // this is for quill to not lose the selection\n          >\n            <div className={cx(styles.colorIndicatorWrapper)} style={colorIndicatorWrapperStyle}>\n              {shouldRenderIcon && (\n                <Icon\n                  icon={isSelected ? SelectedIndicatorIcon : ColorIndicatorIcon}\n                  className={cx({\n                    [styles.colorIconWhite]: !shouldRenderIndicatorWithoutBackground\n                  })}\n                  ignoreFocusStyle\n                />\n              )}\n            </div>\n          </Clickable>\n        </li>\n      </Tooltip>\n    );\n  }\n);\n\nexport default ColorPickerItemComponent;\n"],"names":["ColorPickerItemComponent","forwardRef","_ref2","_ref","color","onColorClicked","_ref2$colorStyle","colorStyle","shouldRenderIndicatorWithoutBackground","ColorIndicatorIcon","_ref2$SelectedIndicat","SelectedIndicatorIcon","isSelected","colorSize","tooltipContent","isActive","colorShape","dataTestId","isMondayColor","useMemo","contentColors","includes","colorAsStyle","ColorUtils","getMondayColorAsStyle","itemRef","useRef","onClick","useCallback","useEffect","current","item","setHoverColor","e","target","style","background","restoreToOriginalColor","addEventListener","removeEventListener","shouldRenderIcon","colorIndicatorWrapperStyle","React","createElement","Tooltip","content","className","cx","styles","itemWrapper","_defineProperty","selectedColor","active","circle","getTestId","ComponentDefaultTestId","COLOR_PICKER_ITEM","feedbackIndicator","Clickable","ref","ariaLabel","colorItem","getStyle","camelCase","colorItemTextMode","tabIndex","onMouseDown","preventDefault","colorIndicatorWrapper","Icon","icon","colorIconWhite","ignoreFocusStyle"],"mappings":"ivBA+DMA,IAAAA,EAA2BC,GAC/B,SAAAC,EAeEC,GACE,IAdAC,EAAKF,EAALE,MACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAsCN,EAAtCM,uCACAC,EAAkBP,EAAlBO,mBAAkBC,EAAAR,EAClBS,sBAAAA,OAAwBF,IAAHC,EAAGD,EAAkBC,EAC1CE,EAAUV,EAAVU,WACAC,EAASX,EAATW,UACAC,EAAcZ,EAAdY,eACAC,EAAQb,EAARa,SACAC,EAAUd,EAAVc,WACeC,EAAUf,EAAzB,eAIIgB,EAAgBC,GAAQ,WAAA,OAAOC,EAAoCC,SAASjB,EAAM,GAAE,CAACA,IACrFkB,EAAeJ,EAAgBK,EAAWC,sBAAsBpB,EAAOG,GAAcH,EACrFqB,EAAUC,EAAuB,MAEjCC,EAAUC,GAAY,WAAA,OAAMvB,EAAeD,EAAM,GAAE,CAACC,EAAgBD,IAE1EyB,GAAU,WACR,IAAKJ,aAAA,EAAAA,EAASK,WAAWtB,GAA2CU,EAApE,CACA,IAAMa,EAAON,EAAQK,QACfE,EAAgB,SAACC,GAElBA,EAAEC,OAA0BC,MAAMC,WAAab,EAAWC,sBAAsBpB,EADhE,aAAfG,EACsF,UAEA,UAGtF8B,EAAyB,SAACJ,GAC7BA,EAAEC,OAA0BC,MAAMC,WAAad,GAKlD,OAHAS,EAAKO,iBAAiB,aAAcN,GAAe,GACnDD,EAAKO,iBAAiB,aAAcD,GAAwB,GAErD,WACLN,EAAKQ,oBAAoB,aAAcP,GAAe,GACtDD,EAAKQ,oBAAoB,aAAcF,GAAwB,GAjBkB,CAmBrF,GAAG,CAACjC,EAAOkB,EAAcf,EAAYW,EAAeO,EAASjB,IAE7D,IAAMgC,EAAmB5B,GAAcH,EACjCgC,EAA6BjC,EAAyC,CAAEJ,MAAOkB,GAAiB,GACtG,OACEoB,EAACC,cAAAC,EAAQ,CAAAC,QAAS/B,GAChB4B,EAAAC,cAAA,KAAA,CACEG,UAAWC,EAAGC,EAAOC,YAAWC,EAAAA,EAAAA,EAAA,CAAA,EAC7BF,EAAOG,cAAgBvC,GACvBoC,EAAOI,OAASrC,GAChBiC,EAAOK,OAAwB,WAAfrC,IACjB,cACWC,GAAcqC,EAAUC,EAAuBC,kBAAmBpD,IAE/EsC,EAAKC,cAAA,MAAA,CAAAG,UAAWC,EAAGC,EAAOS,qBAC1Bf,EAAAC,cAACe,EAAS,CACRC,IAAKlC,EACLmC,UAAWxD,EACX0C,UAAWC,EAAGC,EAAOa,UAAWC,EAASd,EAAQe,EAAU,mBAAqBlD,IAAWqC,EAAA,CAAA,EACxFF,EAAOgB,kBAAoBxD,IAE9B2B,MAAO,CAAEC,WAAY5B,EAAyC,cAAgBc,GAC9EK,QAASA,EACTsC,SAAS,KACTC,YAAa,SAAAjC,GAAC,OAAIA,EAAEkC,gBAAgB,GAEpCzB,EAAAC,cAAA,MAAA,CAAKG,UAAWC,EAAGC,EAAOoB,uBAAwBjC,MAAOM,GACtDD,GACCE,EAAAC,cAAC0B,EAAI,CACHC,KAAM1D,EAAaD,EAAwBF,EAC3CqC,UAAWC,EAAEG,EACVF,CAAAA,EAAAA,EAAOuB,gBAAkB/D,IAE5BgE,kBACA,OAOhB"}

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.module.scss.js

@@ -1,2 +1,2 @@
-var e={itemWrapper:"itemWrapper",circle:"circle",feedbackIndicator:"feedbackIndicator",active:"active",selectedColor:"selectedColor",colorItem:"colorItem",colorIndicatorWrapper:"colorIndicatorWrapper",colorItemSizeSmall:"colorItemSizeSmall",colorItemSizeMedium:"colorItemSizeMedium",colorItemSizeLarge:"colorItemSizeLarge",colorItemTextMode:"colorItemTextMode",colorIconWhite:"colorIconWhite"};!function(e){const r="s_id-4f41e3ef6859_3_61_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const o=document.createElement("style");o.id=r,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}('.itemWrapper.circle {\n  --border-radius-multiplier: 99999;\n}\n\n/* stylelint-disable scss/operator-no-unspaced */\n\n.itemWrapper {\n  --border-radius-multiplier: 1;\n  margin: 4px;\n  display: flex;\n  list-style-type: none;\n  position: relative;\n}\n\n.itemWrapper .feedbackIndicator {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n}\n\n.itemWrapper:focus,\n.itemWrapper:focus-visible,\n.itemWrapper.active {\n  outline: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:before,\n.itemWrapper:focus-visible .feedbackIndicator:before,\n.itemWrapper.active .feedbackIndicator:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-selected-color);\n  pointer-events: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:after,\n.itemWrapper:focus-visible .feedbackIndicator:after,\n.itemWrapper.active .feedbackIndicator:after {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -1px;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n/* active elements have no "hover feedback" */\n\n.itemWrapper:hover:not(.active):not(.selectedColor) .feedbackIndicator {\n  content: " ";\n  position: absolute;\n  border-radius: calc(8px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-background-hover-color);\n  pointer-events: none;\n}\n\n.itemWrapper .colorItem {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid transparent;\n  border-radius: calc(4px * var(--border-radius-multiplier, 1));\n  cursor: pointer;\n}\n\n.itemWrapper .colorItem .colorIndicatorWrapper {\n  display: flex;\n}\n\n.itemWrapper .colorItem.colorItemSizeSmall {\n  width: 24px;\n  height: 24px;\n}\n\n.itemWrapper .colorItem.colorItemSizeMedium {\n  width: 32px;\n  height: 32px;\n}\n\n.itemWrapper .colorItem.colorItemSizeLarge {\n  width: 40px;\n  height: 40px;\n}\n\n.itemWrapper.selectedColor {\n  position: relative;\n}\n\n.itemWrapper.selectedColor:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 2px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n.itemWrapper.selectedColor .feedbackIndicator:before {\n  /* hide the outer border from the "active" feedback indicator */\n  display: none;\n}\n\n.itemWrapper .colorItemTextMode:hover {\n  background-color: var(--primary-background-hover-color) !important;\n}\n\n.itemWrapper .colorIconWhite {\n  color: var(--color-snow_white);\n}');export{e as default};
+var e={itemWrapper:"itemWrapper",circle:"circle",feedbackIndicator:"feedbackIndicator",active:"active",selectedColor:"selectedColor",colorItem:"colorItem",colorIndicatorWrapper:"colorIndicatorWrapper",colorItemSizeSmall:"colorItemSizeSmall",colorItemSizeMedium:"colorItemSizeMedium",colorItemSizeLarge:"colorItemSizeLarge",colorItemTextMode:"colorItemTextMode",colorIconWhite:"colorIconWhite"};!function(e){const r="s_id-4f41e3ef6859_3_62_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const o=document.createElement("style");o.id=r,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}('.itemWrapper.circle {\n  --border-radius-multiplier: 99999;\n}\n\n/* stylelint-disable scss/operator-no-unspaced */\n\n.itemWrapper {\n  --border-radius-multiplier: 1;\n  margin: 4px;\n  display: flex;\n  list-style-type: none;\n  position: relative;\n}\n\n.itemWrapper .feedbackIndicator {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n}\n\n.itemWrapper:focus,\n.itemWrapper:focus-visible,\n.itemWrapper.active {\n  outline: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:before,\n.itemWrapper:focus-visible .feedbackIndicator:before,\n.itemWrapper.active .feedbackIndicator:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-selected-color);\n  pointer-events: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:after,\n.itemWrapper:focus-visible .feedbackIndicator:after,\n.itemWrapper.active .feedbackIndicator:after {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -1px;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n/* active elements have no "hover feedback" */\n\n.itemWrapper:hover:not(.active):not(.selectedColor) .feedbackIndicator {\n  content: " ";\n  position: absolute;\n  border-radius: calc(8px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-background-hover-color);\n  pointer-events: none;\n}\n\n.itemWrapper .colorItem {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid transparent;\n  border-radius: calc(4px * var(--border-radius-multiplier, 1));\n  cursor: pointer;\n}\n\n.itemWrapper .colorItem .colorIndicatorWrapper {\n  display: flex;\n}\n\n.itemWrapper .colorItem.colorItemSizeSmall {\n  width: 24px;\n  height: 24px;\n}\n\n.itemWrapper .colorItem.colorItemSizeMedium {\n  width: 32px;\n  height: 32px;\n}\n\n.itemWrapper .colorItem.colorItemSizeLarge {\n  width: 40px;\n  height: 40px;\n}\n\n.itemWrapper.selectedColor {\n  position: relative;\n}\n\n.itemWrapper.selectedColor:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 2px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n.itemWrapper.selectedColor .feedbackIndicator:before {\n  /* hide the outer border from the "active" feedback indicator */\n  display: none;\n}\n\n.itemWrapper .colorItemTextMode:hover {\n  background-color: var(--primary-background-hover-color) !important;\n}\n\n.itemWrapper .colorIconWhite {\n  color: var(--color-snow_white);\n}');export{e as default};
 //# sourceMappingURL=ColorPickerItemComponent.module.scss.js.map

package/dist/mocked_classnames/src/components/Combobox/Combobox.js

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as t,noop as i,isFunction as s}from"lodash-es";import r from"classnames";import a,{forwardRef as n,useRef as l,useState as c,useCallback as d,useMemo as m}from"react";import{getStyle as p}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as u,ComponentDefaultTestId as v}from"../../tests/testIds.js";import b from"../../hooks/useMergeRef.js";import f from"../Search/Search.js";import{BASE_SIZES as h}from"../../constants/sizes.js";import C from"../Button/Button.js";import g from"../Text/Text.js";import x from"./components/ComboboxOption/ComboboxOption.js";import{defaultFilter as y}from"./ComboboxService.js";import{ComboboxItems as I}from"./components/ComboboxItems/ComboboxItems.js";import{StickyCategoryHeader as O}from"./components/StickyCategoryHeader/StickyCategoryHeader.js";import{useItemsData as N,useKeyboardNavigation as j}from"./ComboboxHelpers/ComboboxHelpers.js";import{getOptionId as S}from"./helpers.js";import{withStaticProps as R}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{COMBOBOX_LISTBOX_ID as k}from"./components/ComboboxConstants.js";import F from"./Combobox.module.scss.js";import{ComponentVibeId as H}from"../../tests/constants.js";var E=R(n((function(n,h){var x=n.className,R=void 0===x?"":x,E=n.optionClassName,A=void 0===E?"":E,L=n.searchWrapperClassName,M=n.stickyCategoryClassName,B=n.searchIcon,w=n.id,T=void 0===w?"":w,z=n.placeholder,V=void 0===z?"":z,W=n.size,P=void 0===W?"medium":W,D=n.defaultVisualFocusFirstIndex,X=n.optionLineHeight,_=void 0===X?32:X,q=n.optionsListHeight,G=n.autoFocus,J=void 0!==G&&G,K=n.disabled,Q=void 0!==K&&K,U=n.options,Y=void 0===U?[]:U,Z=n.categories,$=n.withCategoriesDivider,ee=void 0!==$&&$,oe=n.noResultsMessage,te=void 0===oe?"No results found":oe,ie=n.onAddNew,se=n.addNewLabel,re=void 0===se?"Add new":se,ae=n.onClick,ne=void 0===ae?function(e){}:ae,le=n.filter,ce=void 0===le?y:le,de=n.disableFilter,me=void 0!==de&&de,pe=n.filterValue,ue=n.onFilterChanged,ve=n.loading,be=void 0!==ve&&ve,fe=n.onOptionHover,he=void 0===fe?i:fe,Ce=n.onOptionLeave,ge=void 0===Ce?i:Ce,xe=n.shouldScrollToSelectedItem,ye=void 0===xe||xe,Ie=n.noResultsRenderer,Oe=n.stickyCategories,Ne=void 0!==Oe&&Oe,je=n.optionRenderer,Se=void 0===je?null:je,Re=n.renderOnlyVisibleOptions,ke=void 0!==Re&&Re,Fe=n.clearFilterOnSelection,He=void 0!==Fe&&Fe,Ee=n.maxOptionsWithoutScroll,Ae=n.defaultFilter,Le=void 0===Ae?"":Ae,Me=n.searchInputAriaLabel,Be=void 0===Me?"Search for content":Me,we=n["data-testid"],Te=n.debounceRate,ze=n.searchInputRef,Ve=n.renderAction,We=n.hideRenderActionOnInput,Pe=l(null),De=l(null),Xe=b(h,Pe),_e=b(De,ze),qe=c(pe||Le),Ge=e(qe,2),Je=Ge[0],Ke=Ge[1];void 0!==pe&&pe!==Je&&Ke(pe);var Qe=d((function(e){oo(-1),ue&&ue(e),Ke(e)}),[Ke,ue]),Ue=d((function(e,o,t){he(e,o,t)}),[he]),Ye=m((function(){return me?Y:ce(Je,Y)}),[Y,Je,ce,me]),Ze=c(-1),$e=e(Ze,2),eo=$e[0],oo=$e[1],to=d((function(e){return void 0!==e&&Ye[e]&&!Ye[e].disabled}),[Ye]),io=d((function(){ie&&ie(Je),Ke("")}),[ie,Je,Ke]),so=Ye.length>0,ro=Je.length>0;var ao=c(),no=e(ao,2),lo=no[0],co=no[1],mo=d((function(e){var o;(null===(o=null==e?void 0:e.category)||void 0===o?void 0:o.label)!==(null==lo?void 0:lo.label)&&co(null==e?void 0:e.category)}),[lo]),po=N({categories:Z,options:Ye,filterValue:Je,withCategoriesDivider:ee,optionLineHeight:_}),uo=po.items,vo=po.itemsMap,bo=po.selectableItems,fo=d((function(e,o){ne(bo[o]),to(o)&&oo(o),He&&Qe("")}),[ne,bo,to,He,Qe]),ho=j({getOptionId:S,defaultVisualFocusFirstIndex:D,onClick:fo,isChildSelectable:to,options:bo,inputRef:_e}),Co=ho.visualFocusItemIndex,go=ho.visualFocusItemId,xo=ho.onOptionClick;return a.createElement(g,{type:"text2",ref:Xe,className:r(F.combobox,R,p(F,t("size-"+P)),o(o({},F.empty,!so),F.stickyCategory,Ne)),id:T,"data-testid":we||u(v.COMBOBOX,T),ellipsis:!1,"data-vibe":H.COMBOBOX},a.createElement("div",{className:F.comboboxList,style:{maxHeight:q}},a.createElement(f,{ref:_e,value:Je,className:r(F.comboboxSearchWrapper,L),inputAriaLabel:Be,currentAriaResultId:go,id:"combobox-search",placeholder:V,size:P,disabled:Q,onChange:Qe,autoFocus:J,loading:be,searchIconName:B,ariaExpanded:ro||so,ariaHasPopup:"listbox",searchResultsContainerId:T?"".concat(T,"-listbox"):k,debounceRate:Te,renderAction:Ve,hideRenderActionOnInput:We}),Ne&&a.createElement(O,{label:null==lo?void 0:lo.label,color:null==lo?void 0:lo.color,className:M}),so&&a.createElement(I,{stickyCategories:Ne,categories:Z,options:uo,itemsMap:vo,optionClassName:A,optionRenderer:Se,activeItemIndex:eo,onActiveCategoryChanged:mo,onOptionClick:xo,onOptionEnter:Ue,onOptionLeave:ge,optionLineHeight:_,shouldScrollToSelectedItem:ye,renderOnlyVisibleOptions:ke,maxOptionsWithoutScroll:Ee,visualFocusItemIndex:Co,id:T?"".concat(T,"-listbox"):k})),ro&&!so&&!be&&(Ie?Ie():a.createElement("div",{className:F.comboboxNoResults},a.createElement("div",{className:F.comboboxMessageWrapper},a.createElement("span",{className:F.comboboxMessage},te)),ie&&!Q&&a.createElement(C,{className:F.addNewButton,size:P,kind:"tertiary",onClick:io},a.createElement("span",{className:F.buttonLabel},s(re)?re(Je):re)))))})),{sizes:h,iconTypes:x.iconTypes});export{E as default};
+import{slicedToArray as e,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"classnames";import i,{forwardRef as s,useRef as r,useState as a,useCallback as n,useMemo as l}from"react";import{camelCase as c,noop as d,isFunction as m}from"es-toolkit/compat";import{getStyle as p}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as u,ComponentDefaultTestId as v}from"../../tests/testIds.js";import b from"../../hooks/useMergeRef.js";import f from"../Search/Search.js";import{BASE_SIZES as h}from"../../constants/sizes.js";import C from"../Button/Button.js";import g from"../Text/Text.js";import x from"./components/ComboboxOption/ComboboxOption.js";import{defaultFilter as y}from"./ComboboxService.js";import{ComboboxItems as I}from"./components/ComboboxItems/ComboboxItems.js";import{StickyCategoryHeader as O}from"./components/StickyCategoryHeader/StickyCategoryHeader.js";import{useItemsData as N,useKeyboardNavigation as j}from"./ComboboxHelpers/ComboboxHelpers.js";import{getOptionId as S}from"./helpers.js";import{withStaticProps as R}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{COMBOBOX_LISTBOX_ID as k}from"./components/ComboboxConstants.js";import F from"./Combobox.module.scss.js";import{ComponentVibeId as H}from"../../tests/constants.js";var E=R(s((function(s,h){var x=s.className,R=void 0===x?"":x,E=s.optionClassName,A=void 0===E?"":E,L=s.searchWrapperClassName,M=s.stickyCategoryClassName,B=s.searchIcon,w=s.id,T=void 0===w?"":w,z=s.placeholder,V=void 0===z?"":z,W=s.size,P=void 0===W?"medium":W,D=s.defaultVisualFocusFirstIndex,X=s.optionLineHeight,_=void 0===X?32:X,q=s.optionsListHeight,G=s.autoFocus,J=void 0!==G&&G,K=s.disabled,Q=void 0!==K&&K,U=s.options,Y=void 0===U?[]:U,Z=s.categories,$=s.withCategoriesDivider,ee=void 0!==$&&$,oe=s.noResultsMessage,te=void 0===oe?"No results found":oe,ie=s.onAddNew,se=s.addNewLabel,re=void 0===se?"Add new":se,ae=s.onClick,ne=void 0===ae?function(e){}:ae,le=s.filter,ce=void 0===le?y:le,de=s.disableFilter,me=void 0!==de&&de,pe=s.filterValue,ue=s.onFilterChanged,ve=s.loading,be=void 0!==ve&&ve,fe=s.onOptionHover,he=void 0===fe?d:fe,Ce=s.onOptionLeave,ge=void 0===Ce?d:Ce,xe=s.shouldScrollToSelectedItem,ye=void 0===xe||xe,Ie=s.noResultsRenderer,Oe=s.stickyCategories,Ne=void 0!==Oe&&Oe,je=s.optionRenderer,Se=void 0===je?null:je,Re=s.renderOnlyVisibleOptions,ke=void 0!==Re&&Re,Fe=s.clearFilterOnSelection,He=void 0!==Fe&&Fe,Ee=s.maxOptionsWithoutScroll,Ae=s.defaultFilter,Le=void 0===Ae?"":Ae,Me=s.searchInputAriaLabel,Be=void 0===Me?"Search for content":Me,we=s["data-testid"],Te=s.debounceRate,ze=s.searchInputRef,Ve=s.renderAction,We=s.hideRenderActionOnInput,Pe=r(null),De=r(null),Xe=b(h,Pe),_e=b(De,ze),qe=a(pe||Le),Ge=e(qe,2),Je=Ge[0],Ke=Ge[1];void 0!==pe&&pe!==Je&&Ke(pe);var Qe=n((function(e){oo(-1),ue&&ue(e),Ke(e)}),[Ke,ue]),Ue=n((function(e,o,t){he(e,o,t)}),[he]),Ye=l((function(){return me?Y:ce(Je,Y)}),[Y,Je,ce,me]),Ze=a(-1),$e=e(Ze,2),eo=$e[0],oo=$e[1],to=n((function(e){return void 0!==e&&Ye[e]&&!Ye[e].disabled}),[Ye]),io=n((function(){ie&&ie(Je),Ke("")}),[ie,Je,Ke]),so=Ye.length>0,ro=Je.length>0;var ao=a(),no=e(ao,2),lo=no[0],co=no[1],mo=n((function(e){var o;(null===(o=null==e?void 0:e.category)||void 0===o?void 0:o.label)!==(null==lo?void 0:lo.label)&&co(null==e?void 0:e.category)}),[lo]),po=N({categories:Z,options:Ye,filterValue:Je,withCategoriesDivider:ee,optionLineHeight:_}),uo=po.items,vo=po.itemsMap,bo=po.selectableItems,fo=n((function(e,o){ne(bo[o]),to(o)&&oo(o),He&&Qe("")}),[ne,bo,to,He,Qe]),ho=j({getOptionId:S,defaultVisualFocusFirstIndex:D,onClick:fo,isChildSelectable:to,options:bo,inputRef:_e}),Co=ho.visualFocusItemIndex,go=ho.visualFocusItemId,xo=ho.onOptionClick;return i.createElement(g,{type:"text2",ref:Xe,className:t(F.combobox,R,p(F,c("size-"+P)),o(o({},F.empty,!so),F.stickyCategory,Ne)),id:T,"data-testid":we||u(v.COMBOBOX,T),ellipsis:!1,"data-vibe":H.COMBOBOX},i.createElement("div",{className:F.comboboxList,style:{maxHeight:q}},i.createElement(f,{ref:_e,value:Je,className:t(F.comboboxSearchWrapper,L),inputAriaLabel:Be,currentAriaResultId:go,id:"combobox-search",placeholder:V,size:P,disabled:Q,onChange:Qe,autoFocus:J,loading:be,searchIconName:B,ariaExpanded:ro||so,ariaHasPopup:"listbox",searchResultsContainerId:T?"".concat(T,"-listbox"):k,debounceRate:Te,renderAction:Ve,hideRenderActionOnInput:We}),Ne&&i.createElement(O,{label:null==lo?void 0:lo.label,color:null==lo?void 0:lo.color,className:M}),so&&i.createElement(I,{stickyCategories:Ne,categories:Z,options:uo,itemsMap:vo,optionClassName:A,optionRenderer:Se,activeItemIndex:eo,onActiveCategoryChanged:mo,onOptionClick:xo,onOptionEnter:Ue,onOptionLeave:ge,optionLineHeight:_,shouldScrollToSelectedItem:ye,renderOnlyVisibleOptions:ke,maxOptionsWithoutScroll:Ee,visualFocusItemIndex:Co,id:T?"".concat(T,"-listbox"):k})),ro&&!so&&!be&&(Ie?Ie():i.createElement("div",{className:F.comboboxNoResults},i.createElement("div",{className:F.comboboxMessageWrapper},i.createElement("span",{className:F.comboboxMessage},te)),ie&&!Q&&i.createElement(C,{className:F.addNewButton,size:P,kind:"tertiary",onClick:io},i.createElement("span",{className:F.buttonLabel},m(re)?re(Je):re)))))})),{sizes:h,iconTypes:x.iconTypes});export{E as default};
 //# sourceMappingURL=Combobox.js.map

package/dist/mocked_classnames/src/components/Combobox/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","sources":["../../../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport React, { useRef, useState, forwardRef, useMemo, useCallback } from \"react\";\nimport { isFunction, noop as NOOP } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Search from \"../Search/Search\";\nimport { BASE_SIZES } from \"../../constants\";\nimport Button from \"../Button/Button\";\nimport Text from \"../Text/Text\";\nimport ComboboxOption from \"./components/ComboboxOption/ComboboxOption\";\nimport { defaultFilter } from \"./ComboboxService\";\nimport { ComboboxItems } from \"./components/ComboboxItems/ComboboxItems\";\nimport { StickyCategoryHeader } from \"./components/StickyCategoryHeader/StickyCategoryHeader\";\nimport { useItemsData, useKeyboardNavigation } from \"./ComboboxHelpers/ComboboxHelpers\";\nimport { getOptionId } from \"./helpers\";\nimport { type ElementContent, type SubIcon, type VibeComponentProps, withStaticProps } from \"../../types\";\nimport {\n  type IComboboxCategoryMap,\n  type IComboboxItem,\n  type IComboboxOption,\n  COMBOBOX_LISTBOX_ID,\n  type IComboboxCategory\n} from \"./components/ComboboxConstants\";\nimport styles from \"./Combobox.module.scss\";\nimport { type ComboboxSizes } from \"./Combobox.types\";\nimport type IconButton from \"../IconButton/IconButton\";\nimport type MenuButton from \"../MenuButton/MenuButton\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ComboboxProps extends VibeComponentProps {\n  /**\n   * Class name applied to each option item.\n   */\n  optionClassName?: string;\n  /**\n   * Class name applied to the search wrapper.\n   */\n  searchWrapperClassName?: string;\n  /**\n   * Class name applied to the sticky category header.\n   */\n  stickyCategoryClassName?: string;\n  /**\n   * Placeholder text displayed in the search input.\n   */\n  placeholder?: string;\n  /**\n   * Message displayed when no results are found.\n   */\n  noResultsMessage?: string;\n  /**\n   * If true, the combobox is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The list of available options.\n   */\n  options?: IComboboxOption[];\n  /**\n   * The list of available categories.\n   */\n  categories?: IComboboxCategoryMap;\n  /**\n   * If true, displays a divider between category sections.\n   */\n  withCategoriesDivider?: boolean;\n  /**\n   * The size of the combobox.\n   */\n  size?: ComboboxSizes;\n  /**\n   * The height of each option item.\n   */\n  optionLineHeight?: number;\n  /**\n   * The height of the options list.\n   */\n  optionsListHeight?: number;\n  /**\n   * If true, the search input is focused when the component mounts.\n   */\n  autoFocus?: boolean;\n  /**\n   * Callback fired when the \"Add new\" button is clicked.\n   */\n  onAddNew?: (value: string) => void;\n  /**\n   * Label displayed for the \"Add new\" button.\n   */\n  addNewLabel?: ((label: string) => ElementContent) | string;\n  /**\n   * Custom filter function for searching options.\n   */\n  filter?: (filterValue: string, options: IComboboxOption[]) => IComboboxOption[];\n  /**\n   * The default search input\n   */\n  defaultFilter?: string;\n  /**\n   * If true, disables filtering.\n   */\n  disableFilter?: boolean;\n  /**\n   * Controlled search input value.\n   */\n  filterValue?: string;\n  /**\n   * Callback fired when the search input value changes.\n   */\n  onFilterChanged?: (value: string) => void;\n  /**\n   * If true, displays a loading state.\n   */\n  loading?: boolean;\n  /**\n   * Callback fired when an option is hovered.\n   */\n  onOptionHover?: (event: React.MouseEvent, index: number, option: IComboboxOption) => void;\n  /**\n   * Callback fired when the mouse leaves an option.\n   */\n  onOptionLeave?: () => void;\n  /**\n   * If true, automatically scrolls to the selected option.\n   */\n  shouldScrollToSelectedItem?: boolean;\n  /**\n   * Custom renderer for when no results are found.\n   */\n  noResultsRenderer?: () => JSX.Element;\n  /**\n   * If true, keeps categories visible when scrolling.\n   */\n  stickyCategories?: boolean;\n  /**\n   * If true, visually focuses the first item by default.\n   */\n  defaultVisualFocusFirstIndex?: boolean;\n  /**\n   * If true, clears the search input when an option is selected.\n   */\n  clearFilterOnSelection?: boolean;\n  /**\n   * Custom renderer for options.\n   */\n  optionRenderer?: (option: IComboboxOption) => JSX.Element;\n  /**\n   * Maximum number of options displayed before scrolling.\n   */\n  maxOptionsWithoutScroll?: number;\n  /**\n   * If true, renders only visible options for performance optimization.\n   */\n  renderOnlyVisibleOptions?: boolean;\n  /**\n   * Callback fired when an option is clicked.\n   */\n  onClick?: (optionData: IComboboxOption) => void;\n  /**\n   * Custom search icon.\n   */\n  searchIcon?: SubIcon;\n  /**\n   * ARIA label for the search input.\n   */\n  searchInputAriaLabel?: string;\n  /**\n   * The debounce rate for filtering.\n   */\n  debounceRate?: number;\n  /**\n   * Ref for the search input element.\n   */\n  searchInputRef?: React.RefObject<HTMLInputElement>;\n  /**\n   * Additional action button inside the search input.\n   */\n  renderAction?: React.ReactElement<typeof IconButton | typeof MenuButton>;\n  /**\n   * If true, hides the additional action when the user types in the search input.\n   */\n  hideRenderActionOnInput?: boolean;\n}\n\nconst Combobox = forwardRef(\n  (\n    {\n      className = \"\",\n      optionClassName = \"\",\n      searchWrapperClassName,\n      stickyCategoryClassName,\n      searchIcon,\n      id = \"\",\n      placeholder = \"\",\n      size = \"medium\",\n      defaultVisualFocusFirstIndex,\n      optionLineHeight = 32,\n      optionsListHeight,\n      autoFocus = false,\n      disabled = false,\n      options = [],\n      categories,\n      withCategoriesDivider = false,\n      noResultsMessage = \"No results found\",\n      onAddNew,\n      addNewLabel = \"Add new\",\n      onClick = (_optionData: IComboboxOption) => {},\n      filter = defaultFilter,\n      disableFilter = false,\n      filterValue: filterValueProp,\n      onFilterChanged,\n      loading = false,\n      onOptionHover = NOOP,\n      onOptionLeave = NOOP,\n      shouldScrollToSelectedItem = true,\n      noResultsRenderer,\n      stickyCategories = false,\n      optionRenderer = null,\n      renderOnlyVisibleOptions = false,\n      clearFilterOnSelection = false,\n      maxOptionsWithoutScroll,\n      defaultFilter: defaultFilterValue = \"\",\n      searchInputAriaLabel = \"Search for content\",\n      \"data-testid\": dataTestId,\n      debounceRate,\n      searchInputRef,\n      renderAction: RenderAction,\n      hideRenderActionOnInput\n    }: ComboboxProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const componentRef = useRef(null);\n    const inputRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const mergedInputRef = useMergeRef(inputRef, searchInputRef);\n\n    const [filterValue, setFilterValue] = useState(filterValueProp || defaultFilterValue);\n\n    if (filterValueProp !== undefined && filterValueProp !== filterValue) {\n      setFilterValue(filterValueProp);\n    }\n\n    const onChangeCallback = useCallback(\n      (value: string) => {\n        setActiveOptionIndex(-1);\n        if (onFilterChanged) {\n          onFilterChanged(value);\n        }\n        setFilterValue(value);\n      },\n      [setFilterValue, onFilterChanged]\n    );\n\n    const onOptionHoverCB = useCallback(\n      (event: React.MouseEvent, index: number, option: IComboboxOption) => {\n        onOptionHover(event, index, option);\n      },\n      [onOptionHover]\n    );\n\n    const filteredOptions: IComboboxOption[] = useMemo(() => {\n      if (disableFilter) {\n        return options;\n      }\n      return filter(filterValue, options);\n    }, [options, filterValue, filter, disableFilter]);\n\n    const [activeOptionIndex, setActiveOptionIndex] = useState(-1);\n\n    const isChildSelectable = useCallback(\n      (index: number) => {\n        return index !== undefined && filteredOptions[index] && !filteredOptions[index].disabled;\n      },\n      [filteredOptions]\n    );\n\n    const onAddNewCallback = useCallback(() => {\n      onAddNew && onAddNew(filterValue);\n      // clear filter after adding\n      setFilterValue(\"\");\n    }, [onAddNew, filterValue, setFilterValue]);\n\n    const hasResults = filteredOptions.length > 0;\n    const hasFilter = filterValue.length > 0;\n\n    function getAddNewLabel() {\n      if (isFunction(addNewLabel)) {\n        return addNewLabel(filterValue);\n      }\n      return addNewLabel;\n    }\n\n    function renderNoResults() {\n      if (noResultsRenderer) {\n        return noResultsRenderer();\n      }\n\n      return (\n        <div className={styles.comboboxNoResults}>\n          <div className={styles.comboboxMessageWrapper}>\n            <span className={styles.comboboxMessage}>{noResultsMessage}</span>\n          </div>\n          {onAddNew && !disabled && (\n            <Button className={styles.addNewButton} size={size} kind=\"tertiary\" onClick={onAddNewCallback}>\n              <span className={styles.buttonLabel}>{getAddNewLabel()}</span>\n            </Button>\n          )}\n        </div>\n      );\n    }\n\n    const [activeCategory, setActiveCategory] = useState<IComboboxCategory>();\n\n    const onActiveCategoryChanged = useCallback(\n      (categoryData: IComboboxItem) => {\n        if (categoryData?.category?.label !== activeCategory?.label) {\n          setActiveCategory(categoryData?.category);\n        }\n      },\n      [activeCategory]\n    );\n\n    const { items, itemsMap, selectableItems } = useItemsData({\n      categories,\n      options: filteredOptions,\n      filterValue,\n      withCategoriesDivider,\n      optionLineHeight\n    });\n\n    const overrideOnClick = useCallback(\n      (_event: React.MouseEvent | React.KeyboardEvent, itemIndex: number) => {\n        onClick(selectableItems[itemIndex]);\n        if (isChildSelectable(itemIndex)) {\n          setActiveOptionIndex(itemIndex);\n        }\n        if (clearFilterOnSelection) {\n          // clear filter after adding\n          onChangeCallback(\"\");\n        }\n      },\n      [onClick, selectableItems, isChildSelectable, clearFilterOnSelection, onChangeCallback]\n    );\n\n    const {\n      visualFocusItemIndex,\n      visualFocusItemId,\n      onOptionClick: overrideOnOptionClick\n    } = useKeyboardNavigation({\n      getOptionId,\n      defaultVisualFocusFirstIndex,\n      onClick: overrideOnClick,\n      isChildSelectable,\n      options: selectableItems,\n      inputRef: mergedInputRef\n    });\n\n    return (\n      <Text\n        type=\"text2\"\n        ref={mergedRef}\n        className={cx(styles.combobox, className, getStyle(styles, camelCase(\"size-\" + size)), {\n          [styles.empty]: !hasResults,\n          [styles.stickyCategory]: stickyCategories\n        })}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.COMBOBOX, id)}\n        ellipsis={false}\n        data-vibe={ComponentVibeId.COMBOBOX}\n      >\n        <div className={styles.comboboxList} style={{ maxHeight: optionsListHeight }}>\n          <Search\n            ref={mergedInputRef}\n            value={filterValue}\n            className={cx(styles.comboboxSearchWrapper, searchWrapperClassName)}\n            inputAriaLabel={searchInputAriaLabel}\n            currentAriaResultId={visualFocusItemId}\n            id=\"combobox-search\"\n            placeholder={placeholder}\n            size={size}\n            disabled={disabled}\n            onChange={onChangeCallback}\n            autoFocus={autoFocus}\n            loading={loading}\n            searchIconName={searchIcon}\n            ariaExpanded={hasFilter || hasResults}\n            ariaHasPopup=\"listbox\"\n            searchResultsContainerId={id ? `${id}-listbox` : COMBOBOX_LISTBOX_ID}\n            debounceRate={debounceRate}\n            renderAction={RenderAction}\n            hideRenderActionOnInput={hideRenderActionOnInput}\n          />\n          {stickyCategories && (\n            <StickyCategoryHeader\n              label={activeCategory?.label}\n              color={activeCategory?.color}\n              className={stickyCategoryClassName}\n            />\n          )}\n          {hasResults && (\n            <ComboboxItems\n              stickyCategories={stickyCategories}\n              categories={categories}\n              options={items}\n              itemsMap={itemsMap}\n              optionClassName={optionClassName}\n              optionRenderer={optionRenderer}\n              activeItemIndex={activeOptionIndex}\n              onActiveCategoryChanged={onActiveCategoryChanged}\n              onOptionClick={overrideOnOptionClick}\n              onOptionEnter={onOptionHoverCB}\n              onOptionLeave={onOptionLeave}\n              optionLineHeight={optionLineHeight}\n              shouldScrollToSelectedItem={shouldScrollToSelectedItem}\n              renderOnlyVisibleOptions={renderOnlyVisibleOptions}\n              maxOptionsWithoutScroll={maxOptionsWithoutScroll}\n              visualFocusItemIndex={visualFocusItemIndex}\n              id={id ? `${id}-listbox` : COMBOBOX_LISTBOX_ID}\n            />\n          )}\n        </div>\n        {hasFilter && !hasResults && !loading && renderNoResults()}\n      </Text>\n    );\n  }\n);\n\n// Locate loading next to search icon\n// color it with --secondary-text-color\n// size it like the icon - we think it's 16px - make sure it's not fat\n\ninterface ComboboxStaticProps {\n  sizes: typeof BASE_SIZES;\n  iconTypes: typeof ComboboxOption.iconTypes;\n}\n\nexport default withStaticProps<ComboboxProps, ComboboxStaticProps>(Combobox, {\n  sizes: BASE_SIZES,\n  iconTypes: ComboboxOption.iconTypes\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","_ref$className","className","_ref$optionClassName","optionClassName","searchWrapperClassName","stickyCategoryClassName","searchIcon","_ref$id","id","_ref$placeholder","placeholder","_ref$size","size","defaultVisualFocusFirstIndex","_ref$optionLineHeight","optionLineHeight","optionsListHeight","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$options","options","categories","_ref$withCategoriesDi","withCategoriesDivider","_ref$noResultsMessage","noResultsMessage","onAddNew","_ref$addNewLabel","addNewLabel","_ref$onClick","onClick","_optionData","_ref$filter","filter","defaultFilter","_ref$disableFilter","disableFilter","filterValueProp","filterValue","onFilterChanged","_ref$loading","loading","_ref$onOptionHover","onOptionHover","NOOP","_ref$onOptionLeave","onOptionLeave","_ref$shouldScrollToSe","shouldScrollToSelectedItem","noResultsRenderer","_ref$stickyCategories","stickyCategories","_ref$optionRenderer","optionRenderer","_ref$renderOnlyVisibl","renderOnlyVisibleOptions","_ref$clearFilterOnSel","clearFilterOnSelection","maxOptionsWithoutScroll","_ref$defaultFilter","defaultFilterValue","_ref$searchInputAriaL","searchInputAriaLabel","dataTestId","debounceRate","searchInputRef","RenderAction","renderAction","hideRenderActionOnInput","componentRef","useRef","inputRef","mergedRef","useMergeRef","mergedInputRef","_useState","useState","_useState2","_slicedToArray","setFilterValue","undefined","onChangeCallback","useCallback","value","setActiveOptionIndex","onOptionHoverCB","event","index","option","filteredOptions","useMemo","_useState3","_useState4","activeOptionIndex","isChildSelectable","onAddNewCallback","hasResults","length","hasFilter","_useState5","_useState6","activeCategory","setActiveCategory","onActiveCategoryChanged","categoryData","category","_a","label","_useItemsData","useItemsData","items","itemsMap","selectableItems","overrideOnClick","_event","itemIndex","_useKeyboardNavigatio","useKeyboardNavigation","getOptionId","visualFocusItemIndex","visualFocusItemId","overrideOnOptionClick","onOptionClick","React","createElement","Text","type","cx","styles","combobox","getStyle","camelCase","_defineProperty","empty","stickyCategory","getTestId","ComponentDefaultTestId","COMBOBOX","ellipsis","ComponentVibeId","comboboxList","style","maxHeight","Search","comboboxSearchWrapper","inputAriaLabel","currentAriaResultId","onChange","searchIconName","ariaExpanded","ariaHasPopup","searchResultsContainerId","concat","COMBOBOX_LISTBOX_ID","StickyCategoryHeader","color","ComboboxItems","activeItemIndex","onOptionEnter","comboboxNoResults","comboboxMessageWrapper","comboboxMessage","Button","addNewButton","kind","buttonLabel","isFunction","sizes","BASE_SIZES","iconTypes","ComboboxOption"],"mappings":"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"}
+{"version":3,"file":"Combobox.js","sources":["../../../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { useRef, useState, forwardRef, useMemo, useCallback } from \"react\";\nimport { isFunction, noop as NOOP, camelCase } from \"es-toolkit/compat\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Search from \"../Search/Search\";\nimport { BASE_SIZES } from \"../../constants\";\nimport Button from \"../Button/Button\";\nimport Text from \"../Text/Text\";\nimport ComboboxOption from \"./components/ComboboxOption/ComboboxOption\";\nimport { defaultFilter } from \"./ComboboxService\";\nimport { ComboboxItems } from \"./components/ComboboxItems/ComboboxItems\";\nimport { StickyCategoryHeader } from \"./components/StickyCategoryHeader/StickyCategoryHeader\";\nimport { useItemsData, useKeyboardNavigation } from \"./ComboboxHelpers/ComboboxHelpers\";\nimport { getOptionId } from \"./helpers\";\nimport { type ElementContent, type SubIcon, type VibeComponentProps, withStaticProps } from \"../../types\";\nimport {\n  type IComboboxCategoryMap,\n  type IComboboxItem,\n  type IComboboxOption,\n  COMBOBOX_LISTBOX_ID,\n  type IComboboxCategory\n} from \"./components/ComboboxConstants\";\nimport styles from \"./Combobox.module.scss\";\nimport { type ComboboxSizes } from \"./Combobox.types\";\nimport type IconButton from \"../IconButton/IconButton\";\nimport type MenuButton from \"../MenuButton/MenuButton\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ComboboxProps extends VibeComponentProps {\n  /**\n   * Class name applied to each option item.\n   */\n  optionClassName?: string;\n  /**\n   * Class name applied to the search wrapper.\n   */\n  searchWrapperClassName?: string;\n  /**\n   * Class name applied to the sticky category header.\n   */\n  stickyCategoryClassName?: string;\n  /**\n   * Placeholder text displayed in the search input.\n   */\n  placeholder?: string;\n  /**\n   * Message displayed when no results are found.\n   */\n  noResultsMessage?: string;\n  /**\n   * If true, the combobox is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The list of available options.\n   */\n  options?: IComboboxOption[];\n  /**\n   * The list of available categories.\n   */\n  categories?: IComboboxCategoryMap;\n  /**\n   * If true, displays a divider between category sections.\n   */\n  withCategoriesDivider?: boolean;\n  /**\n   * The size of the combobox.\n   */\n  size?: ComboboxSizes;\n  /**\n   * The height of each option item.\n   */\n  optionLineHeight?: number;\n  /**\n   * The height of the options list.\n   */\n  optionsListHeight?: number;\n  /**\n   * If true, the search input is focused when the component mounts.\n   */\n  autoFocus?: boolean;\n  /**\n   * Callback fired when the \"Add new\" button is clicked.\n   */\n  onAddNew?: (value: string) => void;\n  /**\n   * Label displayed for the \"Add new\" button.\n   */\n  addNewLabel?: ((label: string) => ElementContent) | string;\n  /**\n   * Custom filter function for searching options.\n   */\n  filter?: (filterValue: string, options: IComboboxOption[]) => IComboboxOption[];\n  /**\n   * The default search input\n   */\n  defaultFilter?: string;\n  /**\n   * If true, disables filtering.\n   */\n  disableFilter?: boolean;\n  /**\n   * Controlled search input value.\n   */\n  filterValue?: string;\n  /**\n   * Callback fired when the search input value changes.\n   */\n  onFilterChanged?: (value: string) => void;\n  /**\n   * If true, displays a loading state.\n   */\n  loading?: boolean;\n  /**\n   * Callback fired when an option is hovered.\n   */\n  onOptionHover?: (event: React.MouseEvent, index: number, option: IComboboxOption) => void;\n  /**\n   * Callback fired when the mouse leaves an option.\n   */\n  onOptionLeave?: () => void;\n  /**\n   * If true, automatically scrolls to the selected option.\n   */\n  shouldScrollToSelectedItem?: boolean;\n  /**\n   * Custom renderer for when no results are found.\n   */\n  noResultsRenderer?: () => JSX.Element;\n  /**\n   * If true, keeps categories visible when scrolling.\n   */\n  stickyCategories?: boolean;\n  /**\n   * If true, visually focuses the first item by default.\n   */\n  defaultVisualFocusFirstIndex?: boolean;\n  /**\n   * If true, clears the search input when an option is selected.\n   */\n  clearFilterOnSelection?: boolean;\n  /**\n   * Custom renderer for options.\n   */\n  optionRenderer?: (option: IComboboxOption) => JSX.Element;\n  /**\n   * Maximum number of options displayed before scrolling.\n   */\n  maxOptionsWithoutScroll?: number;\n  /**\n   * If true, renders only visible options for performance optimization.\n   */\n  renderOnlyVisibleOptions?: boolean;\n  /**\n   * Callback fired when an option is clicked.\n   */\n  onClick?: (optionData: IComboboxOption) => void;\n  /**\n   * Custom search icon.\n   */\n  searchIcon?: SubIcon;\n  /**\n   * ARIA label for the search input.\n   */\n  searchInputAriaLabel?: string;\n  /**\n   * The debounce rate for filtering.\n   */\n  debounceRate?: number;\n  /**\n   * Ref for the search input element.\n   */\n  searchInputRef?: React.RefObject<HTMLInputElement>;\n  /**\n   * Additional action button inside the search input.\n   */\n  renderAction?: React.ReactElement<typeof IconButton | typeof MenuButton>;\n  /**\n   * If true, hides the additional action when the user types in the search input.\n   */\n  hideRenderActionOnInput?: boolean;\n}\n\nconst Combobox = forwardRef(\n  (\n    {\n      className = \"\",\n      optionClassName = \"\",\n      searchWrapperClassName,\n      stickyCategoryClassName,\n      searchIcon,\n      id = \"\",\n      placeholder = \"\",\n      size = \"medium\",\n      defaultVisualFocusFirstIndex,\n      optionLineHeight = 32,\n      optionsListHeight,\n      autoFocus = false,\n      disabled = false,\n      options = [],\n      categories,\n      withCategoriesDivider = false,\n      noResultsMessage = \"No results found\",\n      onAddNew,\n      addNewLabel = \"Add new\",\n      onClick = (_optionData: IComboboxOption) => {},\n      filter = defaultFilter,\n      disableFilter = false,\n      filterValue: filterValueProp,\n      onFilterChanged,\n      loading = false,\n      onOptionHover = NOOP,\n      onOptionLeave = NOOP,\n      shouldScrollToSelectedItem = true,\n      noResultsRenderer,\n      stickyCategories = false,\n      optionRenderer = null,\n      renderOnlyVisibleOptions = false,\n      clearFilterOnSelection = false,\n      maxOptionsWithoutScroll,\n      defaultFilter: defaultFilterValue = \"\",\n      searchInputAriaLabel = \"Search for content\",\n      \"data-testid\": dataTestId,\n      debounceRate,\n      searchInputRef,\n      renderAction: RenderAction,\n      hideRenderActionOnInput\n    }: ComboboxProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const componentRef = useRef(null);\n    const inputRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const mergedInputRef = useMergeRef(inputRef, searchInputRef);\n\n    const [filterValue, setFilterValue] = useState(filterValueProp || defaultFilterValue);\n\n    if (filterValueProp !== undefined && filterValueProp !== filterValue) {\n      setFilterValue(filterValueProp);\n    }\n\n    const onChangeCallback = useCallback(\n      (value: string) => {\n        setActiveOptionIndex(-1);\n        if (onFilterChanged) {\n          onFilterChanged(value);\n        }\n        setFilterValue(value);\n      },\n      [setFilterValue, onFilterChanged]\n    );\n\n    const onOptionHoverCB = useCallback(\n      (event: React.MouseEvent, index: number, option: IComboboxOption) => {\n        onOptionHover(event, index, option);\n      },\n      [onOptionHover]\n    );\n\n    const filteredOptions: IComboboxOption[] = useMemo(() => {\n      if (disableFilter) {\n        return options;\n      }\n      return filter(filterValue, options);\n    }, [options, filterValue, filter, disableFilter]);\n\n    const [activeOptionIndex, setActiveOptionIndex] = useState(-1);\n\n    const isChildSelectable = useCallback(\n      (index: number) => {\n        return index !== undefined && filteredOptions[index] && !filteredOptions[index].disabled;\n      },\n      [filteredOptions]\n    );\n\n    const onAddNewCallback = useCallback(() => {\n      onAddNew && onAddNew(filterValue);\n      // clear filter after adding\n      setFilterValue(\"\");\n    }, [onAddNew, filterValue, setFilterValue]);\n\n    const hasResults = filteredOptions.length > 0;\n    const hasFilter = filterValue.length > 0;\n\n    function getAddNewLabel() {\n      if (isFunction(addNewLabel)) {\n        return addNewLabel(filterValue);\n      }\n      return addNewLabel;\n    }\n\n    function renderNoResults() {\n      if (noResultsRenderer) {\n        return noResultsRenderer();\n      }\n\n      return (\n        <div className={styles.comboboxNoResults}>\n          <div className={styles.comboboxMessageWrapper}>\n            <span className={styles.comboboxMessage}>{noResultsMessage}</span>\n          </div>\n          {onAddNew && !disabled && (\n            <Button className={styles.addNewButton} size={size} kind=\"tertiary\" onClick={onAddNewCallback}>\n              <span className={styles.buttonLabel}>{getAddNewLabel()}</span>\n            </Button>\n          )}\n        </div>\n      );\n    }\n\n    const [activeCategory, setActiveCategory] = useState<IComboboxCategory>();\n\n    const onActiveCategoryChanged = useCallback(\n      (categoryData: IComboboxItem) => {\n        if (categoryData?.category?.label !== activeCategory?.label) {\n          setActiveCategory(categoryData?.category);\n        }\n      },\n      [activeCategory]\n    );\n\n    const { items, itemsMap, selectableItems } = useItemsData({\n      categories,\n      options: filteredOptions,\n      filterValue,\n      withCategoriesDivider,\n      optionLineHeight\n    });\n\n    const overrideOnClick = useCallback(\n      (_event: React.MouseEvent | React.KeyboardEvent, itemIndex: number) => {\n        onClick(selectableItems[itemIndex]);\n        if (isChildSelectable(itemIndex)) {\n          setActiveOptionIndex(itemIndex);\n        }\n        if (clearFilterOnSelection) {\n          // clear filter after adding\n          onChangeCallback(\"\");\n        }\n      },\n      [onClick, selectableItems, isChildSelectable, clearFilterOnSelection, onChangeCallback]\n    );\n\n    const {\n      visualFocusItemIndex,\n      visualFocusItemId,\n      onOptionClick: overrideOnOptionClick\n    } = useKeyboardNavigation({\n      getOptionId,\n      defaultVisualFocusFirstIndex,\n      onClick: overrideOnClick,\n      isChildSelectable,\n      options: selectableItems,\n      inputRef: mergedInputRef\n    });\n\n    return (\n      <Text\n        type=\"text2\"\n        ref={mergedRef}\n        className={cx(styles.combobox, className, getStyle(styles, camelCase(\"size-\" + size)), {\n          [styles.empty]: !hasResults,\n          [styles.stickyCategory]: stickyCategories\n        })}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.COMBOBOX, id)}\n        ellipsis={false}\n        data-vibe={ComponentVibeId.COMBOBOX}\n      >\n        <div className={styles.comboboxList} style={{ maxHeight: optionsListHeight }}>\n          <Search\n            ref={mergedInputRef}\n            value={filterValue}\n            className={cx(styles.comboboxSearchWrapper, searchWrapperClassName)}\n            inputAriaLabel={searchInputAriaLabel}\n            currentAriaResultId={visualFocusItemId}\n            id=\"combobox-search\"\n            placeholder={placeholder}\n            size={size}\n            disabled={disabled}\n            onChange={onChangeCallback}\n            autoFocus={autoFocus}\n            loading={loading}\n            searchIconName={searchIcon}\n            ariaExpanded={hasFilter || hasResults}\n            ariaHasPopup=\"listbox\"\n            searchResultsContainerId={id ? `${id}-listbox` : COMBOBOX_LISTBOX_ID}\n            debounceRate={debounceRate}\n            renderAction={RenderAction}\n            hideRenderActionOnInput={hideRenderActionOnInput}\n          />\n          {stickyCategories && (\n            <StickyCategoryHeader\n              label={activeCategory?.label}\n              color={activeCategory?.color}\n              className={stickyCategoryClassName}\n            />\n          )}\n          {hasResults && (\n            <ComboboxItems\n              stickyCategories={stickyCategories}\n              categories={categories}\n              options={items}\n              itemsMap={itemsMap}\n              optionClassName={optionClassName}\n              optionRenderer={optionRenderer}\n              activeItemIndex={activeOptionIndex}\n              onActiveCategoryChanged={onActiveCategoryChanged}\n              onOptionClick={overrideOnOptionClick}\n              onOptionEnter={onOptionHoverCB}\n              onOptionLeave={onOptionLeave}\n              optionLineHeight={optionLineHeight}\n              shouldScrollToSelectedItem={shouldScrollToSelectedItem}\n              renderOnlyVisibleOptions={renderOnlyVisibleOptions}\n              maxOptionsWithoutScroll={maxOptionsWithoutScroll}\n              visualFocusItemIndex={visualFocusItemIndex}\n              id={id ? `${id}-listbox` : COMBOBOX_LISTBOX_ID}\n            />\n          )}\n        </div>\n        {hasFilter && !hasResults && !loading && renderNoResults()}\n      </Text>\n    );\n  }\n);\n\n// Locate loading next to search icon\n// color it with --secondary-text-color\n// size it like the icon - we think it's 16px - make sure it's not fat\n\ninterface ComboboxStaticProps {\n  sizes: typeof BASE_SIZES;\n  iconTypes: typeof ComboboxOption.iconTypes;\n}\n\nexport default withStaticProps<ComboboxProps, ComboboxStaticProps>(Combobox, {\n  sizes: BASE_SIZES,\n  iconTypes: ComboboxOption.iconTypes\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","_ref$className","className","_ref$optionClassName","optionClassName","searchWrapperClassName","stickyCategoryClassName","searchIcon","_ref$id","id","_ref$placeholder","placeholder","_ref$size","size","defaultVisualFocusFirstIndex","_ref$optionLineHeight","optionLineHeight","optionsListHeight","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$options","options","categories","_ref$withCategoriesDi","withCategoriesDivider","_ref$noResultsMessage","noResultsMessage","onAddNew","_ref$addNewLabel","addNewLabel","_ref$onClick","onClick","_optionData","_ref$filter","filter","defaultFilter","_ref$disableFilter","disableFilter","filterValueProp","filterValue","onFilterChanged","_ref$loading","loading","_ref$onOptionHover","onOptionHover","NOOP","_ref$onOptionLeave","onOptionLeave","_ref$shouldScrollToSe","shouldScrollToSelectedItem","noResultsRenderer","_ref$stickyCategories","stickyCategories","_ref$optionRenderer","optionRenderer","_ref$renderOnlyVisibl","renderOnlyVisibleOptions","_ref$clearFilterOnSel","clearFilterOnSelection","maxOptionsWithoutScroll","_ref$defaultFilter","defaultFilterValue","_ref$searchInputAriaL","searchInputAriaLabel","dataTestId","debounceRate","searchInputRef","RenderAction","renderAction","hideRenderActionOnInput","componentRef","useRef","inputRef","mergedRef","useMergeRef","mergedInputRef","_useState","useState","_useState2","_slicedToArray","setFilterValue","undefined","onChangeCallback","useCallback","value","setActiveOptionIndex","onOptionHoverCB","event","index","option","filteredOptions","useMemo","_useState3","_useState4","activeOptionIndex","isChildSelectable","onAddNewCallback","hasResults","length","hasFilter","_useState5","_useState6","activeCategory","setActiveCategory","onActiveCategoryChanged","categoryData","category","_a","label","_useItemsData","useItemsData","items","itemsMap","selectableItems","overrideOnClick","_event","itemIndex","_useKeyboardNavigatio","useKeyboardNavigation","getOptionId","visualFocusItemIndex","visualFocusItemId","overrideOnOptionClick","onOptionClick","React","createElement","Text","type","cx","styles","combobox","getStyle","camelCase","_defineProperty","empty","stickyCategory","getTestId","ComponentDefaultTestId","COMBOBOX","ellipsis","ComponentVibeId","comboboxList","style","maxHeight","Search","comboboxSearchWrapper","inputAriaLabel","currentAriaResultId","onChange","searchIconName","ariaExpanded","ariaHasPopup","searchResultsContainerId","concat","COMBOBOX_LISTBOX_ID","StickyCategoryHeader","color","ComboboxItems","activeItemIndex","onOptionEnter","comboboxNoResults","comboboxMessageWrapper","comboboxMessage","Button","addNewButton","kind","buttonLabel","isFunction","sizes","BASE_SIZES","iconTypes","ComboboxOption"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Combobox/Combobox.module.scss.js

@@ -1,2 +1,2 @@
-var o={combobox:"combobox",stickyCategory:"stickyCategory",comboboxCategory:"comboboxCategory",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",empty:"empty",comboboxSearchWrapper:"comboboxSearchWrapper",comboboxNoResults:"comboboxNoResults",comboboxMessageWrapper:"comboboxMessageWrapper",comboboxMessage:"comboboxMessage",addNewButton:"addNewButton",buttonLabel:"buttonLabel",comboboxList:"comboboxList"};!function(o){const e="s_id-140391bb7df9_3_61_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=o)}("/* stylelint-disable selector-class-pattern */\n.combobox {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  margin-bottom: var(--spacing-small);\n}\n.combobox.stickyCategory .comboboxCategory {\n  z-index: 10;\n  background-color: var(--secondary-background-color);\n}\n/* Relative to Search height */\n.combobox.stickyCategory.sizeSmall .comboboxCategory {\n  top: 32px;\n}\n.combobox.stickyCategory.sizeMedium .comboboxCategory {\n  top: 40px;\n}\n.combobox.stickyCategory.sizeLarge .comboboxCategory {\n  top: 48px;\n}\n.combobox.empty {\n  max-height: 200px;\n  margin-bottom: 0;\n}\n.comboboxSearchWrapper {\n  position: sticky;\n  top: 0;\n  z-index: 12;\n}\n.comboboxNoResults {\n  margin-top: var(--spacing-small);\n  flex: 1 1 auto;\n  height: calc(100% - 20px);\n  overflow: hidden;\n  position: relative;\n  padding: 0 16px;\n  display: flex;\n  flex-direction: column;\n}\n.comboboxNoResults .comboboxMessageWrapper {\n  flex: 1 0 auto;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.comboboxNoResults .comboboxMessageWrapper .comboboxMessage {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.comboboxNoResults .addNewButton {\n  flex: 0 0 auto;\n  width: 100% !important;\n  margin-bottom: 8px;\n}\n.comboboxNoResults .addNewButton .buttonLabel {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.comboboxList {\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 auto;\n  padding: 0 4px;\n  overflow: hidden;\n}");export{o as default};
+var o={combobox:"combobox",stickyCategory:"stickyCategory",comboboxCategory:"comboboxCategory",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",empty:"empty",comboboxSearchWrapper:"comboboxSearchWrapper",comboboxNoResults:"comboboxNoResults",comboboxMessageWrapper:"comboboxMessageWrapper",comboboxMessage:"comboboxMessage",addNewButton:"addNewButton",buttonLabel:"buttonLabel",comboboxList:"comboboxList"};!function(o){const e="s_id-140391bb7df9_3_62_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=o)}("/* stylelint-disable selector-class-pattern */\n.combobox {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  margin-bottom: var(--spacing-small);\n}\n.combobox.stickyCategory .comboboxCategory {\n  z-index: 10;\n  background-color: var(--secondary-background-color);\n}\n/* Relative to Search height */\n.combobox.stickyCategory.sizeSmall .comboboxCategory {\n  top: 32px;\n}\n.combobox.stickyCategory.sizeMedium .comboboxCategory {\n  top: 40px;\n}\n.combobox.stickyCategory.sizeLarge .comboboxCategory {\n  top: 48px;\n}\n.combobox.empty {\n  max-height: 200px;\n  margin-bottom: 0;\n}\n.comboboxSearchWrapper {\n  position: sticky;\n  top: 0;\n  z-index: 12;\n}\n.comboboxNoResults {\n  margin-top: var(--spacing-small);\n  flex: 1 1 auto;\n  height: calc(100% - 20px);\n  overflow: hidden;\n  position: relative;\n  padding: 0 16px;\n  display: flex;\n  flex-direction: column;\n}\n.comboboxNoResults .comboboxMessageWrapper {\n  flex: 1 0 auto;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.comboboxNoResults .comboboxMessageWrapper .comboboxMessage {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.comboboxNoResults .addNewButton {\n  flex: 0 0 auto;\n  width: 100% !important;\n  margin-bottom: 8px;\n}\n.comboboxNoResults .addNewButton .buttonLabel {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.comboboxList {\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 auto;\n  padding: 0 4px;\n  overflow: hidden;\n}");export{o as default};
 //# sourceMappingURL=Combobox.module.scss.js.map

package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js

@@ -1,2 +1,2 @@
-var e={comboboxItemContainer:"comboboxItemContainer",dividerContainer:"dividerContainer",divider:"divider",sticky:"sticky"};!function(e){const n="s_id-78c8179b7fe9_3_61_1";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".comboboxItemContainer {\n  display: flex;\n  flex: auto;\n  width: 100%;\n  background-color: var(--secondary-background-color);\n}\n\n.dividerContainer {\n  position: relative;\n  width: 95%;\n}\n\n.divider {\n  position: absolute;\n  width: calc(100% + 16px);\n  margin-left: -12px;\n}\n\n.sticky {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n}");export{e as default};
+var e={comboboxItemContainer:"comboboxItemContainer",dividerContainer:"dividerContainer",divider:"divider",sticky:"sticky"};!function(e){const n="s_id-78c8179b7fe9_3_62_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".comboboxItemContainer {\n  display: flex;\n  flex: auto;\n  width: 100%;\n  background-color: var(--secondary-background-color);\n}\n\n.dividerContainer {\n  position: relative;\n  width: 95%;\n}\n\n.divider {\n  position: absolute;\n  width: calc(100% + 16px);\n  margin-left: -12px;\n}\n\n.sticky {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n}");export{e as default};
 //# sourceMappingURL=ComboboxHelpers.module.scss.js.map

package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js

@@ -1,2 +1,2 @@
-var e={comboboxCategory:"comboboxCategory"};!function(e){const t="s_id-a004d249e1c1_3_61_1";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,o.firstChild?o.insertBefore(n,o.firstChild):o.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.comboboxCategory {\n  color: var(--placeholder-color);\n  display: flex;\n  align-items: center;\n  padding-top: var(--spacing-small);\n}");export{e as default};
+var e={comboboxCategory:"comboboxCategory"};!function(e){const t="s_id-a004d249e1c1_3_62_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,o.firstChild?o.insertBefore(n,o.firstChild):o.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.comboboxCategory {\n  color: var(--placeholder-color);\n  display: flex;\n  align-items: center;\n  padding-top: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=ComboboxCategory.module.scss.js.map

package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js

@@ -1,2 +1,2 @@
-var t={scrollableContainer:"scrollableContainer",optionsContainer:"optionsContainer",categoryWithOptions:"categoryWithOptions",firstCategory:"firstCategory",categoryWithoutOptions:"categoryWithoutOptions"};!function(t){const o="s_id-4d4facb041a8_3_61_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+o))return;const e=document.createElement("style");e.id=o,n.firstChild?n.insertBefore(e,n.firstChild):n.appendChild(e),e.appendChild(document.createTextNode(t))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=t)}(".scrollableContainer::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.scrollableContainer::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}\n.optionsContainer {\n  overflow-x: visible;\n  overflow-y: auto;\n  margin-top: var(--spacing-small);\n}\n.categoryWithOptions.firstCategory,\n.categoryWithoutOptions.firstCategory {\n  padding-top: 0;\n}\n.categoryWithOptions {\n  margin-bottom: var(--spacing-xs);\n}\n.categoryWithoutOptions {\n  margin-bottom: 0;\n}");export{t as default};
+var t={scrollableContainer:"scrollableContainer",optionsContainer:"optionsContainer",categoryWithOptions:"categoryWithOptions",firstCategory:"firstCategory",categoryWithoutOptions:"categoryWithoutOptions"};!function(t){const o="s_id-4d4facb041a8_3_62_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+o))return;const e=document.createElement("style");e.id=o,n.firstChild?n.insertBefore(e,n.firstChild):n.appendChild(e),e.appendChild(document.createTextNode(t))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=t)}(".scrollableContainer::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.scrollableContainer::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}\n.optionsContainer {\n  overflow-x: visible;\n  overflow-y: auto;\n  margin-top: var(--spacing-small);\n}\n.categoryWithOptions.firstCategory,\n.categoryWithoutOptions.firstCategory {\n  padding-top: 0;\n}\n.categoryWithOptions {\n  margin-bottom: var(--spacing-xs);\n}\n.categoryWithoutOptions {\n  margin-bottom: 0;\n}");export{t as default};
 //# sourceMappingURL=ComboboxItems.module.scss.js.map