npm - @vibe/core - Versions diffs - 3.60.0 → 3.61.1 - Mend

@vibe/core 3.60.0 → 3.61.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (472) hide show

package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={breadcrumbItemWrapper:"breadcrumbItemWrapper_d77aa48c6c",disabled:"disabled_1c2b96c072"};!function(e){const d="s_id-03f482333e23_3_59_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+d))return;const n=document.createElement("style");n.id=d,t.firstChild?t.insertBefore(n,t.firstChild):t.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".breadcrumbItemWrapper_d77aa48c6c {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}\n\n.breadcrumbItemWrapper_d77aa48c6c.disabled_1c2b96c072 {\n  cursor: not-allowed;\n}");export{e as default};
+var e={breadcrumbItemWrapper:"breadcrumbItemWrapper_7db3796d9e",disabled:"disabled_ac5771f39c"};!function(e){const d="s_id-03f482333e23_3_61_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+d))return;const n=document.createElement("style");n.id=d,t.firstChild?t.insertBefore(n,t.firstChild):t.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".breadcrumbItemWrapper_7db3796d9e {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}\n\n.breadcrumbItemWrapper_7db3796d9e.disabled_ac5771f39c {\n  cursor: not-allowed;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbItem.module.scss.js.map

package/dist/src/components/BreadcrumbsBar/BreadcrumbMenu/BreadcrumbsMenu.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={breadcrumbMenuWrapper:"breadcrumbMenuWrapper_d77aa48c6c"};!function(e){const n="s_id-fc5ae89c4b65_3_59_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)}(".breadcrumbMenuWrapper_d77aa48c6c {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}");export{e as default};
+var e={breadcrumbMenuWrapper:"breadcrumbMenuWrapper_7db3796d9e"};!function(e){const n="s_id-fc5ae89c4b65_3_61_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,d.firstChild?d.insertBefore(t,d.firstChild):d.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbMenuWrapper_7db3796d9e {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbsMenu.module.scss.js.map

package/dist/src/components/BreadcrumbsBar/BreadcrumbsBar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import t from"react";import e from"classnames";import{getTestId as r,ComponentDefaultTestId as a}from"../../tests/testIds.js";import{BreadcrumbsBarType as s}from"./BreadcrumbsConstants.js";import{withStaticPropsWithoutForwardRef as i}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import o from"./BreadcrumbsBar.module.scss.js";import n from"../../../icons/dist/react/NavigationChevronRight.js";var m=i((function(s){var i=s.children,m=s.type,l=void 0===m?"indication":m,c=s.id,d=s["data-testid"];return t.createElement("nav",{"aria-label":"Breadcrumb",className:e(o.breadcrumbsBar,s.className),id:c,"data-testid":d||r(a.BREADCRUMBS_BAR,c)},t.createElement("ol",null,i&&t.Children.map(i,(function(e,r){return t.isValidElement(e)?[r>0&&t.createElement(n,{className:o.separatorIcon,size:"14","aria-hidden":"true"}),t.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{isClickable:"indication"!==l}))]:null}))))}),{types:s});export{m as default};
+import t from"react";import e from"classnames";import{getTestId as s,ComponentDefaultTestId as a}from"../../tests/testIds.js";import{BreadcrumbsBarType as r}from"./BreadcrumbsConstants.js";import{withStaticPropsWithoutForwardRef as i}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import o from"./BreadcrumbsBar.module.scss.js";import{ComponentVibeId as n}from"../../tests/constants.js";import m from"../../../icons/dist/react/NavigationChevronRight.js";var c=i((function(r){var i=r.children,c=r.type,l=void 0===c?"indication":c,d=r.id,p=r["data-testid"];return t.createElement("nav",{"aria-label":"Breadcrumb",className:e(o.breadcrumbsBar,r.className),id:d,"data-testid":p||s(a.BREADCRUMBS_BAR,d),"data-vibe":n.BREADCRUMBS_BAR},t.createElement("ol",null,i&&t.Children.map(i,(function(e,s){return t.isValidElement(e)?[s>0&&t.createElement(m,{className:o.separatorIcon,size:"14","aria-hidden":"true"}),t.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{isClickable:"indication"!==l}))]:null}))))}),{types:r});export{c as default};
 //# sourceMappingURL=BreadcrumbsBar.js.map

package/dist/src/components/BreadcrumbsBar/BreadcrumbsBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BreadcrumbsBar.js","sources":["../../../../src/components/BreadcrumbsBar/BreadcrumbsBar.tsx"],"sourcesContent":["import React, { type ReactElement } from \"react\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { NavigationChevronRight } from \"@vibe/icons\";\nimport { BreadcrumbsBarType as BreadcrumbsBarTypeEnum } from \"./BreadcrumbsConstants\";\nimport { type BreadcrumbsBarType } from \"./Breadcrumbs.types\";\nimport { type BreadcrumbItemProps } from \"./BreadcrumbItem/BreadcrumbItem\";\nimport { type VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport styles from \"./BreadcrumbsBar.module.scss\";\nimport { type BreadcrumbMenuProps } from \"./BreadcrumbMenu/BreadcrumbMenu\";\n\nexport interface BreadcrumbBarProps extends VibeComponentProps {\n /*\n The type of the breadcrumb bar, determining if it is navigational or for indication only.\n /\n type: BreadcrumbsBarType;\n /\n The breadcrumb items displayed in the bar.\n */\n children:\n \| ReactElement<BreadcrumbItemProps \| BreadcrumbMenuProps>\n \| ReactElement<BreadcrumbItemProps \| BreadcrumbMenuProps>[];\n}\n\nconst BreadcrumbsBar = ({\n className,\n children,\n type = \"indication\",\n id,\n \"data-testid\": dataTestId\n}: BreadcrumbBarProps) => (\n <nav\n aria-label=\"Breadcrumb\"\n className={cx(styles.breadcrumbsBar, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.BREADCRUMBS_BAR, id)}\n >\n <ol>\n {children &&\n React.Children.map(children, (child, index) =>\n React.isValidElement(child)\n ? [\n index > 0 && <NavigationChevronRight className={styles.separatorIcon} size=\"14\" aria-hidden=\"true\" />,\n React.cloneElement(child, {\n ...child?.props,\n isClickable: type !== \"indication\"\n })\n ]\n : null\n )}\n </ol>\n </nav>\n);\n\ninterface BreadcrumbsBarStaticProps {\n types: typeof BreadcrumbsBarTypeEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<BreadcrumbBarProps, BreadcrumbsBarStaticProps>(BreadcrumbsBar, {\n types: BreadcrumbsBarTypeEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","children","_ref$type","type","id","dataTestId","React","createElement","className","cx","styles","breadcrumbsBar","getTestId","ComponentDefaultTestId","BREADCRUMBS_BAR","Children","map","child","index","isValidElement","NavigationChevronRight","separatorIcon","size","cloneElement","Object","assign","props","isClickable","types","BreadcrumbsBarTypeEnum"],"mappings":"~~waAwBA~~,~~IAkCeA~~,EAAAA,~~GAlCQ~~,SAAHC,GAAA,IAElBC,EAAQD,EAARC,SAAQC,EAAAF,EACRG,KAAAA,OAAO,IAAHD,EAAG,aAAYA,EACnBE,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eAAa,OAEbM,EACaC,cAAA,MAAA,CAAA,aAAA,aACXC,UAAWC,EAAGC,EAAOC,eARdX,EAATQ,WASEJ,GAAIA,EAAE,cACOC,GAAcO,EAAUC,EAAuBC,gBAAiBV,~~IAE7EE~~,EAAAC,cAAA,KAAA,KACGN,GACCK,~~EAAMS~~,SAASC,~~IAAIf~~,GAAU,~~SAACgB~~,EAAOC,GAAK,~~OACxCZ~~,~~EAAMa~~,eAAeF,GACjB,CACEC,EAAQ,~~GAAKZ~~,EAACC,~~cAAAa~~,~~GAAuBZ~~,UAAWE,~~EAAOW~~,cAAeC,KAAK,KAAI,cAAa,~~SAC5FhB~~,~~EAAMiB~~,aAAaN,EACdO,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAR,aAAK,EAALA,EAAOS,OACV,CAAAC,YAAsB,~~eAATxB~~,MAGjB,IAAI,KAGV,GAOuG,~~CAC7GyB~~,MAAOC"}
1	+ {"version":3,"file":"BreadcrumbsBar.js","sources":["../../../../src/components/BreadcrumbsBar/BreadcrumbsBar.tsx"],"sourcesContent":["import React, { type ReactElement } from \"react\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { NavigationChevronRight } from \"@vibe/icons\";\nimport { BreadcrumbsBarType as BreadcrumbsBarTypeEnum } from \"./BreadcrumbsConstants\";\nimport { type BreadcrumbsBarType } from \"./Breadcrumbs.types\";\nimport { type BreadcrumbItemProps } from \"./BreadcrumbItem/BreadcrumbItem\";\nimport { type VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport styles from \"./BreadcrumbsBar.module.scss\";\nimport { type BreadcrumbMenuProps } from \"./BreadcrumbMenu/BreadcrumbMenu\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface BreadcrumbBarProps extends VibeComponentProps {\n /*\n The type of the breadcrumb bar, determining if it is navigational or for indication only.\n /\n type: BreadcrumbsBarType;\n /\n The breadcrumb items displayed in the bar.\n */\n children:\n \| ReactElement<BreadcrumbItemProps \| BreadcrumbMenuProps>\n \| ReactElement<BreadcrumbItemProps \| BreadcrumbMenuProps>[];\n}\n\nconst BreadcrumbsBar = ({\n className,\n children,\n type = \"indication\",\n id,\n \"data-testid\": dataTestId\n}: BreadcrumbBarProps) => (\n <nav\n aria-label=\"Breadcrumb\"\n className={cx(styles.breadcrumbsBar, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.BREADCRUMBS_BAR, id)}\n data-vibe={ComponentVibeId.BREADCRUMBS_BAR}\n >\n <ol>\n {children &&\n React.Children.map(children, (child, index) =>\n React.isValidElement(child)\n ? [\n index > 0 && <NavigationChevronRight className={styles.separatorIcon} size=\"14\" aria-hidden=\"true\" />,\n React.cloneElement(child, {\n ...child?.props,\n isClickable: type !== \"indication\"\n })\n ]\n : null\n )}\n </ol>\n </nav>\n);\n\ninterface BreadcrumbsBarStaticProps {\n types: typeof BreadcrumbsBarTypeEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<BreadcrumbBarProps, BreadcrumbsBarStaticProps>(BreadcrumbsBar, {\n types: BreadcrumbsBarTypeEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","children","_ref$type","type","id","dataTestId","React","createElement","className","cx","styles","breadcrumbsBar","getTestId","ComponentDefaultTestId","BREADCRUMBS_BAR","ComponentVibeId","Children","map","child","index","isValidElement","NavigationChevronRight","separatorIcon","size","cloneElement","Object","assign","props","isClickable","types","BreadcrumbsBarTypeEnum"],"mappings":"meAyBA,IAmCeA,EAAAA,GAnCQ,SAAHC,GAAA,IAElBC,EAAQD,EAARC,SAAQC,EAAAF,EACRG,KAAAA,OAAO,IAAHD,EAAG,aAAYA,EACnBE,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eAAa,OAEbM,EACaC,cAAA,MAAA,CAAA,aAAA,aACXC,UAAWC,EAAGC,EAAOC,eARdX,EAATQ,WASEJ,GAAIA,EAAE,cACOC,GAAcO,EAAUC,EAAuBC,gBAAiBV,GAAG,YACrEW,EAAgBD,iBAE3BR,EAAAC,cAAA,KAAA,KACGN,GACCK,EAAMU,SAASC,IAAIhB,GAAU,SAACiB,EAAOC,GAAK,OACxCb,EAAMc,eAAeF,GACjB,CACEC,EAAQ,GAAKb,EAACC,cAAAc,GAAuBb,UAAWE,EAAOY,cAAeC,KAAK,KAAI,cAAa,SAC5FjB,EAAMkB,aAAaN,EACdO,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAR,aAAK,EAALA,EAAOS,OACV,CAAAC,YAAsB,eAATzB,MAGjB,IAAI,KAGV,GAOuG,CAC7G0B,MAAOC"}

package/dist/src/components/BreadcrumbsBar/BreadcrumbsBar.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={breadcrumbsBar:"breadcrumbsBar_cd03ff4ab2",separatorIcon:"separatorIcon_e802958d40"};!function(e){const n="s_id-24567fd55d40_3_59_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbsBar_cd03ff4ab2 ol {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  white-space: nowrap;\n}\n\n.breadcrumbsBar_cd03ff4ab2 ol .separatorIcon_e802958d40 {\n  color: var(--secondary-text-color);\n  flex-shrink: 0;\n}");export{e as default};
+var e={breadcrumbsBar:"breadcrumbsBar_d845a8523d",separatorIcon:"separatorIcon_7e203c6337"};!function(e){const n="s_id-24567fd55d40_3_61_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbsBar_d845a8523d ol {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  white-space: nowrap;\n}\n\n.breadcrumbsBar_d845a8523d ol .separatorIcon_7e203c6337 {\n  color: var(--secondary-text-color);\n  flex-shrink: 0;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbsBar.module.scss.js.map

package/dist/src/components/Button/Button.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var o={button:"button_d9cd088a68","focus-visible":"focus-visible_a0a0b58798",loader:"loader_0526f15353",loaderSvg:"loaderSvg_6e24fb1464",textPlaceholder:"textPlaceholder_728b3f2cfa",success:"success_58ce9abf54",successContent:"successContent_3cd6405641",marginRight:"marginRight_9335900c40",marginLeft:"marginLeft_ac260a6649",rightFlat:"rightFlat_b2057c3fde",leftFlat:"leftFlat_c91c8d3d89",preventClickAnimation:"preventClickAnimation_c08380f50a",leftIcon:"leftIcon_9335900c40",rightIcon:"rightIcon_ac260a6649",sizeXxs:"sizeXxs_e6471227e1",sizeXs:"sizeXs_76a22d8cd0",sizeSmall:"sizeSmall_32febe9e5c",sizeMedium:"sizeMedium_fa93c795d4",sizeLarge:"sizeLarge_3b64d8cac6",kindPrimary:"kindPrimary_fbec724939",colorPrimary:"colorPrimary_7d148eebf0",colorBrand:"colorBrand_095bed55c8",colorPrimaryActive:"colorPrimaryActive_54bbe9adf1",colorBrandActive:"colorBrandActive_94d0265164",colorPositive:"colorPositive_8d1681937d",colorPositiveActive:"colorPositiveActive_1c8dccfa3f",colorNegative:"colorNegative_fe5557260a",colorNegativeActive:"colorNegativeActive_1c8dccfa3f",colorInverted:"colorInverted_0d4a5ef10a",colorInvertedActive:"colorInvertedActive_1c8dccfa3f",disabled:"disabled_7524c2110c",colorOnPrimaryColor:"colorOnPrimaryColor_44060a636f",colorOnPrimaryColorActive:"colorOnPrimaryColorActive_8cfef7b0c9",colorFixedLight:"colorFixedLight_2205e45c85",colorFixedLightActive:"colorFixedLightActive_c08380f50a",colorFixedDark:"colorFixedDark_2c1c83c2e6",colorFixedDarkActive:"colorFixedDarkActive_54ee66c16e",colorOnInvertedBackground:"colorOnInvertedBackground_0044e3ce4a",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive_0b004ec181",kindSecondary:"kindSecondary_b4a4c5a448",kindTertiary:"kindTertiary_91f204ffc2",noSidePadding:"noSidePadding_db8e3dc065",insetFocusStyle:"insetFocusStyle_f032c2b66e"};!function(o){const r="s_id-f5db469b1a79_3_59_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const c=document.createElement("style");c.id=r,n.firstChild?n.insertBefore(c,n.firstChild):n.appendChild(c),c.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}("/* stylelint-disable selector-class-pattern */\n.button_d9cd088a68 {\n  --loader-padding: 8px;\n  outline: none;\n  border: none;\n  height: auto;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n  white-space: nowrap;\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Prevent text selection */\n  user-select: none;\n  min-width: auto;\n}\n.button_d9cd088a68:focus-visible, .button_d9cd088a68.focus-visible_a0a0b58798 {\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.button_d9cd088a68:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.button_d9cd088a68 .loader_0526f15353 {\n  height: 100%;\n}\n.button_d9cd088a68 .loader_0526f15353 .loaderSvg_6e24fb1464 {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button_d9cd088a68 .textPlaceholder_728b3f2cfa {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button_d9cd088a68.success_58ce9abf54 {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button_d9cd088a68.success_58ce9abf54 .successContent_3cd6405641 {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight_9335900c40 {\n  margin-right: var(--spacing-small);\n}\n.marginLeft_ac260a6649 {\n  margin-left: var(--spacing-small);\n}\n.rightFlat_b2057c3fde {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat_c91c8d3d89 {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button_d9cd088a68:active:not(.preventClickAnimation_c08380f50a) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button_d9cd088a68 .leftIcon_9335900c40 {\n  margin-right: var(--spacing-small);\n}\n.button_d9cd088a68 .rightIcon_ac260a6649 {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs_e6471227e1 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: 2px var(--spacing-xs);\n  height: 16px;\n  line-height: 16px;\n}\n.sizeXs_76a22d8cd0 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 24px;\n  line-height: 21px;\n}\n.sizeSmall_32febe9e5c {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 32px;\n  line-height: 24px;\n}\n.sizeSmall_32febe9e5c .loader_0526f15353 {\n  top: 7px;\n}\n.sizeMedium_fa93c795d4 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: var(--spacing-small) var(--spacing-medium);\n  height: 40px;\n}\n.sizeLarge_3b64d8cac6 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: 12px var(--spacing-large);\n  height: 48px;\n}\n.kindPrimary_fbec724939 {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_fbec724939.colorPrimary_7d148eebf0 {\n  background: var(--primary-color);\n}\n.kindPrimary_fbec724939.colorBrand_095bed55c8 {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary_fbec724939.colorPrimaryActive_54bbe9adf1,\n.kindPrimary_fbec724939.colorPrimary_7d148eebf0:hover,\n.kindPrimary_fbec724939.colorPrimary_7d148eebf0:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary_fbec724939.colorBrandActive_94d0265164,\n.kindPrimary_fbec724939.colorBrand_095bed55c8:hover,\n.kindPrimary_fbec724939.colorBrand_095bed55c8:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary_fbec724939.colorPositive_8d1681937d {\n  background: var(--positive-color);\n}\n.kindPrimary_fbec724939.colorPositiveActive_1c8dccfa3f,\n.kindPrimary_fbec724939.colorPositive_8d1681937d:hover,\n.kindPrimary_fbec724939.colorPositive_8d1681937d:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary_fbec724939.colorNegative_fe5557260a {\n  background: var(--negative-color);\n}\n.kindPrimary_fbec724939.colorNegativeActive_1c8dccfa3f,\n.kindPrimary_fbec724939.colorNegative_fe5557260a:hover,\n.kindPrimary_fbec724939.colorNegative_fe5557260a:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary_fbec724939.colorInverted_0d4a5ef10a {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary_fbec724939.colorInvertedActive_1c8dccfa3f,\n.kindPrimary_fbec724939.colorInverted_0d4a5ef10a:hover,\n.kindPrimary_fbec724939.colorInverted_0d4a5ef10a:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary_fbec724939.button_d9cd088a68.colorInverted_0d4a5ef10a.disabled_7524c2110c {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary_fbec724939.colorOnPrimaryColorActive_8cfef7b0c9,\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:hover,\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_fbec724939.colorOnPrimaryColorActive_8cfef7b0c9:focus-visible, .kindPrimary_fbec724939.colorOnPrimaryColorActive_8cfef7b0c9.focus-visible_a0a0b58798,\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:hover:focus-visible,\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:hover.focus-visible_a0a0b58798,\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:focus:focus-visible,\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_fbec724939.colorOnPrimaryColorActive_8cfef7b0c9:focus:not(.focus-visible_a0a0b58798),\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:hover:focus:not(.focus-visible_a0a0b58798),\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindPrimary_fbec724939.colorOnPrimaryColor_44060a636f.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85 {\n  background: var(--fixed-light-color);\n}\n.kindPrimary_fbec724939.colorFixedLightActive_c08380f50a,\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:hover,\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_fbec724939.colorFixedLightActive_c08380f50a:focus-visible, .kindPrimary_fbec724939.colorFixedLightActive_c08380f50a.focus-visible_a0a0b58798,\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:hover:focus-visible,\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:hover.focus-visible_a0a0b58798,\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:focus:focus-visible,\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_fbec724939.colorFixedLightActive_c08380f50a:focus:not(.focus-visible_a0a0b58798),\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:hover:focus:not(.focus-visible_a0a0b58798),\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindPrimary_fbec724939.colorFixedLight_2205e45c85.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6 {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary_fbec724939.colorFixedDarkActive_54ee66c16e,\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:hover,\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:focus {\n  filter: brightness(125%);\n}\n.kindPrimary_fbec724939.colorFixedDarkActive_54ee66c16e:focus-visible, .kindPrimary_fbec724939.colorFixedDarkActive_54ee66c16e.focus-visible_a0a0b58798,\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:hover:focus-visible,\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:hover.focus-visible_a0a0b58798,\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:focus:focus-visible,\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_fbec724939.colorFixedDarkActive_54ee66c16e:focus:not(.focus-visible_a0a0b58798),\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:hover:focus:not(.focus-visible_a0a0b58798),\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindPrimary_fbec724939.colorFixedDark_2c1c83c2e6.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary_fbec724939.colorOnInvertedBackground_0044e3ce4a {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary_fbec724939.colorOnInvertedBackgroundActive_0b004ec181,\n.kindPrimary_fbec724939.colorOnInvertedBackground_0044e3ce4a:hover,\n.kindPrimary_fbec724939.colorOnInvertedBackground_0044e3ce4a:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary_fbec724939.button_d9cd088a68.colorOnInvertedBackground_0044e3ce4a.disabled_7524c2110c {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary_fbec724939.button_d9cd088a68.disabled_7524c2110c {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_b4a4c5a448 {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary_b4a4c5a448.sizeSmall_32febe9e5c {\n  line-height: 22px;\n}\n.kindSecondary_b4a4c5a448.sizeMedium_fa93c795d4 {\n  line-height: 22px;\n}\n.kindSecondary_b4a4c5a448.sizeLarge_3b64d8cac6 {\n  line-height: 22px;\n}\n.kindSecondary_b4a4c5a448.colorPrimaryActive_54bbe9adf1 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_b4a4c5a448.colorPrimaryActive_54bbe9adf1:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_b4a4c5a448.colorBrandActive_94d0265164 {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary_b4a4c5a448.colorBrandActive_94d0265164,\n.kindSecondary_b4a4c5a448.colorBrandActive_94d0265164:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary_b4a4c5a448.colorPrimary_7d148eebf0:hover:not(.colorPrimaryActive_54bbe9adf1),\n.kindSecondary_b4a4c5a448.colorPrimary_7d148eebf0:focus:not(.colorPrimaryActive_54bbe9adf1) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_b4a4c5a448.colorBrand_095bed55c8:hover:not(.colorBrandActive_94d0265164),\n.kindSecondary_b4a4c5a448.colorBrand_095bed55c8:focus:not(.colorBrandActive_94d0265164) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_b4a4c5a448.colorPositive_8d1681937d {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary_b4a4c5a448.colorPositiveActive_1c8dccfa3f,\n.kindSecondary_b4a4c5a448.colorPositive_8d1681937d:hover,\n.kindSecondary_b4a4c5a448.colorPositive_8d1681937d:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary_b4a4c5a448.colorNegative_fe5557260a {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary_b4a4c5a448.colorNegativeActive_1c8dccfa3f,\n.kindSecondary_b4a4c5a448.colorNegative_fe5557260a:hover,\n.kindSecondary_b4a4c5a448.colorNegative_fe5557260a:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary_b4a4c5a448.colorInverted_0d4a5ef10a {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary_b4a4c5a448.colorInvertedActive_1c8dccfa3f,\n.kindSecondary_b4a4c5a448.colorInverted_0d4a5ef10a:hover,\n.kindSecondary_b4a4c5a448.colorInverted_0d4a5ef10a:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_b4a4c5a448.colorInverted_0d4a5ef10a.disabled_7524c2110c {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary_b4a4c5a448.colorOnPrimaryColorActive_8cfef7b0c9,\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:hover,\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_b4a4c5a448.colorOnPrimaryColorActive_8cfef7b0c9:focus-visible, .kindSecondary_b4a4c5a448.colorOnPrimaryColorActive_8cfef7b0c9.focus-visible_a0a0b58798,\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:hover:focus-visible,\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:hover.focus-visible_a0a0b58798,\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:focus:focus-visible,\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_b4a4c5a448.colorOnPrimaryColorActive_8cfef7b0c9:focus:not(.focus-visible_a0a0b58798),\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:hover:focus:not(.focus-visible_a0a0b58798),\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindSecondary_b4a4c5a448.colorOnPrimaryColor_44060a636f.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85 {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary_b4a4c5a448.colorFixedLightActive_c08380f50a,\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:hover,\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_b4a4c5a448.colorFixedLightActive_c08380f50a:focus-visible, .kindSecondary_b4a4c5a448.colorFixedLightActive_c08380f50a.focus-visible_a0a0b58798,\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:hover:focus-visible,\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:hover.focus-visible_a0a0b58798,\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:focus:focus-visible,\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_b4a4c5a448.colorFixedLightActive_c08380f50a:focus:not(.focus-visible_a0a0b58798),\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:hover:focus:not(.focus-visible_a0a0b58798),\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6 {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_b4a4c5a448.colorFixedDarkActive_54ee66c16e,\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:hover,\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary_b4a4c5a448.colorFixedDarkActive_54ee66c16e:focus-visible, .kindSecondary_b4a4c5a448.colorFixedDarkActive_54ee66c16e.focus-visible_a0a0b58798,\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:hover:focus-visible,\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:hover.focus-visible_a0a0b58798,\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:focus:focus-visible,\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_b4a4c5a448.colorFixedDarkActive_54ee66c16e:focus:not(.focus-visible_a0a0b58798),\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:hover:focus:not(.focus-visible_a0a0b58798),\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindSecondary_b4a4c5a448.colorOnInvertedBackground_0044e3ce4a {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary_b4a4c5a448.colorOnInvertedBackgroundActive_0b004ec181,\n.kindSecondary_b4a4c5a448.colorOnInvertedBackground_0044e3ce4a:hover,\n.kindSecondary_b4a4c5a448.colorOnInvertedBackground_0044e3ce4a:focus {\n  background: var(--icon-color);\n}\n.kindSecondary_b4a4c5a448.colorOnInvertedBackground_0044e3ce4a.disabled_7524c2110c {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary_b4a4c5a448.colorFixedLight_2205e45c85.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary_b4a4c5a448.colorFixedDark_2c1c83c2e6.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_b4a4c5a448.disabled_7524c2110c {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_b4a4c5a448.disabled_7524c2110c:hover {\n  background-color: transparent;\n}\n.kindTertiary_91f204ffc2 {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary_91f204ffc2.colorPrimaryActive_54bbe9adf1 {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary_91f204ffc2.colorPrimaryActive_54bbe9adf1:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary_91f204ffc2.colorBrandActive_94d0265164 {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary_91f204ffc2.colorBrandActive_94d0265164,\n.kindTertiary_91f204ffc2.colorBrandActive_94d0265164:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary_91f204ffc2.colorPrimary_7d148eebf0:hover:not(.colorPrimaryActive_54bbe9adf1),\n.kindTertiary_91f204ffc2.colorPrimary_7d148eebf0:focus:not(.colorPrimaryActive_54bbe9adf1) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_91f204ffc2.colorBrand_095bed55c8:hover:not(.colorBrandActive_94d0265164),\n.kindTertiary_91f204ffc2.colorBrand_095bed55c8:focus:not(.colorBrandActive_94d0265164) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_91f204ffc2.colorPositive_8d1681937d {\n  color: var(--positive-color);\n}\n.kindTertiary_91f204ffc2.colorPositiveActive_1c8dccfa3f,\n.kindTertiary_91f204ffc2.colorPositive_8d1681937d:hover,\n.kindTertiary_91f204ffc2.colorPositive_8d1681937d:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary_91f204ffc2.colorNegative_fe5557260a {\n  color: var(--negative-color);\n}\n.kindTertiary_91f204ffc2.colorNegativeActive_1c8dccfa3f,\n.kindTertiary_91f204ffc2.colorNegative_fe5557260a:hover,\n.kindTertiary_91f204ffc2.colorNegative_fe5557260a:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary_91f204ffc2.colorInverted_0d4a5ef10a {\n  color: var(--primary-text-color);\n}\n.kindTertiary_91f204ffc2.colorInvertedActive_1c8dccfa3f,\n.kindTertiary_91f204ffc2.colorInverted_0d4a5ef10a:hover,\n.kindTertiary_91f204ffc2.colorInverted_0d4a5ef10a:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_91f204ffc2.colorInverted_0d4a5ef10a.disabled_7524c2110c {\n  color: var(--disabled-text-color);\n}\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_91f204ffc2.colorOnPrimaryColorActive_8cfef7b0c9,\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:hover,\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_91f204ffc2.colorOnPrimaryColorActive_8cfef7b0c9:focus-visible, .kindTertiary_91f204ffc2.colorOnPrimaryColorActive_8cfef7b0c9.focus-visible_a0a0b58798,\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:hover:focus-visible,\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:hover.focus-visible_a0a0b58798,\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:focus:focus-visible,\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_91f204ffc2.colorOnPrimaryColorActive_8cfef7b0c9:focus:not(.focus-visible_a0a0b58798),\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:hover:focus:not(.focus-visible_a0a0b58798),\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindTertiary_91f204ffc2.colorOnPrimaryColor_44060a636f.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85 {\n  color: var(--fixed-light-color);\n}\n.kindTertiary_91f204ffc2.colorFixedLightActive_c08380f50a,\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:hover,\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_91f204ffc2.colorFixedLightActive_c08380f50a:focus-visible, .kindTertiary_91f204ffc2.colorFixedLightActive_c08380f50a.focus-visible_a0a0b58798,\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:hover:focus-visible,\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:hover.focus-visible_a0a0b58798,\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:focus:focus-visible,\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_91f204ffc2.colorFixedLightActive_c08380f50a:focus:not(.focus-visible_a0a0b58798),\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:hover:focus:not(.focus-visible_a0a0b58798),\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindTertiary_91f204ffc2.colorFixedLight_2205e45c85.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6 {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_91f204ffc2.colorFixedDarkActive_54ee66c16e,\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:hover,\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary_91f204ffc2.colorFixedDarkActive_54ee66c16e:focus-visible, .kindTertiary_91f204ffc2.colorFixedDarkActive_54ee66c16e.focus-visible_a0a0b58798,\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:hover:focus-visible,\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:hover.focus-visible_a0a0b58798,\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:focus:focus-visible,\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:focus.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_91f204ffc2.colorFixedDarkActive_54ee66c16e:focus:not(.focus-visible_a0a0b58798),\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:hover:focus:not(.focus-visible_a0a0b58798),\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6:focus:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.kindTertiary_91f204ffc2.colorFixedDark_2c1c83c2e6.disabled_7524c2110c {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_91f204ffc2.colorOnInvertedBackground_0044e3ce4a {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_91f204ffc2.colorOnInvertedBackgroundActive_0b004ec181,\n.kindTertiary_91f204ffc2.colorOnInvertedBackground_0044e3ce4a:hover,\n.kindTertiary_91f204ffc2.colorOnInvertedBackground_0044e3ce4a:focus {\n  background: var(--icon-color);\n}\n.kindTertiary_91f204ffc2.colorOnInvertedBackground_0044e3ce4a.disabled_7524c2110c {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_91f204ffc2.disabled_7524c2110c {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary_91f204ffc2.disabled_7524c2110c:hover {\n  background-color: transparent;\n}\n.noSidePadding_db8e3dc065 {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button_d9cd088a68.insetFocusStyle_f032c2b66e:focus-visible, .button_d9cd088a68.insetFocusStyle_f032c2b66e.focus-visible_a0a0b58798 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button_d9cd088a68.insetFocusStyle_f032c2b66e:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}");export{o as default};
+var o={button:"button_b7f21155b4","focus-visible":"focus-visible_8b4f8382ab",loader:"loader_cd0655ad45",loaderSvg:"loaderSvg_6449aa72be",textPlaceholder:"textPlaceholder_a040295d8f",success:"success_7566d6fb15",successContent:"successContent_8b47d93496",marginRight:"marginRight_e15e830f67",marginLeft:"marginLeft_3efd917e91",rightFlat:"rightFlat_ba30b87751",leftFlat:"leftFlat_0c138eb3bd",preventClickAnimation:"preventClickAnimation_2818a899e8",leftIcon:"leftIcon_e15e830f67",rightIcon:"rightIcon_3efd917e91",sizeXxs:"sizeXxs_73babeb413",sizeXs:"sizeXs_474004c22e",sizeSmall:"sizeSmall_1e93f4e66c",sizeMedium:"sizeMedium_73b459d0f3",sizeLarge:"sizeLarge_2bdb935040",kindPrimary:"kindPrimary_551736a4ab",colorPrimary:"colorPrimary_5128726269",colorBrand:"colorBrand_10cf97785d",colorPrimaryActive:"colorPrimaryActive_a265fff5c7",colorBrandActive:"colorBrandActive_62e5cf3ccb",colorPositive:"colorPositive_0f0268e133",colorPositiveActive:"colorPositiveActive_adaf70b19e",colorNegative:"colorNegative_1c1b3da0a9",colorNegativeActive:"colorNegativeActive_adaf70b19e",colorInverted:"colorInverted_c5119e4ded",colorInvertedActive:"colorInvertedActive_adaf70b19e",disabled:"disabled_1297f56b8a",colorOnPrimaryColor:"colorOnPrimaryColor_e71f871bb2",colorOnPrimaryColorActive:"colorOnPrimaryColorActive_cbfe0bab76",colorFixedLight:"colorFixedLight_4ad6b7b071",colorFixedLightActive:"colorFixedLightActive_2818a899e8",colorFixedDark:"colorFixedDark_0c17bd172e",colorFixedDarkActive:"colorFixedDarkActive_da4c26d58d",colorOnInvertedBackground:"colorOnInvertedBackground_eac9e958da",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive_ca97803f35",kindSecondary:"kindSecondary_6df3c2888f",kindTertiary:"kindTertiary_c105069bb1",noSidePadding:"noSidePadding_ef959ab3fd",insetFocusStyle:"insetFocusStyle_cda543a19c"};!function(o){const r="s_id-f5db469b1a79_3_61_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const e=document.createElement("style");e.id=r,n.firstChild?n.insertBefore(e,n.firstChild):n.appendChild(e),e.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}("/* stylelint-disable selector-class-pattern */\n.button_b7f21155b4 {\n  --loader-padding: 8px;\n  outline: none;\n  border: none;\n  height: auto;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n  white-space: nowrap;\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Prevent text selection */\n  user-select: none;\n  min-width: auto;\n}\n.button_b7f21155b4:focus-visible, .button_b7f21155b4.focus-visible_8b4f8382ab {\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.button_b7f21155b4:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.button_b7f21155b4 .loader_cd0655ad45 {\n  height: 100%;\n}\n.button_b7f21155b4 .loader_cd0655ad45 .loaderSvg_6449aa72be {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button_b7f21155b4 .textPlaceholder_a040295d8f {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button_b7f21155b4.success_7566d6fb15 {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button_b7f21155b4.success_7566d6fb15 .successContent_8b47d93496 {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight_e15e830f67 {\n  margin-right: var(--spacing-small);\n}\n.marginLeft_3efd917e91 {\n  margin-left: var(--spacing-small);\n}\n.rightFlat_ba30b87751 {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat_0c138eb3bd {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button_b7f21155b4:active:not(.preventClickAnimation_2818a899e8) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button_b7f21155b4 .leftIcon_e15e830f67 {\n  margin-right: var(--spacing-small);\n}\n.button_b7f21155b4 .rightIcon_3efd917e91 {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs_73babeb413 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: 2px var(--spacing-xs);\n  height: 16px;\n  line-height: 16px;\n}\n.sizeXs_474004c22e {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 24px;\n  line-height: 21px;\n}\n.sizeSmall_1e93f4e66c {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 32px;\n  line-height: 24px;\n}\n.sizeSmall_1e93f4e66c .loader_cd0655ad45 {\n  top: 7px;\n}\n.sizeMedium_73b459d0f3 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: var(--spacing-small) var(--spacing-medium);\n  height: 40px;\n}\n.sizeLarge_2bdb935040 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: 12px var(--spacing-large);\n  height: 48px;\n}\n.kindPrimary_551736a4ab {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_551736a4ab.colorPrimary_5128726269 {\n  background: var(--primary-color);\n}\n.kindPrimary_551736a4ab.colorBrand_10cf97785d {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary_551736a4ab.colorPrimaryActive_a265fff5c7,\n.kindPrimary_551736a4ab.colorPrimary_5128726269:hover,\n.kindPrimary_551736a4ab.colorPrimary_5128726269:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary_551736a4ab.colorBrandActive_62e5cf3ccb,\n.kindPrimary_551736a4ab.colorBrand_10cf97785d:hover,\n.kindPrimary_551736a4ab.colorBrand_10cf97785d:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary_551736a4ab.colorPositive_0f0268e133 {\n  background: var(--positive-color);\n}\n.kindPrimary_551736a4ab.colorPositiveActive_adaf70b19e,\n.kindPrimary_551736a4ab.colorPositive_0f0268e133:hover,\n.kindPrimary_551736a4ab.colorPositive_0f0268e133:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary_551736a4ab.colorNegative_1c1b3da0a9 {\n  background: var(--negative-color);\n}\n.kindPrimary_551736a4ab.colorNegativeActive_adaf70b19e,\n.kindPrimary_551736a4ab.colorNegative_1c1b3da0a9:hover,\n.kindPrimary_551736a4ab.colorNegative_1c1b3da0a9:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary_551736a4ab.colorInverted_c5119e4ded {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary_551736a4ab.colorInvertedActive_adaf70b19e,\n.kindPrimary_551736a4ab.colorInverted_c5119e4ded:hover,\n.kindPrimary_551736a4ab.colorInverted_c5119e4ded:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary_551736a4ab.button_b7f21155b4.colorInverted_c5119e4ded.disabled_1297f56b8a {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2 {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary_551736a4ab.colorOnPrimaryColorActive_cbfe0bab76,\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:hover,\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_551736a4ab.colorOnPrimaryColorActive_cbfe0bab76:focus-visible, .kindPrimary_551736a4ab.colorOnPrimaryColorActive_cbfe0bab76.focus-visible_8b4f8382ab,\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:hover:focus-visible,\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:hover.focus-visible_8b4f8382ab,\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:focus:focus-visible,\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_551736a4ab.colorOnPrimaryColorActive_cbfe0bab76:focus:not(.focus-visible_8b4f8382ab),\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindPrimary_551736a4ab.colorOnPrimaryColor_e71f871bb2.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071 {\n  background: var(--fixed-light-color);\n}\n.kindPrimary_551736a4ab.colorFixedLightActive_2818a899e8,\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:hover,\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_551736a4ab.colorFixedLightActive_2818a899e8:focus-visible, .kindPrimary_551736a4ab.colorFixedLightActive_2818a899e8.focus-visible_8b4f8382ab,\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:hover:focus-visible,\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:hover.focus-visible_8b4f8382ab,\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:focus:focus-visible,\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_551736a4ab.colorFixedLightActive_2818a899e8:focus:not(.focus-visible_8b4f8382ab),\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindPrimary_551736a4ab.colorFixedLight_4ad6b7b071.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary_551736a4ab.colorFixedDarkActive_da4c26d58d,\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:hover,\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:focus {\n  filter: brightness(125%);\n}\n.kindPrimary_551736a4ab.colorFixedDarkActive_da4c26d58d:focus-visible, .kindPrimary_551736a4ab.colorFixedDarkActive_da4c26d58d.focus-visible_8b4f8382ab,\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:hover:focus-visible,\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:hover.focus-visible_8b4f8382ab,\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:focus:focus-visible,\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_551736a4ab.colorFixedDarkActive_da4c26d58d:focus:not(.focus-visible_8b4f8382ab),\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindPrimary_551736a4ab.colorFixedDark_0c17bd172e.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary_551736a4ab.colorOnInvertedBackground_eac9e958da {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary_551736a4ab.colorOnInvertedBackgroundActive_ca97803f35,\n.kindPrimary_551736a4ab.colorOnInvertedBackground_eac9e958da:hover,\n.kindPrimary_551736a4ab.colorOnInvertedBackground_eac9e958da:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary_551736a4ab.button_b7f21155b4.colorOnInvertedBackground_eac9e958da.disabled_1297f56b8a {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary_551736a4ab.button_b7f21155b4.disabled_1297f56b8a {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_6df3c2888f {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary_6df3c2888f.sizeSmall_1e93f4e66c {\n  line-height: 22px;\n}\n.kindSecondary_6df3c2888f.sizeMedium_73b459d0f3 {\n  line-height: 22px;\n}\n.kindSecondary_6df3c2888f.sizeLarge_2bdb935040 {\n  line-height: 22px;\n}\n.kindSecondary_6df3c2888f.colorPrimaryActive_a265fff5c7 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_6df3c2888f.colorPrimaryActive_a265fff5c7:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_6df3c2888f.colorBrandActive_62e5cf3ccb {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary_6df3c2888f.colorBrandActive_62e5cf3ccb,\n.kindSecondary_6df3c2888f.colorBrandActive_62e5cf3ccb:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary_6df3c2888f.colorPrimary_5128726269:hover:not(.colorPrimaryActive_a265fff5c7),\n.kindSecondary_6df3c2888f.colorPrimary_5128726269:focus:not(.colorPrimaryActive_a265fff5c7) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_6df3c2888f.colorBrand_10cf97785d:hover:not(.colorBrandActive_62e5cf3ccb),\n.kindSecondary_6df3c2888f.colorBrand_10cf97785d:focus:not(.colorBrandActive_62e5cf3ccb) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_6df3c2888f.colorPositive_0f0268e133 {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary_6df3c2888f.colorPositiveActive_adaf70b19e,\n.kindSecondary_6df3c2888f.colorPositive_0f0268e133:hover,\n.kindSecondary_6df3c2888f.colorPositive_0f0268e133:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary_6df3c2888f.colorNegative_1c1b3da0a9 {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary_6df3c2888f.colorNegativeActive_adaf70b19e,\n.kindSecondary_6df3c2888f.colorNegative_1c1b3da0a9:hover,\n.kindSecondary_6df3c2888f.colorNegative_1c1b3da0a9:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary_6df3c2888f.colorInverted_c5119e4ded {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary_6df3c2888f.colorInvertedActive_adaf70b19e,\n.kindSecondary_6df3c2888f.colorInverted_c5119e4ded:hover,\n.kindSecondary_6df3c2888f.colorInverted_c5119e4ded:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_6df3c2888f.colorInverted_c5119e4ded.disabled_1297f56b8a {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2 {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary_6df3c2888f.colorOnPrimaryColorActive_cbfe0bab76,\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:hover,\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_6df3c2888f.colorOnPrimaryColorActive_cbfe0bab76:focus-visible, .kindSecondary_6df3c2888f.colorOnPrimaryColorActive_cbfe0bab76.focus-visible_8b4f8382ab,\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:hover:focus-visible,\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:hover.focus-visible_8b4f8382ab,\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:focus:focus-visible,\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_6df3c2888f.colorOnPrimaryColorActive_cbfe0bab76:focus:not(.focus-visible_8b4f8382ab),\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindSecondary_6df3c2888f.colorOnPrimaryColor_e71f871bb2.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071 {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary_6df3c2888f.colorFixedLightActive_2818a899e8,\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:hover,\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_6df3c2888f.colorFixedLightActive_2818a899e8:focus-visible, .kindSecondary_6df3c2888f.colorFixedLightActive_2818a899e8.focus-visible_8b4f8382ab,\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:hover:focus-visible,\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:hover.focus-visible_8b4f8382ab,\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:focus:focus-visible,\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_6df3c2888f.colorFixedLightActive_2818a899e8:focus:not(.focus-visible_8b4f8382ab),\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_6df3c2888f.colorFixedDarkActive_da4c26d58d,\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:hover,\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary_6df3c2888f.colorFixedDarkActive_da4c26d58d:focus-visible, .kindSecondary_6df3c2888f.colorFixedDarkActive_da4c26d58d.focus-visible_8b4f8382ab,\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:hover:focus-visible,\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:hover.focus-visible_8b4f8382ab,\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:focus:focus-visible,\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_6df3c2888f.colorFixedDarkActive_da4c26d58d:focus:not(.focus-visible_8b4f8382ab),\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindSecondary_6df3c2888f.colorOnInvertedBackground_eac9e958da {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary_6df3c2888f.colorOnInvertedBackgroundActive_ca97803f35,\n.kindSecondary_6df3c2888f.colorOnInvertedBackground_eac9e958da:hover,\n.kindSecondary_6df3c2888f.colorOnInvertedBackground_eac9e958da:focus {\n  background: var(--icon-color);\n}\n.kindSecondary_6df3c2888f.colorOnInvertedBackground_eac9e958da.disabled_1297f56b8a {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary_6df3c2888f.colorFixedLight_4ad6b7b071.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary_6df3c2888f.colorFixedDark_0c17bd172e.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_6df3c2888f.disabled_1297f56b8a {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_6df3c2888f.disabled_1297f56b8a:hover {\n  background-color: transparent;\n}\n.kindTertiary_c105069bb1 {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary_c105069bb1.colorPrimaryActive_a265fff5c7 {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary_c105069bb1.colorPrimaryActive_a265fff5c7:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary_c105069bb1.colorBrandActive_62e5cf3ccb {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary_c105069bb1.colorBrandActive_62e5cf3ccb,\n.kindTertiary_c105069bb1.colorBrandActive_62e5cf3ccb:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary_c105069bb1.colorPrimary_5128726269:hover:not(.colorPrimaryActive_a265fff5c7),\n.kindTertiary_c105069bb1.colorPrimary_5128726269:focus:not(.colorPrimaryActive_a265fff5c7) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_c105069bb1.colorBrand_10cf97785d:hover:not(.colorBrandActive_62e5cf3ccb),\n.kindTertiary_c105069bb1.colorBrand_10cf97785d:focus:not(.colorBrandActive_62e5cf3ccb) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_c105069bb1.colorPositive_0f0268e133 {\n  color: var(--positive-color);\n}\n.kindTertiary_c105069bb1.colorPositiveActive_adaf70b19e,\n.kindTertiary_c105069bb1.colorPositive_0f0268e133:hover,\n.kindTertiary_c105069bb1.colorPositive_0f0268e133:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary_c105069bb1.colorNegative_1c1b3da0a9 {\n  color: var(--negative-color);\n}\n.kindTertiary_c105069bb1.colorNegativeActive_adaf70b19e,\n.kindTertiary_c105069bb1.colorNegative_1c1b3da0a9:hover,\n.kindTertiary_c105069bb1.colorNegative_1c1b3da0a9:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary_c105069bb1.colorInverted_c5119e4ded {\n  color: var(--primary-text-color);\n}\n.kindTertiary_c105069bb1.colorInvertedActive_adaf70b19e,\n.kindTertiary_c105069bb1.colorInverted_c5119e4ded:hover,\n.kindTertiary_c105069bb1.colorInverted_c5119e4ded:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_c105069bb1.colorInverted_c5119e4ded.disabled_1297f56b8a {\n  color: var(--disabled-text-color);\n}\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2 {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_c105069bb1.colorOnPrimaryColorActive_cbfe0bab76,\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:hover,\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_c105069bb1.colorOnPrimaryColorActive_cbfe0bab76:focus-visible, .kindTertiary_c105069bb1.colorOnPrimaryColorActive_cbfe0bab76.focus-visible_8b4f8382ab,\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:hover:focus-visible,\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:hover.focus-visible_8b4f8382ab,\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:focus:focus-visible,\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_c105069bb1.colorOnPrimaryColorActive_cbfe0bab76:focus:not(.focus-visible_8b4f8382ab),\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindTertiary_c105069bb1.colorOnPrimaryColor_e71f871bb2.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071 {\n  color: var(--fixed-light-color);\n}\n.kindTertiary_c105069bb1.colorFixedLightActive_2818a899e8,\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:hover,\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_c105069bb1.colorFixedLightActive_2818a899e8:focus-visible, .kindTertiary_c105069bb1.colorFixedLightActive_2818a899e8.focus-visible_8b4f8382ab,\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:hover:focus-visible,\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:hover.focus-visible_8b4f8382ab,\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:focus:focus-visible,\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_c105069bb1.colorFixedLightActive_2818a899e8:focus:not(.focus-visible_8b4f8382ab),\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindTertiary_c105069bb1.colorFixedLight_4ad6b7b071.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_c105069bb1.colorFixedDarkActive_da4c26d58d,\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:hover,\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary_c105069bb1.colorFixedDarkActive_da4c26d58d:focus-visible, .kindTertiary_c105069bb1.colorFixedDarkActive_da4c26d58d.focus-visible_8b4f8382ab,\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:hover:focus-visible,\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:hover.focus-visible_8b4f8382ab,\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:focus:focus-visible,\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:focus.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_c105069bb1.colorFixedDarkActive_da4c26d58d:focus:not(.focus-visible_8b4f8382ab),\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:hover:focus:not(.focus-visible_8b4f8382ab),\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e:focus:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.kindTertiary_c105069bb1.colorFixedDark_0c17bd172e.disabled_1297f56b8a {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_c105069bb1.colorOnInvertedBackground_eac9e958da {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_c105069bb1.colorOnInvertedBackgroundActive_ca97803f35,\n.kindTertiary_c105069bb1.colorOnInvertedBackground_eac9e958da:hover,\n.kindTertiary_c105069bb1.colorOnInvertedBackground_eac9e958da:focus {\n  background: var(--icon-color);\n}\n.kindTertiary_c105069bb1.colorOnInvertedBackground_eac9e958da.disabled_1297f56b8a {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_c105069bb1.disabled_1297f56b8a {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary_c105069bb1.disabled_1297f56b8a:hover {\n  background-color: transparent;\n}\n.noSidePadding_ef959ab3fd {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button_b7f21155b4.insetFocusStyle_cda543a19c:focus-visible, .button_b7f21155b4.insetFocusStyle_cda543a19c.focus-visible_8b4f8382ab {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button_b7f21155b4.insetFocusStyle_cda543a19c:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}");export{o as default};
 //# sourceMappingURL=Button.module.scss.js.map

package/dist/src/components/ButtonGroup/ButtonGroup.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={buttonGroup:"buttonGroup_c68fd7a480",subTextContainer:"subTextContainer_8ec4114c30",buttonsContainer:"buttonsContainer_64ac758069",fullWidth:"fullWidth_e23f2ec89e",button:"button_b03eacc24e",activeButton:"activeButton_80fc829c33",disabled:"disabled_1c2b96c072",buttonDisabled:"buttonDisabled_46525538ab",startBorder:"startBorder_e2c66dc856",endBorder:"endBorder_f9ad750840",kindTertiary:"kindTertiary_609cd60c51",optionText:"optionText_56d9161ac4",selected:"selected_0884e33fc3",wrapper:"wrapper_997eb33177"};!function(n){const t="s_id-4b7ca9f3603b_3_59_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".buttonGroup_c68fd7a480 {\n  display: flex;\n  flex-direction: column;\n}\n\n.subTextContainer_8ec4114c30 {\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.buttonsContainer_64ac758069 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.buttonsContainer_64ac758069.fullWidth_e23f2ec89e {\n  justify-content: flex-start;\n  width: 100%;\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e {\n  border-style: solid;\n  border-width: 1px 0;\n  background-color: var(--primary-background-color);\n  border-color: var(--ui-border-color);\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e.activeButton_80fc829c33 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n  border-inline-start-width: 1px;\n  border-inline-end-width: 1px;\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e.activeButton_80fc829c33:hover {\n  background-color: var(--primary-selected-color);\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e.disabled_1c2b96c072, .buttonsContainer_64ac758069 .button_b03eacc24e.buttonDisabled_46525538ab {\n  background-color: var(--disabled-background-color);\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e.startBorder_e2c66dc856 {\n  border-inline-start-width: 1px;\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e.endBorder_f9ad750840 {\n  border-inline-end-width: 1px;\n}\n\n.buttonsContainer_64ac758069 .button_b03eacc24e.fullWidth_e23f2ec89e {\n  width: 100%;\n  display: flex;\n}\n\n.kindTertiary_609cd60c51 .buttonsContainer_64ac758069 .button_b03eacc24e {\n  border-color: transparent;\n}\n\n.kindTertiary_609cd60c51 .buttonsContainer_64ac758069 .button_b03eacc24e:first-child {\n  border-color: transparent;\n}\n\n.optionText_56d9161ac4:not(.disabled_1c2b96c072) {\n  color: var(--primary-text-color);\n}\n\n.optionText_56d9161ac4:not(.disabled_1c2b96c072).selected_0884e33fc3 {\n  color: var(--primary-text-color);\n}\n\n.wrapper_997eb33177.disabled_1c2b96c072 {\n  cursor: not-allowed;\n}\n\n.fullWidth_e23f2ec89e {\n  flex: 1;\n}");export{n as default};
+var n={buttonGroup:"buttonGroup_252053965e",subTextContainer:"subTextContainer_1d7137bd0d",buttonsContainer:"buttonsContainer_8b7681f925",fullWidth:"fullWidth_d4535299b5",button:"button_d957116988",activeButton:"activeButton_5bd8d97ca7",disabled:"disabled_ac5771f39c",buttonDisabled:"buttonDisabled_33c85a36ef",startBorder:"startBorder_c115b4a896",endBorder:"endBorder_226c0a1c3a",kindTertiary:"kindTertiary_f767244ea7",optionText:"optionText_90aa05d116",selected:"selected_342b28b5ed",wrapper:"wrapper_4cd7afa2f4"};!function(n){const t="s_id-4b7ca9f3603b_3_61_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const e=document.createElement("style");e.id=t,o.firstChild?o.insertBefore(e,o.firstChild):o.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".buttonGroup_252053965e {\n  display: flex;\n  flex-direction: column;\n}\n\n.subTextContainer_1d7137bd0d {\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.buttonsContainer_8b7681f925 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.buttonsContainer_8b7681f925.fullWidth_d4535299b5 {\n  justify-content: flex-start;\n  width: 100%;\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988 {\n  border-style: solid;\n  border-width: 1px 0;\n  background-color: var(--primary-background-color);\n  border-color: var(--ui-border-color);\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988.activeButton_5bd8d97ca7 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n  border-inline-start-width: 1px;\n  border-inline-end-width: 1px;\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988.activeButton_5bd8d97ca7:hover {\n  background-color: var(--primary-selected-color);\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988.disabled_ac5771f39c, .buttonsContainer_8b7681f925 .button_d957116988.buttonDisabled_33c85a36ef {\n  background-color: var(--disabled-background-color);\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988.startBorder_c115b4a896 {\n  border-inline-start-width: 1px;\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988.endBorder_226c0a1c3a {\n  border-inline-end-width: 1px;\n}\n\n.buttonsContainer_8b7681f925 .button_d957116988.fullWidth_d4535299b5 {\n  width: 100%;\n  display: flex;\n}\n\n.kindTertiary_f767244ea7 .buttonsContainer_8b7681f925 .button_d957116988 {\n  border-color: transparent;\n}\n\n.kindTertiary_f767244ea7 .buttonsContainer_8b7681f925 .button_d957116988:first-child {\n  border-color: transparent;\n}\n\n.optionText_90aa05d116:not(.disabled_ac5771f39c) {\n  color: var(--primary-text-color);\n}\n\n.optionText_90aa05d116:not(.disabled_ac5771f39c).selected_342b28b5ed {\n  color: var(--primary-text-color);\n}\n\n.wrapper_4cd7afa2f4.disabled_ac5771f39c {\n  cursor: not-allowed;\n}\n\n.fullWidth_d4535299b5 {\n  flex: 1;\n}");export{n as default};
 //# sourceMappingURL=ButtonGroup.module.scss.js.map

package/dist/src/components/Checkbox/Checkbox.js CHANGED Viewed

@@ -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)},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),"data-vibe":C.CHECKBOX,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},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),"data-vibe":C.CHECKBOX},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 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};
 //# sourceMappingURL=Checkbox.js.map

package/dist/src/components/Checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +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 >\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 data-vibe={ComponentVibeId.CHECKBOX}\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 >\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 data-vibe={ComponentVibeId.CHECKBOX}\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","cx","styles","wrapper","getTestId","ComponentDefaultTestId","CHECKBOX","createElement","type","htmlFor","checkbox","CHECKBOX_CHECKBOX","ComponentVibeId","onMouseUp","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","CHECKBOX_LABEL","Text","element"],"mappings":"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"}
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":"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"}

package/dist/src/components/Checkbox/Checkbox.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={wrapper:"wrapper_858b6b04be",checkbox:"checkbox_ba218c0632",icon:"icon_f2994f0688",label:"label_37e1de8ca5",input:"input_ca1e32b8ab",checkboxGrowAnimation:"checkboxGrowAnimation_054d8ef163"};!function(n){const e="s_id-3c767214051a_3_59_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const c=document.createElement("style");c.id=e,o.firstChild?o.insertBefore(c,o.firstChild):o.appendChild(c),c.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}('/* stylelint-disable selector-class-pattern */\n.wrapper_858b6b04be {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n.checkbox_ba218c0632 {\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_ba218c0632: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_ba218c0632:hover {\n  border-color: var(--secondary-text-color);\n}\n.icon_f2994f0688 {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n.label_37e1de8ca5 {\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_ca1e32b8ab {\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_ca1e32b8ab:focus + .checkbox_ba218c0632 {\n  border-color: var(--secondary-text-color);\n}\n.input_ca1e32b8ab:focus:checked + .checkbox_ba218c0632 {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input_ca1e32b8ab:focus-visible + .checkbox_ba218c0632 {\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_ca1e32b8ab:checked:focus + .checkbox_ba218c0632:after,\n.input_ca1e32b8ab:indeterminate:focus + .checkbox_ba218c0632:after {\n  background-color: var(--primary-hover-color);\n}\n.input_ca1e32b8ab:checked + .checkbox_ba218c0632,\n.input_ca1e32b8ab:indeterminate + .checkbox_ba218c0632 {\n  animation: checkboxGrowAnimation_054d8ef163 var(--motion-productive-short);\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n.input_ca1e32b8ab:checked + .checkbox_ba218c0632:hover,\n.input_ca1e32b8ab:indeterminate + .checkbox_ba218c0632:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input_ca1e32b8ab:checked + .checkbox_ba218c0632:hover:after,\n.input_ca1e32b8ab:indeterminate + .checkbox_ba218c0632:hover:after {\n  background-color: var(--primary-hover-color);\n}\n.input_ca1e32b8ab:checked + .checkbox_ba218c0632:after,\n.input_ca1e32b8ab:indeterminate + .checkbox_ba218c0632: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_ca1e32b8ab:checked + .checkbox_ba218c0632 > .icon_f2994f0688,\n.input_ca1e32b8ab:indeterminate + .checkbox_ba218c0632 > .icon_f2994f0688 {\n  visibility: visible;\n}\n.input_ca1e32b8ab:checked:disabled + .checkbox_ba218c0632:after,\n.input_ca1e32b8ab:indeterminate:disabled + .checkbox_ba218c0632:after {\n  background-color: var(--disabled-background-color);\n}\n.input_ca1e32b8ab:disabled + .checkbox_ba218c0632 .icon_f2994f0688,\n.input_ca1e32b8ab:disabled + .checkbox_ba218c0632:hover .icon_f2994f0688 {\n  color: var(--disabled-text-color);\n}\n.input_ca1e32b8ab:disabled + .checkbox_ba218c0632,\n.input_ca1e32b8ab:disabled + .checkbox_ba218c0632:hover {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n.input_ca1e32b8ab:disabled ~ .label_37e1de8ca5 {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n@keyframes checkboxGrowAnimation_054d8ef163 {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{n as default};
+var e={wrapper:"wrapper_823d23692e",checkbox:"checkbox_e8b1d87a3e",icon:"icon_65714caa9a",label:"label_70ab404aba",input:"input_73bb0e956e",checkboxGrowAnimation:"checkboxGrowAnimation_3760f5698c"};!function(e){const n="s_id-3c767214051a_3_61_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('/* stylelint-disable selector-class-pattern */\n.wrapper_823d23692e {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n.checkbox_e8b1d87a3e {\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_e8b1d87a3e: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_e8b1d87a3e:hover {\n  border-color: var(--secondary-text-color);\n}\n.icon_65714caa9a {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n.label_70ab404aba {\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_73bb0e956e {\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_73bb0e956e:focus + .checkbox_e8b1d87a3e {\n  border-color: var(--secondary-text-color);\n}\n.input_73bb0e956e:focus:checked + .checkbox_e8b1d87a3e {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input_73bb0e956e:focus-visible + .checkbox_e8b1d87a3e {\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_73bb0e956e:checked:focus + .checkbox_e8b1d87a3e:after,\n.input_73bb0e956e:indeterminate:focus + .checkbox_e8b1d87a3e:after {\n  background-color: var(--primary-hover-color);\n}\n.input_73bb0e956e:checked + .checkbox_e8b1d87a3e,\n.input_73bb0e956e:indeterminate + .checkbox_e8b1d87a3e {\n  animation: checkboxGrowAnimation_3760f5698c var(--motion-productive-short);\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n.input_73bb0e956e:checked + .checkbox_e8b1d87a3e:hover,\n.input_73bb0e956e:indeterminate + .checkbox_e8b1d87a3e:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n.input_73bb0e956e:checked + .checkbox_e8b1d87a3e:hover:after,\n.input_73bb0e956e:indeterminate + .checkbox_e8b1d87a3e:hover:after {\n  background-color: var(--primary-hover-color);\n}\n.input_73bb0e956e:checked + .checkbox_e8b1d87a3e:after,\n.input_73bb0e956e:indeterminate + .checkbox_e8b1d87a3e: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_73bb0e956e:checked + .checkbox_e8b1d87a3e > .icon_65714caa9a,\n.input_73bb0e956e:indeterminate + .checkbox_e8b1d87a3e > .icon_65714caa9a {\n  visibility: visible;\n}\n.input_73bb0e956e:checked:disabled + .checkbox_e8b1d87a3e:after,\n.input_73bb0e956e:indeterminate:disabled + .checkbox_e8b1d87a3e:after {\n  background-color: var(--disabled-background-color);\n}\n.input_73bb0e956e:disabled + .checkbox_e8b1d87a3e .icon_65714caa9a,\n.input_73bb0e956e:disabled + .checkbox_e8b1d87a3e:hover .icon_65714caa9a {\n  color: var(--disabled-text-color);\n}\n.input_73bb0e956e:disabled + .checkbox_e8b1d87a3e,\n.input_73bb0e956e:disabled + .checkbox_e8b1d87a3e:hover {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n.input_73bb0e956e:disabled ~ .label_70ab404aba {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n@keyframes checkboxGrowAnimation_3760f5698c {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{e as default};
 //# sourceMappingURL=Checkbox.module.scss.js.map

package/dist/src/components/Chips/Chips.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as r,useRef as a,useState as i,useCallback as s,useMemo as n}from"react";import l from"classnames";import c from"../Icon/Icon.js";import m from"../../hooks/useMergeRef.js";import{getCSSVar as d}from"../../services/themes.js";import{ElementAllowedColor as u}from"../../utils/colors-vars-map.js";import{getElementColor as p}from"../../types/Colors.js";import v from"../Avatar/Avatar.js";import f from"../IconButton/IconButton.js";import b from"../Text/Text.js";import{getTestId as g,ComponentDefaultTestId as y}from"../../tests/testIds.js";import{AvatarType as j}from"../Avatar/AvatarConstants.js";import{withStaticProps as h}from"../../types/withStaticProps.js";import k from"../../hooks/useSetFocus/index.js";import C from"../../hooks/useClickableProps/useClickableProps.js";import x from"./Chips.module.scss.js";import N from"../../../icons/dist/react/CloseSmall.js";var S=h(r((function(r,u){var j=r.className,h=r.avatarClassName,S=r.iconClassName,A=r.id,E=r.label,T=void 0===E?"":E,M=r.leftIcon,w=void 0===M?null:M,B=r.rightIcon,I=void 0===B?null:B,P=r.leftAvatar,z=void 0===P?null:P,L=r.rightAvatar,O=void 0===L?null:L,R=r.disabled,D=void 0!==R&&R,F=r.readOnly,H=void 0!==F&&F,_=r.allowTextSelection,U=void 0!==_&&_,q=r.color,G=void 0===q?"primary":q,J=r.iconSize,K=void 0===J?18:J,Q=r.onDelete,V=void 0===Q?function(e,o){}:Q,W=r.onMouseDown,X=r.onClick,Y=r.noAnimation,Z=void 0===Y||Y,$=r.ariaLabel,ee=r.disableClickableBehavior,oe=void 0!==ee&&ee,te=r.leftAvatarType,re=void 0===te?"img":te,ae=r.rightAvatarType,ie=void 0===ae?"img":ae,se=r.showBorder,ne=void 0!==se&&se,le=r.leftRenderer,ce=r.rightRenderer,me=r.closeButtonAriaLabel,de=void 0===me?"Remove":me,ue=r.noMargin,pe=void 0!==ue&&ue,ve=r["data-testid"]||g(y.CHIP,A),fe=!(!X&&!W||oe),be=!H&&!D,ge=$||"string"==typeof T&&T||"",ye=a(null),je=a(null),he=i(!1),ke=e(he,2),Ce=ke[0],xe=ke[1],Ne=s((function(){return xe(!0)}),[]),Se=s((function(){return xe(!1)}),[]),Ae=k({ref:je}).isFocused,Ee=m(u,je),Te=l(x.chips,j,o(o(o(o(o({},x.disabled,D),x.noAnimation,Z),x.withUserSelect,U),x.border,ne),x.noMargin,pe)),Me=l(x.clickable,Te,o(o({},x.disabled,D),x.disableTextSelection,!U)),we=n((function(){return{backgroundColor:D?d("disabled-background-color"):fe&&(Ce||Ae)?p(G,!0,!0):p(G,!0)}}),[D,fe,Ce,Ae,G]),Be=s((function(e){e.stopPropagation(),V&&V(A,e)}),[A,V]),Ie=s((function(e){void 0!==X&&e.target!==ye.current&&(e.preventDefault(),X(e))}),[X]),Pe=C({onClick:Ie,onMouseDown:W,disabled:D,id:A,"data-testid":ve,ariaLabel:ge,ariaHidden:!1,ariaHasPopup:!1,ariaExpanded:!1},Ee),ze=fe?Object.assign(Object.assign({},Pe),{ref:Ee,className:Me,style:we,onMouseEnter:Ne,onMouseLeave:Se}):{className:Te,"aria-label":ge,style:we,ref:Ee,onClick:Ie,onMouseDown:W,id:A,"data-testid":ve,onMouseEnter:Ne,onMouseLeave:Se},Le="text"===re?{text:z}:{src:z},Oe="text"===re?{text:O}:{src:O};return t.createElement("div",Object.assign({},ze),z?t.createElement(v,Object.assign({withoutBorder:!0,className:l(x.avatar,x.left,h),customSize:18,type:re,key:A},Le)):null,w?t.createElement(c,{className:l(x.icon,x.left,S),iconType:"font",icon:w,iconSize:K,ignoreFocusStyle:!0}):null,le&&t.createElement("div",{className:l(x.customRenderer,x.left)},le),t.createElement(b,{type:"text2",className:x.label},T),I?t.createElement(c,{className:l(x.icon,x.right,S),iconType:"font",icon:I,iconSize:K,ignoreFocusStyle:!0}):null,O?t.createElement(v,Object.assign({withoutBorder:!0,className:l(x.avatar,x.right,h),customSize:18,type:ie,key:A},Oe)):null,ce&&t.createElement("div",{className:l(x.customRenderer,x.right)},ce),be&&t.createElement(f,{size:"xxs",color:"on-primary-color",className:l(x.icon,x.close),ariaLabel:de,hideTooltip:!0,icon:N,onClick:Be,"data-testid":"".concat(ve,"-close"),ref:ye}))})),{colors:u,avatarTypes:j});export{S as default};
+import{slicedToArray as e,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as r,useRef as a,useState as i,useCallback as s,useMemo as n}from"react";import l from"classnames";import c from"../Icon/Icon.js";import m from"../../hooks/useMergeRef.js";import{getCSSVar as d}from"../../services/themes.js";import{ElementAllowedColor as u}from"../../utils/colors-vars-map.js";import{getElementColor as p}from"../../types/Colors.js";import v from"../Avatar/Avatar.js";import f from"../IconButton/IconButton.js";import b from"../Text/Text.js";import{getTestId as g,ComponentDefaultTestId as j}from"../../tests/testIds.js";import{AvatarType as y}from"../Avatar/AvatarConstants.js";import{withStaticProps as h}from"../../types/withStaticProps.js";import C from"../../hooks/useSetFocus/index.js";import k from"../../hooks/useClickableProps/useClickableProps.js";import x from"./Chips.module.scss.js";import{ComponentVibeId as S}from"../../tests/constants.js";import N from"../../../icons/dist/react/CloseSmall.js";var A=h(r((function(r,u){var y=r.className,h=r.avatarClassName,A=r.iconClassName,E=r.id,T=r.label,M=void 0===T?"":T,w=r.leftIcon,I=void 0===w?null:w,P=r.rightIcon,B=void 0===P?null:P,z=r.leftAvatar,L=void 0===z?null:z,O=r.rightAvatar,R=void 0===O?null:O,D=r.disabled,H=void 0!==D&&D,F=r.readOnly,_=void 0!==F&&F,U=r.allowTextSelection,q=void 0!==U&&U,G=r.color,J=void 0===G?"primary":G,K=r.iconSize,Q=void 0===K?18:K,V=r.onDelete,W=void 0===V?function(e,o){}:V,X=r.onMouseDown,Y=r.onClick,Z=r.noAnimation,$=void 0===Z||Z,ee=r.ariaLabel,oe=r.disableClickableBehavior,te=void 0!==oe&&oe,re=r.leftAvatarType,ae=void 0===re?"img":re,ie=r.rightAvatarType,se=void 0===ie?"img":ie,ne=r.showBorder,le=void 0!==ne&&ne,ce=r.leftRenderer,me=r.rightRenderer,de=r.closeButtonAriaLabel,ue=void 0===de?"Remove":de,pe=r.noMargin,ve=void 0!==pe&&pe,fe=r["data-testid"]||g(j.CHIP,E),be=!(!Y&&!X||te),ge=!_&&!H,je=ee||"string"==typeof M&&M||"",ye=a(null),he=a(null),Ce=i(!1),ke=e(Ce,2),xe=ke[0],Se=ke[1],Ne=s((function(){return Se(!0)}),[]),Ae=s((function(){return Se(!1)}),[]),Ee=C({ref:he}).isFocused,Te=m(u,he),Me=l(x.chips,y,o(o(o(o(o({},x.disabled,H),x.noAnimation,$),x.withUserSelect,q),x.border,le),x.noMargin,ve)),we=l(x.clickable,Me,o(o({},x.disabled,H),x.disableTextSelection,!q)),Ie=n((function(){return{backgroundColor:H?d("disabled-background-color"):be&&(xe||Ee)?p(J,!0,!0):p(J,!0)}}),[H,be,xe,Ee,J]),Pe=s((function(e){e.stopPropagation(),W&&W(E,e)}),[E,W]),Be=s((function(e){void 0!==Y&&e.target!==ye.current&&(e.preventDefault(),Y(e))}),[Y]),ze=k({onClick:Be,onMouseDown:X,disabled:H,id:E,"data-testid":fe,ariaLabel:je,ariaHidden:!1,ariaHasPopup:!1,ariaExpanded:!1},Te),Le=be?Object.assign(Object.assign({},ze),{ref:Te,className:we,style:Ie,onMouseEnter:Ne,onMouseLeave:Ae}):{className:Me,"aria-label":je,style:Ie,ref:Te,onClick:Be,onMouseDown:X,id:E,"data-testid":fe,onMouseEnter:Ne,onMouseLeave:Ae},Oe="text"===ae?{text:L}:{src:L},Re="text"===ae?{text:R}:{src:R};return t.createElement("div",Object.assign({},Le,{"data-vibe":S.CHIPS}),L?t.createElement(v,Object.assign({withoutBorder:!0,className:l(x.avatar,x.left,h),customSize:18,type:ae,key:E},Oe)):null,I?t.createElement(c,{className:l(x.icon,x.left,A),iconType:"font",icon:I,iconSize:Q,ignoreFocusStyle:!0}):null,ce&&t.createElement("div",{className:l(x.customRenderer,x.left)},ce),t.createElement(b,{type:"text2",className:x.label},M),B?t.createElement(c,{className:l(x.icon,x.right,A),iconType:"font",icon:B,iconSize:Q,ignoreFocusStyle:!0}):null,R?t.createElement(v,Object.assign({withoutBorder:!0,className:l(x.avatar,x.right,h),customSize:18,type:se,key:E},Re)):null,me&&t.createElement("div",{className:l(x.customRenderer,x.right)},me),ge&&t.createElement(f,{size:"xxs",color:"on-primary-color",className:l(x.icon,x.close),ariaLabel:ue,hideTooltip:!0,icon:N,onClick:Pe,"data-testid":"".concat(fe,"-close"),ref:ye}))})),{colors:u,avatarTypes:y});export{A as default};
 //# sourceMappingURL=Chips.js.map

package/dist/src/components/Chips/Chips.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chips.js","sources":["../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport Icon from \"../Icon/Icon\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { getCSSVar } from \"../../services/themes\";\nimport { ElementAllowedColor as ElementAllowedColorEnum } from \"../../utils/colors-vars-map\";\nimport { type ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport Avatar from \"../Avatar/Avatar\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Text from \"../Text/Text\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { AvatarType as AvatarTypeEnum } from \"../Avatar/AvatarConstants\";\nimport { type AvatarType } from \"../Avatar\";\nimport { type ElementContent, type SubIcon, type VibeComponentProps, withStaticProps } from \"../../types\";\n\nimport useSetFocus from \"../../hooks/useSetFocus\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Chips.module.scss\";\n\nconst CHIPS_AVATAR_SIZE = 18;\n\nexport interface ChipsProps extends VibeComponentProps {\n /*\n The text or content displayed inside the chip.\n /\n label?: ElementContent;\n /\n If true, the chip is disabled.\n /\n disabled?: boolean;\n /\n If true, the chip is read-only and cannot be deleted.\n /\n readOnly?: boolean;\n /\n A React element displayed on the right side.\n /\n rightRenderer?: ElementContent;\n /\n A React element displayed on the left side.\n /\n leftRenderer?: ElementContent;\n /\n Icon displayed on the right side.\n /\n rightIcon?: SubIcon;\n /\n Icon displayed on the left side.\n /\n leftIcon?: SubIcon;\n /\n Image URL or text for an avatar displayed on the right.\n /\n rightAvatar?: string;\n /\n The type of avatar displayed on the right.\n /\n rightAvatarType?: AvatarType;\n /\n Image URL or text for an avatar displayed on the left.\n /\n leftAvatar?: string;\n /\n The type of avatar displayed on the left.\n /\n leftAvatarType?: AvatarType;\n /\n Class name applied to left or right icons.\n /\n iconClassName?: string;\n /\n Class name applied to left or right avatars.\n /\n avatarClassName?: string;\n /\n The background color of the chip.\n /\n color?: Exclude<ElementAllowedColor, \"dark_indigo\" \| \"blackish\">;\n /\n The size of the icons inside the chip.\n /\n iconSize?: number \| string;\n /\n Callback fired when the chip is deleted.\n /\n onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;\n /\n If true, disables the chip's entry animation.\n /\n noAnimation?: boolean;\n /\n If true, allows the user to select text inside the chip.\n /\n allowTextSelection?: boolean;\n /\n Callback fired when the mouse button is pressed on the chip.\n /\n onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /\n Callback fired when the chip is clicked.\n /\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /\n The label of the chip for accessibility.\n /\n ariaLabel?: string;\n /\n If true, disables all click behaviors.\n /\n disableClickableBehavior?: boolean;\n /\n If true, displays a border around the chip.\n /\n showBorder?: boolean;\n /\n The label for the close button.\n /\n closeButtonAriaLabel?: string;\n /\n If true, removes the default margin from the chip.\n */\n noMargin?: boolean;\n}\n\nconst Chips = forwardRef(\n (\n {\n className,\n avatarClassName,\n iconClassName,\n id,\n label = \"\",\n leftIcon = null,\n rightIcon = null,\n leftAvatar = null,\n rightAvatar = null,\n disabled = false,\n readOnly = false,\n allowTextSelection = false,\n color = \"primary\",\n iconSize = 18,\n onDelete = (_id: string, _e: React.MouseEvent<HTMLSpanElement>) => {},\n onMouseDown,\n onClick,\n noAnimation = true,\n ariaLabel,\n \"data-testid\": dataTestId,\n disableClickableBehavior = false,\n leftAvatarType = \"img\",\n rightAvatarType = \"img\",\n showBorder = false,\n leftRenderer,\n rightRenderer,\n closeButtonAriaLabel = \"Remove\",\n noMargin = false\n }: ChipsProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const componentDataTestId = dataTestId \|\| getTestId(ComponentDefaultTestId.CHIP, id);\n const hasClickableWrapper = (!!onClick \|\| !!onMouseDown) && !disableClickableBehavior;\n const hasCloseButton = !readOnly && !disabled;\n const overrideAriaLabel = ariaLabel \|\| (typeof label === \"string\" && label) \|\| \"\";\n\n const iconButtonRef = useRef(null);\n const componentRef = useRef(null);\n\n const [isHovered, setIsHovered] = useState(false);\n const handleMouseEnter = useCallback(() => setIsHovered(true), []);\n const handleMouseLeave = useCallback(() => setIsHovered(false), []);\n const { isFocused } = useSetFocus({ ref: componentRef });\n\n const mergedRef = useMergeRef<HTMLDivElement>(ref, componentRef);\n\n const overrideClassName = cx(styles.chips, className, {\n [styles.disabled]: disabled,\n [styles.noAnimation]: noAnimation,\n [styles.withUserSelect]: allowTextSelection,\n [styles.border]: showBorder,\n [styles.noMargin]: noMargin\n });\n const clickableClassName = cx(styles.clickable, overrideClassName, {\n [styles.disabled]: disabled,\n [styles.disableTextSelection]: !allowTextSelection\n });\n\n const backgroundColorStyle = useMemo(() => {\n let cssVar;\n if (disabled) {\n cssVar = getCSSVar(\"disabled-background-color\");\n } else if (hasClickableWrapper && (isHovered \|\| isFocused)) {\n cssVar = getElementColor(color, true, true);\n } else {\n cssVar = getElementColor(color, true);\n }\n return { backgroundColor: cssVar };\n }, [disabled, hasClickableWrapper, isHovered, isFocused, color]);\n\n const onDeleteCallback = useCallback(\n (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n e.stopPropagation();\n if (onDelete) {\n onDelete(id, e);\n }\n },\n [id, onDelete]\n );\n\n const onClickCallback = useCallback(\n (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n if (onClick !== undefined && (e.target as HTMLElement) !== iconButtonRef.current) {\n e.preventDefault();\n onClick(e);\n }\n },\n [onClick]\n );\n\n const clickableProps = useClickableProps(\n {\n onClick: onClickCallback,\n onMouseDown,\n disabled,\n id,\n \"data-testid\": componentDataTestId,\n ariaLabel: overrideAriaLabel,\n ariaHidden: false,\n ariaHasPopup: false,\n ariaExpanded: false\n },\n mergedRef\n );\n const wrapperProps = hasClickableWrapper\n ? {\n ...clickableProps,\n ref: mergedRef,\n className: clickableClassName,\n style: backgroundColorStyle,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave\n }\n : {\n className: overrideClassName,\n \"aria-label\": overrideAriaLabel,\n style: backgroundColorStyle,\n ref: mergedRef,\n onClick: onClickCallback,\n onMouseDown,\n id: id,\n \"data-testid\": componentDataTestId,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave\n };\n\n const leftAvatarProps = leftAvatarType === \"text\" ? { text: leftAvatar } : { src: leftAvatar };\n const rightAvatarProps = leftAvatarType === \"text\" ? { text: rightAvatar } : { src: rightAvatar };\n\n return (\n <div {...wrapperProps}>\n {leftAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.left, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={leftAvatarType}\n key={id}\n {...leftAvatarProps}\n />\n ) : null}\n {leftIcon ? (\n <Icon\n className={cx(styles.icon, styles.left, iconClassName)}\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {leftRenderer && <div className={cx(styles.customRenderer, styles.left)}>{leftRenderer}</div>}\n <Text type=\"text2\" className={styles.label}>\n {label}\n </Text>\n {rightIcon ? (\n <Icon\n className={cx(styles.icon, styles.right, iconClassName)}\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {rightAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.right, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={rightAvatarType}\n key={id}\n {...rightAvatarProps}\n />\n ) : null}\n {rightRenderer && <div className={cx(styles.customRenderer, styles.right)}>{rightRenderer}</div>}\n {hasCloseButton && (\n <IconButton\n size=\"xxs\"\n color=\"on-primary-color\"\n className={cx(styles.icon, styles.close)}\n ariaLabel={closeButtonAriaLabel}\n hideTooltip\n icon={CloseSmall}\n onClick={onDeleteCallback}\n data-testid={`${componentDataTestId}-close`}\n ref={iconButtonRef}\n />\n )}\n </div>\n );\n }\n);\n\ninterface ChipsStaticProps {\n colors: typeof ElementAllowedColorEnum;\n avatarTypes: typeof AvatarTypeEnum;\n}\n\nexport default withStaticProps<ChipsProps, ChipsStaticProps>(Chips, {\n colors: ElementAllowedColorEnum,\n avatarTypes: AvatarTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","avatarClassName","iconClassName","id","_ref$label","label","_ref$leftIcon","leftIcon","_ref$rightIcon","rightIcon","_ref$leftAvatar","leftAvatar","_ref$rightAvatar","rightAvatar","_ref$disabled","disabled","_ref$readOnly","readOnly","_ref$allowTextSelecti","allowTextSelection","_ref$color","color","_ref$iconSize","iconSize","_ref$onDelete","onDelete","_id","_e","onMouseDown","onClick","_ref$noAnimation","noAnimation","ariaLabel","_ref$disableClickable","disableClickableBehavior","_ref$leftAvatarType","leftAvatarType","_ref$rightAvatarType","rightAvatarType","_ref$showBorder","showBorder","leftRenderer","rightRenderer","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$noMargin","noMargin","componentDataTestId","getTestId","ComponentDefaultTestId","CHIP","hasClickableWrapper","hasCloseButton","overrideAriaLabel","iconButtonRef","useRef","componentRef","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","handleMouseEnter","useCallback","handleMouseLeave","isFocused","useSetFocus","mergedRef","useMergeRef","overrideClassName","cx","styles","chips","_defineProperty","withUserSelect","border","clickableClassName","clickable","disableTextSelection","backgroundColorStyle","useMemo","backgroundColor","getCSSVar","getElementColor","onDeleteCallback","e","stopPropagation","onClickCallback","undefined","target","current","preventDefault","clickableProps","useClickableProps","ariaHidden","ariaHasPopup","ariaExpanded","wrapperProps","Object","assign","style","onMouseEnter","onMouseLeave","leftAvatarProps","text","src","rightAvatarProps","React","createElement","Avatar","withoutBorder","avatar","left","customSize","type","key","Icon","icon","iconType","ignoreFocusStyle","customRenderer","Text","right","IconButton","size","close","hideTooltip","CloseSmall","colors","ElementAllowedColorEnum","avatarTypes","AvatarTypeEnum"],"mappings":"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"}
1	+ {"version":3,"file":"Chips.js","sources":["../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport Icon from \"../Icon/Icon\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { getCSSVar } from \"../../services/themes\";\nimport { ElementAllowedColor as ElementAllowedColorEnum } from \"../../utils/colors-vars-map\";\nimport { type ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport Avatar from \"../Avatar/Avatar\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Text from \"../Text/Text\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { AvatarType as AvatarTypeEnum } from \"../Avatar/AvatarConstants\";\nimport { type AvatarType } from \"../Avatar\";\nimport { type ElementContent, type SubIcon, type VibeComponentProps, withStaticProps } from \"../../types\";\n\nimport useSetFocus from \"../../hooks/useSetFocus\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Chips.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nconst CHIPS_AVATAR_SIZE = 18;\n\nexport interface ChipsProps extends VibeComponentProps {\n /*\n The text or content displayed inside the chip.\n /\n label?: ElementContent;\n /\n If true, the chip is disabled.\n /\n disabled?: boolean;\n /\n If true, the chip is read-only and cannot be deleted.\n /\n readOnly?: boolean;\n /\n A React element displayed on the right side.\n /\n rightRenderer?: ElementContent;\n /\n A React element displayed on the left side.\n /\n leftRenderer?: ElementContent;\n /\n Icon displayed on the right side.\n /\n rightIcon?: SubIcon;\n /\n Icon displayed on the left side.\n /\n leftIcon?: SubIcon;\n /\n Image URL or text for an avatar displayed on the right.\n /\n rightAvatar?: string;\n /\n The type of avatar displayed on the right.\n /\n rightAvatarType?: AvatarType;\n /\n Image URL or text for an avatar displayed on the left.\n /\n leftAvatar?: string;\n /\n The type of avatar displayed on the left.\n /\n leftAvatarType?: AvatarType;\n /\n Class name applied to left or right icons.\n /\n iconClassName?: string;\n /\n Class name applied to left or right avatars.\n /\n avatarClassName?: string;\n /\n The background color of the chip.\n /\n color?: Exclude<ElementAllowedColor, \"dark_indigo\" \| \"blackish\">;\n /\n The size of the icons inside the chip.\n /\n iconSize?: number \| string;\n /\n Callback fired when the chip is deleted.\n /\n onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;\n /\n If true, disables the chip's entry animation.\n /\n noAnimation?: boolean;\n /\n If true, allows the user to select text inside the chip.\n /\n allowTextSelection?: boolean;\n /\n Callback fired when the mouse button is pressed on the chip.\n /\n onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /\n Callback fired when the chip is clicked.\n /\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /\n The label of the chip for accessibility.\n /\n ariaLabel?: string;\n /\n If true, disables all click behaviors.\n /\n disableClickableBehavior?: boolean;\n /\n If true, displays a border around the chip.\n /\n showBorder?: boolean;\n /\n The label for the close button.\n /\n closeButtonAriaLabel?: string;\n /\n If true, removes the default margin from the chip.\n */\n noMargin?: boolean;\n}\n\nconst Chips = forwardRef(\n (\n {\n className,\n avatarClassName,\n iconClassName,\n id,\n label = \"\",\n leftIcon = null,\n rightIcon = null,\n leftAvatar = null,\n rightAvatar = null,\n disabled = false,\n readOnly = false,\n allowTextSelection = false,\n color = \"primary\",\n iconSize = 18,\n onDelete = (_id: string, _e: React.MouseEvent<HTMLSpanElement>) => {},\n onMouseDown,\n onClick,\n noAnimation = true,\n ariaLabel,\n \"data-testid\": dataTestId,\n disableClickableBehavior = false,\n leftAvatarType = \"img\",\n rightAvatarType = \"img\",\n showBorder = false,\n leftRenderer,\n rightRenderer,\n closeButtonAriaLabel = \"Remove\",\n noMargin = false\n }: ChipsProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const componentDataTestId = dataTestId \|\| getTestId(ComponentDefaultTestId.CHIP, id);\n const hasClickableWrapper = (!!onClick \|\| !!onMouseDown) && !disableClickableBehavior;\n const hasCloseButton = !readOnly && !disabled;\n const overrideAriaLabel = ariaLabel \|\| (typeof label === \"string\" && label) \|\| \"\";\n\n const iconButtonRef = useRef(null);\n const componentRef = useRef(null);\n\n const [isHovered, setIsHovered] = useState(false);\n const handleMouseEnter = useCallback(() => setIsHovered(true), []);\n const handleMouseLeave = useCallback(() => setIsHovered(false), []);\n const { isFocused } = useSetFocus({ ref: componentRef });\n\n const mergedRef = useMergeRef<HTMLDivElement>(ref, componentRef);\n\n const overrideClassName = cx(styles.chips, className, {\n [styles.disabled]: disabled,\n [styles.noAnimation]: noAnimation,\n [styles.withUserSelect]: allowTextSelection,\n [styles.border]: showBorder,\n [styles.noMargin]: noMargin\n });\n const clickableClassName = cx(styles.clickable, overrideClassName, {\n [styles.disabled]: disabled,\n [styles.disableTextSelection]: !allowTextSelection\n });\n\n const backgroundColorStyle = useMemo(() => {\n let cssVar;\n if (disabled) {\n cssVar = getCSSVar(\"disabled-background-color\");\n } else if (hasClickableWrapper && (isHovered \|\| isFocused)) {\n cssVar = getElementColor(color, true, true);\n } else {\n cssVar = getElementColor(color, true);\n }\n return { backgroundColor: cssVar };\n }, [disabled, hasClickableWrapper, isHovered, isFocused, color]);\n\n const onDeleteCallback = useCallback(\n (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n e.stopPropagation();\n if (onDelete) {\n onDelete(id, e);\n }\n },\n [id, onDelete]\n );\n\n const onClickCallback = useCallback(\n (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n if (onClick !== undefined && (e.target as HTMLElement) !== iconButtonRef.current) {\n e.preventDefault();\n onClick(e);\n }\n },\n [onClick]\n );\n\n const clickableProps = useClickableProps(\n {\n onClick: onClickCallback,\n onMouseDown,\n disabled,\n id,\n \"data-testid\": componentDataTestId,\n ariaLabel: overrideAriaLabel,\n ariaHidden: false,\n ariaHasPopup: false,\n ariaExpanded: false\n },\n mergedRef\n );\n const wrapperProps = hasClickableWrapper\n ? {\n ...clickableProps,\n ref: mergedRef,\n className: clickableClassName,\n style: backgroundColorStyle,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave\n }\n : {\n className: overrideClassName,\n \"aria-label\": overrideAriaLabel,\n style: backgroundColorStyle,\n ref: mergedRef,\n onClick: onClickCallback,\n onMouseDown,\n id: id,\n \"data-testid\": componentDataTestId,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave\n };\n\n const leftAvatarProps = leftAvatarType === \"text\" ? { text: leftAvatar } : { src: leftAvatar };\n const rightAvatarProps = leftAvatarType === \"text\" ? { text: rightAvatar } : { src: rightAvatar };\n\n return (\n <div {...wrapperProps} data-vibe={ComponentVibeId.CHIPS}>\n {leftAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.left, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={leftAvatarType}\n key={id}\n {...leftAvatarProps}\n />\n ) : null}\n {leftIcon ? (\n <Icon\n className={cx(styles.icon, styles.left, iconClassName)}\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {leftRenderer && <div className={cx(styles.customRenderer, styles.left)}>{leftRenderer}</div>}\n <Text type=\"text2\" className={styles.label}>\n {label}\n </Text>\n {rightIcon ? (\n <Icon\n className={cx(styles.icon, styles.right, iconClassName)}\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {rightAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.right, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={rightAvatarType}\n key={id}\n {...rightAvatarProps}\n />\n ) : null}\n {rightRenderer && <div className={cx(styles.customRenderer, styles.right)}>{rightRenderer}</div>}\n {hasCloseButton && (\n <IconButton\n size=\"xxs\"\n color=\"on-primary-color\"\n className={cx(styles.icon, styles.close)}\n ariaLabel={closeButtonAriaLabel}\n hideTooltip\n icon={CloseSmall}\n onClick={onDeleteCallback}\n data-testid={`${componentDataTestId}-close`}\n ref={iconButtonRef}\n />\n )}\n </div>\n );\n }\n);\n\ninterface ChipsStaticProps {\n colors: typeof ElementAllowedColorEnum;\n avatarTypes: typeof AvatarTypeEnum;\n}\n\nexport default withStaticProps<ChipsProps, ChipsStaticProps>(Chips, {\n colors: ElementAllowedColorEnum,\n avatarTypes: AvatarTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","avatarClassName","iconClassName","id","_ref$label","label","_ref$leftIcon","leftIcon","_ref$rightIcon","rightIcon","_ref$leftAvatar","leftAvatar","_ref$rightAvatar","rightAvatar","_ref$disabled","disabled","_ref$readOnly","readOnly","_ref$allowTextSelecti","allowTextSelection","_ref$color","color","_ref$iconSize","iconSize","_ref$onDelete","onDelete","_id","_e","onMouseDown","onClick","_ref$noAnimation","noAnimation","ariaLabel","_ref$disableClickable","disableClickableBehavior","_ref$leftAvatarType","leftAvatarType","_ref$rightAvatarType","rightAvatarType","_ref$showBorder","showBorder","leftRenderer","rightRenderer","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$noMargin","noMargin","componentDataTestId","getTestId","ComponentDefaultTestId","CHIP","hasClickableWrapper","hasCloseButton","overrideAriaLabel","iconButtonRef","useRef","componentRef","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","handleMouseEnter","useCallback","handleMouseLeave","isFocused","useSetFocus","mergedRef","useMergeRef","overrideClassName","cx","styles","chips","_defineProperty","withUserSelect","border","clickableClassName","clickable","disableTextSelection","backgroundColorStyle","useMemo","backgroundColor","getCSSVar","getElementColor","onDeleteCallback","e","stopPropagation","onClickCallback","undefined","target","current","preventDefault","clickableProps","useClickableProps","ariaHidden","ariaHasPopup","ariaExpanded","wrapperProps","Object","assign","style","onMouseEnter","onMouseLeave","leftAvatarProps","text","src","rightAvatarProps","React","createElement","ComponentVibeId","CHIPS","Avatar","withoutBorder","avatar","left","customSize","type","key","Icon","icon","iconType","ignoreFocusStyle","customRenderer","Text","right","IconButton","size","close","hideTooltip","CloseSmall","colors","ElementAllowedColorEnum","avatarTypes","AvatarTypeEnum"],"mappings":"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"}

package/dist/src/components/Chips/Chips.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={clickable:"clickable_2c875c8345","focus-visible":"focus-visible_a0a0b58798",disabled:"disabled_743c2bd691",disableTextSelection:"disableTextSelection_5d597205fd",chips:"chips_a29f10a6cc","chips-pop-in-emphasized":"chips-pop-in-emphasized_c76f22038c",border:"border_2ae333df58",withUserSelect:"withUserSelect_d6358287ee",noMargin:"noMargin_71d6684dfc",label:"label_30e6ffc98b",noAnimation:"noAnimation_b623db95b8",icon:"icon_e8db9d934e",avatar:"avatar_981dab9d91",customRenderer:"customRenderer_5a526850b8",left:"left_c3bcc577bf",right:"right_f6a3cb873e",close:"close_296d6be458",defaultCursor:"defaultCursor_743c2bd691"};!function(e){const c="s_id-b08f85dbbdad_3_59_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+c))return;const a=document.createElement("style");a.id=c,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[c]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable_2c875c8345 {\n  cursor: pointer;\n}\n.clickable_2c875c8345:focus-visible, .clickable_2c875c8345.focus-visible_a0a0b58798 {\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_2c875c8345:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.clickable_2c875c8345.disabled_743c2bd691 {\n  cursor: default;\n}\n.disableTextSelection_5d597205fd {\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_a29f10a6cc {\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_c76f22038c var(--motion-productive-medium) var(--motion-timing-emphasize);\n}\n.chips_a29f10a6cc.border_2ae333df58 {\n  border: 1px solid var(--primary-background-color);\n}\n.chips_a29f10a6cc.withUserSelect_d6358287ee {\n  user-select: text;\n  cursor: text;\n}\n.chips_a29f10a6cc.noMargin_71d6684dfc {\n  margin: 0;\n}\n.chips_a29f10a6cc .label_30e6ffc98b {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.chips_a29f10a6cc.noAnimation_b623db95b8 {\n  animation: none;\n}\n.chips_a29f10a6cc .icon_e8db9d934e,\n.chips_a29f10a6cc .avatar_981dab9d91,\n.chips_a29f10a6cc .customRenderer_5a526850b8 {\n  min-width: 18px;\n}\n.chips_a29f10a6cc .icon_e8db9d934e.left_c3bcc577bf,\n.chips_a29f10a6cc .avatar_981dab9d91.left_c3bcc577bf,\n.chips_a29f10a6cc .customRenderer_5a526850b8.left_c3bcc577bf {\n  margin-right: var(--spacing-xs);\n}\n.chips_a29f10a6cc .icon_e8db9d934e.right_f6a3cb873e,\n.chips_a29f10a6cc .avatar_981dab9d91.right_f6a3cb873e,\n.chips_a29f10a6cc .customRenderer_5a526850b8.right_f6a3cb873e {\n  margin-left: var(--spacing-xs);\n}\n.chips_a29f10a6cc .icon_e8db9d934e.close_296d6be458,\n.chips_a29f10a6cc .avatar_981dab9d91.close_296d6be458,\n.chips_a29f10a6cc .customRenderer_5a526850b8.close_296d6be458 {\n  margin-left: var(--spacing-xs);\n  color: var(--primary-text-color);\n}\n.chips_a29f10a6cc.disabled_743c2bd691 .icon_e8db9d934e {\n  color: var(--disabled-text-color);\n}\n.chips_a29f10a6cc.disabled_743c2bd691 .label_30e6ffc98b {\n  color: var(--disabled-text-color);\n}\n.chips_a29f10a6cc.defaultCursor_743c2bd691 {\n  cursor: default;\n}\n.chips_a29f10a6cc.clickable_2c875c8345 {\n  cursor: pointer;\n}\n.chips_a29f10a6cc.clickable_2c875c8345:focus-visible, .chips_a29f10a6cc.clickable_2c875c8345.focus-visible_a0a0b58798 {\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_a29f10a6cc.clickable_2c875c8345:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.chips_a29f10a6cc.clickable_2c875c8345.disabled_743c2bd691 {\n  cursor: default;\n}\n.chips_a29f10a6cc.clickable_2c875c8345.disableTextSelection_5d597205fd {\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_c76f22038c {\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_7c6f9577e7","focus-visible":"focus-visible_8b4f8382ab",disabled:"disabled_de20658e7d",disableTextSelection:"disableTextSelection_07e732ed38",chips:"chips_1bc2d1cf70","chips-pop-in-emphasized":"chips-pop-in-emphasized_a6924fe00e",border:"border_bfa3d6ed0d",withUserSelect:"withUserSelect_3bd707012f",noMargin:"noMargin_8985fbeb03",label:"label_8cb9745d10",noAnimation:"noAnimation_8c0b4fcb32",icon:"icon_89673e72a1",avatar:"avatar_38cd5342b7",customRenderer:"customRenderer_725e9908a9",left:"left_8e9c015b2a",right:"right_f942bedf76",close:"close_3707f3fd6b",defaultCursor:"defaultCursor_de20658e7d"};!function(e){const n="s_id-b08f85dbbdad_3_61_0";if("undefined"!=typeof document){const c=document.head||document.getElementsByTagName("head")[0];if(c.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,c.firstChild?c.insertBefore(i,c.firstChild):c.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable_7c6f9577e7 {\n  cursor: pointer;\n}\n.clickable_7c6f9577e7:focus-visible, .clickable_7c6f9577e7.focus-visible_8b4f8382ab {\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_7c6f9577e7:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.clickable_7c6f9577e7.disabled_de20658e7d {\n  cursor: default;\n}\n.disableTextSelection_07e732ed38 {\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_1bc2d1cf70 {\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_a6924fe00e var(--motion-productive-medium) var(--motion-timing-emphasize);\n}\n.chips_1bc2d1cf70.border_bfa3d6ed0d {\n  border: 1px solid var(--primary-background-color);\n}\n.chips_1bc2d1cf70.withUserSelect_3bd707012f {\n  user-select: text;\n  cursor: text;\n}\n.chips_1bc2d1cf70.noMargin_8985fbeb03 {\n  margin: 0;\n}\n.chips_1bc2d1cf70 .label_8cb9745d10 {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.chips_1bc2d1cf70.noAnimation_8c0b4fcb32 {\n  animation: none;\n}\n.chips_1bc2d1cf70 .icon_89673e72a1,\n.chips_1bc2d1cf70 .avatar_38cd5342b7,\n.chips_1bc2d1cf70 .customRenderer_725e9908a9 {\n  min-width: 18px;\n}\n.chips_1bc2d1cf70 .icon_89673e72a1.left_8e9c015b2a,\n.chips_1bc2d1cf70 .avatar_38cd5342b7.left_8e9c015b2a,\n.chips_1bc2d1cf70 .customRenderer_725e9908a9.left_8e9c015b2a {\n  margin-right: var(--spacing-xs);\n}\n.chips_1bc2d1cf70 .icon_89673e72a1.right_f942bedf76,\n.chips_1bc2d1cf70 .avatar_38cd5342b7.right_f942bedf76,\n.chips_1bc2d1cf70 .customRenderer_725e9908a9.right_f942bedf76 {\n  margin-left: var(--spacing-xs);\n}\n.chips_1bc2d1cf70 .icon_89673e72a1.close_3707f3fd6b,\n.chips_1bc2d1cf70 .avatar_38cd5342b7.close_3707f3fd6b,\n.chips_1bc2d1cf70 .customRenderer_725e9908a9.close_3707f3fd6b {\n  margin-left: var(--spacing-xs);\n  color: var(--primary-text-color);\n}\n.chips_1bc2d1cf70.disabled_de20658e7d .icon_89673e72a1 {\n  color: var(--disabled-text-color);\n}\n.chips_1bc2d1cf70.disabled_de20658e7d .label_8cb9745d10 {\n  color: var(--disabled-text-color);\n}\n.chips_1bc2d1cf70.defaultCursor_de20658e7d {\n  cursor: default;\n}\n.chips_1bc2d1cf70.clickable_7c6f9577e7 {\n  cursor: pointer;\n}\n.chips_1bc2d1cf70.clickable_7c6f9577e7:focus-visible, .chips_1bc2d1cf70.clickable_7c6f9577e7.focus-visible_8b4f8382ab {\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_1bc2d1cf70.clickable_7c6f9577e7:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.chips_1bc2d1cf70.clickable_7c6f9577e7.disabled_de20658e7d {\n  cursor: default;\n}\n.chips_1bc2d1cf70.clickable_7c6f9577e7.disableTextSelection_07e732ed38 {\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_a6924fe00e {\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/src/components/Clickable/Clickable.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={clickable:"clickable_2c875c8345","focus-visible":"focus-visible_a0a0b58798",disabled:"disabled_743c2bd691",disableTextSelection:"disableTextSelection_5d597205fd"};!function(e){const n="s_id-8d33a9ee9e1f_3_59_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const c=document.createElement("style");c.id=n,i.firstChild?i.insertBefore(c,i.firstChild):i.appendChild(c),c.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.clickable_2c875c8345 {\n  cursor: pointer;\n}\n.clickable_2c875c8345:focus-visible, .clickable_2c875c8345.focus-visible_a0a0b58798 {\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_2c875c8345:focus:not(.focus-visible_a0a0b58798) {\n  outline: none;\n}\n.clickable_2c875c8345.disabled_743c2bd691 {\n  cursor: default;\n}\n.disableTextSelection_5d597205fd {\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_7c6f9577e7","focus-visible":"focus-visible_8b4f8382ab",disabled:"disabled_de20658e7d",disableTextSelection:"disableTextSelection_07e732ed38"};!function(e){const n="s_id-8d33a9ee9e1f_3_61_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_7c6f9577e7 {\n  cursor: pointer;\n}\n.clickable_7c6f9577e7:focus-visible, .clickable_7c6f9577e7.focus-visible_8b4f8382ab {\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_7c6f9577e7:focus:not(.focus-visible_8b4f8382ab) {\n  outline: none;\n}\n.clickable_7c6f9577e7.disabled_de20658e7d {\n  cursor: default;\n}\n.disableTextSelection_07e732ed38 {\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/src/components/ColorPicker/ColorPicker.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"classnames";import r,{forwardRef as e,useRef as t,useCallback as i}from"react";import{BaseSizes as s}from"../../constants/sizes.js";import l from"../../hooks/useMergeRef.js";import c from"../DialogContentContainer/DialogContentContainer.js";import{ColorStyle as n}from"../../utils/colors-vars-map.js";import a from"./components/ColorPickerContent/ColorPickerContent.js";import{ColorShapes as m,DEFAULT_NUMBER_OF_COLORS_IN_LINE as d}from"./ColorPickerConstants.js";import{calculateColorPickerDialogWidth as C}from"./services/ColorPickerStyleService.js";import{withStaticProps as u}from"../../types/withStaticProps.js";import{NOOP as f}from"../../utils/function-utils.js";import{getTestId as p,ComponentDefaultTestId as v}from"../../tests/testIds.js";import I from"./ColorPicker.module.scss.js";import{ComponentVibeId as S}from"../../tests/constants.js";import k from"../../../icons/dist/react/NoColor.js";var h=u(e((function(e,s){var n=e.className,m=e.onSave,u=void 0===m?f:m,h=e.value,j=void 0===h?"":h,P=e.noColorText,L=e.colorStyle,g=void 0===L?"regular":L,R=e.ColorIndicatorIcon,y=e.SelectedIndicatorIcon,O=e.shouldRenderIndicatorWithoutBackground,b=e.NoColorIcon,M=void 0===b?k:b,N=e.isBlackListMode,w=void 0===N||N,z=e.colorsList,D=void 0===z?[]:z,B=e.isMultiselect,E=e.colorSize,T=void 0===E?"medium":E,x=e.numberOfColorsInLine,K=void 0===x?d:x,U=e.focusOnMount,W=e.colorShape,_=void 0===W?"square":W,q=e.forceUseRawColorList,V=e.showColorNameTooltip,A=e.id,F=e["data-testid"],G=t(null),H=l(s,G),J=i(u,[u]),Q=C(T,K);return r.createElement(c,{ref:H,className:o(I.colorPicker,I.colorPickerDialogContent,n),ariaLabelledby:"Color Picker Dialog",ariaDescribedby:"Pick color",style:{width:Q}},r.createElement(a,{onValueChange:J,value:j,noColorText:P,shouldRenderIndicatorWithoutBackground:R&&O,colorStyle:g,ColorIndicatorIcon:R,SelectedIndicatorIcon:y,NoColorIcon:M,colorsList:D,isBlackListMode:w,isMultiselect:B,colorSize:T,numberOfColorsInLine:K,focusOnMount:U,colorShape:_,forceUseRawColorList:q,showColorNameTooltip:V,id:A,"data-testid":F||p(v.COLOR_PICKER,A),"data-vibe":S.COLOR_PICKER}))})),{sizes:s,colorStyles:n,colorSizes:s,colorShapes:m});export{h as default};
+import o from"classnames";import r,{forwardRef as e,useRef as t,useCallback as i}from"react";import{BaseSizes as s}from"../../constants/sizes.js";import l from"../../hooks/useMergeRef.js";import c from"../DialogContentContainer/DialogContentContainer.js";import{ColorStyle as n}from"../../utils/colors-vars-map.js";import a from"./components/ColorPickerContent/ColorPickerContent.js";import{ColorShapes as m,DEFAULT_NUMBER_OF_COLORS_IN_LINE as d}from"./ColorPickerConstants.js";import{calculateColorPickerDialogWidth as C}from"./services/ColorPickerStyleService.js";import{withStaticProps as u}from"../../types/withStaticProps.js";import{NOOP as f}from"../../utils/function-utils.js";import{getTestId as p,ComponentDefaultTestId as v}from"../../tests/testIds.js";import I from"./ColorPicker.module.scss.js";import{ComponentVibeId as S}from"../../tests/constants.js";import k from"../../../icons/dist/react/NoColor.js";var h=u(e((function(e,s){var n=e.className,m=e.onSave,u=void 0===m?f:m,h=e.value,j=void 0===h?"":h,P=e.noColorText,L=e.colorStyle,g=void 0===L?"regular":L,R=e.ColorIndicatorIcon,y=e.SelectedIndicatorIcon,O=e.shouldRenderIndicatorWithoutBackground,b=e.NoColorIcon,M=void 0===b?k:b,N=e.isBlackListMode,w=void 0===N||N,z=e.colorsList,D=void 0===z?[]:z,B=e.isMultiselect,E=e.colorSize,T=void 0===E?"medium":E,x=e.numberOfColorsInLine,K=void 0===x?d:x,U=e.focusOnMount,W=e.colorShape,_=void 0===W?"square":W,q=e.forceUseRawColorList,V=e.showColorNameTooltip,A=e.id,F=e["data-testid"],G=t(null),H=l(s,G),J=i(u,[u]),Q=C(T,K);return r.createElement(c,{ref:H,className:o(I.colorPicker,I.colorPickerDialogContent,n),ariaLabelledby:"Color Picker Dialog",ariaDescribedby:"Pick color",style:{width:Q},"data-vibe":S.COLOR_PICKER},r.createElement(a,{onValueChange:J,value:j,noColorText:P,shouldRenderIndicatorWithoutBackground:R&&O,colorStyle:g,ColorIndicatorIcon:R,SelectedIndicatorIcon:y,NoColorIcon:M,colorsList:D,isBlackListMode:w,isMultiselect:B,colorSize:T,numberOfColorsInLine:K,focusOnMount:U,colorShape:_,forceUseRawColorList:q,showColorNameTooltip:V,id:A,"data-testid":F||p(v.COLOR_PICKER,A)}))})),{sizes:s,colorStyles:n,colorSizes:s,colorShapes:m});export{h as default};
 //# sourceMappingURL=ColorPicker.js.map

package/dist/src/components/ColorPicker/ColorPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorPicker.js","sources":["../../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useRef } from \"react\";\nimport { BaseSizes } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport { ColorStyle as ColorStyleEnum } from \"../../utils/colors-vars-map\";\nimport { NoColor } from \"@vibe/icons\";\nimport ColorPickerContent from \"./components/ColorPickerContent/ColorPickerContent\";\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 { calculateColorPickerDialogWidth } from \"./services/ColorPickerStyleService\";\nimport { type VibeComponentProps, type SubIcon, withStaticProps } from \"../../types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./ColorPicker.module.scss\";\nimport { type ColorStyle } from \"../../types/Colors\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ColorPickerProps extends VibeComponentProps {\n /*\n The selected color(s).\n /\n value?: ColorPickerValue;\n /\n Callback fired when the selected color(s) change.\n /\n onSave?: (value: ColorPickerArrayValueOnly) => void;\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 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 list of colors available for selection.\n /\n colorsList?: ColorPickerArrayValueOnly;\n /\n If true, allows selecting multiple colors.\n /\n isMultiselect?: boolean;\n /\n The size of the color items.\n /\n colorSize?: ColorPickerSizes;\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 The shape of the color items.\n /\n colorShape?: ColorShapes;\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 /\n showColorNameTooltip?: boolean;\n}\n\nconst ColorPicker = forwardRef(\n (\n {\n className,\n onSave = NOOP,\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 = \"medium\",\n numberOfColorsInLine = DEFAULT_NUMBER_OF_COLORS_IN_LINE,\n focusOnMount,\n colorShape = \"square\",\n forceUseRawColorList,\n showColorNameTooltip,\n id,\n \"data-testid\": dataTestId\n }: ColorPickerProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n const onChange = useCallback(onSave, [onSave]);\n\n const width = calculateColorPickerDialogWidth(colorSize as BaseSizes, numberOfColorsInLine);\n\n return (\n <DialogContentContainer\n ref={mergedRef}\n className={cx(styles.colorPicker, styles.colorPickerDialogContent, className)}\n ariaLabelledby=\"Color Picker Dialog\"\n ariaDescribedby=\"Pick color\"\n style={{ width }}\n >\n <ColorPickerContent\n onValueChange={onChange}\n value={value}\n noColorText={noColorText}\n shouldRenderIndicatorWithoutBackground={ColorIndicatorIcon && shouldRenderIndicatorWithoutBackground}\n colorStyle={colorStyle}\n ColorIndicatorIcon={ColorIndicatorIcon}\n SelectedIndicatorIcon={SelectedIndicatorIcon}\n NoColorIcon={NoColorIcon}\n colorsList={colorsList}\n isBlackListMode={isBlackListMode}\n isMultiselect={isMultiselect}\n colorSize={colorSize}\n numberOfColorsInLine={numberOfColorsInLine}\n focusOnMount={focusOnMount}\n colorShape={colorShape}\n forceUseRawColorList={forceUseRawColorList}\n showColorNameTooltip={showColorNameTooltip}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.COLOR_PICKER, id)}\n ~~data-vibe={ComponentVibeId.COLOR_PICKER}\n~~ />\n </DialogContentContainer>\n );\n }\n);\n\ninterface ColorPickerStaticProps {\n sizes: typeof BaseSizes;\n colorStyles: typeof ColorStyleEnum;\n colorSizes: typeof BaseSizes;\n colorShapes: typeof ColorShapesEnum;\n}\n\nexport default withStaticProps<ColorPickerProps, ColorPickerStaticProps>(ColorPicker, {\n sizes: BaseSizes,\n colorStyles: ColorStyleEnum,\n colorSizes: BaseSizes,\n colorShapes: ColorShapesEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$onSave","onSave","NOOP","_ref$value","value","noColorText","_ref$colorStyle","colorStyle","ColorIndicatorIcon","SelectedIndicatorIcon","shouldRenderIndicatorWithoutBackground","_ref$NoColorIcon","NoColorIcon","NoColor","_ref$isBlackListMode","isBlackListMode","_ref$colorsList","colorsList","isMultiselect","_ref$colorSize","colorSize","_ref$numberOfColorsIn","numberOfColorsInLine","DEFAULT_NUMBER_OF_COLORS_IN_LINE","focusOnMount","_ref$colorShape","colorShape","forceUseRawColorList","showColorNameTooltip","id","dataTestId","componentRef","useRef","mergedRef","useMergeRef","onChange","useCallback","width","calculateColorPickerDialogWidth","React","createElement","DialogContentContainer","cx","styles","colorPicker","colorPickerDialogContent","ariaLabelledby","ariaDescribedby","style","~~ColorPickerContent~~","~~onValueChange~~","~~getTestId~~","~~ComponentDefaultTestId~~","~~COLOR_PICKER~~","~~ComponentVibeId~~","sizes","BaseSizes","colorStyles","ColorStyleEnum","colorSizes","colorShapes","ColorShapesEnum"],"mappings":"s5BAiGA,IA2EeA,EAAAA,EA3EKC,GAClB,SAAAC,EAuBEC,GACE,IAtBAC,EAASF,EAATE,UAASC,EAAAH,EACTI,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAN,EACbO,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EACVE,EAAWR,EAAXQ,YAAWC,EAAAT,EACXU,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAkBX,EAAlBW,mBACAC,EAAqBZ,EAArBY,sBACAC,EAAsCb,EAAtCa,uCAAsCC,EAAAd,EACtCe,YAAAA,OAAcC,IAAHF,EAAGE,EAAOF,EAAAG,EAAAjB,EACrBkB,gBAAAA,OAAkB,IAAHD,GAAOA,EAAAE,EAAAnB,EACtBoB,WAAAA,OAAa,IAAHD,EAAG,GAAEA,EACfE,EAAarB,EAAbqB,cAAaC,EAAAtB,EACbuB,UAAAA,OAAY,IAAHD,EAAG,SAAQA,EAAAE,EAAAxB,EACpByB,qBAAAA,OAAuBC,IAAHF,EAAGE,EAAgCF,EACvDG,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,EAAeC,EAAO,MACtBC,EAAYC,EAAYpC,EAAKiC,GAE7BI,EAAWC,EAAYnC,EAAQ,CAACA,IAEhCoC,EAAQC,EAAgClB,EAAwBE,GAEtE,OACEiB,~~EAAAC~~,~~cAACC~~,~~EAAsB~~,~~CACrB3C~~,IAAKmC,EACLlC,UAAW2C,EAAGC,EAAOC,YAAaD,EAAOE,yBAA0B9C,GACnE+C,eAAe,sBACfC,gBAAgB,aAChBC,MAAO,CAAEX,MAAAA,~~IAETE~~,~~EAACC~~,~~cAAAS~~,~~GACCC~~,~~cAAef~~,EACf/B,MAAOA,EACPC,YAAaA,EACbK,uCAAwCF,GAAsBE,EAC9DH,WAAYA,EACZC,mBAAoBA,EACpBC,sBAAuBA,EACvBG,YAAaA,EACbK,WAAYA,EACZF,gBAAiBA,EACjBG,cAAeA,EACfE,UAAWA,EACXE,qBAAsBA,EACtBE,aAAcA,EACdE,WAAYA,EACZC,qBAAsBA,EACtBC,qBAAsBA,EACtBC,GAAIA,EAAE,cACOC,~~GAAcqB~~,EAAUC,~~EAAuBC~~,~~aAAcxB~~,~~GAC/D~~,~~YAAAyB,EAAgBD,eAInC,~~IAUoF,~~CACpFE~~,MAAOC,EACPC,YAAaC,EACbC,WAAYH,EACZI,YAAaC"}
1	+ {"version":3,"file":"ColorPicker.js","sources":["../../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useRef } from \"react\";\nimport { BaseSizes } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport { ColorStyle as ColorStyleEnum } from \"../../utils/colors-vars-map\";\nimport { NoColor } from \"@vibe/icons\";\nimport ColorPickerContent from \"./components/ColorPickerContent/ColorPickerContent\";\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 { calculateColorPickerDialogWidth } from \"./services/ColorPickerStyleService\";\nimport { type VibeComponentProps, type SubIcon, withStaticProps } from \"../../types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./ColorPicker.module.scss\";\nimport { type ColorStyle } from \"../../types/Colors\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ColorPickerProps extends VibeComponentProps {\n /*\n The selected color(s).\n /\n value?: ColorPickerValue;\n /\n Callback fired when the selected color(s) change.\n /\n onSave?: (value: ColorPickerArrayValueOnly) => void;\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 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 list of colors available for selection.\n /\n colorsList?: ColorPickerArrayValueOnly;\n /\n If true, allows selecting multiple colors.\n /\n isMultiselect?: boolean;\n /\n The size of the color items.\n /\n colorSize?: ColorPickerSizes;\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 The shape of the color items.\n /\n colorShape?: ColorShapes;\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 /\n showColorNameTooltip?: boolean;\n}\n\nconst ColorPicker = forwardRef(\n (\n {\n className,\n onSave = NOOP,\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 = \"medium\",\n numberOfColorsInLine = DEFAULT_NUMBER_OF_COLORS_IN_LINE,\n focusOnMount,\n colorShape = \"square\",\n forceUseRawColorList,\n showColorNameTooltip,\n id,\n \"data-testid\": dataTestId\n }: ColorPickerProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n const onChange = useCallback(onSave, [onSave]);\n\n const width = calculateColorPickerDialogWidth(colorSize as BaseSizes, numberOfColorsInLine);\n\n return (\n <DialogContentContainer\n ref={mergedRef}\n className={cx(styles.colorPicker, styles.colorPickerDialogContent, className)}\n ariaLabelledby=\"Color Picker Dialog\"\n ariaDescribedby=\"Pick color\"\n style={{ width }}\n data-vibe={ComponentVibeId.COLOR_PICKER}\n >\n <ColorPickerContent\n onValueChange={onChange}\n value={value}\n noColorText={noColorText}\n shouldRenderIndicatorWithoutBackground={ColorIndicatorIcon && shouldRenderIndicatorWithoutBackground}\n colorStyle={colorStyle}\n ColorIndicatorIcon={ColorIndicatorIcon}\n SelectedIndicatorIcon={SelectedIndicatorIcon}\n NoColorIcon={NoColorIcon}\n colorsList={colorsList}\n isBlackListMode={isBlackListMode}\n isMultiselect={isMultiselect}\n colorSize={colorSize}\n numberOfColorsInLine={numberOfColorsInLine}\n focusOnMount={focusOnMount}\n colorShape={colorShape}\n forceUseRawColorList={forceUseRawColorList}\n showColorNameTooltip={showColorNameTooltip}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.COLOR_PICKER, id)}\n />\n </DialogContentContainer>\n );\n }\n);\n\ninterface ColorPickerStaticProps {\n sizes: typeof BaseSizes;\n colorStyles: typeof ColorStyleEnum;\n colorSizes: typeof BaseSizes;\n colorShapes: typeof ColorShapesEnum;\n}\n\nexport default withStaticProps<ColorPickerProps, ColorPickerStaticProps>(ColorPicker, {\n sizes: BaseSizes,\n colorStyles: ColorStyleEnum,\n colorSizes: BaseSizes,\n colorShapes: ColorShapesEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$onSave","onSave","NOOP","_ref$value","value","noColorText","_ref$colorStyle","colorStyle","ColorIndicatorIcon","SelectedIndicatorIcon","shouldRenderIndicatorWithoutBackground","_ref$NoColorIcon","NoColorIcon","NoColor","_ref$isBlackListMode","isBlackListMode","_ref$colorsList","colorsList","isMultiselect","_ref$colorSize","colorSize","_ref$numberOfColorsIn","numberOfColorsInLine","DEFAULT_NUMBER_OF_COLORS_IN_LINE","focusOnMount","_ref$colorShape","colorShape","forceUseRawColorList","showColorNameTooltip","id","dataTestId","componentRef","useRef","mergedRef","useMergeRef","onChange","useCallback","width","calculateColorPickerDialogWidth","React","createElement","DialogContentContainer","cx","styles","colorPicker","colorPickerDialogContent","ariaLabelledby","ariaDescribedby","style","ComponentVibeId","COLOR_PICKER","ColorPickerContent","onValueChange","getTestId","ComponentDefaultTestId","sizes","BaseSizes","colorStyles","ColorStyleEnum","colorSizes","colorShapes","ColorShapesEnum"],"mappings":"s5BAiGA,IA2EeA,EAAAA,EA3EKC,GAClB,SAAAC,EAuBEC,GACE,IAtBAC,EAASF,EAATE,UAASC,EAAAH,EACTI,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAN,EACbO,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EACVE,EAAWR,EAAXQ,YAAWC,EAAAT,EACXU,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAkBX,EAAlBW,mBACAC,EAAqBZ,EAArBY,sBACAC,EAAsCb,EAAtCa,uCAAsCC,EAAAd,EACtCe,YAAAA,OAAcC,IAAHF,EAAGE,EAAOF,EAAAG,EAAAjB,EACrBkB,gBAAAA,OAAkB,IAAHD,GAAOA,EAAAE,EAAAnB,EACtBoB,WAAAA,OAAa,IAAHD,EAAG,GAAEA,EACfE,EAAarB,EAAbqB,cAAaC,EAAAtB,EACbuB,UAAAA,OAAY,IAAHD,EAAG,SAAQA,EAAAE,EAAAxB,EACpByB,qBAAAA,OAAuBC,IAAHF,EAAGE,EAAgCF,EACvDG,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,EAAeC,EAAO,MACtBC,EAAYC,EAAYpC,EAAKiC,GAE7BI,EAAWC,EAAYnC,EAAQ,CAACA,IAEhCoC,EAAQC,EAAgClB,EAAwBE,GAEtE,OACEiB,EAACC,cAAAC,EACC,CAAA3C,IAAKmC,EACLlC,UAAW2C,EAAGC,EAAOC,YAAaD,EAAOE,yBAA0B9C,GACnE+C,eAAe,sBACfC,gBAAgB,aAChBC,MAAO,CAAEX,MAAAA,GACE,YAAAY,EAAgBC,cAE3BX,EAAAC,cAACW,EACC,CAAAC,cAAejB,EACf/B,MAAOA,EACPC,YAAaA,EACbK,uCAAwCF,GAAsBE,EAC9DH,WAAYA,EACZC,mBAAoBA,EACpBC,sBAAuBA,EACvBG,YAAaA,EACbK,WAAYA,EACZF,gBAAiBA,EACjBG,cAAeA,EACfE,UAAWA,EACXE,qBAAsBA,EACtBE,aAAcA,EACdE,WAAYA,EACZC,qBAAsBA,EACtBC,qBAAsBA,EACtBC,GAAIA,EAAE,cACOC,GAAcuB,EAAUC,EAAuBJ,aAAcrB,KAIlF,IAUoF,CACpF0B,MAAOC,EACPC,YAAaC,EACbC,WAAYH,EACZI,YAAaC"}

package/dist/src/components/ColorPicker/ColorPicker.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={colorPicker:"colorPicker_7e4390f0b0",colorPickerDialogContent:"colorPickerDialogContent_80b0dd13ce"};!function(e){const t="s_id-ffacbf9b6446_3_59_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_7e4390f0b0.colorPickerDialogContent_80b0dd13ce {\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_7a4205d3ec",colorPickerDialogContent:"colorPickerDialogContent_7c3d87687a"};!function(e){const t="s_id-ffacbf9b6446_3_61_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_7a4205d3ec.colorPickerDialogContent_7c3d87687a {\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