npm - @vibe/core - Versions diffs - 3.38.0-alpha-fff13.0 → 3.39.0 - Mend

@vibe/core 3.38.0-alpha-fff13.0 → 3.39.0

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 (736) hide show

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

@@ -1,2 +1,2 @@
-var n={box:"box_b2cf3a6afb",scrollable:"scrollable_476c97ce20",opacityDisabled:"opacityDisabled_550c5105c9",border:"border_cf6548fa59",borderColorUiBorderColor:"borderColorUiBorderColor_a64140fee2",borderColorLayoutBorderColor:"borderColorLayoutBorderColor_0ca165fad8",rounded0:"rounded0_efe20b4887",roundedSmall:"roundedSmall_9e6dfefa58",roundedMedium:"roundedMedium_8967c3a6e6",roundedBig:"roundedBig_edee24b3ea",shadowXs:"shadowXs_6d949f065e",shadowSmall:"shadowSmall_4acc8e147a",shadowMedium:"shadowMedium_b39fc2eeca",shadowLarge:"shadowLarge_69d95b7728",m0:"m0_405a7289a2",mXs:"mXs_63bccab997",mSmall:"mSmall_b7cb90b54a",mMedium:"mMedium_f1c75e389d",mLarge:"mLarge_43ebcd4ac2",mXl:"mXl_f3311e0c99",mXxl:"mXxl_a4ac6f84ee",mXxxl:"mXxxl_53a8ab6902",mAuto:"mAuto_31528da221",mx0:"mx0_63d6a4643f",mxXs:"mxXs_ddc5272247",mxSmall:"mxSmall_d83b3b7016",mxMedium:"mxMedium_3688d5a881",mxLarge:"mxLarge_1089e260f6",mxXl:"mxXl_188a1eeaef",mxXxl:"mxXxl_f37a134749",mxXxxl:"mxXxxl_a8ebdb6001",mxAuto:"mxAuto_a694bd43dc",my0:"my0_d70753736b",myXs:"myXs_8e6fd7a05a",mySmall:"mySmall_6680b409b2",myMedium:"myMedium_8b377656ec",myLarge:"myLarge_07900a601e",myXl:"myXl_c732f92888",myXxl:"myXxl_aa211baa47",myXxxl:"myXxxl_474a13b43a",myAuto:"myAuto_e977ca741a",mt0:"mt0_00705e467f",mtXs:"mtXs_7927a8fd2b",mtSmall:"mtSmall_69675e8869",mtMedium:"mtMedium_5fae2d62d5",mtLarge:"mtLarge_b703c0ce83",mtXl:"mtXl_1e7d3677d4",mtXxl:"mtXxl_3f222089a5",mtXxxl:"mtXxxl_6efe3374d1",mtAuto:"mtAuto_25c7df9509",me0:"me0_374a2f294f",meXs:"meXs_d878a792c6",meSmall:"meSmall_99f978075a",meMedium:"meMedium_4daf250fcf",meLarge:"meLarge_1063e44e17",meXl:"meXl_6d093a5c5b",meXxl:"meXxl_2b9720a371",meXxxl:"meXxxl_ccbb7b249c",meAuto:"meAuto_5f5abcb0b0",mb0:"mb0_7d1ca558a6",mbXs:"mbXs_96d48ff2c5",mbSmall:"mbSmall_173f5e81a7",mbMedium:"mbMedium_a5a22416a8",mbLarge:"mbLarge_c08d2de379",mbXl:"mbXl_7235410ab2",mbXxl:"mbXxl_0e44ae2c30",mbXxxl:"mbXxxl_b09ce7dfa8",mbAuto:"mbAuto_685f60be76",ms0:"ms0_70a61276b0",msXs:"msXs_ee2070046e",msSmall:"msSmall_b139d44855",msMedium:"msMedium_611ff33855",msLarge:"msLarge_70800361c5",msXl:"msXl_5c43891d24",msXxl:"msXxl_15a4719ec1",msXxxl:"msXxxl_08a75d006c",msAuto:"msAuto_54ac03ccb3",p0:"p0_5532dc9ee7",pXs:"pXs_f2439dea74",pSmall:"pSmall_3eb3b37f15",pMedium:"pMedium_ef3209a97d",pLarge:"pLarge_ef0fe5c0cb",pXl:"pXl_ebbd14a8a3",pXxl:"pXxl_738803d2ae",pXxxl:"pXxxl_520bf9a453",px0:"px0_9d695ded4c",pxXs:"pxXs_02544fb43b",pxSmall:"pxSmall_615145ed41",pxMedium:"pxMedium_f414e76d04",pxLarge:"pxLarge_0a4ec91a88",pxXl:"pxXl_b4958e5c3d",pxXxl:"pxXxl_72b0400a35",pxXxxl:"pxXxxl_82d562f153",py0:"py0_9eb378fdbe",pyXs:"pyXs_c6d986d0f2",pySmall:"pySmall_0be9b98714",pyMedium:"pyMedium_097e45a4f2",pyLarge:"pyLarge_f49a194733",pyXl:"pyXl_368eeba173",pyXxl:"pyXxl_73ef25b106",pyXxxl:"pyXxxl_f314bbe109",pt0:"pt0_cb2baff2e8",ptXs:"ptXs_79744f64ba",ptSmall:"ptSmall_0fc0e721b9",ptMedium:"ptMedium_44e91ccddd",ptLarge:"ptLarge_395dc6a8b6",ptXl:"ptXl_fb536f447b",ptXxl:"ptXxl_26b4e338f9",ptXxxl:"ptXxxl_980bb72b31",pe0:"pe0_d1a13611af",peXs:"peXs_1971724132",peSmall:"peSmall_56809aecb4",peMedium:"peMedium_88c9aff67f",peLarge:"peLarge_54fb841ded",peXl:"peXl_7e9e3723cc",peXxl:"peXxl_8e1c419c1f",peXxxl:"peXxxl_923e2ab500",pb0:"pb0_e82b35aff1",pbXs:"pbXs_39f05ae9a7",pbSmall:"pbSmall_cb0dc7759a",pbMedium:"pbMedium_f48f17f89e",pbLarge:"pbLarge_da90b2b7e5",pbXl:"pbXl_40b5183e5e",pbXxl:"pbXxl_6cfe754fdd",pbXxxl:"pbXxxl_1e7fd87664",ps0:"ps0_85dd342c9c",psXs:"psXs_06a1b6d353",psSmall:"psSmall_7bdb5f351e",psMedium:"psMedium_7137811f14",psLarge:"psLarge_3187e1b310",psXl:"psXl_3cacfb2673",psXxl:"psXxl_ae60ec2985",psXxxl:"psXxxl_17b6dd2c87",textPrimaryTextColor:"textPrimaryTextColor_54444142f1",textTextColorOnInverted:"textTextColorOnInverted_3abdb9c88d",textSecondaryTextColor:"textSecondaryTextColor_e540e05db9",bgPrimaryBackgroundColor:"bgPrimaryBackgroundColor_6e3d25a497",bgSecondaryBackgroundColor:"bgSecondaryBackgroundColor_57164d3da2",bgGreyBackgroundColor:"bgGreyBackgroundColor_d4c6151492",bgAllgreyBackgroundColor:"bgAllgreyBackgroundColor_10ebd6b2c7",bgInvertedColorBackground:"bgInvertedColorBackground_4f8798daf5"};!function(n){const a="s_id-e8ebf0c89fee_3_37_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+a))return;const t=document.createElement("style");t.id=a,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=n)}("/*  stylelint-disable scss/at-if-no-null */\n/*  stylelint-enable scss/at-if-no-null */\n.box_b2cf3a6afb {\n  overflow: hidden;\n}\n.box_b2cf3a6afb.scrollable_476c97ce20 {\n  overflow: auto;\n}\n.box_b2cf3a6afb.scrollable_476c97ce20::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.box_b2cf3a6afb.scrollable_476c97ce20::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}\n.opacityDisabled_550c5105c9 {\n  opacity: var(--disabled-component-opacity) !important;\n}\n.border_cf6548fa59 {\n  border: var(--border-width) var(--border-style) var(--ui-border-color) !important;\n}\n.borderColorUiBorderColor_a64140fee2 {\n  border-color: var(--ui-border-color) !important;\n}\n.borderColorLayoutBorderColor_0ca165fad8 {\n  border-color: var(--layout-border-color) !important;\n}\n.rounded0_efe20b4887 {\n  border-radius: 0 !important;\n}\n.roundedSmall_9e6dfefa58 {\n  border-radius: var(--border-radius-small) !important;\n}\n.roundedMedium_8967c3a6e6 {\n  border-radius: var(--border-radius-medium) !important;\n}\n.roundedBig_edee24b3ea {\n  border-radius: var(--border-radius-big) !important;\n}\n.shadowXs_6d949f065e {\n  box-shadow: var(--box-shadow-xs) !important;\n}\n.shadowSmall_4acc8e147a {\n  box-shadow: var(--box-shadow-small) !important;\n}\n.shadowMedium_b39fc2eeca {\n  box-shadow: var(--box-shadow-medium) !important;\n}\n.shadowLarge_69d95b7728 {\n  box-shadow: var(--box-shadow-large) !important;\n}\n.m0_405a7289a2 {\n  margin: 0 !important;\n}\n.mXs_63bccab997 {\n  margin: var(--spacing-xs) !important;\n}\n.mSmall_b7cb90b54a {\n  margin: var(--spacing-small) !important;\n}\n.mMedium_f1c75e389d {\n  margin: var(--spacing-medium) !important;\n}\n.mLarge_43ebcd4ac2 {\n  margin: var(--spacing-large) !important;\n}\n.mXl_f3311e0c99 {\n  margin: var(--spacing-xl) !important;\n}\n.mXxl_a4ac6f84ee {\n  margin: var(--spacing-xxl) !important;\n}\n.mXxxl_53a8ab6902 {\n  margin: var(--spacing-xxxl) !important;\n}\n.mAuto_31528da221 {\n  margin: auto !important;\n}\n.mx0_63d6a4643f {\n  margin-right: 0 !important;\n  margin-left: 0 !important;\n}\n.mxXs_ddc5272247 {\n  margin-right: var(--spacing-xs) !important;\n  margin-left: var(--spacing-xs) !important;\n}\n.mxSmall_d83b3b7016 {\n  margin-right: var(--spacing-small) !important;\n  margin-left: var(--spacing-small) !important;\n}\n.mxMedium_3688d5a881 {\n  margin-right: var(--spacing-medium) !important;\n  margin-left: var(--spacing-medium) !important;\n}\n.mxLarge_1089e260f6 {\n  margin-right: var(--spacing-large) !important;\n  margin-left: var(--spacing-large) !important;\n}\n.mxXl_188a1eeaef {\n  margin-right: var(--spacing-xl) !important;\n  margin-left: var(--spacing-xl) !important;\n}\n.mxXxl_f37a134749 {\n  margin-right: var(--spacing-xxl) !important;\n  margin-left: var(--spacing-xxl) !important;\n}\n.mxXxxl_a8ebdb6001 {\n  margin-right: var(--spacing-xxxl) !important;\n  margin-left: var(--spacing-xxxl) !important;\n}\n.mxAuto_a694bd43dc {\n  margin-right: auto !important;\n  margin-left: auto !important;\n}\n.my0_d70753736b {\n  margin-top: 0 !important;\n  margin-bottom: 0 !important;\n}\n.myXs_8e6fd7a05a {\n  margin-top: var(--spacing-xs) !important;\n  margin-bottom: var(--spacing-xs) !important;\n}\n.mySmall_6680b409b2 {\n  margin-top: var(--spacing-small) !important;\n  margin-bottom: var(--spacing-small) !important;\n}\n.myMedium_8b377656ec {\n  margin-top: var(--spacing-medium) !important;\n  margin-bottom: var(--spacing-medium) !important;\n}\n.myLarge_07900a601e {\n  margin-top: var(--spacing-large) !important;\n  margin-bottom: var(--spacing-large) !important;\n}\n.myXl_c732f92888 {\n  margin-top: var(--spacing-xl) !important;\n  margin-bottom: var(--spacing-xl) !important;\n}\n.myXxl_aa211baa47 {\n  margin-top: var(--spacing-xxl) !important;\n  margin-bottom: var(--spacing-xxl) !important;\n}\n.myXxxl_474a13b43a {\n  margin-top: var(--spacing-xxxl) !important;\n  margin-bottom: var(--spacing-xxxl) !important;\n}\n.myAuto_e977ca741a {\n  margin-top: auto !important;\n  margin-bottom: auto !important;\n}\n.mt0_00705e467f {\n  margin-top: 0 !important;\n}\n.mtXs_7927a8fd2b {\n  margin-top: var(--spacing-xs) !important;\n}\n.mtSmall_69675e8869 {\n  margin-top: var(--spacing-small) !important;\n}\n.mtMedium_5fae2d62d5 {\n  margin-top: var(--spacing-medium) !important;\n}\n.mtLarge_b703c0ce83 {\n  margin-top: var(--spacing-large) !important;\n}\n.mtXl_1e7d3677d4 {\n  margin-top: var(--spacing-xl) !important;\n}\n.mtXxl_3f222089a5 {\n  margin-top: var(--spacing-xxl) !important;\n}\n.mtXxxl_6efe3374d1 {\n  margin-top: var(--spacing-xxxl) !important;\n}\n.mtAuto_25c7df9509 {\n  margin-top: auto !important;\n}\n.me0_374a2f294f {\n  margin-inline-end: 0 !important;\n}\n.meXs_d878a792c6 {\n  margin-inline-end: var(--spacing-xs) !important;\n}\n.meSmall_99f978075a {\n  margin-inline-end: var(--spacing-small) !important;\n}\n.meMedium_4daf250fcf {\n  margin-inline-end: var(--spacing-medium) !important;\n}\n.meLarge_1063e44e17 {\n  margin-inline-end: var(--spacing-large) !important;\n}\n.meXl_6d093a5c5b {\n  margin-inline-end: var(--spacing-xl) !important;\n}\n.meXxl_2b9720a371 {\n  margin-inline-end: var(--spacing-xxl) !important;\n}\n.meXxxl_ccbb7b249c {\n  margin-inline-end: var(--spacing-xxxl) !important;\n}\n.meAuto_5f5abcb0b0 {\n  margin-inline-end: auto !important;\n}\n.mb0_7d1ca558a6 {\n  margin-bottom: 0 !important;\n}\n.mbXs_96d48ff2c5 {\n  margin-bottom: var(--spacing-xs) !important;\n}\n.mbSmall_173f5e81a7 {\n  margin-bottom: var(--spacing-small) !important;\n}\n.mbMedium_a5a22416a8 {\n  margin-bottom: var(--spacing-medium) !important;\n}\n.mbLarge_c08d2de379 {\n  margin-bottom: var(--spacing-large) !important;\n}\n.mbXl_7235410ab2 {\n  margin-bottom: var(--spacing-xl) !important;\n}\n.mbXxl_0e44ae2c30 {\n  margin-bottom: var(--spacing-xxl) !important;\n}\n.mbXxxl_b09ce7dfa8 {\n  margin-bottom: var(--spacing-xxxl) !important;\n}\n.mbAuto_685f60be76 {\n  margin-bottom: auto !important;\n}\n.ms0_70a61276b0 {\n  margin-inline-start: 0 !important;\n}\n.msXs_ee2070046e {\n  margin-inline-start: var(--spacing-xs) !important;\n}\n.msSmall_b139d44855 {\n  margin-inline-start: var(--spacing-small) !important;\n}\n.msMedium_611ff33855 {\n  margin-inline-start: var(--spacing-medium) !important;\n}\n.msLarge_70800361c5 {\n  margin-inline-start: var(--spacing-large) !important;\n}\n.msXl_5c43891d24 {\n  margin-inline-start: var(--spacing-xl) !important;\n}\n.msXxl_15a4719ec1 {\n  margin-inline-start: var(--spacing-xxl) !important;\n}\n.msXxxl_08a75d006c {\n  margin-inline-start: var(--spacing-xxxl) !important;\n}\n.msAuto_54ac03ccb3 {\n  margin-inline-start: auto !important;\n}\n.p0_5532dc9ee7 {\n  padding: 0 !important;\n}\n.pXs_f2439dea74 {\n  padding: var(--spacing-xs) !important;\n}\n.pSmall_3eb3b37f15 {\n  padding: var(--spacing-small) !important;\n}\n.pMedium_ef3209a97d {\n  padding: var(--spacing-medium) !important;\n}\n.pLarge_ef0fe5c0cb {\n  padding: var(--spacing-large) !important;\n}\n.pXl_ebbd14a8a3 {\n  padding: var(--spacing-xl) !important;\n}\n.pXxl_738803d2ae {\n  padding: var(--spacing-xxl) !important;\n}\n.pXxxl_520bf9a453 {\n  padding: var(--spacing-xxxl) !important;\n}\n.px0_9d695ded4c {\n  padding-right: 0 !important;\n  padding-left: 0 !important;\n}\n.pxXs_02544fb43b {\n  padding-right: var(--spacing-xs) !important;\n  padding-left: var(--spacing-xs) !important;\n}\n.pxSmall_615145ed41 {\n  padding-right: var(--spacing-small) !important;\n  padding-left: var(--spacing-small) !important;\n}\n.pxMedium_f414e76d04 {\n  padding-right: var(--spacing-medium) !important;\n  padding-left: var(--spacing-medium) !important;\n}\n.pxLarge_0a4ec91a88 {\n  padding-right: var(--spacing-large) !important;\n  padding-left: var(--spacing-large) !important;\n}\n.pxXl_b4958e5c3d {\n  padding-right: var(--spacing-xl) !important;\n  padding-left: var(--spacing-xl) !important;\n}\n.pxXxl_72b0400a35 {\n  padding-right: var(--spacing-xxl) !important;\n  padding-left: var(--spacing-xxl) !important;\n}\n.pxXxxl_82d562f153 {\n  padding-right: var(--spacing-xxxl) !important;\n  padding-left: var(--spacing-xxxl) !important;\n}\n.py0_9eb378fdbe {\n  padding-top: 0 !important;\n  padding-bottom: 0 !important;\n}\n.pyXs_c6d986d0f2 {\n  padding-top: var(--spacing-xs) !important;\n  padding-bottom: var(--spacing-xs) !important;\n}\n.pySmall_0be9b98714 {\n  padding-top: var(--spacing-small) !important;\n  padding-bottom: var(--spacing-small) !important;\n}\n.pyMedium_097e45a4f2 {\n  padding-top: var(--spacing-medium) !important;\n  padding-bottom: var(--spacing-medium) !important;\n}\n.pyLarge_f49a194733 {\n  padding-top: var(--spacing-large) !important;\n  padding-bottom: var(--spacing-large) !important;\n}\n.pyXl_368eeba173 {\n  padding-top: var(--spacing-xl) !important;\n  padding-bottom: var(--spacing-xl) !important;\n}\n.pyXxl_73ef25b106 {\n  padding-top: var(--spacing-xxl) !important;\n  padding-bottom: var(--spacing-xxl) !important;\n}\n.pyXxxl_f314bbe109 {\n  padding-top: var(--spacing-xxxl) !important;\n  padding-bottom: var(--spacing-xxxl) !important;\n}\n.pt0_cb2baff2e8 {\n  padding-top: 0 !important;\n}\n.ptXs_79744f64ba {\n  padding-top: var(--spacing-xs) !important;\n}\n.ptSmall_0fc0e721b9 {\n  padding-top: var(--spacing-small) !important;\n}\n.ptMedium_44e91ccddd {\n  padding-top: var(--spacing-medium) !important;\n}\n.ptLarge_395dc6a8b6 {\n  padding-top: var(--spacing-large) !important;\n}\n.ptXl_fb536f447b {\n  padding-top: var(--spacing-xl) !important;\n}\n.ptXxl_26b4e338f9 {\n  padding-top: var(--spacing-xxl) !important;\n}\n.ptXxxl_980bb72b31 {\n  padding-top: var(--spacing-xxxl) !important;\n}\n.pe0_d1a13611af {\n  padding-inline-end: 0 !important;\n}\n.peXs_1971724132 {\n  padding-inline-end: var(--spacing-xs) !important;\n}\n.peSmall_56809aecb4 {\n  padding-inline-end: var(--spacing-small) !important;\n}\n.peMedium_88c9aff67f {\n  padding-inline-end: var(--spacing-medium) !important;\n}\n.peLarge_54fb841ded {\n  padding-inline-end: var(--spacing-large) !important;\n}\n.peXl_7e9e3723cc {\n  padding-inline-end: var(--spacing-xl) !important;\n}\n.peXxl_8e1c419c1f {\n  padding-inline-end: var(--spacing-xxl) !important;\n}\n.peXxxl_923e2ab500 {\n  padding-inline-end: var(--spacing-xxxl) !important;\n}\n.pb0_e82b35aff1 {\n  padding-bottom: 0 !important;\n}\n.pbXs_39f05ae9a7 {\n  padding-bottom: var(--spacing-xs) !important;\n}\n.pbSmall_cb0dc7759a {\n  padding-bottom: var(--spacing-small) !important;\n}\n.pbMedium_f48f17f89e {\n  padding-bottom: var(--spacing-medium) !important;\n}\n.pbLarge_da90b2b7e5 {\n  padding-bottom: var(--spacing-large) !important;\n}\n.pbXl_40b5183e5e {\n  padding-bottom: var(--spacing-xl) !important;\n}\n.pbXxl_6cfe754fdd {\n  padding-bottom: var(--spacing-xxl) !important;\n}\n.pbXxxl_1e7fd87664 {\n  padding-bottom: var(--spacing-xxxl) !important;\n}\n.ps0_85dd342c9c {\n  padding-inline-start: 0 !important;\n}\n.psXs_06a1b6d353 {\n  padding-inline-start: var(--spacing-xs) !important;\n}\n.psSmall_7bdb5f351e {\n  padding-inline-start: var(--spacing-small) !important;\n}\n.psMedium_7137811f14 {\n  padding-inline-start: var(--spacing-medium) !important;\n}\n.psLarge_3187e1b310 {\n  padding-inline-start: var(--spacing-large) !important;\n}\n.psXl_3cacfb2673 {\n  padding-inline-start: var(--spacing-xl) !important;\n}\n.psXxl_ae60ec2985 {\n  padding-inline-start: var(--spacing-xxl) !important;\n}\n.psXxxl_17b6dd2c87 {\n  padding-inline-start: var(--spacing-xxxl) !important;\n}\n.textPrimaryTextColor_54444142f1 {\n  color: var(--primary-text-color) !important;\n}\n.textTextColorOnInverted_3abdb9c88d {\n  color: var(--text-color-on-inverted) !important;\n}\n.textSecondaryTextColor_e540e05db9 {\n  color: var(--secondary-text-color) !important;\n}\n.bgPrimaryBackgroundColor_6e3d25a497 {\n  background-color: var(--primary-background-color) !important;\n}\n.bgSecondaryBackgroundColor_57164d3da2 {\n  background-color: var(--secondary-background-color) !important;\n}\n.bgGreyBackgroundColor_d4c6151492 {\n  background-color: var(--grey-background-color) !important;\n}\n.bgAllgreyBackgroundColor_10ebd6b2c7 {\n  background-color: var(--allgrey-background-color) !important;\n}\n.bgInvertedColorBackground_4f8798daf5 {\n  background-color: var(--inverted-color-background) !important;\n}");export{n as default};
+var n={box:"box_3cec7b3925",scrollable:"scrollable_1707d19e81",opacityDisabled:"opacityDisabled_d8c97d40a4",border:"border_cb7a611ff0",borderColorUiBorderColor:"borderColorUiBorderColor_84014feffe",borderColorLayoutBorderColor:"borderColorLayoutBorderColor_3a3cb0f20b",rounded0:"rounded0_1bcc096ec3",roundedSmall:"roundedSmall_425939ac85",roundedMedium:"roundedMedium_8bf8245c93",roundedBig:"roundedBig_63b60a0f7d",shadowXs:"shadowXs_59e9ed295e",shadowSmall:"shadowSmall_507dce59f7",shadowMedium:"shadowMedium_f361511351",shadowLarge:"shadowLarge_2095b665f9",m0:"m0_edfc4bde8c",mXs:"mXs_e8c87271c2",mSmall:"mSmall_5695f72cae",mMedium:"mMedium_ffb9476214",mLarge:"mLarge_3681ceb198",mXl:"mXl_414ee760b2",mXxl:"mXxl_b2684d6ab5",mXxxl:"mXxxl_8c2dacf32d",mAuto:"mAuto_86ca997bfc",mx0:"mx0_6e179b0cbc",mxXs:"mxXs_dd41ba9fcc",mxSmall:"mxSmall_c66da1b738",mxMedium:"mxMedium_0e8e6656cc",mxLarge:"mxLarge_adf4749930",mxXl:"mxXl_0416c111d5",mxXxl:"mxXxl_8ae39da0d5",mxXxxl:"mxXxxl_6f884aa50c",mxAuto:"mxAuto_582ae9eec2",my0:"my0_f618fa75a8",myXs:"myXs_fd845e1e9f",mySmall:"mySmall_279708e5ac",myMedium:"myMedium_0b32076c87",myLarge:"myLarge_c60e1096d1",myXl:"myXl_feaff87eae",myXxl:"myXxl_66442c0c16",myXxxl:"myXxxl_914c439930",myAuto:"myAuto_f6f66fa178",mt0:"mt0_13bd701490",mtXs:"mtXs_e57cd96af9",mtSmall:"mtSmall_952b87ba87",mtMedium:"mtMedium_2b2b11e81d",mtLarge:"mtLarge_846b88082a",mtXl:"mtXl_01573aad37",mtXxl:"mtXxl_89233c90c2",mtXxxl:"mtXxxl_058d9e52b2",mtAuto:"mtAuto_4ac1aa0047",me0:"me0_7c17108076",meXs:"meXs_7866177b85",meSmall:"meSmall_86047e2bf6",meMedium:"meMedium_8f5bf0daf0",meLarge:"meLarge_95e38b7406",meXl:"meXl_2cdeb0e144",meXxl:"meXxl_95dc4d75de",meXxxl:"meXxxl_f8227c19b3",meAuto:"meAuto_f612d39dcf",mb0:"mb0_e9af348030",mbXs:"mbXs_ec5e540fe7",mbSmall:"mbSmall_0c841b204d",mbMedium:"mbMedium_affafe5cf6",mbLarge:"mbLarge_4ad21db804",mbXl:"mbXl_a4b6c7429c",mbXxl:"mbXxl_74587cab6b",mbXxxl:"mbXxxl_bacdd6d950",mbAuto:"mbAuto_d60cbbd7af",ms0:"ms0_a017cd17f3",msXs:"msXs_d78796e819",msSmall:"msSmall_880adb107f",msMedium:"msMedium_f9228a402c",msLarge:"msLarge_20a1071f7e",msXl:"msXl_97645f0138",msXxl:"msXxl_db74279573",msXxxl:"msXxxl_638946457c",msAuto:"msAuto_720a93406e",p0:"p0_5daec8deb8",pXs:"pXs_4d1bbbd5af",pSmall:"pSmall_b66e733d3b",pMedium:"pMedium_11c054edab",pLarge:"pLarge_62422a3a00",pXl:"pXl_09add77ead",pXxl:"pXxl_ee1c1eae53",pXxxl:"pXxxl_29e1140a6f",px0:"px0_cbe7de1165",pxXs:"pxXs_18994a34ad",pxSmall:"pxSmall_7ad9a2454c",pxMedium:"pxMedium_ec707d5e6a",pxLarge:"pxLarge_85cac361fc",pxXl:"pxXl_b96111d3c9",pxXxl:"pxXxl_8aea6ae116",pxXxxl:"pxXxxl_77bf1e79fe",py0:"py0_44c2432016",pyXs:"pyXs_43db004bf2",pySmall:"pySmall_46009de5b4",pyMedium:"pyMedium_8b2a19344e",pyLarge:"pyLarge_5e2f42dea9",pyXl:"pyXl_17610dc727",pyXxl:"pyXxl_62c0d96a31",pyXxxl:"pyXxxl_87fce9fcc7",pt0:"pt0_e326b805c8",ptXs:"ptXs_e52aeb7116",ptSmall:"ptSmall_03b1601b2a",ptMedium:"ptMedium_2c4a02bee1",ptLarge:"ptLarge_48d9159008",ptXl:"ptXl_ac037cf1e6",ptXxl:"ptXxl_4a323fa083",ptXxxl:"ptXxxl_2b2afe9ba6",pe0:"pe0_f72ebf0e3e",peXs:"peXs_72e00349ff",peSmall:"peSmall_c25371ef80",peMedium:"peMedium_7fc50d0b93",peLarge:"peLarge_60bf6d2eaf",peXl:"peXl_8d78ddad17",peXxl:"peXxl_e1c3405638",peXxxl:"peXxxl_0a338493fc",pb0:"pb0_0ab384e210",pbXs:"pbXs_ee30037664",pbSmall:"pbSmall_533275ef9d",pbMedium:"pbMedium_0e578f4f08",pbLarge:"pbLarge_1dfdbf31f7",pbXl:"pbXl_683e3a11a8",pbXxl:"pbXxl_53a110afe4",pbXxxl:"pbXxxl_7d42d0f0f3",ps0:"ps0_ef31964959",psXs:"psXs_e294c25c61",psSmall:"psSmall_9f6b72d745",psMedium:"psMedium_9b5c913b8b",psLarge:"psLarge_3581f92292",psXl:"psXl_56b141f931",psXxl:"psXxl_544f054039",psXxxl:"psXxxl_e2452fdbb0",textPrimaryTextColor:"textPrimaryTextColor_9c23c740fa",textTextColorOnInverted:"textTextColorOnInverted_afc0234fdc",textSecondaryTextColor:"textSecondaryTextColor_20e1620e6a",bgPrimaryBackgroundColor:"bgPrimaryBackgroundColor_7684ffe4da",bgSecondaryBackgroundColor:"bgSecondaryBackgroundColor_cd47fcd5ef",bgGreyBackgroundColor:"bgGreyBackgroundColor_083757a874",bgAllgreyBackgroundColor:"bgAllgreyBackgroundColor_2d4007f86a",bgInvertedColorBackground:"bgInvertedColorBackground_61f2444a1e"};!function(n){const a="s_id-e8ebf0c89fee_3_38_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+a))return;const t=document.createElement("style");t.id=a,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=n)}("/*  stylelint-disable scss/at-if-no-null */\n/*  stylelint-enable scss/at-if-no-null */\n.box_3cec7b3925 {\n  overflow: hidden;\n}\n.box_3cec7b3925.scrollable_1707d19e81 {\n  overflow: auto;\n}\n.box_3cec7b3925.scrollable_1707d19e81::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.box_3cec7b3925.scrollable_1707d19e81::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}\n.opacityDisabled_d8c97d40a4 {\n  opacity: var(--disabled-component-opacity) !important;\n}\n.border_cb7a611ff0 {\n  border: var(--border-width) var(--border-style) var(--ui-border-color) !important;\n}\n.borderColorUiBorderColor_84014feffe {\n  border-color: var(--ui-border-color) !important;\n}\n.borderColorLayoutBorderColor_3a3cb0f20b {\n  border-color: var(--layout-border-color) !important;\n}\n.rounded0_1bcc096ec3 {\n  border-radius: 0 !important;\n}\n.roundedSmall_425939ac85 {\n  border-radius: var(--border-radius-small) !important;\n}\n.roundedMedium_8bf8245c93 {\n  border-radius: var(--border-radius-medium) !important;\n}\n.roundedBig_63b60a0f7d {\n  border-radius: var(--border-radius-big) !important;\n}\n.shadowXs_59e9ed295e {\n  box-shadow: var(--box-shadow-xs) !important;\n}\n.shadowSmall_507dce59f7 {\n  box-shadow: var(--box-shadow-small) !important;\n}\n.shadowMedium_f361511351 {\n  box-shadow: var(--box-shadow-medium) !important;\n}\n.shadowLarge_2095b665f9 {\n  box-shadow: var(--box-shadow-large) !important;\n}\n.m0_edfc4bde8c {\n  margin: 0 !important;\n}\n.mXs_e8c87271c2 {\n  margin: var(--spacing-xs) !important;\n}\n.mSmall_5695f72cae {\n  margin: var(--spacing-small) !important;\n}\n.mMedium_ffb9476214 {\n  margin: var(--spacing-medium) !important;\n}\n.mLarge_3681ceb198 {\n  margin: var(--spacing-large) !important;\n}\n.mXl_414ee760b2 {\n  margin: var(--spacing-xl) !important;\n}\n.mXxl_b2684d6ab5 {\n  margin: var(--spacing-xxl) !important;\n}\n.mXxxl_8c2dacf32d {\n  margin: var(--spacing-xxxl) !important;\n}\n.mAuto_86ca997bfc {\n  margin: auto !important;\n}\n.mx0_6e179b0cbc {\n  margin-right: 0 !important;\n  margin-left: 0 !important;\n}\n.mxXs_dd41ba9fcc {\n  margin-right: var(--spacing-xs) !important;\n  margin-left: var(--spacing-xs) !important;\n}\n.mxSmall_c66da1b738 {\n  margin-right: var(--spacing-small) !important;\n  margin-left: var(--spacing-small) !important;\n}\n.mxMedium_0e8e6656cc {\n  margin-right: var(--spacing-medium) !important;\n  margin-left: var(--spacing-medium) !important;\n}\n.mxLarge_adf4749930 {\n  margin-right: var(--spacing-large) !important;\n  margin-left: var(--spacing-large) !important;\n}\n.mxXl_0416c111d5 {\n  margin-right: var(--spacing-xl) !important;\n  margin-left: var(--spacing-xl) !important;\n}\n.mxXxl_8ae39da0d5 {\n  margin-right: var(--spacing-xxl) !important;\n  margin-left: var(--spacing-xxl) !important;\n}\n.mxXxxl_6f884aa50c {\n  margin-right: var(--spacing-xxxl) !important;\n  margin-left: var(--spacing-xxxl) !important;\n}\n.mxAuto_582ae9eec2 {\n  margin-right: auto !important;\n  margin-left: auto !important;\n}\n.my0_f618fa75a8 {\n  margin-top: 0 !important;\n  margin-bottom: 0 !important;\n}\n.myXs_fd845e1e9f {\n  margin-top: var(--spacing-xs) !important;\n  margin-bottom: var(--spacing-xs) !important;\n}\n.mySmall_279708e5ac {\n  margin-top: var(--spacing-small) !important;\n  margin-bottom: var(--spacing-small) !important;\n}\n.myMedium_0b32076c87 {\n  margin-top: var(--spacing-medium) !important;\n  margin-bottom: var(--spacing-medium) !important;\n}\n.myLarge_c60e1096d1 {\n  margin-top: var(--spacing-large) !important;\n  margin-bottom: var(--spacing-large) !important;\n}\n.myXl_feaff87eae {\n  margin-top: var(--spacing-xl) !important;\n  margin-bottom: var(--spacing-xl) !important;\n}\n.myXxl_66442c0c16 {\n  margin-top: var(--spacing-xxl) !important;\n  margin-bottom: var(--spacing-xxl) !important;\n}\n.myXxxl_914c439930 {\n  margin-top: var(--spacing-xxxl) !important;\n  margin-bottom: var(--spacing-xxxl) !important;\n}\n.myAuto_f6f66fa178 {\n  margin-top: auto !important;\n  margin-bottom: auto !important;\n}\n.mt0_13bd701490 {\n  margin-top: 0 !important;\n}\n.mtXs_e57cd96af9 {\n  margin-top: var(--spacing-xs) !important;\n}\n.mtSmall_952b87ba87 {\n  margin-top: var(--spacing-small) !important;\n}\n.mtMedium_2b2b11e81d {\n  margin-top: var(--spacing-medium) !important;\n}\n.mtLarge_846b88082a {\n  margin-top: var(--spacing-large) !important;\n}\n.mtXl_01573aad37 {\n  margin-top: var(--spacing-xl) !important;\n}\n.mtXxl_89233c90c2 {\n  margin-top: var(--spacing-xxl) !important;\n}\n.mtXxxl_058d9e52b2 {\n  margin-top: var(--spacing-xxxl) !important;\n}\n.mtAuto_4ac1aa0047 {\n  margin-top: auto !important;\n}\n.me0_7c17108076 {\n  margin-inline-end: 0 !important;\n}\n.meXs_7866177b85 {\n  margin-inline-end: var(--spacing-xs) !important;\n}\n.meSmall_86047e2bf6 {\n  margin-inline-end: var(--spacing-small) !important;\n}\n.meMedium_8f5bf0daf0 {\n  margin-inline-end: var(--spacing-medium) !important;\n}\n.meLarge_95e38b7406 {\n  margin-inline-end: var(--spacing-large) !important;\n}\n.meXl_2cdeb0e144 {\n  margin-inline-end: var(--spacing-xl) !important;\n}\n.meXxl_95dc4d75de {\n  margin-inline-end: var(--spacing-xxl) !important;\n}\n.meXxxl_f8227c19b3 {\n  margin-inline-end: var(--spacing-xxxl) !important;\n}\n.meAuto_f612d39dcf {\n  margin-inline-end: auto !important;\n}\n.mb0_e9af348030 {\n  margin-bottom: 0 !important;\n}\n.mbXs_ec5e540fe7 {\n  margin-bottom: var(--spacing-xs) !important;\n}\n.mbSmall_0c841b204d {\n  margin-bottom: var(--spacing-small) !important;\n}\n.mbMedium_affafe5cf6 {\n  margin-bottom: var(--spacing-medium) !important;\n}\n.mbLarge_4ad21db804 {\n  margin-bottom: var(--spacing-large) !important;\n}\n.mbXl_a4b6c7429c {\n  margin-bottom: var(--spacing-xl) !important;\n}\n.mbXxl_74587cab6b {\n  margin-bottom: var(--spacing-xxl) !important;\n}\n.mbXxxl_bacdd6d950 {\n  margin-bottom: var(--spacing-xxxl) !important;\n}\n.mbAuto_d60cbbd7af {\n  margin-bottom: auto !important;\n}\n.ms0_a017cd17f3 {\n  margin-inline-start: 0 !important;\n}\n.msXs_d78796e819 {\n  margin-inline-start: var(--spacing-xs) !important;\n}\n.msSmall_880adb107f {\n  margin-inline-start: var(--spacing-small) !important;\n}\n.msMedium_f9228a402c {\n  margin-inline-start: var(--spacing-medium) !important;\n}\n.msLarge_20a1071f7e {\n  margin-inline-start: var(--spacing-large) !important;\n}\n.msXl_97645f0138 {\n  margin-inline-start: var(--spacing-xl) !important;\n}\n.msXxl_db74279573 {\n  margin-inline-start: var(--spacing-xxl) !important;\n}\n.msXxxl_638946457c {\n  margin-inline-start: var(--spacing-xxxl) !important;\n}\n.msAuto_720a93406e {\n  margin-inline-start: auto !important;\n}\n.p0_5daec8deb8 {\n  padding: 0 !important;\n}\n.pXs_4d1bbbd5af {\n  padding: var(--spacing-xs) !important;\n}\n.pSmall_b66e733d3b {\n  padding: var(--spacing-small) !important;\n}\n.pMedium_11c054edab {\n  padding: var(--spacing-medium) !important;\n}\n.pLarge_62422a3a00 {\n  padding: var(--spacing-large) !important;\n}\n.pXl_09add77ead {\n  padding: var(--spacing-xl) !important;\n}\n.pXxl_ee1c1eae53 {\n  padding: var(--spacing-xxl) !important;\n}\n.pXxxl_29e1140a6f {\n  padding: var(--spacing-xxxl) !important;\n}\n.px0_cbe7de1165 {\n  padding-right: 0 !important;\n  padding-left: 0 !important;\n}\n.pxXs_18994a34ad {\n  padding-right: var(--spacing-xs) !important;\n  padding-left: var(--spacing-xs) !important;\n}\n.pxSmall_7ad9a2454c {\n  padding-right: var(--spacing-small) !important;\n  padding-left: var(--spacing-small) !important;\n}\n.pxMedium_ec707d5e6a {\n  padding-right: var(--spacing-medium) !important;\n  padding-left: var(--spacing-medium) !important;\n}\n.pxLarge_85cac361fc {\n  padding-right: var(--spacing-large) !important;\n  padding-left: var(--spacing-large) !important;\n}\n.pxXl_b96111d3c9 {\n  padding-right: var(--spacing-xl) !important;\n  padding-left: var(--spacing-xl) !important;\n}\n.pxXxl_8aea6ae116 {\n  padding-right: var(--spacing-xxl) !important;\n  padding-left: var(--spacing-xxl) !important;\n}\n.pxXxxl_77bf1e79fe {\n  padding-right: var(--spacing-xxxl) !important;\n  padding-left: var(--spacing-xxxl) !important;\n}\n.py0_44c2432016 {\n  padding-top: 0 !important;\n  padding-bottom: 0 !important;\n}\n.pyXs_43db004bf2 {\n  padding-top: var(--spacing-xs) !important;\n  padding-bottom: var(--spacing-xs) !important;\n}\n.pySmall_46009de5b4 {\n  padding-top: var(--spacing-small) !important;\n  padding-bottom: var(--spacing-small) !important;\n}\n.pyMedium_8b2a19344e {\n  padding-top: var(--spacing-medium) !important;\n  padding-bottom: var(--spacing-medium) !important;\n}\n.pyLarge_5e2f42dea9 {\n  padding-top: var(--spacing-large) !important;\n  padding-bottom: var(--spacing-large) !important;\n}\n.pyXl_17610dc727 {\n  padding-top: var(--spacing-xl) !important;\n  padding-bottom: var(--spacing-xl) !important;\n}\n.pyXxl_62c0d96a31 {\n  padding-top: var(--spacing-xxl) !important;\n  padding-bottom: var(--spacing-xxl) !important;\n}\n.pyXxxl_87fce9fcc7 {\n  padding-top: var(--spacing-xxxl) !important;\n  padding-bottom: var(--spacing-xxxl) !important;\n}\n.pt0_e326b805c8 {\n  padding-top: 0 !important;\n}\n.ptXs_e52aeb7116 {\n  padding-top: var(--spacing-xs) !important;\n}\n.ptSmall_03b1601b2a {\n  padding-top: var(--spacing-small) !important;\n}\n.ptMedium_2c4a02bee1 {\n  padding-top: var(--spacing-medium) !important;\n}\n.ptLarge_48d9159008 {\n  padding-top: var(--spacing-large) !important;\n}\n.ptXl_ac037cf1e6 {\n  padding-top: var(--spacing-xl) !important;\n}\n.ptXxl_4a323fa083 {\n  padding-top: var(--spacing-xxl) !important;\n}\n.ptXxxl_2b2afe9ba6 {\n  padding-top: var(--spacing-xxxl) !important;\n}\n.pe0_f72ebf0e3e {\n  padding-inline-end: 0 !important;\n}\n.peXs_72e00349ff {\n  padding-inline-end: var(--spacing-xs) !important;\n}\n.peSmall_c25371ef80 {\n  padding-inline-end: var(--spacing-small) !important;\n}\n.peMedium_7fc50d0b93 {\n  padding-inline-end: var(--spacing-medium) !important;\n}\n.peLarge_60bf6d2eaf {\n  padding-inline-end: var(--spacing-large) !important;\n}\n.peXl_8d78ddad17 {\n  padding-inline-end: var(--spacing-xl) !important;\n}\n.peXxl_e1c3405638 {\n  padding-inline-end: var(--spacing-xxl) !important;\n}\n.peXxxl_0a338493fc {\n  padding-inline-end: var(--spacing-xxxl) !important;\n}\n.pb0_0ab384e210 {\n  padding-bottom: 0 !important;\n}\n.pbXs_ee30037664 {\n  padding-bottom: var(--spacing-xs) !important;\n}\n.pbSmall_533275ef9d {\n  padding-bottom: var(--spacing-small) !important;\n}\n.pbMedium_0e578f4f08 {\n  padding-bottom: var(--spacing-medium) !important;\n}\n.pbLarge_1dfdbf31f7 {\n  padding-bottom: var(--spacing-large) !important;\n}\n.pbXl_683e3a11a8 {\n  padding-bottom: var(--spacing-xl) !important;\n}\n.pbXxl_53a110afe4 {\n  padding-bottom: var(--spacing-xxl) !important;\n}\n.pbXxxl_7d42d0f0f3 {\n  padding-bottom: var(--spacing-xxxl) !important;\n}\n.ps0_ef31964959 {\n  padding-inline-start: 0 !important;\n}\n.psXs_e294c25c61 {\n  padding-inline-start: var(--spacing-xs) !important;\n}\n.psSmall_9f6b72d745 {\n  padding-inline-start: var(--spacing-small) !important;\n}\n.psMedium_9b5c913b8b {\n  padding-inline-start: var(--spacing-medium) !important;\n}\n.psLarge_3581f92292 {\n  padding-inline-start: var(--spacing-large) !important;\n}\n.psXl_56b141f931 {\n  padding-inline-start: var(--spacing-xl) !important;\n}\n.psXxl_544f054039 {\n  padding-inline-start: var(--spacing-xxl) !important;\n}\n.psXxxl_e2452fdbb0 {\n  padding-inline-start: var(--spacing-xxxl) !important;\n}\n.textPrimaryTextColor_9c23c740fa {\n  color: var(--primary-text-color) !important;\n}\n.textTextColorOnInverted_afc0234fdc {\n  color: var(--text-color-on-inverted) !important;\n}\n.textSecondaryTextColor_20e1620e6a {\n  color: var(--secondary-text-color) !important;\n}\n.bgPrimaryBackgroundColor_7684ffe4da {\n  background-color: var(--primary-background-color) !important;\n}\n.bgSecondaryBackgroundColor_cd47fcd5ef {\n  background-color: var(--secondary-background-color) !important;\n}\n.bgGreyBackgroundColor_083757a874 {\n  background-color: var(--grey-background-color) !important;\n}\n.bgAllgreyBackgroundColor_2d4007f86a {\n  background-color: var(--allgrey-background-color) !important;\n}\n.bgInvertedColorBackground_61f2444a1e {\n  background-color: var(--inverted-color-background) !important;\n}");export{n as default};
 //# sourceMappingURL=Box.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={breadcrumbContent:"breadcrumbContent_1b97630d81",withoutText:"withoutText_9570a21b98",breadcrumbText:"breadcrumbText_877b072163",breadcrumbIcon:"breadcrumbIcon_de19615d09",clickable:"clickable_afb705e132",current:"current_a7396ca361",disabled:"disabled_a1c8c1bcfe",notClickable:"notClickable_ded5139b0c"};!function(e){const n="s_id-55ff70da99a4_3_37_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)}(".breadcrumbContent_1b97630d81 {\n  font: var(--font-text2-normal);\n  color: var(--secondary-text-color);\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 2px;\n  overflow: hidden;\n  text-decoration: none;\n}\n.breadcrumbContent_1b97630d81.withoutText_9570a21b98 {\n  padding: 4px;\n}\na.breadcrumbContent_1b97630d81:hover {\n  color: var(--secondary-text-color);\n  text-decoration: none;\n}\n.breadcrumbContent_1b97630d81 .breadcrumbText_877b072163 {\n  color: inherit;\n  margin: 0 4px;\n  line-height: 22px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.breadcrumbContent_1b97630d81 .breadcrumbIcon_de19615d09 {\n  height: 14px;\n  width: 14px;\n  flex-shrink: 0;\n}\n.breadcrumbContent_1b97630d81:focus {\n  outline: none;\n}\n.breadcrumbContent_1b97630d81.clickable_afb705e132 {\n  cursor: pointer;\n}\n.breadcrumbContent_1b97630d81.clickable_afb705e132:hover,\n.breadcrumbContent_1b97630d81:focus-within {\n  background-color: var(--primary-background-hover-color);\n  border-radius: 4px;\n}\n.breadcrumbContent_1b97630d81.current_a7396ca361 {\n  color: var(--primary-text-color);\n  font-weight: 500;\n}\n.breadcrumbContent_1b97630d81.disabled_a1c8c1bcfe {\n  border-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.breadcrumbContent_1b97630d81.disabled_a1c8c1bcfe:hover {\n  background-color: transparent;\n}\n.breadcrumbContent_1b97630d81.notClickable_ded5139b0c {\n  pointer-events: none;\n}");export{e as default};
+var e={breadcrumbContent:"breadcrumbContent_675166fac6",withoutText:"withoutText_9f004486b5",breadcrumbText:"breadcrumbText_8ae3a7eb96",breadcrumbIcon:"breadcrumbIcon_a87c6ab3de",clickable:"clickable_3da218a51a",current:"current_2c383bd0a8",disabled:"disabled_0d42b042b2",notClickable:"notClickable_534f3198d7"};!function(e){const n="s_id-55ff70da99a4_3_38_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)}(".breadcrumbContent_675166fac6 {\n  font: var(--font-text2-normal);\n  color: var(--secondary-text-color);\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 2px;\n  overflow: hidden;\n  text-decoration: none;\n}\n.breadcrumbContent_675166fac6.withoutText_9f004486b5 {\n  padding: 4px;\n}\na.breadcrumbContent_675166fac6:hover {\n  color: var(--secondary-text-color);\n  text-decoration: none;\n}\n.breadcrumbContent_675166fac6 .breadcrumbText_8ae3a7eb96 {\n  color: inherit;\n  margin: 0 4px;\n  line-height: 22px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.breadcrumbContent_675166fac6 .breadcrumbIcon_a87c6ab3de {\n  height: 14px;\n  width: 14px;\n  flex-shrink: 0;\n}\n.breadcrumbContent_675166fac6:focus {\n  outline: none;\n}\n.breadcrumbContent_675166fac6.clickable_3da218a51a {\n  cursor: pointer;\n}\n.breadcrumbContent_675166fac6.clickable_3da218a51a:hover,\n.breadcrumbContent_675166fac6:focus-within {\n  background-color: var(--primary-background-hover-color);\n  border-radius: 4px;\n}\n.breadcrumbContent_675166fac6.current_2c383bd0a8 {\n  color: var(--primary-text-color);\n  font-weight: 500;\n}\n.breadcrumbContent_675166fac6.disabled_0d42b042b2 {\n  border-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.breadcrumbContent_675166fac6.disabled_0d42b042b2:hover {\n  background-color: transparent;\n}\n.breadcrumbContent_675166fac6.notClickable_534f3198d7 {\n  pointer-events: none;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbContent.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={breadcrumbItemWrapper:"breadcrumbItemWrapper_59b6c9df02",disabled:"disabled_dd048e5684"};!function(e){const d="s_id-03f482333e23_3_37_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_59b6c9df02 {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}\n\n.breadcrumbItemWrapper_59b6c9df02.disabled_dd048e5684 {\n  cursor: not-allowed;\n}");export{e as default};
+var e={breadcrumbItemWrapper:"breadcrumbItemWrapper_41525cfc85",disabled:"disabled_b3796015e1"};!function(e){const t="s_id-03f482333e23_3_38_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".breadcrumbItemWrapper_41525cfc85 {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}\n\n.breadcrumbItemWrapper_41525cfc85.disabled_b3796015e1 {\n  cursor: not-allowed;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbItem.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{withStaticProps 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"classnames";import e from"react";import{getTestId as r,ComponentDefaultTestId as a}from"../../tests/testIds.js";import{BreadcrumbsBarType as s}from"./BreadcrumbsConstants.js";import{withStaticProps 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 e.createElement("nav",{"aria-label":"Breadcrumb",className:t(o.breadcrumbsBar,s.className),id:c,"data-testid":d||r(a.BREADCRUMBS_BAR,c)},e.createElement("ol",null,i&&e.Children.map(i,(function(t,r){return e.isValidElement(t)?[r>0&&e.createElement(n,{className:o.separatorIcon,size:"14","aria-hidden":"true"}),e.cloneElement(t,Object.assign(Object.assign({},null==t?void 0:t.props),{isClickable:"indication"!==l}))]:null}))))}),{types:s});export{m 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,~~ ~~{ 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 { BreadcrumbsBarType } from \"./Breadcrumbs.types\";\nimport { BreadcrumbItemProps } from \"./BreadcrumbItem/BreadcrumbItem\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./BreadcrumbsBar.module.scss\";\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: ReactElement<BreadcrumbItemProps> \| ReactElement<BreadcrumbItemProps>[];\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 withStaticProps~~<BreadcrumbBarProps, BreadcrumbsBarStaticProps>~~(BreadcrumbsBar, {\n types: BreadcrumbsBarTypeEnum\n});\n"],"names":["withStaticProps","_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":"uZAqBA,~~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,~~GAOsF~~,~~CAC5FyB~~,MAAOC"}
1	+ {"version":3,"file":"BreadcrumbsBar.js","sources":["../../../../src/components/BreadcrumbsBar/BreadcrumbsBar.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { FC, ReactElement } from \"react\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { NavigationChevronRight } from \"@vibe/icons\";\nimport { BreadcrumbsBarType as BreadcrumbsBarTypeEnum } from \"./BreadcrumbsConstants\";\nimport { BreadcrumbsBarType } from \"./Breadcrumbs.types\";\nimport { BreadcrumbItemProps } from \"./BreadcrumbItem/BreadcrumbItem\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./BreadcrumbsBar.module.scss\";\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: ReactElement<BreadcrumbItemProps> \| ReactElement<BreadcrumbItemProps>[];\n}\n\nconst BreadcrumbsBar: FC<BreadcrumbBarProps> & { types?: typeof BreadcrumbsBarTypeEnum } = ({\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\nexport default withStaticProps(BreadcrumbsBar, {\n types: BreadcrumbsBarTypeEnum\n});\n"],"names":["withStaticProps","_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":"uZAqBA,IA8BeA,EAAAA,GA9B4E,SAAvEC,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,GAGuC,CAC7CyB,MAAOC"}

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

@@ -1,2 +1,2 @@
-var e={breadcrumbsBar:"breadcrumbsBar_48e4074bb0",separatorIcon:"separatorIcon_b1c6c743fc"};!function(e){const n="s_id-24567fd55d40_3_37_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_48e4074bb0 ol {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  white-space: nowrap;\n}\n\n.breadcrumbsBar_48e4074bb0 ol .separatorIcon_b1c6c743fc {\n  color: var(--secondary-text-color);\n  flex-shrink: 0;\n}");export{e as default};
+var e={breadcrumbsBar:"breadcrumbsBar_8c5ba1432a",separatorIcon:"separatorIcon_846718eff7"};!function(e){const a="s_id-24567fd55d40_3_38_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+a))return;const r=document.createElement("style");r.id=a,n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".breadcrumbsBar_8c5ba1432a ol {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  white-space: nowrap;\n}\n\n.breadcrumbsBar_8c5ba1432a ol .separatorIcon_846718eff7 {\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.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type /\nimport React, { AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { SIZES } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport Icon from \"../../components/Icon/Icon\";\nimport Loader from \"../../components/Loader/Loader\";\nimport {\n BUTTON_ICON_SIZE,\n ButtonColor as ButtonColorEnum,\n ButtonInputType as ButtonInputTypeEnum,\n ButtonType as ButtonTypeEnum,\n SMALL_BUTTON_ICON_SIZE\n} from \"./ButtonConstants\";\nimport { ButtonColor, ButtonInputType, ButtonType, ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { SubIcon, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n children: React.ReactNode;\n /* Custom class names to pass to the component /\n className?: string;\n activeButtonClassName?: string;\n /* The button's kind /\n kind?: ButtonType;\n /* Callback function to run when the button is clicked /\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /* Blur on button click /\n blurOnMouseUp?: boolean;\n /* Name of the button - for form submit usages /\n name?: string;\n /* The button's size /\n size?: ButtonSize;\n /* The button's color /\n color?: ButtonColor;\n /* The button's type /\n type?: ButtonInputType;\n /* Whether the button should be disabled or not /\n disabled?: boolean;\n /* Icon to place on the right /\n rightIcon?: SubIcon;\n /* Icon to place on the left /\n leftIcon?: SubIcon;\n /* the success props are used when you have async action and wants to display a success message /\n success?: boolean;\n /* Success icon name /\n successIcon?: SubIcon;\n /* Success text /\n successText?: string;\n /* loading boolean which switches the text to a loader /\n loading?: boolean;\n /* className which is applied to loader container /\n loaderClassName?: string;\n style?: React.CSSProperties;\n / displays the active state /\n active?: boolean;\n /* id to pass to the button /\n id?: string;\n /* adds 8px margin to the right /\n marginRight?: boolean;\n /* adds 8px margin to the left /\n marginLeft?: boolean;\n /* element id to describe the button accordingly /\n ariaLabeledBy?: string;\n /* aria label to provide important when providing only Icon /\n ariaLabel?: string;\n /* aria for a button popup /\n ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n /* aria to be set if the popup is open /\n ariaExpanded?: boolean;\n /* aria controls - receives id for the controlled region /\n ariaControls?: string;\n \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n /\n aria to be used for screen reader to know if the button is hidden\n /\n \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n /\n Indicates the current \"pressed\" state of toggle buttons\n /\n \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n /* On Button Focus callback /\n onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n /* On Button Blur callback /\n onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n rightFlat?: boolean;\n leftFlat?: boolean;\n preventClickAnimation?: boolean;\n noSidePadding?: boolean;\n /* default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) /\n defaultTextColorOnPrimaryColor?: string;\n \"data-testid\"?: string;\n /* Change the focus indicator from around the button to within it /\n insetFocus?: boolean;\n /* Specifies the tab order of an element */\n tabIndex?: number;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n children,\n kind,\n onClick,\n name,\n size,\n color,\n disabled,\n rightIcon,\n leftIcon,\n success,\n successText,\n successIcon,\n style,\n loading: isLoading,\n loaderClassName,\n active,\n activeButtonClassName,\n id,\n marginRight,\n marginLeft,\n type,\n onMouseDown,\n ariaLabel,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n onFocus,\n onBlur,\n ariaLabeledBy,\n defaultTextColorOnPrimaryColor,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed,\n blurOnMouseUp,\n \"data-testid\": dataTestId,\n insetFocus,\n tabIndex\n }: ButtonProps,\n ref\n ) => {\n const buttonRef = useRef<HTMLButtonElement>(null);\n const mergedRef = useMergeRef(ref, buttonRef);\n\n const { loading } = useButtonLoading({ isLoading });\n\n useEffect(() => {\n if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n if (kind !== \"primary\") return;\n if (!buttonRef.current) return;\n\n const buttonElement = buttonRef.current;\n buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n const onMouseUp = useCallback(() => {\n const button = buttonRef.current;\n if (disabled \|\| !button) {\n return;\n }\n if (blurOnMouseUp) {\n button.blur();\n }\n }, [disabled, buttonRef, blurOnMouseUp]);\n\n const onButtonClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled \|\| loading \|\| success) {\n event.preventDefault();\n return;\n }\n\n if (onClick) {\n onClick(event);\n }\n },\n [onClick, disabled, loading, success]\n );\n\n const onMouseDownClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled \|\| loading \|\| success) {\n event.preventDefault();\n return;\n }\n\n if (onMouseDown) {\n onMouseDown(event);\n }\n },\n [onMouseDown, disabled, loading, success]\n );\n\n const classNames = useMemo(() => {\n const calculatedColor = success ? \"positive\" : color;\n return cx(\n className,\n styles.button,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n {\n [styles.success]: success,\n [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n [activeButtonClassName]: active,\n [styles.marginRight]: marginRight,\n [styles.marginLeft]: marginLeft,\n [styles.rightFlat]: rightFlat,\n [styles.leftFlat]: leftFlat,\n [styles.preventClickAnimation]: preventClickAnimation,\n [styles.noSidePadding]: noSidePadding,\n [styles.disabled]: disabled,\n [styles.insetFocusStyle]: insetFocus\n }\n );\n }, [\n success,\n color,\n className,\n size,\n kind,\n active,\n activeButtonClassName,\n marginRight,\n marginLeft,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n disabled,\n insetFocus\n ]);\n\n const buttonProps = useMemo(() => {\n const props: Record<string, unknown> = {\n ref: mergedRef,\n type,\n className: classNames,\n name,\n onMouseUp,\n style,\n onClick: onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex: disabled \|\| ariaHidden ? -1 : tabIndex,\n \"data-testid\": dataTestId \|\| getTestId(ComponentDefaultTestId.BUTTON, id),\n \"data-vibe\": ComponentVibeId.BUTTON,\n onMouseDown: onMouseDownClicked,\n \"aria-disabled\": disabled,\n \"aria-busy\": loading,\n \"aria-labelledby\": ariaLabeledBy,\n \"aria-label\": ariaLabel,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-expanded\": ariaExpanded,\n \"aria-controls\": ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed\n };\n return props;\n }, [\n mergedRef,\n type,\n classNames,\n name,\n onMouseUp,\n style,\n onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex,\n dataTestId,\n onMouseDownClicked,\n disabled,\n loading,\n ariaLabeledBy,\n ariaLabel,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n ariaDescribedBy,\n ariaHidden,\n ariaPressed\n ]);\n\n const iconSize = useCallback(\n (icon: SubIcon) => {\n if (typeof icon !== \"function\") return;\n switch (size) {\n case \"xxs\":\n case \"xs\":\n return SMALL_BUTTON_ICON_SIZE;\n default:\n return BUTTON_ICON_SIZE;\n }\n },\n [size]\n );\n\n const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n const buttonContent = useMemo(\n () => (\n <>\n {leftIcon ? (\n <Icon\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize(leftIcon)}\n className={cx({\n [styles.leftIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n {children}\n {rightIcon ? (\n <Icon\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize(rightIcon)}\n className={cx({\n [styles.rightIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n </>\n ),\n [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n );\n\n if (loading) {\n return (\n <button {...buttonProps} key={`${id}-loading`}>\n <span className={cx(styles.loader, loaderClassName)}>\n <Loader className={styles.loaderSvg} />\n <span aria-hidden className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </span>\n </button>\n );\n }\n\n if (success) {\n return (\n <button {...buttonProps} key={`${id}-success`}>\n <span className={styles.successContent}>\n {successIcon ? (\n <Icon\n iconType=\"font\"\n icon={successIcon}\n iconSize={iconSize(successIcon)}\n className={cx({\n [styles.leftIcon]: !!successText\n })}\n ignoreFocusStyle\n />\n ) : null}\n {successText}\n </span>\n <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </button>\n );\n }\n\n return (\n <button {...buttonProps} key={`${id}-button`}>\n {buttonContent}\n </button>\n );\n }\n);\n\nButton.defaultProps = {\n name: undefined,\n style: undefined,\n kind: \"primary\",\n onClick: NOOP,\n size: \"medium\",\n color: \"primary\",\n disabled: false,\n rightIcon: null,\n leftIcon: null,\n success: false,\n successText: \"\",\n successIcon: null,\n loading: false,\n loaderClassName: undefined,\n active: false,\n marginRight: false,\n marginLeft: false,\n type: \"button\",\n onMouseDown: NOOP,\n rightFlat: false,\n leftFlat: false,\n preventClickAnimation: false,\n noSidePadding: false,\n onFocus: NOOP,\n onBlur: NOOP,\n defaultTextColorOnPrimaryColor: TRANSPARENT_COLOR,\n ariaHasPopup: undefined,\n blurOnMouseUp: true,\n ariaExpanded: undefined,\n ariaControls: undefined,\n ariaLabel: undefined,\n ariaLabeledBy: undefined,\n insetFocus: false\n};\n\ninterface ButtonStaticProps {\n sizes: typeof SIZES;\n colors: typeof ButtonColorEnum;\n kinds: typeof ButtonTypeEnum;\n types: typeof ButtonInputTypeEnum;\n inputTags: typeof ButtonInputTypeEnum;\n}\n\nexport default withStaticProps<ButtonProps, ButtonStaticProps>(Button, {\n sizes: SIZES,\n colors: ButtonColorEnum,\n kinds: ButtonTypeEnum,\n types: ButtonInputTypeEnum,\n inputTags: ButtonInputTypeEnum\n});\n"],"names":["Button","forwardRef","_ref","ref","className","children","kind","onClick","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","isLoading","loading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","ariaHasPopup","ariaExpanded","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","_cx","calculatedColor","cx","styles","getStyle","camelCase","_defineProperty","insetFocusStyle","buttonProps","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","SMALL_BUTTON_ICON_SIZE","BUTTON_ICON_SIZE","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","iconType","ignoreFocusStyle","key","concat","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign","defaultProps","undefined","NOOP","TRANSPARENT_COLOR","withStaticProps","sizes","SIZES","colors","ButtonColorEnum","kinds","ButtonTypeEnum","types","ButtonInputTypeEnum","inputTags"],"mappings":"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"}
1	+ {"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type /\nimport React, { AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { SIZES } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport Icon from \"../../components/Icon/Icon\";\nimport Loader from \"../../components/Loader/Loader\";\nimport {\n BUTTON_ICON_SIZE,\n ButtonColor as ButtonColorEnum,\n ButtonInputType as ButtonInputTypeEnum,\n ButtonType as ButtonTypeEnum,\n SMALL_BUTTON_ICON_SIZE\n} from \"./ButtonConstants\";\nimport { ButtonColor, ButtonInputType, ButtonType, ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n children: React.ReactNode;\n /* Custom class names to pass to the component /\n className?: string;\n activeButtonClassName?: string;\n /* The button's kind /\n kind?: ButtonType;\n /* Callback function to run when the button is clicked /\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /* Blur on button click /\n blurOnMouseUp?: boolean;\n /* Name of the button - for form submit usages /\n name?: string;\n /* The button's size /\n size?: ButtonSize;\n /* The button's color /\n color?: ButtonColor;\n /* The button's type /\n type?: ButtonInputType;\n /* Whether the button should be disabled or not /\n disabled?: boolean;\n /* Icon to place on the right /\n rightIcon?: SubIcon;\n /* Icon to place on the left /\n leftIcon?: SubIcon;\n /* the success props are used when you have async action and wants to display a success message /\n success?: boolean;\n /* Success icon name /\n successIcon?: SubIcon;\n /* Success text /\n successText?: string;\n /* loading boolean which switches the text to a loader /\n loading?: boolean;\n /* className which is applied to loader container /\n loaderClassName?: string;\n style?: React.CSSProperties;\n / displays the active state /\n active?: boolean;\n /* id to pass to the button /\n id?: string;\n /* adds 8px margin to the right /\n marginRight?: boolean;\n /* adds 8px margin to the left /\n marginLeft?: boolean;\n /* element id to describe the button accordingly /\n ariaLabeledBy?: string;\n /* aria label to provide important when providing only Icon /\n ariaLabel?: string;\n /* aria for a button popup /\n ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n /* aria to be set if the popup is open /\n ariaExpanded?: boolean;\n /* aria controls - receives id for the controlled region /\n ariaControls?: string;\n \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n /\n aria to be used for screen reader to know if the button is hidden\n /\n \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n /\n Indicates the current \"pressed\" state of toggle buttons\n /\n \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n /* On Button Focus callback /\n onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n /* On Button Blur callback /\n onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n rightFlat?: boolean;\n leftFlat?: boolean;\n preventClickAnimation?: boolean;\n noSidePadding?: boolean;\n /* default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) /\n defaultTextColorOnPrimaryColor?: string;\n \"data-testid\"?: string;\n /* Change the focus indicator from around the button to within it /\n insetFocus?: boolean;\n /* Specifies the tab order of an element */\n tabIndex?: number;\n}\n\nconst Button: VibeComponent<ButtonProps, unknown> & {\n sizes?: typeof SIZES;\n colors?: typeof ButtonColorEnum;\n kinds?: typeof ButtonTypeEnum;\n types?: typeof ButtonInputTypeEnum;\n inputTags?: typeof ButtonInputTypeEnum;\n} = forwardRef<unknown, ButtonProps>(\n (\n {\n className,\n children,\n kind,\n onClick,\n name,\n size,\n color,\n disabled,\n rightIcon,\n leftIcon,\n success,\n successText,\n successIcon,\n style,\n loading: isLoading,\n loaderClassName,\n active,\n activeButtonClassName,\n id,\n marginRight,\n marginLeft,\n type,\n onMouseDown,\n ariaLabel,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n onFocus,\n onBlur,\n ariaLabeledBy,\n defaultTextColorOnPrimaryColor,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed,\n blurOnMouseUp,\n \"data-testid\": dataTestId,\n insetFocus,\n tabIndex\n }: ButtonProps,\n ref\n ) => {\n const buttonRef = useRef<HTMLButtonElement>(null);\n const mergedRef = useMergeRef(ref, buttonRef);\n\n const { loading } = useButtonLoading({ isLoading });\n\n useEffect(() => {\n if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n if (kind !== \"primary\") return;\n if (!buttonRef.current) return;\n\n const buttonElement = buttonRef.current;\n buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n const onMouseUp = useCallback(() => {\n const button = buttonRef.current;\n if (disabled \|\| !button) {\n return;\n }\n if (blurOnMouseUp) {\n button.blur();\n }\n }, [disabled, buttonRef, blurOnMouseUp]);\n\n const onButtonClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled \|\| loading \|\| success) {\n event.preventDefault();\n return;\n }\n\n if (onClick) {\n onClick(event);\n }\n },\n [onClick, disabled, loading, success]\n );\n\n const onMouseDownClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled \|\| loading \|\| success) {\n event.preventDefault();\n return;\n }\n\n if (onMouseDown) {\n onMouseDown(event);\n }\n },\n [onMouseDown, disabled, loading, success]\n );\n\n const classNames = useMemo(() => {\n const calculatedColor = success ? \"positive\" : color;\n return cx(\n className,\n styles.button,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n {\n [styles.success]: success,\n [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n [activeButtonClassName]: active,\n [styles.marginRight]: marginRight,\n [styles.marginLeft]: marginLeft,\n [styles.rightFlat]: rightFlat,\n [styles.leftFlat]: leftFlat,\n [styles.preventClickAnimation]: preventClickAnimation,\n [styles.noSidePadding]: noSidePadding,\n [styles.disabled]: disabled,\n [styles.insetFocusStyle]: insetFocus\n }\n );\n }, [\n success,\n color,\n className,\n size,\n kind,\n active,\n activeButtonClassName,\n marginRight,\n marginLeft,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n disabled,\n insetFocus\n ]);\n\n const buttonProps = useMemo(() => {\n const props: Record<string, unknown> = {\n ref: mergedRef,\n type,\n className: classNames,\n name,\n onMouseUp,\n style,\n onClick: onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex: disabled \|\| ariaHidden ? -1 : tabIndex,\n \"data-testid\": dataTestId \|\| getTestId(ComponentDefaultTestId.BUTTON, id),\n \"data-vibe\": ComponentVibeId.BUTTON,\n onMouseDown: onMouseDownClicked,\n \"aria-disabled\": disabled,\n \"aria-busy\": loading,\n \"aria-labelledby\": ariaLabeledBy,\n \"aria-label\": ariaLabel,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-expanded\": ariaExpanded,\n \"aria-controls\": ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed\n };\n return props;\n }, [\n mergedRef,\n type,\n classNames,\n name,\n onMouseUp,\n style,\n onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex,\n dataTestId,\n onMouseDownClicked,\n disabled,\n loading,\n ariaLabeledBy,\n ariaLabel,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n ariaDescribedBy,\n ariaHidden,\n ariaPressed\n ]);\n\n const iconSize = useCallback(\n (icon: SubIcon) => {\n if (typeof icon !== \"function\") return;\n switch (size) {\n case \"xxs\":\n case \"xs\":\n return SMALL_BUTTON_ICON_SIZE;\n default:\n return BUTTON_ICON_SIZE;\n }\n },\n [size]\n );\n\n const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n const buttonContent = useMemo(\n () => (\n <>\n {leftIcon ? (\n <Icon\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize(leftIcon)}\n className={cx({\n [styles.leftIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n {children}\n {rightIcon ? (\n <Icon\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize(rightIcon)}\n className={cx({\n [styles.rightIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n </>\n ),\n [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n );\n\n if (loading) {\n return (\n <button {...buttonProps} key={`${id}-loading`}>\n <span className={cx(styles.loader, loaderClassName)}>\n <Loader className={styles.loaderSvg} />\n <span aria-hidden className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </span>\n </button>\n );\n }\n\n if (success) {\n return (\n <button {...buttonProps} key={`${id}-success`}>\n <span className={styles.successContent}>\n {successIcon ? (\n <Icon\n iconType=\"font\"\n icon={successIcon}\n iconSize={iconSize(successIcon)}\n className={cx({\n [styles.leftIcon]: !!successText\n })}\n ignoreFocusStyle\n />\n ) : null}\n {successText}\n </span>\n <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </button>\n );\n }\n\n return (\n <button {...buttonProps} key={`${id}-button`}>\n {buttonContent}\n </button>\n );\n }\n);\n\nButton.defaultProps = {\n name: undefined,\n style: undefined,\n kind: \"primary\",\n onClick: NOOP,\n size: \"medium\",\n color: \"primary\",\n disabled: false,\n rightIcon: null,\n leftIcon: null,\n success: false,\n successText: \"\",\n successIcon: null,\n loading: false,\n loaderClassName: undefined,\n active: false,\n marginRight: false,\n marginLeft: false,\n type: \"button\",\n onMouseDown: NOOP,\n rightFlat: false,\n leftFlat: false,\n preventClickAnimation: false,\n noSidePadding: false,\n onFocus: NOOP,\n onBlur: NOOP,\n defaultTextColorOnPrimaryColor: TRANSPARENT_COLOR,\n ariaHasPopup: undefined,\n blurOnMouseUp: true,\n ariaExpanded: undefined,\n ariaControls: undefined,\n ariaLabel: undefined,\n ariaLabeledBy: undefined,\n insetFocus: false\n};\n\nexport default withStaticProps(Button, {\n sizes: SIZES,\n colors: ButtonColorEnum,\n kinds: ButtonTypeEnum,\n types: ButtonInputTypeEnum,\n inputTags: ButtonInputTypeEnum\n});\n"],"names":["Button","forwardRef","_ref","ref","className","children","kind","onClick","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","isLoading","loading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","ariaHasPopup","ariaExpanded","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","_cx","calculatedColor","cx","styles","getStyle","camelCase","_defineProperty","insetFocusStyle","buttonProps","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","SMALL_BUTTON_ICON_SIZE","BUTTON_ICON_SIZE","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","iconType","ignoreFocusStyle","key","concat","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign","defaultProps","undefined","NOOP","TRANSPARENT_COLOR","withStaticProps","sizes","SIZES","colors","ButtonColorEnum","kinds","ButtonTypeEnum","types","ButtonInputTypeEnum","inputTags"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var o={button:"button_9bcfe9ce7f","focus-visible":"focus-visible_392b3754d5",loader:"loader_bd6d01be5c",loaderSvg:"loaderSvg_e5d0357303",textPlaceholder:"textPlaceholder_3d76f53e94",success:"success_6c53c6222c",successContent:"successContent_d72fab7d89",marginRight:"marginRight_1e596c1c28",marginLeft:"marginLeft_56391d8bc1",rightFlat:"rightFlat_41f0aa2836",leftFlat:"leftFlat_32bacc394f",preventClickAnimation:"preventClickAnimation_baa61bf9e2",leftIcon:"leftIcon_1e596c1c28",rightIcon:"rightIcon_56391d8bc1",sizeXxs:"sizeXxs_71387a4599",sizeXs:"sizeXs_cd884d8d5f",sizeSmall:"sizeSmall_85ad15e6db",sizeMedium:"sizeMedium_78a38bc654",sizeLarge:"sizeLarge_c1ac068dac",kindPrimary:"kindPrimary_6524ac10c7",colorPrimary:"colorPrimary_d09bbfb9c7",colorBrand:"colorBrand_3b42d17330",colorPrimaryActive:"colorPrimaryActive_0a55f3ea8b",colorBrandActive:"colorBrandActive_10a50936d8",colorPositive:"colorPositive_8e11bae80c",colorPositiveActive:"colorPositiveActive_dae84709b4",colorNegative:"colorNegative_9f6976b7ad",colorNegativeActive:"colorNegativeActive_dae84709b4",colorInverted:"colorInverted_21b46724e2",colorInvertedActive:"colorInvertedActive_dae84709b4",disabled:"disabled_8941cab4b8",colorOnPrimaryColor:"colorOnPrimaryColor_19d8986a49",colorOnPrimaryColorActive:"colorOnPrimaryColorActive_9282fd015e",colorFixedLight:"colorFixedLight_18ef7e29c6",colorFixedLightActive:"colorFixedLightActive_baa61bf9e2",colorFixedDark:"colorFixedDark_e436d7b4ca",colorFixedDarkActive:"colorFixedDarkActive_46eb871a31",colorOnInvertedBackground:"colorOnInvertedBackground_6a04a41e8f",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive_de28d4535f",kindSecondary:"kindSecondary_2ca0007779",kindTertiary:"kindTertiary_fd941223e4",noSidePadding:"noSidePadding_29dff8c479",insetFocusStyle:"insetFocusStyle_8883ad1816"};!function(o){const r="s_id-f5db469b1a79_3_37_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)}(".button_9bcfe9ce7f {\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_9bcfe9ce7f:focus-visible, .button_9bcfe9ce7f.focus-visible_392b3754d5 {\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_9bcfe9ce7f:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.button_9bcfe9ce7f .loader_bd6d01be5c {\n  height: 100%;\n}\n.button_9bcfe9ce7f .loader_bd6d01be5c .loaderSvg_e5d0357303 {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button_9bcfe9ce7f .textPlaceholder_3d76f53e94 {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button_9bcfe9ce7f.success_6c53c6222c {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button_9bcfe9ce7f.success_6c53c6222c .successContent_d72fab7d89 {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight_1e596c1c28 {\n  margin-right: var(--spacing-small);\n}\n.marginLeft_56391d8bc1 {\n  margin-left: var(--spacing-small);\n}\n.rightFlat_41f0aa2836 {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat_32bacc394f {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button_9bcfe9ce7f:active:not(.preventClickAnimation_baa61bf9e2) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button_9bcfe9ce7f .leftIcon_1e596c1c28 {\n  margin-right: var(--spacing-small);\n}\n.button_9bcfe9ce7f .rightIcon_56391d8bc1 {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs_71387a4599 {\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_cd884d8d5f {\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_85ad15e6db {\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_85ad15e6db .loader_bd6d01be5c {\n  top: 7px;\n}\n.sizeMedium_78a38bc654 {\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_c1ac068dac {\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_6524ac10c7 {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_6524ac10c7.colorPrimary_d09bbfb9c7 {\n  background: var(--primary-color);\n}\n.kindPrimary_6524ac10c7.colorBrand_3b42d17330 {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary_6524ac10c7.colorPrimaryActive_0a55f3ea8b,\n.kindPrimary_6524ac10c7.colorPrimary_d09bbfb9c7:hover,\n.kindPrimary_6524ac10c7.colorPrimary_d09bbfb9c7:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary_6524ac10c7.colorBrandActive_10a50936d8,\n.kindPrimary_6524ac10c7.colorBrand_3b42d17330:hover,\n.kindPrimary_6524ac10c7.colorBrand_3b42d17330:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary_6524ac10c7.colorPositive_8e11bae80c {\n  background: var(--positive-color);\n}\n.kindPrimary_6524ac10c7.colorPositiveActive_dae84709b4,\n.kindPrimary_6524ac10c7.colorPositive_8e11bae80c:hover,\n.kindPrimary_6524ac10c7.colorPositive_8e11bae80c:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary_6524ac10c7.colorNegative_9f6976b7ad {\n  background: var(--negative-color);\n}\n.kindPrimary_6524ac10c7.colorNegativeActive_dae84709b4,\n.kindPrimary_6524ac10c7.colorNegative_9f6976b7ad:hover,\n.kindPrimary_6524ac10c7.colorNegative_9f6976b7ad:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary_6524ac10c7.colorInverted_21b46724e2 {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary_6524ac10c7.colorInvertedActive_dae84709b4,\n.kindPrimary_6524ac10c7.colorInverted_21b46724e2:hover,\n.kindPrimary_6524ac10c7.colorInverted_21b46724e2:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary_6524ac10c7.button_9bcfe9ce7f.colorInverted_21b46724e2.disabled_8941cab4b8 {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49 {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary_6524ac10c7.colorOnPrimaryColorActive_9282fd015e,\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:hover,\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_6524ac10c7.colorOnPrimaryColorActive_9282fd015e:focus-visible, .kindPrimary_6524ac10c7.colorOnPrimaryColorActive_9282fd015e.focus-visible_392b3754d5,\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:hover:focus-visible,\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:hover.focus-visible_392b3754d5,\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:focus:focus-visible,\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:focus.focus-visible_392b3754d5 {\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_6524ac10c7.colorOnPrimaryColorActive_9282fd015e:focus:not(.focus-visible_392b3754d5),\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:hover:focus:not(.focus-visible_392b3754d5),\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindPrimary_6524ac10c7.colorOnPrimaryColor_19d8986a49.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6 {\n  background: var(--fixed-light-color);\n}\n.kindPrimary_6524ac10c7.colorFixedLightActive_baa61bf9e2,\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:hover,\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_6524ac10c7.colorFixedLightActive_baa61bf9e2:focus-visible, .kindPrimary_6524ac10c7.colorFixedLightActive_baa61bf9e2.focus-visible_392b3754d5,\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:hover:focus-visible,\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:hover.focus-visible_392b3754d5,\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:focus:focus-visible,\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:focus.focus-visible_392b3754d5 {\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_6524ac10c7.colorFixedLightActive_baa61bf9e2:focus:not(.focus-visible_392b3754d5),\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:hover:focus:not(.focus-visible_392b3754d5),\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindPrimary_6524ac10c7.colorFixedLight_18ef7e29c6.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary_6524ac10c7.colorFixedDarkActive_46eb871a31,\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:hover,\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:focus {\n  filter: brightness(125%);\n}\n.kindPrimary_6524ac10c7.colorFixedDarkActive_46eb871a31:focus-visible, .kindPrimary_6524ac10c7.colorFixedDarkActive_46eb871a31.focus-visible_392b3754d5,\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:hover:focus-visible,\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:hover.focus-visible_392b3754d5,\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:focus:focus-visible,\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:focus.focus-visible_392b3754d5 {\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_6524ac10c7.colorFixedDarkActive_46eb871a31:focus:not(.focus-visible_392b3754d5),\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:hover:focus:not(.focus-visible_392b3754d5),\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindPrimary_6524ac10c7.colorFixedDark_e436d7b4ca.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary_6524ac10c7.colorOnInvertedBackground_6a04a41e8f {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary_6524ac10c7.colorOnInvertedBackgroundActive_de28d4535f,\n.kindPrimary_6524ac10c7.colorOnInvertedBackground_6a04a41e8f:hover,\n.kindPrimary_6524ac10c7.colorOnInvertedBackground_6a04a41e8f:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary_6524ac10c7.button_9bcfe9ce7f.colorOnInvertedBackground_6a04a41e8f.disabled_8941cab4b8 {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary_6524ac10c7.button_9bcfe9ce7f.disabled_8941cab4b8 {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_2ca0007779 {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary_2ca0007779.sizeSmall_85ad15e6db {\n  line-height: 22px;\n}\n.kindSecondary_2ca0007779.sizeMedium_78a38bc654 {\n  line-height: 22px;\n}\n.kindSecondary_2ca0007779.sizeLarge_c1ac068dac {\n  line-height: 22px;\n}\n.kindSecondary_2ca0007779.colorPrimaryActive_0a55f3ea8b {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_2ca0007779.colorPrimaryActive_0a55f3ea8b:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_2ca0007779.colorBrandActive_10a50936d8 {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary_2ca0007779.colorBrandActive_10a50936d8,\n.kindSecondary_2ca0007779.colorBrandActive_10a50936d8:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary_2ca0007779.colorPrimary_d09bbfb9c7:hover:not(.colorPrimaryActive_0a55f3ea8b),\n.kindSecondary_2ca0007779.colorPrimary_d09bbfb9c7:focus:not(.colorPrimaryActive_0a55f3ea8b) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_2ca0007779.colorBrand_3b42d17330:hover:not(.colorBrandActive_10a50936d8),\n.kindSecondary_2ca0007779.colorBrand_3b42d17330:focus:not(.colorBrandActive_10a50936d8) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_2ca0007779.colorPositive_8e11bae80c {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary_2ca0007779.colorPositiveActive_dae84709b4,\n.kindSecondary_2ca0007779.colorPositive_8e11bae80c:hover,\n.kindSecondary_2ca0007779.colorPositive_8e11bae80c:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary_2ca0007779.colorNegative_9f6976b7ad {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary_2ca0007779.colorNegativeActive_dae84709b4,\n.kindSecondary_2ca0007779.colorNegative_9f6976b7ad:hover,\n.kindSecondary_2ca0007779.colorNegative_9f6976b7ad:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary_2ca0007779.colorInverted_21b46724e2 {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary_2ca0007779.colorInvertedActive_dae84709b4,\n.kindSecondary_2ca0007779.colorInverted_21b46724e2:hover,\n.kindSecondary_2ca0007779.colorInverted_21b46724e2:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_2ca0007779.colorInverted_21b46724e2.disabled_8941cab4b8 {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49 {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary_2ca0007779.colorOnPrimaryColorActive_9282fd015e,\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:hover,\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_2ca0007779.colorOnPrimaryColorActive_9282fd015e:focus-visible, .kindSecondary_2ca0007779.colorOnPrimaryColorActive_9282fd015e.focus-visible_392b3754d5,\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:hover:focus-visible,\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:hover.focus-visible_392b3754d5,\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:focus:focus-visible,\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:focus.focus-visible_392b3754d5 {\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_2ca0007779.colorOnPrimaryColorActive_9282fd015e:focus:not(.focus-visible_392b3754d5),\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:hover:focus:not(.focus-visible_392b3754d5),\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindSecondary_2ca0007779.colorOnPrimaryColor_19d8986a49.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6 {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary_2ca0007779.colorFixedLightActive_baa61bf9e2,\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:hover,\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_2ca0007779.colorFixedLightActive_baa61bf9e2:focus-visible, .kindSecondary_2ca0007779.colorFixedLightActive_baa61bf9e2.focus-visible_392b3754d5,\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:hover:focus-visible,\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:hover.focus-visible_392b3754d5,\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:focus:focus-visible,\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:focus.focus-visible_392b3754d5 {\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_2ca0007779.colorFixedLightActive_baa61bf9e2:focus:not(.focus-visible_392b3754d5),\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:hover:focus:not(.focus-visible_392b3754d5),\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_2ca0007779.colorFixedDarkActive_46eb871a31,\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:hover,\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary_2ca0007779.colorFixedDarkActive_46eb871a31:focus-visible, .kindSecondary_2ca0007779.colorFixedDarkActive_46eb871a31.focus-visible_392b3754d5,\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:hover:focus-visible,\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:hover.focus-visible_392b3754d5,\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:focus:focus-visible,\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:focus.focus-visible_392b3754d5 {\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_2ca0007779.colorFixedDarkActive_46eb871a31:focus:not(.focus-visible_392b3754d5),\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:hover:focus:not(.focus-visible_392b3754d5),\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindSecondary_2ca0007779.colorOnInvertedBackground_6a04a41e8f {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary_2ca0007779.colorOnInvertedBackgroundActive_de28d4535f,\n.kindSecondary_2ca0007779.colorOnInvertedBackground_6a04a41e8f:hover,\n.kindSecondary_2ca0007779.colorOnInvertedBackground_6a04a41e8f:focus {\n  background: var(--icon-color);\n}\n.kindSecondary_2ca0007779.colorOnInvertedBackground_6a04a41e8f.disabled_8941cab4b8 {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary_2ca0007779.colorFixedLight_18ef7e29c6.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary_2ca0007779.colorFixedDark_e436d7b4ca.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_2ca0007779.disabled_8941cab4b8 {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_2ca0007779.disabled_8941cab4b8:hover {\n  background-color: transparent;\n}\n.kindTertiary_fd941223e4 {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary_fd941223e4.colorPrimaryActive_0a55f3ea8b {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary_fd941223e4.colorPrimaryActive_0a55f3ea8b:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary_fd941223e4.colorBrandActive_10a50936d8 {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary_fd941223e4.colorBrandActive_10a50936d8,\n.kindTertiary_fd941223e4.colorBrandActive_10a50936d8:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary_fd941223e4.colorPrimary_d09bbfb9c7:hover:not(.colorPrimaryActive_0a55f3ea8b),\n.kindTertiary_fd941223e4.colorPrimary_d09bbfb9c7:focus:not(.colorPrimaryActive_0a55f3ea8b) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_fd941223e4.colorBrand_3b42d17330:hover:not(.colorBrandActive_10a50936d8),\n.kindTertiary_fd941223e4.colorBrand_3b42d17330:focus:not(.colorBrandActive_10a50936d8) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_fd941223e4.colorPositive_8e11bae80c {\n  color: var(--positive-color);\n}\n.kindTertiary_fd941223e4.colorPositiveActive_dae84709b4,\n.kindTertiary_fd941223e4.colorPositive_8e11bae80c:hover,\n.kindTertiary_fd941223e4.colorPositive_8e11bae80c:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary_fd941223e4.colorNegative_9f6976b7ad {\n  color: var(--negative-color);\n}\n.kindTertiary_fd941223e4.colorNegativeActive_dae84709b4,\n.kindTertiary_fd941223e4.colorNegative_9f6976b7ad:hover,\n.kindTertiary_fd941223e4.colorNegative_9f6976b7ad:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary_fd941223e4.colorInverted_21b46724e2 {\n  color: var(--primary-text-color);\n}\n.kindTertiary_fd941223e4.colorInvertedActive_dae84709b4,\n.kindTertiary_fd941223e4.colorInverted_21b46724e2:hover,\n.kindTertiary_fd941223e4.colorInverted_21b46724e2:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_fd941223e4.colorInverted_21b46724e2.disabled_8941cab4b8 {\n  color: var(--disabled-text-color);\n}\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49 {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_fd941223e4.colorOnPrimaryColorActive_9282fd015e,\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:hover,\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_fd941223e4.colorOnPrimaryColorActive_9282fd015e:focus-visible, .kindTertiary_fd941223e4.colorOnPrimaryColorActive_9282fd015e.focus-visible_392b3754d5,\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:hover:focus-visible,\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:hover.focus-visible_392b3754d5,\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:focus:focus-visible,\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:focus.focus-visible_392b3754d5 {\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_fd941223e4.colorOnPrimaryColorActive_9282fd015e:focus:not(.focus-visible_392b3754d5),\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:hover:focus:not(.focus-visible_392b3754d5),\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindTertiary_fd941223e4.colorOnPrimaryColor_19d8986a49.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6 {\n  color: var(--fixed-light-color);\n}\n.kindTertiary_fd941223e4.colorFixedLightActive_baa61bf9e2,\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:hover,\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_fd941223e4.colorFixedLightActive_baa61bf9e2:focus-visible, .kindTertiary_fd941223e4.colorFixedLightActive_baa61bf9e2.focus-visible_392b3754d5,\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:hover:focus-visible,\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:hover.focus-visible_392b3754d5,\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:focus:focus-visible,\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:focus.focus-visible_392b3754d5 {\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_fd941223e4.colorFixedLightActive_baa61bf9e2:focus:not(.focus-visible_392b3754d5),\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:hover:focus:not(.focus-visible_392b3754d5),\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindTertiary_fd941223e4.colorFixedLight_18ef7e29c6.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_fd941223e4.colorFixedDarkActive_46eb871a31,\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:hover,\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary_fd941223e4.colorFixedDarkActive_46eb871a31:focus-visible, .kindTertiary_fd941223e4.colorFixedDarkActive_46eb871a31.focus-visible_392b3754d5,\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:hover:focus-visible,\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:hover.focus-visible_392b3754d5,\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:focus:focus-visible,\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:focus.focus-visible_392b3754d5 {\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_fd941223e4.colorFixedDarkActive_46eb871a31:focus:not(.focus-visible_392b3754d5),\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:hover:focus:not(.focus-visible_392b3754d5),\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca:focus:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}\n.kindTertiary_fd941223e4.colorFixedDark_e436d7b4ca.disabled_8941cab4b8 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_fd941223e4.colorOnInvertedBackground_6a04a41e8f {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_fd941223e4.colorOnInvertedBackgroundActive_de28d4535f,\n.kindTertiary_fd941223e4.colorOnInvertedBackground_6a04a41e8f:hover,\n.kindTertiary_fd941223e4.colorOnInvertedBackground_6a04a41e8f:focus {\n  background: var(--icon-color);\n}\n.kindTertiary_fd941223e4.colorOnInvertedBackground_6a04a41e8f.disabled_8941cab4b8 {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_fd941223e4.disabled_8941cab4b8 {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary_fd941223e4.disabled_8941cab4b8:hover {\n  background-color: transparent;\n}\n.noSidePadding_29dff8c479 {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button_9bcfe9ce7f.insetFocusStyle_8883ad1816:focus-visible, .button_9bcfe9ce7f.insetFocusStyle_8883ad1816.focus-visible_392b3754d5 {\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_9bcfe9ce7f.insetFocusStyle_8883ad1816:focus:not(.focus-visible_392b3754d5) {\n  outline: none;\n}");export{o as default};
+var o={button:"button_8fae311a00","focus-visible":"focus-visible_5af66d1166",loader:"loader_5a7632c081",loaderSvg:"loaderSvg_496cd953ed",textPlaceholder:"textPlaceholder_96ac61374d",success:"success_428c2d22e7",successContent:"successContent_f26fafe9fb",marginRight:"marginRight_b9d7a409b2",marginLeft:"marginLeft_6c49812206",rightFlat:"rightFlat_5f7ad0e3d2",leftFlat:"leftFlat_2de9672be7",preventClickAnimation:"preventClickAnimation_c43962ca3d",leftIcon:"leftIcon_b9d7a409b2",rightIcon:"rightIcon_6c49812206",sizeXxs:"sizeXxs_780b1ae055",sizeXs:"sizeXs_b2bbd96808",sizeSmall:"sizeSmall_b0078038f9",sizeMedium:"sizeMedium_e8e0554cc7",sizeLarge:"sizeLarge_5bc394a33c",kindPrimary:"kindPrimary_75e4998ccb",colorPrimary:"colorPrimary_19569ffb78",colorBrand:"colorBrand_f162fc026c",colorPrimaryActive:"colorPrimaryActive_b13cdd48c5",colorBrandActive:"colorBrandActive_7e6bbcd983",colorPositive:"colorPositive_188f61523a",colorPositiveActive:"colorPositiveActive_9120a86882",colorNegative:"colorNegative_db8d94544a",colorNegativeActive:"colorNegativeActive_9120a86882",colorInverted:"colorInverted_c67ed30165",colorInvertedActive:"colorInvertedActive_9120a86882",disabled:"disabled_26321d87c1",colorOnPrimaryColor:"colorOnPrimaryColor_43b03c1165",colorOnPrimaryColorActive:"colorOnPrimaryColorActive_7d7f00dfd8",colorFixedLight:"colorFixedLight_9a20c3f760",colorFixedLightActive:"colorFixedLightActive_c43962ca3d",colorFixedDark:"colorFixedDark_d26df32a09",colorFixedDarkActive:"colorFixedDarkActive_908f0adb8a",colorOnInvertedBackground:"colorOnInvertedBackground_6dd75a6172",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive_a5f1afaa70",kindSecondary:"kindSecondary_dc50ab8fa3",kindTertiary:"kindTertiary_7c09732a0a",noSidePadding:"noSidePadding_51afb91a6e",insetFocusStyle:"insetFocusStyle_47339d0709"};!function(o){const r="s_id-f5db469b1a79_3_38_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const a=document.createElement("style");a.id=r,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}(".button_8fae311a00 {\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_8fae311a00:focus-visible, .button_8fae311a00.focus-visible_5af66d1166 {\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_8fae311a00:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.button_8fae311a00 .loader_5a7632c081 {\n  height: 100%;\n}\n.button_8fae311a00 .loader_5a7632c081 .loaderSvg_496cd953ed {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button_8fae311a00 .textPlaceholder_96ac61374d {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button_8fae311a00.success_428c2d22e7 {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button_8fae311a00.success_428c2d22e7 .successContent_f26fafe9fb {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight_b9d7a409b2 {\n  margin-right: var(--spacing-small);\n}\n.marginLeft_6c49812206 {\n  margin-left: var(--spacing-small);\n}\n.rightFlat_5f7ad0e3d2 {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat_2de9672be7 {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button_8fae311a00:active:not(.preventClickAnimation_c43962ca3d) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button_8fae311a00 .leftIcon_b9d7a409b2 {\n  margin-right: var(--spacing-small);\n}\n.button_8fae311a00 .rightIcon_6c49812206 {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs_780b1ae055 {\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_b2bbd96808 {\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_b0078038f9 {\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_b0078038f9 .loader_5a7632c081 {\n  top: 7px;\n}\n.sizeMedium_e8e0554cc7 {\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_5bc394a33c {\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_75e4998ccb {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_75e4998ccb.colorPrimary_19569ffb78 {\n  background: var(--primary-color);\n}\n.kindPrimary_75e4998ccb.colorBrand_f162fc026c {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary_75e4998ccb.colorPrimaryActive_b13cdd48c5,\n.kindPrimary_75e4998ccb.colorPrimary_19569ffb78:hover,\n.kindPrimary_75e4998ccb.colorPrimary_19569ffb78:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary_75e4998ccb.colorBrandActive_7e6bbcd983,\n.kindPrimary_75e4998ccb.colorBrand_f162fc026c:hover,\n.kindPrimary_75e4998ccb.colorBrand_f162fc026c:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary_75e4998ccb.colorPositive_188f61523a {\n  background: var(--positive-color);\n}\n.kindPrimary_75e4998ccb.colorPositiveActive_9120a86882,\n.kindPrimary_75e4998ccb.colorPositive_188f61523a:hover,\n.kindPrimary_75e4998ccb.colorPositive_188f61523a:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary_75e4998ccb.colorNegative_db8d94544a {\n  background: var(--negative-color);\n}\n.kindPrimary_75e4998ccb.colorNegativeActive_9120a86882,\n.kindPrimary_75e4998ccb.colorNegative_db8d94544a:hover,\n.kindPrimary_75e4998ccb.colorNegative_db8d94544a:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary_75e4998ccb.colorInverted_c67ed30165 {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary_75e4998ccb.colorInvertedActive_9120a86882,\n.kindPrimary_75e4998ccb.colorInverted_c67ed30165:hover,\n.kindPrimary_75e4998ccb.colorInverted_c67ed30165:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary_75e4998ccb.button_8fae311a00.colorInverted_c67ed30165.disabled_26321d87c1 {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165 {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary_75e4998ccb.colorOnPrimaryColorActive_7d7f00dfd8,\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:hover,\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_75e4998ccb.colorOnPrimaryColorActive_7d7f00dfd8:focus-visible, .kindPrimary_75e4998ccb.colorOnPrimaryColorActive_7d7f00dfd8.focus-visible_5af66d1166,\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:hover:focus-visible,\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:hover.focus-visible_5af66d1166,\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:focus:focus-visible,\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:focus.focus-visible_5af66d1166 {\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_75e4998ccb.colorOnPrimaryColorActive_7d7f00dfd8:focus:not(.focus-visible_5af66d1166),\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:hover:focus:not(.focus-visible_5af66d1166),\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindPrimary_75e4998ccb.colorOnPrimaryColor_43b03c1165.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760 {\n  background: var(--fixed-light-color);\n}\n.kindPrimary_75e4998ccb.colorFixedLightActive_c43962ca3d,\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:hover,\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:focus {\n  background-color: #e6e9ef;\n  backdrop-filter: brightness(85%);\n}\n.kindPrimary_75e4998ccb.colorFixedLightActive_c43962ca3d:focus-visible, .kindPrimary_75e4998ccb.colorFixedLightActive_c43962ca3d.focus-visible_5af66d1166,\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:hover:focus-visible,\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:hover.focus-visible_5af66d1166,\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:focus:focus-visible,\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:focus.focus-visible_5af66d1166 {\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_75e4998ccb.colorFixedLightActive_c43962ca3d:focus:not(.focus-visible_5af66d1166),\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:hover:focus:not(.focus-visible_5af66d1166),\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindPrimary_75e4998ccb.colorFixedLight_9a20c3f760.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09 {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary_75e4998ccb.colorFixedDarkActive_908f0adb8a,\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:hover,\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:focus {\n  filter: brightness(125%);\n}\n.kindPrimary_75e4998ccb.colorFixedDarkActive_908f0adb8a:focus-visible, .kindPrimary_75e4998ccb.colorFixedDarkActive_908f0adb8a.focus-visible_5af66d1166,\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:hover:focus-visible,\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:hover.focus-visible_5af66d1166,\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:focus:focus-visible,\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:focus.focus-visible_5af66d1166 {\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_75e4998ccb.colorFixedDarkActive_908f0adb8a:focus:not(.focus-visible_5af66d1166),\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:hover:focus:not(.focus-visible_5af66d1166),\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindPrimary_75e4998ccb.colorFixedDark_d26df32a09.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary_75e4998ccb.colorOnInvertedBackground_6dd75a6172 {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary_75e4998ccb.colorOnInvertedBackgroundActive_a5f1afaa70,\n.kindPrimary_75e4998ccb.colorOnInvertedBackground_6dd75a6172:hover,\n.kindPrimary_75e4998ccb.colorOnInvertedBackground_6dd75a6172:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary_75e4998ccb.button_8fae311a00.colorOnInvertedBackground_6dd75a6172.disabled_26321d87c1 {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary_75e4998ccb.button_8fae311a00.disabled_26321d87c1 {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_dc50ab8fa3 {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary_dc50ab8fa3.sizeSmall_b0078038f9 {\n  line-height: 22px;\n}\n.kindSecondary_dc50ab8fa3.sizeMedium_e8e0554cc7 {\n  line-height: 22px;\n}\n.kindSecondary_dc50ab8fa3.sizeLarge_5bc394a33c {\n  line-height: 22px;\n}\n.kindSecondary_dc50ab8fa3.colorPrimaryActive_b13cdd48c5 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_dc50ab8fa3.colorPrimaryActive_b13cdd48c5:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_dc50ab8fa3.colorBrandActive_7e6bbcd983 {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary_dc50ab8fa3.colorBrandActive_7e6bbcd983,\n.kindSecondary_dc50ab8fa3.colorBrandActive_7e6bbcd983:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary_dc50ab8fa3.colorPrimary_19569ffb78:hover:not(.colorPrimaryActive_b13cdd48c5),\n.kindSecondary_dc50ab8fa3.colorPrimary_19569ffb78:focus:not(.colorPrimaryActive_b13cdd48c5) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_dc50ab8fa3.colorBrand_f162fc026c:hover:not(.colorBrandActive_7e6bbcd983),\n.kindSecondary_dc50ab8fa3.colorBrand_f162fc026c:focus:not(.colorBrandActive_7e6bbcd983) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_dc50ab8fa3.colorPositive_188f61523a {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary_dc50ab8fa3.colorPositiveActive_9120a86882,\n.kindSecondary_dc50ab8fa3.colorPositive_188f61523a:hover,\n.kindSecondary_dc50ab8fa3.colorPositive_188f61523a:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary_dc50ab8fa3.colorNegative_db8d94544a {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary_dc50ab8fa3.colorNegativeActive_9120a86882,\n.kindSecondary_dc50ab8fa3.colorNegative_db8d94544a:hover,\n.kindSecondary_dc50ab8fa3.colorNegative_db8d94544a:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary_dc50ab8fa3.colorInverted_c67ed30165 {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary_dc50ab8fa3.colorInvertedActive_9120a86882,\n.kindSecondary_dc50ab8fa3.colorInverted_c67ed30165:hover,\n.kindSecondary_dc50ab8fa3.colorInverted_c67ed30165:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_dc50ab8fa3.colorInverted_c67ed30165.disabled_26321d87c1 {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165 {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColorActive_7d7f00dfd8,\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:hover,\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColorActive_7d7f00dfd8:focus-visible, .kindSecondary_dc50ab8fa3.colorOnPrimaryColorActive_7d7f00dfd8.focus-visible_5af66d1166,\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:hover:focus-visible,\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:hover.focus-visible_5af66d1166,\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:focus:focus-visible,\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:focus.focus-visible_5af66d1166 {\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_dc50ab8fa3.colorOnPrimaryColorActive_7d7f00dfd8:focus:not(.focus-visible_5af66d1166),\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:hover:focus:not(.focus-visible_5af66d1166),\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindSecondary_dc50ab8fa3.colorOnPrimaryColor_43b03c1165.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760 {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary_dc50ab8fa3.colorFixedLightActive_c43962ca3d,\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:hover,\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindSecondary_dc50ab8fa3.colorFixedLightActive_c43962ca3d:focus-visible, .kindSecondary_dc50ab8fa3.colorFixedLightActive_c43962ca3d.focus-visible_5af66d1166,\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:hover:focus-visible,\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:hover.focus-visible_5af66d1166,\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:focus:focus-visible,\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:focus.focus-visible_5af66d1166 {\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_dc50ab8fa3.colorFixedLightActive_c43962ca3d:focus:not(.focus-visible_5af66d1166),\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:hover:focus:not(.focus-visible_5af66d1166),\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09 {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_dc50ab8fa3.colorFixedDarkActive_908f0adb8a,\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:hover,\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary_dc50ab8fa3.colorFixedDarkActive_908f0adb8a:focus-visible, .kindSecondary_dc50ab8fa3.colorFixedDarkActive_908f0adb8a.focus-visible_5af66d1166,\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:hover:focus-visible,\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:hover.focus-visible_5af66d1166,\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:focus:focus-visible,\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:focus.focus-visible_5af66d1166 {\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_dc50ab8fa3.colorFixedDarkActive_908f0adb8a:focus:not(.focus-visible_5af66d1166),\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:hover:focus:not(.focus-visible_5af66d1166),\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindSecondary_dc50ab8fa3.colorOnInvertedBackground_6dd75a6172 {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary_dc50ab8fa3.colorOnInvertedBackgroundActive_a5f1afaa70,\n.kindSecondary_dc50ab8fa3.colorOnInvertedBackground_6dd75a6172:hover,\n.kindSecondary_dc50ab8fa3.colorOnInvertedBackground_6dd75a6172:focus {\n  background: var(--icon-color);\n}\n.kindSecondary_dc50ab8fa3.colorOnInvertedBackground_6dd75a6172.disabled_26321d87c1 {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary_dc50ab8fa3.colorFixedLight_9a20c3f760.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary_dc50ab8fa3.colorFixedDark_d26df32a09.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_dc50ab8fa3.disabled_26321d87c1 {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_dc50ab8fa3.disabled_26321d87c1:hover {\n  background-color: transparent;\n}\n.kindTertiary_7c09732a0a {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary_7c09732a0a.colorPrimaryActive_b13cdd48c5 {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary_7c09732a0a.colorPrimaryActive_b13cdd48c5:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary_7c09732a0a.colorBrandActive_7e6bbcd983 {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary_7c09732a0a.colorBrandActive_7e6bbcd983,\n.kindTertiary_7c09732a0a.colorBrandActive_7e6bbcd983:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary_7c09732a0a.colorPrimary_19569ffb78:hover:not(.colorPrimaryActive_b13cdd48c5),\n.kindTertiary_7c09732a0a.colorPrimary_19569ffb78:focus:not(.colorPrimaryActive_b13cdd48c5) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_7c09732a0a.colorBrand_f162fc026c:hover:not(.colorBrandActive_7e6bbcd983),\n.kindTertiary_7c09732a0a.colorBrand_f162fc026c:focus:not(.colorBrandActive_7e6bbcd983) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_7c09732a0a.colorPositive_188f61523a {\n  color: var(--positive-color);\n}\n.kindTertiary_7c09732a0a.colorPositiveActive_9120a86882,\n.kindTertiary_7c09732a0a.colorPositive_188f61523a:hover,\n.kindTertiary_7c09732a0a.colorPositive_188f61523a:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary_7c09732a0a.colorNegative_db8d94544a {\n  color: var(--negative-color);\n}\n.kindTertiary_7c09732a0a.colorNegativeActive_9120a86882,\n.kindTertiary_7c09732a0a.colorNegative_db8d94544a:hover,\n.kindTertiary_7c09732a0a.colorNegative_db8d94544a:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary_7c09732a0a.colorInverted_c67ed30165 {\n  color: var(--primary-text-color);\n}\n.kindTertiary_7c09732a0a.colorInvertedActive_9120a86882,\n.kindTertiary_7c09732a0a.colorInverted_c67ed30165:hover,\n.kindTertiary_7c09732a0a.colorInverted_c67ed30165:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_7c09732a0a.colorInverted_c67ed30165.disabled_26321d87c1 {\n  color: var(--disabled-text-color);\n}\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165 {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_7c09732a0a.colorOnPrimaryColorActive_7d7f00dfd8,\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:hover,\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_7c09732a0a.colorOnPrimaryColorActive_7d7f00dfd8:focus-visible, .kindTertiary_7c09732a0a.colorOnPrimaryColorActive_7d7f00dfd8.focus-visible_5af66d1166,\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:hover:focus-visible,\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:hover.focus-visible_5af66d1166,\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:focus:focus-visible,\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:focus.focus-visible_5af66d1166 {\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_7c09732a0a.colorOnPrimaryColorActive_7d7f00dfd8:focus:not(.focus-visible_5af66d1166),\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:hover:focus:not(.focus-visible_5af66d1166),\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindTertiary_7c09732a0a.colorOnPrimaryColor_43b03c1165.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760 {\n  color: var(--fixed-light-color);\n}\n.kindTertiary_7c09732a0a.colorFixedLightActive_c43962ca3d,\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:hover,\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:focus {\n  backdrop-filter: brightness(85%);\n}\n.kindTertiary_7c09732a0a.colorFixedLightActive_c43962ca3d:focus-visible, .kindTertiary_7c09732a0a.colorFixedLightActive_c43962ca3d.focus-visible_5af66d1166,\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:hover:focus-visible,\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:hover.focus-visible_5af66d1166,\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:focus:focus-visible,\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:focus.focus-visible_5af66d1166 {\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_7c09732a0a.colorFixedLightActive_c43962ca3d:focus:not(.focus-visible_5af66d1166),\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:hover:focus:not(.focus-visible_5af66d1166),\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindTertiary_7c09732a0a.colorFixedLight_9a20c3f760.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09 {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_7c09732a0a.colorFixedDarkActive_908f0adb8a,\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:hover,\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary_7c09732a0a.colorFixedDarkActive_908f0adb8a:focus-visible, .kindTertiary_7c09732a0a.colorFixedDarkActive_908f0adb8a.focus-visible_5af66d1166,\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:hover:focus-visible,\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:hover.focus-visible_5af66d1166,\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:focus:focus-visible,\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:focus.focus-visible_5af66d1166 {\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_7c09732a0a.colorFixedDarkActive_908f0adb8a:focus:not(.focus-visible_5af66d1166),\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:hover:focus:not(.focus-visible_5af66d1166),\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09:focus:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}\n.kindTertiary_7c09732a0a.colorFixedDark_d26df32a09.disabled_26321d87c1 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_7c09732a0a.colorOnInvertedBackground_6dd75a6172 {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_7c09732a0a.colorOnInvertedBackgroundActive_a5f1afaa70,\n.kindTertiary_7c09732a0a.colorOnInvertedBackground_6dd75a6172:hover,\n.kindTertiary_7c09732a0a.colorOnInvertedBackground_6dd75a6172:focus {\n  background: var(--icon-color);\n}\n.kindTertiary_7c09732a0a.colorOnInvertedBackground_6dd75a6172.disabled_26321d87c1 {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_7c09732a0a.disabled_26321d87c1 {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary_7c09732a0a.disabled_26321d87c1:hover {\n  background-color: transparent;\n}\n.noSidePadding_51afb91a6e {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button_8fae311a00.insetFocusStyle_47339d0709:focus-visible, .button_8fae311a00.insetFocusStyle_47339d0709.focus-visible_5af66d1166 {\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_8fae311a00.insetFocusStyle_47339d0709:focus:not(.focus-visible_5af66d1166) {\n  outline: none;\n}");export{o as default};
 //# sourceMappingURL=Button.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonGroup.js","sources":["../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport Button from \"../Button/Button\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { ButtonValue } from \"./ButtonGroupConstants\";\nimport { ButtonWrapper } from \"./ButtonWrapper\";\nimport { SIZES } from \"../../constants\";\nimport { ButtonType as ButtonTypeEnum } from \"../Button/ButtonConstants\";\nimport { ButtonType, ButtonSize } from \"../Button\";\nimport { SubIcon, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./ButtonGroup.module.scss\";\nimport { TooltipPositions } from \"../Tooltip\";\n\ntype ButtonGroupOption = {\n icon?: SubIcon;\n leftIcon?: SubIcon;\n ariaLabel?: string;\n subText?: string;\n value: ButtonValue;\n text: string;\n disabled?: boolean;\n tooltipContent?: string;\n};\n\nexport interface ButtonGroupProps extends VibeComponentProps {\n /*\n The list of button options.\n /\n options: Array<ButtonGroupOption>;\n /\n The currently selected button value.\n /\n value?: ButtonValue;\n /\n Callback fired when a button is selected.\n /\n onSelect?: (value: ButtonValue, name: string) => void;\n /\n The size of the buttons.\n /\n size?: ButtonSize;\n /\n The style variant of the buttons.\n /\n kind?: Extract<ButtonType, \"secondary\" \| \"tertiary\">;\n /\n The name of the button group.\n /\n name?: string;\n /\n If true, disables all buttons in the group.\n /\n disabled?: boolean;\n /\n The label of the button group for accessibility.\n /\n groupAriaLabel?: string;\n /\n The position of the tooltip relative to the button.\n /\n tooltipPosition?: TooltipPositions;\n /\n The delay in milliseconds before the tooltip hides.\n /\n tooltipHideDelay?: number;\n /\n The delay in milliseconds before the tooltip shows.\n /\n tooltipShowDelay?: number;\n /\n CSS selector for the tooltip container.\n /\n tooltipContainerSelector?: string;\n /\n Adjusts the tooltip position.\n /\n tooltipMoveBy?: MoveBy;\n /\n The content inside the button group.\n /\n children?: React.ReactNode;\n /\n If true, makes the button group take the full width of its container.\n /\n fullWidth?: boolean;\n /\n If true, removes focus from the button after clicking.\n */\n blurOnMouseUp?: boolean;\n}\n\nconst ButtonGroup = forwardRef(\n (\n {\n className,\n options,\n name = \"\",\n disabled = false,\n value = \"\",\n onSelect,\n size = \"small\",\n kind = \"secondary\",\n groupAriaLabel = \"\",\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp = true,\n id,\n \"data-testid\": dataTestId,\n fullWidth = false\n }: ButtonGroupProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const inputRef = useRef();\n const mergedRef = useMergeRef(ref, inputRef);\n\n const [valueState, setValueState] = useState(value);\n const prevValue = usePrevious(value);\n\n const onClick = useCallback(\n (option: ButtonGroupOption) => {\n const isDisabled = disabled \|\| option.disabled;\n if (!isDisabled) {\n setValueState(option.value);\n if (onSelect) {\n onSelect(option.value, name);\n }\n }\n },\n [onSelect, disabled, name]\n );\n\n const selectedOption = useMemo(() => {\n return options.find(option => option.value === valueState);\n }, [options, valueState]);\n\n const Buttons = useMemo(() => {\n return options.map((option, index) => {\n const isSelected = option.value === valueState;\n return (\n <ButtonWrapper\n key={option.value}\n size={size}\n onClick={() => onClick(option)}\n rightIcon={option.icon}\n leftIcon={option.leftIcon}\n active={isSelected}\n rightFlat={index !== options.length - 1}\n leftFlat={index !== 0}\n kind=\"tertiary\"\n preventClickAnimation\n ariaLabel={option.ariaLabel}\n tooltipContent={option.tooltipContent}\n tooltipPosition={tooltipPosition}\n tooltipHideDelay={tooltipHideDelay}\n tooltipShowDelay={tooltipShowDelay}\n tooltipContainerSelector={tooltipContainerSelector}\n tooltipMoveBy={tooltipMoveBy}\n blurOnMouseUp={blurOnMouseUp}\n className={cx(styles.button, styles.optionText, {\n [styles.selected]: isSelected,\n [styles.disabled]: disabled,\n [styles.buttonDisabled]: option.disabled,\n [styles.fullWidth]: fullWidth\n })}\n activeButtonClassName={styles.activeButton}\n >\n {option.text}\n </ButtonWrapper>\n );\n });\n }, [\n options,\n valueState,\n size,\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp,\n disabled,\n fullWidth,\n onClick\n ]);\n\n // Effects\n useEffect(() => {\n // Update value if changed from props\n if (value !== prevValue && value !== valueState) {\n setValueState(value);\n }\n }, [value, prevValue, valueState, setValueState]);\n\n return (\n <div\n className={cx(styles.buttonGroup, className, getStyle(styles, camelCase(\"kind-\" + kind)), {\n [styles.disabled]: disabled\n })}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.BUTTON_GROUP, id)}\n data-vibe={ComponentVibeId.BUTTON_GROUP}\n ref={mergedRef}\n >\n <div role=\"group\" aria-label={groupAriaLabel} className={cx(styles.buttonsContainer)} aria-disabled={disabled}>\n {Buttons}\n </div>\n {selectedOption && selectedOption.subText && (\n <div className={cx(styles.subTextContainer)}>{selectedOption.subText}</div>\n )}\n </div>\n );\n }\n);\n\ninterface ButtonGroupStaticProps {\n sizes: typeof SIZES;\n kinds: typeof ButtonTypeEnum;\n}\n\nexport default withStaticProps<ButtonGroupProps, ButtonGroupStaticProps>(ButtonGroup, {\n sizes: Button.sizes,\n kinds: Button.kinds\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","options","_ref$name","name","_ref$disabled","disabled","_ref$value","value","onSelect","_ref$size","size","_ref$kind","kind","_ref$groupAriaLabel","groupAriaLabel","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","_ref$blurOnMouseUp","blurOnMouseUp","id","dataTestId","_ref$fullWidth","fullWidth","inputRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","valueState","setValueState","prevValue","usePrevious","onClick","useCallback","option","selectedOption","useMemo","find","Buttons","map","index","isSelected","React","createElement","ButtonWrapper","key","rightIcon","icon","leftIcon","active","rightFlat","length","leftFlat","preventClickAnimation","ariaLabel","tooltipContent","cx","styles","button","optionText","_defineProperty","selected","buttonDisabled","activeButtonClassName","activeButton","text","useEffect","buttonGroup","getStyle","camelCase","getTestId","ComponentDefaultTestId","BUTTON_GROUP","ComponentVibeId","role","buttonsContainer","subText","subTextContainer","sizes","Button","kinds"],"mappings":"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"}
1	+ {"version":3,"file":"ButtonGroup.js","sources":["../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport Button from \"../Button/Button\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { ButtonValue } from \"./ButtonGroupConstants\";\nimport { ButtonWrapper } from \"./ButtonWrapper\";\nimport { SIZES } from \"../../constants\";\nimport { ButtonType as ButtonTypeEnum } from \"../Button/ButtonConstants\";\nimport { ButtonType, ButtonSize } from \"../Button/Button.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./ButtonGroup.module.scss\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\n\ntype ButtonGroupOption = {\n icon?: SubIcon;\n leftIcon?: SubIcon;\n ariaLabel?: string;\n subText?: string;\n value: ButtonValue;\n text: string;\n disabled?: boolean;\n tooltipContent?: string;\n};\n\nexport interface ButtonGroupProps extends VibeComponentProps {\n /*\n The list of button options.\n /\n options: Array<ButtonGroupOption>;\n /\n The currently selected button value.\n /\n value?: ButtonValue;\n /\n Callback fired when a button is selected.\n /\n onSelect?: (value: ButtonValue, name: string) => void;\n /\n The size of the buttons.\n /\n size?: ButtonSize;\n /\n The style variant of the buttons.\n /\n kind?: Extract<ButtonType, \"secondary\" \| \"tertiary\">;\n /\n The name of the button group.\n /\n name?: string;\n /\n If true, disables all buttons in the group.\n /\n disabled?: boolean;\n /\n The label of the button group for accessibility.\n /\n groupAriaLabel?: string;\n /\n The position of the tooltip relative to the button.\n /\n tooltipPosition?: TooltipPositions;\n /\n The delay in milliseconds before the tooltip hides.\n /\n tooltipHideDelay?: number;\n /\n The delay in milliseconds before the tooltip shows.\n /\n tooltipShowDelay?: number;\n /\n CSS selector for the tooltip container.\n /\n tooltipContainerSelector?: string;\n /\n Adjusts the tooltip position.\n /\n tooltipMoveBy?: MoveBy;\n /\n The content inside the button group.\n /\n children?: React.ReactNode;\n /\n If true, makes the button group take the full width of its container.\n /\n fullWidth?: boolean;\n /\n If true, removes focus from the button after clicking.\n */\n blurOnMouseUp?: boolean;\n}\n\nconst ButtonGroup: VibeComponent<ButtonGroupProps, HTMLDivElement> & {\n sizes?: typeof SIZES;\n kinds?: typeof ButtonTypeEnum;\n} = forwardRef(\n (\n {\n className,\n options,\n name = \"\",\n disabled = false,\n value = \"\",\n onSelect,\n size = \"small\",\n kind = \"secondary\",\n groupAriaLabel = \"\",\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp = true,\n id,\n \"data-testid\": dataTestId,\n fullWidth = false\n }: ButtonGroupProps,\n ref\n ) => {\n const inputRef = useRef();\n const mergedRef = useMergeRef(ref, inputRef);\n\n const [valueState, setValueState] = useState(value);\n const prevValue = usePrevious(value);\n\n const onClick = useCallback(\n (option: ButtonGroupOption) => {\n const isDisabled = disabled \|\| option.disabled;\n if (!isDisabled) {\n setValueState(option.value);\n if (onSelect) {\n onSelect(option.value, name);\n }\n }\n },\n [onSelect, disabled, name]\n );\n\n const selectedOption = useMemo(() => {\n return options.find(option => option.value === valueState);\n }, [options, valueState]);\n\n const Buttons = useMemo(() => {\n return options.map((option, index) => {\n const isSelected = option.value === valueState;\n return (\n <ButtonWrapper\n key={option.value}\n size={size}\n onClick={() => onClick(option)}\n rightIcon={option.icon}\n leftIcon={option.leftIcon}\n active={isSelected}\n rightFlat={index !== options.length - 1}\n leftFlat={index !== 0}\n kind=\"tertiary\"\n preventClickAnimation\n ariaLabel={option.ariaLabel}\n tooltipContent={option.tooltipContent}\n tooltipPosition={tooltipPosition}\n tooltipHideDelay={tooltipHideDelay}\n tooltipShowDelay={tooltipShowDelay}\n tooltipContainerSelector={tooltipContainerSelector}\n tooltipMoveBy={tooltipMoveBy}\n blurOnMouseUp={blurOnMouseUp}\n className={cx(styles.button, styles.optionText, {\n [styles.selected]: isSelected,\n [styles.disabled]: disabled,\n [styles.buttonDisabled]: option.disabled,\n [styles.fullWidth]: fullWidth\n })}\n activeButtonClassName={styles.activeButton}\n >\n {option.text}\n </ButtonWrapper>\n );\n });\n }, [\n options,\n valueState,\n size,\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp,\n disabled,\n fullWidth,\n onClick\n ]);\n\n // Effects\n useEffect(() => {\n // Update value if changed from props\n if (value !== prevValue && value !== valueState) {\n setValueState(value);\n }\n }, [value, prevValue, valueState, setValueState]);\n\n return (\n <div\n className={cx(styles.buttonGroup, className, getStyle(styles, camelCase(\"kind-\" + kind)), {\n [styles.disabled]: disabled\n })}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.BUTTON_GROUP, id)}\n data-vibe={ComponentVibeId.BUTTON_GROUP}\n ref={mergedRef}\n >\n <div role=\"group\" aria-label={groupAriaLabel} className={cx(styles.buttonsContainer)} aria-disabled={disabled}>\n {Buttons}\n </div>\n {selectedOption && selectedOption.subText && (\n <div className={cx(styles.subTextContainer)}>{selectedOption.subText}</div>\n )}\n </div>\n );\n }\n);\n\nexport default withStaticProps(ButtonGroup, { sizes: Button.sizes, kinds: Button.kinds });\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","options","_ref$name","name","_ref$disabled","disabled","_ref$value","value","onSelect","_ref$size","size","_ref$kind","kind","_ref$groupAriaLabel","groupAriaLabel","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","_ref$blurOnMouseUp","blurOnMouseUp","id","dataTestId","_ref$fullWidth","fullWidth","inputRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","valueState","setValueState","prevValue","usePrevious","onClick","useCallback","option","selectedOption","useMemo","find","Buttons","map","index","isSelected","React","createElement","ButtonWrapper","key","rightIcon","icon","leftIcon","active","rightFlat","length","leftFlat","preventClickAnimation","ariaLabel","tooltipContent","cx","styles","button","optionText","_defineProperty","selected","buttonDisabled","activeButtonClassName","activeButton","text","useEffect","buttonGroup","getStyle","camelCase","getTestId","ComponentDefaultTestId","BUTTON_GROUP","ComponentVibeId","role","buttonsContainer","subText","subTextContainer","sizes","Button","kinds"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var n={buttonGroup:"buttonGroup_a8b72092b5",subTextContainer:"subTextContainer_ebd27453a9",buttonsContainer:"buttonsContainer_565dd09919",button:"button_52d7dbf35c",activeButton:"activeButton_0a55f3ea8b",optionText:"optionText_f0fb3c42e0",disabled:"disabled_dd048e5684",selected:"selected_6e9b27ebb1",kindTertiary:"kindTertiary_3155d9dbc2",wrapper:"wrapper_a48cfd2e13",buttonDisabled:"buttonDisabled_1397ed780d",fullWidth:"fullWidth_236ece2cd9"};!function(n){const o="s_id-51d51089eef9_3_37_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+o))return;const e=document.createElement("style");e.id=o,t.firstChild?t.insertBefore(e,t.firstChild):t.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".buttonGroup_a8b72092b5 {\n  display: flex;\n  flex-direction: column;\n}\n\n.subTextContainer_ebd27453a9 {\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_565dd09919 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.buttonsContainer_565dd09919 .button_52d7dbf35c {\n  border: 1px solid;\n  background-color: var(--primary-background-color);\n  border-color: var(--ui-border-color);\n}\n\n.buttonsContainer_565dd09919 .button_52d7dbf35c.activeButton_0a55f3ea8b {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n\n.buttonsContainer_565dd09919 .button_52d7dbf35c.activeButton_0a55f3ea8b:hover {\n  background-color: var(--primary-selected-color);\n}\n\n.optionText_f0fb3c42e0:not(.disabled_dd048e5684) {\n  color: var(--primary-text-color);\n}\n\n.optionText_f0fb3c42e0:not(.disabled_dd048e5684).selected_6e9b27ebb1 {\n  color: var(--primary-text-color);\n}\n\n.kindTertiary_3155d9dbc2 .button_52d7dbf35c {\n  border-color: transparent;\n}\n\n.kindTertiary_3155d9dbc2 .button_52d7dbf35c:first-child {\n  border-color: transparent;\n}\n\n.wrapper_a48cfd2e13.disabled_dd048e5684 {\n  cursor: not-allowed;\n}\n\n.button_52d7dbf35c.disabled_dd048e5684 {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  opacity: 0.5;\n}\n\n.button_52d7dbf35c.buttonDisabled_1397ed780d {\n  background-color: var(--disabled-background-color);\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.fullWidth_236ece2cd9 {\n  flex: 1;\n}");export{n as default};
+var n={buttonGroup:"buttonGroup_2dabb40a0c",subTextContainer:"subTextContainer_e2084848fa",buttonsContainer:"buttonsContainer_94189513aa",button:"button_52c405ea58",activeButton:"activeButton_b13cdd48c5",optionText:"optionText_9db6599187",disabled:"disabled_b3796015e1",selected:"selected_08038ad864",kindTertiary:"kindTertiary_23afe29dcb",wrapper:"wrapper_943adc89aa",buttonDisabled:"buttonDisabled_752368ffc6",fullWidth:"fullWidth_fdc02d160a"};!function(n){const o="s_id-51d51089eef9_3_38_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+o))return;const e=document.createElement("style");e.id=o,t.firstChild?t.insertBefore(e,t.firstChild):t.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".buttonGroup_2dabb40a0c {\n  display: flex;\n  flex-direction: column;\n}\n\n.subTextContainer_e2084848fa {\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_94189513aa {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.buttonsContainer_94189513aa .button_52c405ea58 {\n  border: 1px solid;\n  background-color: var(--primary-background-color);\n  border-color: var(--ui-border-color);\n}\n\n.buttonsContainer_94189513aa .button_52c405ea58.activeButton_b13cdd48c5 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n\n.buttonsContainer_94189513aa .button_52c405ea58.activeButton_b13cdd48c5:hover {\n  background-color: var(--primary-selected-color);\n}\n\n.optionText_9db6599187:not(.disabled_b3796015e1) {\n  color: var(--primary-text-color);\n}\n\n.optionText_9db6599187:not(.disabled_b3796015e1).selected_08038ad864 {\n  color: var(--primary-text-color);\n}\n\n.kindTertiary_23afe29dcb .button_52c405ea58 {\n  border-color: transparent;\n}\n\n.kindTertiary_23afe29dcb .button_52c405ea58:first-child {\n  border-color: transparent;\n}\n\n.wrapper_943adc89aa.disabled_b3796015e1 {\n  cursor: not-allowed;\n}\n\n.button_52c405ea58.disabled_b3796015e1 {\n  cursor: not-allowed;\n  background-color: var(--disabled-background-color);\n  opacity: 0.5;\n}\n\n.button_52c405ea58.buttonDisabled_752368ffc6 {\n  background-color: var(--disabled-background-color);\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.fullWidth_fdc02d160a {\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 t,useRef as a,useCallback as o,useEffect as r,useMemo as i}from"react";import n from"classnames";import{isNil as s,noop as c}from"lodash-es";import l 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 f}from"../../tests/constants.js";import C from"../Text/Text.js";import b from"./Checkbox.module.scss.js";import h from"../../../icons/dist/react/Remove.js";import v from"../../../icons/dist/react/Check.js";var k=t((function(t,k){var x=t.className,E=t.checkboxClassName,j=t.labelClassName,N=t.ariaLabel,y=t.label,B=t.ariaLabelledBy,F=t.onChange,g=void 0===F?c:F,H=t.checked,w=t.autoFocus,I=t.indeterminate,K=void 0!==I&&I,L=t.disabled,O=void 0!==L&&L,X=t.defaultChecked,A=t.tabIndex,R=t.value,S=void 0===R?"":R,T=t.name,q=void 0===T?"":T,M=t.id,_=t["data-testid"],z=a(null),U=d(k,z),D=a(null),G=o((function(){var e=z.current;e&&window.requestAnimationFrame((function(){window.requestAnimationFrame((function(){e.blur()}))}))}),[z]),J=X;s(J)&&s(H)&&(J=!1),r((function(){z.current&&(z.current.indeterminate=K)}),[z,K]);var P=m({inputRef:z}).onClickCapture,Q=i((function(){return N||("string"==typeof y?y:"")}),[N,y]);return e.createElement("label",{className:n(b.wrapper,x),onMouseUp:G,"data-testid":_||u(p.CHECKBOX,M),htmlFor:M,onClickCapture:P},e.createElement("input",{ref:U,id:M,className:b.input,value:S,name:q,type:"checkbox",autoFocus:w,onChange:g,defaultChecked:J,disabled:O,"aria-label":Q,"aria-labelledby":B,checked:H,tabIndex:A}),e.createElement("div",{className:n(b.checkbox,E),ref:D,"data-testid":u(p.CHECKBOX_CHECKBOX,M),"data-vibe":f.CHECKBOX},e.createElement(l,{className:b.icon,iconType:"svg",icon:K?h:v,ignoreFocusStyle:!0,ariaHidden:!0,iconSize:"16"})),!1===y?null:e.createElement(C,{element:"span",type:"text2",className:n(b.label,j),"data-testid":u(p.CHECKBOX_LABEL,M)},y))}));export{k as default};
+import e from"classnames";import t,{forwardRef as a,useRef as o,useCallback as r,useEffect as i,useMemo as n}from"react";import{isNil as s,noop as c}from"lodash-es";import l 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 f}from"../../tests/constants.js";import C from"../Text/Text.js";import b from"./Checkbox.module.scss.js";import h from"../../../icons/dist/react/Remove.js";import v from"../../../icons/dist/react/Check.js";var k=a((function(a,k){var x=a.className,E=a.checkboxClassName,j=a.labelClassName,N=a.ariaLabel,y=a.label,B=a.ariaLabelledBy,F=a.onChange,g=void 0===F?c:F,H=a.checked,w=a.autoFocus,I=a.indeterminate,K=void 0!==I&&I,L=a.disabled,O=void 0!==L&&L,X=a.defaultChecked,A=a.tabIndex,R=a.value,S=void 0===R?"":R,T=a.name,q=void 0===T?"":T,M=a.id,_=a["data-testid"],z=o(null),U=d(k,z),D=o(null),G=r((function(){var e=z.current;e&&window.requestAnimationFrame((function(){window.requestAnimationFrame((function(){e.blur()}))}))}),[z]),J=X;s(J)&&s(H)&&(J=!1),i((function(){z.current&&(z.current.indeterminate=K)}),[z,K]);var P=m({inputRef:z}).onClickCapture,Q=n((function(){return N||("string"==typeof y?y:"")}),[N,y]);return t.createElement("label",{className:e(b.wrapper,x),onMouseUp:G,"data-testid":_||u(p.CHECKBOX,M),htmlFor:M,onClickCapture:P},t.createElement("input",{ref:U,id:M,className:b.input,value:S,name:q,type:"checkbox",autoFocus:w,onChange:g,defaultChecked:J,disabled:O,"aria-label":Q,"aria-labelledby":B,checked:H,tabIndex:A}),t.createElement("div",{className:e(b.checkbox,E),ref:D,"data-testid":u(p.CHECKBOX_CHECKBOX,M),"data-vibe":f.CHECKBOX},t.createElement(l,{className:b.icon,iconType:"svg",icon:K?h:v,ignoreFocusStyle:!0,ariaHidden:!0,iconSize:"16"})),!1===y?null:t.createElement(C,{element:"span",type:"text2",className:e(b.label,j),"data-testid":u(p.CHECKBOX_LABEL,M)},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 { 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\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 \"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 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","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","onMouseUp","getTestId","ComponentDefaultTestId","CHECKBOX","htmlFor","type","checkbox","CHECKBOX_CHECKBOX","ComponentVibeId","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","Text","element","CHECKBOX_LABEL"],"mappings":"0nBAwEMA,IAAAA,~~EAAWC~~,~~GACf~~,SAAAC,EAoBEC,GACE,IAnBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAcJ,EAAdI,eACAC,EAASL,EAATK,UACAC,EAAKN,EAALM,MACAC,EAAcP,EAAdO,eAAcC,EAAAR,EACdS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAOX,EAAPW,QACAC,EAASZ,EAATY,UAASC,EAAAb,EACTc,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAf,EACrBgB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAcjB,EAAdiB,eACAC,EAAQlB,EAARkB,SAAQC,EAAAnB,EACRoB,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACVsB,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAEvB,EAAFuB,GACeC,EAAUxB,EAAzB,eAIIyB,EAAWC,EAAyB,MACpCC,EAAiBC,EAAY3B,EAAKwB,GAClCI,EAAmBH,EAAuB,MAE1CI,EAAoBC,GAAY,WACpC,IAAMC,EAAQP,EAASQ,QAClBD,GAELE,OAAOC,uBAAsB,WAC3BD,OAAOC,uBAAsB,WAC3BH,EAAMI,MACR,GACF,GACF,GAAG,CAACX,IACAY,EAAyBpB,EAIzBqB,EAAMD,IAA2BC,EAAM3B,KACzC0B,GAAyB,GAG3BE,GAAU,WACJd,EAASQ,UACXR,EAASQ,QAAQnB,cAAgBA,EAErC,GAAG,CAACW,EAAUX,IAEd,IAAwB0B,EAAwBC,EAA4B,CAAEhB,SAAAA,IAAtEiB,eAEFC,EAAiBC,GAAQ,WAC7B,OAAIvC,IACiB,iBAAVC,EAA2BA,EAC/B,GACT,GAAG,CAACD,EAAWC,IAEf,OAEEuC,EAAAC,cAAA,QAAA,CACE5C,UAAW6C,EAAGC,EAAOC,QAAS/C,GAC9BgD,UAAWpB,EACE,cAAAN,GAAc2B,EAAUC,EAAuBC,SAAU9B,GACtE+B,QAAS/B,EACTmB,eAAgBF,GAEhBK,EACEC,cAAA,QAAA,CAAA7C,IAAK0B,EACLJ,GAAIA,EACJrB,UAAW8C,EAAOhB,MAClBZ,MAAOA,EACPE,KAAMA,EACNiC,KAAK,WACL3C,UAAWA,EACXH,SAAUA,EACVQ,eAAgBoB,EAChBrB,SAAUA,EACE,aAAA2B,EACK,kBAAApC,EACjBI,QAASA,EACTO,SAAUA,IAEZ2B,EACEC,cAAA,MAAA,CAAA5C,UAAW6C,EAAGC,EAAOQ,SAAUrD,GAC/BF,IAAK4B,EACQ,cAAAsB,EAAUC,EAAuBK,kBAAmBlC,GAAG,YACzDmC,EAAgBL,UAE3BR,EAAAC,cAACa,EAAI,CACHzD,UAAW8C,EAAOY,KAClBC,SAAS,MACTD,KAAM9C,EAAgBgD,EAASC,EAC/BC,kBAAgB,EAChBC,YAAY,EACZC,SAAS,SAGF,IAAV5D,EAAkB,KACjBuC,gBAACsB,EAAI,CACHC,QAAQ,OACRb,KAAK,QACLrD,UAAW6C,EAAGC,EAAO1C,MAAOF,GAAe,cAC9B+C,EAAUC,EAAuBiB,eAAgB9C,IAE7DjB,GAKX"}
1	+ {"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\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 { VibeComponent, 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\nconst Checkbox: VibeComponent<CheckBoxProps, HTMLInputElement> = 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 \"data-testid\": dataTestId\n }: CheckBoxProps,\n ref\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 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","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","onMouseUp","getTestId","ComponentDefaultTestId","CHECKBOX","htmlFor","type","checkbox","CHECKBOX_CHECKBOX","ComponentVibeId","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","Text","element","CHECKBOX_LABEL"],"mappings":"0nBAwEMA,IAAAA,EAA2DC,GAC/D,SAAAC,EAoBEC,GACE,IAnBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAcJ,EAAdI,eACAC,EAASL,EAATK,UACAC,EAAKN,EAALM,MACAC,EAAcP,EAAdO,eAAcC,EAAAR,EACdS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAOX,EAAPW,QACAC,EAASZ,EAATY,UAASC,EAAAb,EACTc,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAf,EACrBgB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAcjB,EAAdiB,eACAC,EAAQlB,EAARkB,SAAQC,EAAAnB,EACRoB,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACVsB,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAEvB,EAAFuB,GACeC,EAAUxB,EAAzB,eAIIyB,EAAWC,EAAyB,MACpCC,EAAiBC,EAAY3B,EAAKwB,GAClCI,EAAmBH,EAAuB,MAE1CI,EAAoBC,GAAY,WACpC,IAAMC,EAAQP,EAASQ,QAClBD,GAELE,OAAOC,uBAAsB,WAC3BD,OAAOC,uBAAsB,WAC3BH,EAAMI,MACR,GACF,GACF,GAAG,CAACX,IACAY,EAAyBpB,EAIzBqB,EAAMD,IAA2BC,EAAM3B,KACzC0B,GAAyB,GAG3BE,GAAU,WACJd,EAASQ,UACXR,EAASQ,QAAQnB,cAAgBA,EAErC,GAAG,CAACW,EAAUX,IAEd,IAAwB0B,EAAwBC,EAA4B,CAAEhB,SAAAA,IAAtEiB,eAEFC,EAAiBC,GAAQ,WAC7B,OAAIvC,IACiB,iBAAVC,EAA2BA,EAC/B,GACT,GAAG,CAACD,EAAWC,IAEf,OAEEuC,EAAAC,cAAA,QAAA,CACE5C,UAAW6C,EAAGC,EAAOC,QAAS/C,GAC9BgD,UAAWpB,EACE,cAAAN,GAAc2B,EAAUC,EAAuBC,SAAU9B,GACtE+B,QAAS/B,EACTmB,eAAgBF,GAEhBK,EACEC,cAAA,QAAA,CAAA7C,IAAK0B,EACLJ,GAAIA,EACJrB,UAAW8C,EAAOhB,MAClBZ,MAAOA,EACPE,KAAMA,EACNiC,KAAK,WACL3C,UAAWA,EACXH,SAAUA,EACVQ,eAAgBoB,EAChBrB,SAAUA,EACE,aAAA2B,EACK,kBAAApC,EACjBI,QAASA,EACTO,SAAUA,IAEZ2B,EACEC,cAAA,MAAA,CAAA5C,UAAW6C,EAAGC,EAAOQ,SAAUrD,GAC/BF,IAAK4B,EACQ,cAAAsB,EAAUC,EAAuBK,kBAAmBlC,GAAG,YACzDmC,EAAgBL,UAE3BR,EAAAC,cAACa,EAAI,CACHzD,UAAW8C,EAAOY,KAClBC,SAAS,MACTD,KAAM9C,EAAgBgD,EAASC,EAC/BC,kBAAgB,EAChBC,YAAY,EACZC,SAAS,SAGF,IAAV5D,EAAkB,KACjBuC,gBAACsB,EAAI,CACHC,QAAQ,OACRb,KAAK,QACLrD,UAAW6C,EAAGC,EAAO1C,MAAOF,GAAe,cAC9B+C,EAAUC,EAAuBiB,eAAgB9C,IAE7DjB,GAKX"}

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

@@ -1,2 +1,2 @@
-var e={wrapper:"wrapper_c1872c2a4e",checkbox:"checkbox_9d12d37ee8",icon:"icon_1e0df75d50",label:"label_39e845f436",input:"input_06c9a7a6f0",checkboxGrowAnimation:"checkboxGrowAnimation_a2acbb8a49"};!function(e){const n="s_id-a622c58c4e9d_3_37_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const c=document.createElement("style");c.id=n,o.firstChild?o.insertBefore(c,o.firstChild):o.appendChild(c),c.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('.wrapper_c1872c2a4e {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n\n.checkbox_9d12d37ee8 {\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\n.checkbox_9d12d37ee8: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\n.checkbox_9d12d37ee8:hover {\n  border-color: var(--secondary-text-color);\n}\n\n.icon_1e0df75d50 {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n\n.label_39e845f436 {\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\n/* Since it is not possible to change the design of the checkbox according to the requirements using css, */\n\n/* we hide the checkbox and draw a new one instead. */\n\n/* In order to allow accessibility, all operations will be performed on the hidden checkbox and be reflected */\n\n.input_06c9a7a6f0 {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}\n\n/* For any active attribute in the hidden checkbox, we will change the appearance of the checkbox we drew in its place. */\n\n.input_06c9a7a6f0:focus + .checkbox_9d12d37ee8 {\n  border-color: var(--secondary-text-color);\n}\n\n.input_06c9a7a6f0:focus:checked + .checkbox_9d12d37ee8 {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n\n.input_06c9a7a6f0:focus-visible + .checkbox_9d12d37ee8 {\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\n.input_06c9a7a6f0:checked:focus + .checkbox_9d12d37ee8:after,\n.input_06c9a7a6f0:indeterminate:focus + .checkbox_9d12d37ee8:after {\n  background-color: var(--primary-hover-color);\n}\n\n.input_06c9a7a6f0:checked + .checkbox_9d12d37ee8,\n.input_06c9a7a6f0:indeterminate + .checkbox_9d12d37ee8 {\n  animation: checkboxGrowAnimation_a2acbb8a49 var(--motion-productive-short);\n}\n\n.input_06c9a7a6f0:checked + .checkbox_9d12d37ee8,\n.input_06c9a7a6f0:indeterminate + .checkbox_9d12d37ee8 {\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n\n.input_06c9a7a6f0:checked + .checkbox_9d12d37ee8:hover,\n.input_06c9a7a6f0:indeterminate + .checkbox_9d12d37ee8:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n\n.input_06c9a7a6f0:checked + .checkbox_9d12d37ee8:hover:after,\n.input_06c9a7a6f0:indeterminate + .checkbox_9d12d37ee8:hover:after {\n  background-color: var(--primary-hover-color);\n}\n\n.input_06c9a7a6f0:checked + .checkbox_9d12d37ee8:after,\n.input_06c9a7a6f0:indeterminate + .checkbox_9d12d37ee8: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\n.input_06c9a7a6f0:checked + .checkbox_9d12d37ee8 > .icon_1e0df75d50,\n.input_06c9a7a6f0:indeterminate + .checkbox_9d12d37ee8 > .icon_1e0df75d50 {\n  visibility: visible;\n}\n\n.input_06c9a7a6f0:checked:disabled + .checkbox_9d12d37ee8:after,\n.input_06c9a7a6f0:indeterminate:disabled + .checkbox_9d12d37ee8:after {\n  background-color: var(--disabled-background-color);\n}\n\n.input_06c9a7a6f0:disabled + .checkbox_9d12d37ee8,\n.input_06c9a7a6f0:disabled + .checkbox_9d12d37ee8:hover {\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n\n.input_06c9a7a6f0:disabled + .checkbox_9d12d37ee8 .icon_1e0df75d50,\n.input_06c9a7a6f0:disabled + .checkbox_9d12d37ee8:hover .icon_1e0df75d50 {\n  color: var(--disabled-text-color);\n}\n\n.input_06c9a7a6f0:disabled + .checkbox_9d12d37ee8,\n.input_06c9a7a6f0:disabled + .checkbox_9d12d37ee8:hover {\n  cursor: not-allowed;\n}\n\n.input_06c9a7a6f0:disabled ~ .label_39e845f436 {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n\n@keyframes checkboxGrowAnimation_a2acbb8a49 {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{e as default};
+var n={wrapper:"wrapper_a9b26b070b",checkbox:"checkbox_043f034528",icon:"icon_c5a58171ee",label:"label_c7589e0101",input:"input_2fd53ddbab",checkboxGrowAnimation:"checkboxGrowAnimation_cff0cece1f"};!function(n){const e="s_id-a622c58c4e9d_3_38_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}('.wrapper_a9b26b070b {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  height: min-content;\n}\n\n.checkbox_043f034528 {\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\n.checkbox_043f034528: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\n.checkbox_043f034528:hover {\n  border-color: var(--secondary-text-color);\n}\n\n.icon_c5a58171ee {\n  width: 100%;\n  color: var(--text-color-on-primary);\n  visibility: hidden;\n}\n\n.label_c7589e0101 {\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\n/* Since it is not possible to change the design of the checkbox according to the requirements using css, */\n\n/* we hide the checkbox and draw a new one instead. */\n\n/* In order to allow accessibility, all operations will be performed on the hidden checkbox and be reflected */\n\n.input_2fd53ddbab {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}\n\n/* For any active attribute in the hidden checkbox, we will change the appearance of the checkbox we drew in its place. */\n\n.input_2fd53ddbab:focus + .checkbox_043f034528 {\n  border-color: var(--secondary-text-color);\n}\n\n.input_2fd53ddbab:focus:checked + .checkbox_043f034528 {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n\n.input_2fd53ddbab:focus-visible + .checkbox_043f034528 {\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\n.input_2fd53ddbab:checked:focus + .checkbox_043f034528:after,\n.input_2fd53ddbab:indeterminate:focus + .checkbox_043f034528:after {\n  background-color: var(--primary-hover-color);\n}\n\n.input_2fd53ddbab:checked + .checkbox_043f034528,\n.input_2fd53ddbab:indeterminate + .checkbox_043f034528 {\n  animation: checkboxGrowAnimation_cff0cece1f var(--motion-productive-short);\n}\n\n.input_2fd53ddbab:checked + .checkbox_043f034528,\n.input_2fd53ddbab:indeterminate + .checkbox_043f034528 {\n  background-color: var(--primary-color);\n  border-color: transparent;\n}\n\n.input_2fd53ddbab:checked + .checkbox_043f034528:hover,\n.input_2fd53ddbab:indeterminate + .checkbox_043f034528:hover {\n  background-color: var(--primary-hover-color);\n  border-color: transparent;\n}\n\n.input_2fd53ddbab:checked + .checkbox_043f034528:hover:after,\n.input_2fd53ddbab:indeterminate + .checkbox_043f034528:hover:after {\n  background-color: var(--primary-hover-color);\n}\n\n.input_2fd53ddbab:checked + .checkbox_043f034528:after,\n.input_2fd53ddbab:indeterminate + .checkbox_043f034528: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\n.input_2fd53ddbab:checked + .checkbox_043f034528 > .icon_c5a58171ee,\n.input_2fd53ddbab:indeterminate + .checkbox_043f034528 > .icon_c5a58171ee {\n  visibility: visible;\n}\n\n.input_2fd53ddbab:checked:disabled + .checkbox_043f034528:after,\n.input_2fd53ddbab:indeterminate:disabled + .checkbox_043f034528:after {\n  background-color: var(--disabled-background-color);\n}\n\n.input_2fd53ddbab:disabled + .checkbox_043f034528,\n.input_2fd53ddbab:disabled + .checkbox_043f034528:hover {\n  background-color: var(--disabled-background-color);\n  border-color: var(--ui-border-color);\n}\n\n.input_2fd53ddbab:disabled + .checkbox_043f034528 .icon_c5a58171ee,\n.input_2fd53ddbab:disabled + .checkbox_043f034528:hover .icon_c5a58171ee {\n  color: var(--disabled-text-color);\n}\n\n.input_2fd53ddbab:disabled + .checkbox_043f034528,\n.input_2fd53ddbab:disabled + .checkbox_043f034528:hover {\n  cursor: not-allowed;\n}\n\n.input_2fd53ddbab:disabled ~ .label_c7589e0101 {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n\n@keyframes checkboxGrowAnimation_cff0cece1f {\n  0% {\n    transform: scale(0.8);\n  }\n  100% {\n    transform: scale(1);\n  }\n}');export{n as default};
 //# sourceMappingURL=Checkbox.module.scss.js.map