@usecapsule/core-components 2.0.9 → 3.0.1
Sign up to get free protection for your applications and to get access to all the features.
- package/css/capsule-core.css +54 -19
- package/css/capsule-core.css.map +1 -1
- package/dist/capsule/capsule.esm.js +1 -1
- package/dist/capsule/capsule.esm.js.map +1 -1
- package/dist/capsule/index.esm.js +1 -1
- package/dist/capsule/index.esm.js.map +1 -1
- package/dist/capsule/{p-415384b7.entry.js → p-0d0a0037.entry.js} +2 -2
- package/dist/capsule/p-107e1ff5.entry.js +29 -0
- package/dist/capsule/p-107e1ff5.entry.js.map +1 -0
- package/dist/capsule/p-86e48e61.js +3 -0
- package/dist/capsule/p-86e48e61.js.map +1 -0
- package/dist/capsule/p-ad14a817.entry.js +2 -0
- package/dist/capsule/p-b6b38e73.js +2 -0
- package/dist/capsule/p-b6b38e73.js.map +1 -0
- package/dist/capsule/p-d28b96ba.entry.js +10 -0
- package/dist/capsule/{p-b76350fd.entry.js.map → p-d28b96ba.entry.js.map} +1 -1
- package/dist/capsule/{p-4d957466.entry.js → p-fa078837.entry.js} +2 -2
- package/dist/capsule/{p-fa4e3c14.entry.js → p-fcead80b.entry.js} +2 -2
- package/dist/cjs/capsule.cjs.js +2 -2
- package/dist/cjs/constants-0869a780.js +29 -0
- package/dist/cjs/constants-0869a780.js.map +1 -0
- package/dist/cjs/{cpsl-alert_18.cjs.entry.js → cpsl-alert_29.cjs.entry.js} +615 -187
- package/dist/cjs/cpsl-alert_29.cjs.entry.js.map +1 -0
- package/dist/cjs/cpsl-animation.cjs.entry.js +2 -2
- package/dist/cjs/cpsl-col.cjs.entry.js +2 -2
- package/dist/cjs/cpsl-grid.cjs.entry.js +3 -3
- package/dist/cjs/cpsl-info-box.cjs.entry.js +2 -2
- package/dist/cjs/cpsl-row.cjs.entry.js +2 -2
- package/dist/cjs/{index-87ba56f9.js → index-5733071e.js} +6 -3
- package/dist/cjs/index-5733071e.js.map +1 -0
- package/dist/cjs/index.cjs.js +53 -24
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/assets/icons/brush.svg +3 -0
- package/dist/collection/assets/icons/check-circle.svg +3 -0
- package/dist/collection/assets/icons/file.svg +3 -0
- package/dist/collection/assets/icons/home.svg +3 -0
- package/dist/collection/assets/icons/index.js +7 -1
- package/dist/collection/assets/icons/index.js.map +1 -1
- package/dist/collection/assets/icons/lightning-01.svg +3 -0
- package/dist/collection/assets/icons/lightning.svg +2 -2
- package/dist/collection/assets/icons/settings.svg +4 -0
- package/dist/collection/collection-manifest.json +11 -0
- package/dist/collection/components/cpsl-alert/cpsl-alert.css +21 -11
- package/dist/collection/components/cpsl-alert/cpsl-alert.js +34 -26
- package/dist/collection/components/cpsl-alert/cpsl-alert.js.map +1 -1
- package/dist/collection/components/cpsl-animation/cpsl-animation.js +1 -1
- package/dist/collection/components/cpsl-app-bar/cpsl-app-bar.css +67 -0
- package/dist/collection/components/cpsl-app-bar/cpsl-app-bar.js +69 -0
- package/dist/collection/components/cpsl-app-bar/cpsl-app-bar.js.map +1 -0
- package/dist/collection/components/cpsl-app-bar/test/cpsl-app-bar.e2e.js +29 -0
- package/dist/collection/components/cpsl-app-bar/test/cpsl-app-bar.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-app-bar/test/cpsl-app-bar.spec.js +37 -0
- package/dist/collection/components/cpsl-app-bar/test/cpsl-app-bar.spec.js.map +1 -0
- package/dist/collection/components/cpsl-avatar/cpsl-avatar.css +31 -0
- package/dist/collection/components/cpsl-avatar/cpsl-avatar.js +81 -0
- package/dist/collection/components/cpsl-avatar/cpsl-avatar.js.map +1 -0
- package/dist/collection/components/cpsl-avatar/test/cpsl-avatar.e2e.js +29 -0
- package/dist/collection/components/cpsl-avatar/test/cpsl-avatar.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-avatar/test/cpsl-avatar.spec.js +37 -0
- package/dist/collection/components/cpsl-avatar/test/cpsl-avatar.spec.js.map +1 -0
- package/dist/collection/components/cpsl-button/cpsl-button.css +175 -51
- package/dist/collection/components/cpsl-button/cpsl-button.js +46 -5
- package/dist/collection/components/cpsl-button/cpsl-button.js.map +1 -1
- package/dist/collection/components/cpsl-button-group/cpsl-button-group.css +88 -0
- package/dist/collection/components/cpsl-button-group/cpsl-button-group.js +78 -0
- package/dist/collection/components/cpsl-button-group/cpsl-button-group.js.map +1 -0
- package/dist/collection/components/cpsl-button-group/test/cpsl-button-group.e2e.js +29 -0
- package/dist/collection/components/cpsl-button-group/test/cpsl-button-group.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-button-group/test/cpsl-button-group.spec.js +37 -0
- package/dist/collection/components/cpsl-button-group/test/cpsl-button-group.spec.js.map +1 -0
- package/dist/collection/components/cpsl-card/cpsl-card.css +81 -0
- package/dist/collection/components/cpsl-card/cpsl-card.js +19 -0
- package/dist/collection/components/cpsl-card/cpsl-card.js.map +1 -0
- package/dist/collection/components/cpsl-card/test/cpsl-card.e2e.js +29 -0
- package/dist/collection/components/cpsl-card/test/cpsl-card.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-card/test/cpsl-card.spec.js +37 -0
- package/dist/collection/components/cpsl-card/test/cpsl-card.spec.js.map +1 -0
- package/dist/collection/components/cpsl-checkbox/cpsl-checkbox.css +110 -0
- package/dist/collection/components/cpsl-checkbox/cpsl-checkbox.js +64 -0
- package/dist/collection/components/cpsl-checkbox/cpsl-checkbox.js.map +1 -0
- package/dist/collection/components/cpsl-checkbox/test/cpsl-checkbox.e2e.js +29 -0
- package/dist/collection/components/cpsl-checkbox/test/cpsl-checkbox.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-checkbox/test/cpsl-checkbox.spec.js +37 -0
- package/dist/collection/components/cpsl-checkbox/test/cpsl-checkbox.spec.js.map +1 -0
- package/dist/collection/components/cpsl-code-input/cpsl-code-input.js +1 -1
- package/dist/collection/components/cpsl-col/cpsl-col.js +1 -1
- package/dist/collection/components/cpsl-divider/cpsl-divider.js +1 -1
- package/dist/collection/components/cpsl-drawer/cpsl-drawer.css +90 -0
- package/dist/collection/components/cpsl-drawer/cpsl-drawer.js +149 -0
- package/dist/collection/components/cpsl-drawer/cpsl-drawer.js.map +1 -0
- package/dist/collection/components/cpsl-drawer/test/cpsl-drawer.e2e.js +29 -0
- package/dist/collection/components/cpsl-drawer/test/cpsl-drawer.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-drawer/test/cpsl-drawer.spec.js +37 -0
- package/dist/collection/components/cpsl-drawer/test/cpsl-drawer.spec.js.map +1 -0
- package/dist/collection/components/cpsl-dropdown/cpsl-dropdown.js +1 -1
- package/dist/collection/components/cpsl-grid/cpsl-grid.js +2 -2
- package/dist/collection/components/cpsl-icon/cpsl-icon.js +2 -2
- package/dist/collection/components/cpsl-info-box/cpsl-info-box.js +1 -1
- package/dist/collection/components/cpsl-input/cpsl-input.css +35 -19
- package/dist/collection/components/cpsl-input/cpsl-input.js +47 -6
- package/dist/collection/components/cpsl-input/cpsl-input.js.map +1 -1
- package/dist/collection/components/cpsl-modal/cpsl-modal.css +12 -2
- package/dist/collection/components/cpsl-modal/cpsl-modal.js +20 -2
- package/dist/collection/components/cpsl-modal/cpsl-modal.js.map +1 -1
- package/dist/collection/components/cpsl-nav-button-group/cpsl-nav-button-group.css +50 -0
- package/dist/collection/components/cpsl-nav-button-group/cpsl-nav-button-group.js +78 -0
- package/dist/collection/components/cpsl-nav-button-group/cpsl-nav-button-group.js.map +1 -0
- package/dist/collection/components/cpsl-nav-button-group/test/cpsl-nav-button-group.e2e.js +29 -0
- package/dist/collection/components/cpsl-nav-button-group/test/cpsl-nav-button-group.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-nav-button-group/test/cpsl-nav-button-group.spec.js +37 -0
- package/dist/collection/components/cpsl-nav-button-group/test/cpsl-nav-button-group.spec.js.map +1 -0
- package/dist/collection/components/cpsl-overlay/cpsl-overlay.css +61 -3
- package/dist/collection/components/cpsl-overlay/cpsl-overlay.js +35 -17
- package/dist/collection/components/cpsl-overlay/cpsl-overlay.js.map +1 -1
- package/dist/collection/components/cpsl-pagination/cpsl-pagination.css +67 -0
- package/dist/collection/components/cpsl-pagination/cpsl-pagination.js +174 -0
- package/dist/collection/components/cpsl-pagination/cpsl-pagination.js.map +1 -0
- package/dist/collection/components/cpsl-pagination/test/cpsl-pagination.e2e.js +29 -0
- package/dist/collection/components/cpsl-pagination/test/cpsl-pagination.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-pagination/test/cpsl-pagination.spec.js +37 -0
- package/dist/collection/components/cpsl-pagination/test/cpsl-pagination.spec.js.map +1 -0
- package/dist/collection/components/cpsl-pill/cpsl-pill.js +1 -1
- package/dist/collection/components/cpsl-qr-code/cpsl-qr-code.js +1 -1
- package/dist/collection/components/cpsl-radio/cpsl-radio.css +97 -0
- package/dist/collection/components/cpsl-radio/cpsl-radio.js +66 -0
- package/dist/collection/components/cpsl-radio/cpsl-radio.js.map +1 -0
- package/dist/collection/components/cpsl-radio/test/cpsl-radio.e2e.js +29 -0
- package/dist/collection/components/cpsl-radio/test/cpsl-radio.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-radio/test/cpsl-radio.spec.js +37 -0
- package/dist/collection/components/cpsl-radio/test/cpsl-radio.spec.js.map +1 -0
- package/dist/collection/components/cpsl-row/cpsl-row.js +1 -1
- package/dist/collection/components/cpsl-slide-button/cpsl-slide-button.js +3 -3
- package/dist/collection/components/cpsl-spinner/cpsl-spinner.js +2 -2
- package/dist/collection/components/cpsl-switch/cpsl-switch.css +115 -0
- package/dist/collection/components/cpsl-switch/cpsl-switch.js +64 -0
- package/dist/collection/components/cpsl-switch/cpsl-switch.js.map +1 -0
- package/dist/collection/components/cpsl-switch/test/cpsl-switch.e2e.js +29 -0
- package/dist/collection/components/cpsl-switch/test/cpsl-switch.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-switch/test/cpsl-switch.spec.js +37 -0
- package/dist/collection/components/cpsl-switch/test/cpsl-switch.spec.js.map +1 -0
- package/dist/collection/components/cpsl-tab/cpsl-tab.js +1 -1
- package/dist/collection/components/cpsl-table/cpsl-table.css +179 -0
- package/dist/collection/components/cpsl-table/cpsl-table.js +88 -0
- package/dist/collection/components/cpsl-table/cpsl-table.js.map +1 -0
- package/dist/collection/components/cpsl-table/table-interface.js +2 -0
- package/dist/collection/components/cpsl-table/table-interface.js.map +1 -0
- package/dist/collection/components/cpsl-table/test/cpsl-table.e2e.js +29 -0
- package/dist/collection/components/cpsl-table/test/cpsl-table.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-table/test/cpsl-table.spec.js +37 -0
- package/dist/collection/components/cpsl-table/test/cpsl-table.spec.js.map +1 -0
- package/dist/collection/components/cpsl-tabs/cpsl-tabs.js +1 -1
- package/dist/collection/components/cpsl-text/cpsl-text.js +1 -1
- package/dist/collection/components/cpsl-tile-button/cpsl-tile-button.js +2 -2
- package/dist/collection/constants.js +14 -0
- package/dist/collection/constants.js.map +1 -1
- package/dist/collection/index.js.map +1 -1
- package/dist/collection/interface.js.map +1 -1
- package/dist/collection/utils/theme/generateBorderRadii.js +24 -7
- package/dist/collection/utils/theme/generateBorderRadii.js.map +1 -1
- package/dist/collection/utils/theme/generatePalette.js +22 -18
- package/dist/collection/utils/theme/generatePalette.js.map +1 -1
- package/dist/collection/utils/theme/utils.js +8 -0
- package/dist/collection/utils/theme/utils.js.map +1 -1
- package/dist/esm/capsule.js +3 -3
- package/dist/esm/constants-6acf4ea8.js +23 -0
- package/dist/esm/constants-6acf4ea8.js.map +1 -0
- package/dist/esm/{cpsl-alert_18.entry.js → cpsl-alert_29.entry.js} +605 -188
- package/dist/esm/cpsl-alert_29.entry.js.map +1 -0
- package/dist/esm/cpsl-animation.entry.js +2 -2
- package/dist/esm/cpsl-col.entry.js +2 -2
- package/dist/esm/cpsl-grid.entry.js +3 -3
- package/dist/esm/cpsl-info-box.entry.js +2 -2
- package/dist/esm/cpsl-row.entry.js +2 -2
- package/dist/esm/{index-fd970ca2.js → index-8fe9f35e.js} +6 -3
- package/dist/esm/index-8fe9f35e.js.map +1 -0
- package/dist/esm/index.js +53 -24
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/types/assets/icons/index.d.ts +6 -0
- package/dist/types/components/cpsl-alert/cpsl-alert.d.ts +2 -2
- package/dist/types/components/cpsl-app-bar/cpsl-app-bar.d.ts +5 -0
- package/dist/types/components/cpsl-avatar/cpsl-avatar.d.ts +6 -0
- package/dist/types/components/cpsl-button/cpsl-button.d.ts +2 -0
- package/dist/types/components/cpsl-button-group/cpsl-button-group.d.ts +9 -0
- package/dist/types/components/cpsl-card/cpsl-card.d.ts +3 -0
- package/dist/types/components/cpsl-checkbox/cpsl-checkbox.d.ts +7 -0
- package/dist/types/components/cpsl-drawer/cpsl-drawer.d.ts +9 -0
- package/dist/types/components/cpsl-input/cpsl-input.d.ts +4 -0
- package/dist/types/components/cpsl-modal/cpsl-modal.d.ts +1 -0
- package/dist/types/components/cpsl-nav-button-group/cpsl-nav-button-group.d.ts +9 -0
- package/dist/types/components/cpsl-overlay/cpsl-overlay.d.ts +2 -1
- package/dist/types/components/cpsl-pagination/cpsl-pagination.d.ts +14 -0
- package/dist/types/components/cpsl-radio/cpsl-radio.d.ts +7 -0
- package/dist/types/components/cpsl-switch/cpsl-switch.d.ts +7 -0
- package/dist/types/components/cpsl-table/cpsl-table.d.ts +9 -0
- package/dist/types/components/cpsl-table/table-interface.d.ts +19 -0
- package/dist/types/components.d.ts +435 -6
- package/dist/types/constants.d.ts +14 -0
- package/dist/types/index.d.ts +1 -1
- package/dist/types/interface.d.ts +35 -0
- package/dist/types/utils/theme/utils.d.ts +1 -0
- package/package.json +3 -2
- package/dist/capsule/p-2ce99420.entry.js +0 -29
- package/dist/capsule/p-2ce99420.entry.js.map +0 -1
- package/dist/capsule/p-6b02ea8d.entry.js +0 -2
- package/dist/capsule/p-b2997f3c.js +0 -3
- package/dist/capsule/p-b2997f3c.js.map +0 -1
- package/dist/capsule/p-b76350fd.entry.js +0 -10
- package/dist/capsule/p-c2bf050b.js +0 -2
- package/dist/capsule/p-c2bf050b.js.map +0 -1
- package/dist/cjs/constants-4bb85cc5.js +0 -12
- package/dist/cjs/constants-4bb85cc5.js.map +0 -1
- package/dist/cjs/cpsl-alert_18.cjs.entry.js.map +0 -1
- package/dist/cjs/index-87ba56f9.js.map +0 -1
- package/dist/esm/constants-7b49abd5.js +0 -9
- package/dist/esm/constants-7b49abd5.js.map +0 -1
- package/dist/esm/cpsl-alert_18.entry.js.map +0 -1
- package/dist/esm/index-fd970ca2.js.map +0 -1
- /package/dist/capsule/{p-415384b7.entry.js.map → p-0d0a0037.entry.js.map} +0 -0
- /package/dist/capsule/{p-6b02ea8d.entry.js.map → p-ad14a817.entry.js.map} +0 -0
- /package/dist/capsule/{p-4d957466.entry.js.map → p-fa078837.entry.js.map} +0 -0
- /package/dist/capsule/{p-fa4e3c14.entry.js.map → p-fcead80b.entry.js.map} +0 -0
- /package/dist/types/Users/{vinay → taylorbosch}/Documents/GitHub/Capsule/component-library/core/.stencil/scripts/buildIconLibrary.d.ts +0 -0
package/css/capsule-core.css
CHANGED
|
@@ -79,6 +79,7 @@ body.backdrop-no-scroll {
|
|
|
79
79
|
--cpsl-color-alpha-white-4: rgba(255, 255, 255, 0.0392156863);
|
|
80
80
|
--cpsl-color-alpha-white-25: rgba(255, 255, 255, 0.2509803922);
|
|
81
81
|
--cpsl-color-background-0: rgb(255, 255, 255);
|
|
82
|
+
--cpsl-color-background-4: rgb(240, 240, 240);
|
|
82
83
|
--cpsl-color-background-8: rgb(235, 235, 235);
|
|
83
84
|
--cpsl-color-background-16: rgb(214, 214, 214);
|
|
84
85
|
--cpsl-color-background-32: rgb(173, 173, 173);
|
|
@@ -86,45 +87,56 @@ body.backdrop-no-scroll {
|
|
|
86
87
|
--cpsl-color-background-64: rgb(92, 92, 92);
|
|
87
88
|
--cpsl-color-background-80: rgb(51, 51, 51);
|
|
88
89
|
--cpsl-color-background-96: rgb(10, 10, 10);
|
|
89
|
-
--cpsl-color-foreground-0: rgb(
|
|
90
|
-
--cpsl-color-foreground-
|
|
91
|
-
--cpsl-color-foreground-
|
|
92
|
-
--cpsl-color-foreground-
|
|
93
|
-
--cpsl-color-foreground-
|
|
94
|
-
--cpsl-color-foreground-
|
|
95
|
-
--cpsl-color-foreground-
|
|
90
|
+
--cpsl-color-foreground-0: rgb(20, 20, 20);
|
|
91
|
+
--cpsl-color-foreground-4: rgb(31, 31, 31);
|
|
92
|
+
--cpsl-color-foreground-8: rgb(42, 42, 42);
|
|
93
|
+
--cpsl-color-foreground-16: rgb(60, 60, 60);
|
|
94
|
+
--cpsl-color-foreground-32: rgb(97, 97, 97);
|
|
95
|
+
--cpsl-color-foreground-48: rgb(134, 134, 134);
|
|
96
|
+
--cpsl-color-foreground-64: rgb(171, 171, 171);
|
|
97
|
+
--cpsl-color-foreground-80: rgb(209, 209, 209);
|
|
96
98
|
--cpsl-color-foreground-96: rgb(246, 246, 246);
|
|
99
|
+
--cpsl-color-utility-red: rgb(240, 68, 56);
|
|
100
|
+
--cpsl-color-utility-yellow: rgb(251, 188, 4);
|
|
101
|
+
--cpsl-color-utility-green: rgb(52, 168, 83);
|
|
97
102
|
--cpsl-color-text-primary: var(--cpsl-color-foreground-0);
|
|
98
103
|
--cpsl-color-text-secondary: var(--cpsl-color-background-64);
|
|
104
|
+
--cpsl-color-text-tertiary: var(--cpsl-color-foreground-32);
|
|
99
105
|
--cpsl-color-text-subtle: var(--cpsl-color-background-64);
|
|
100
106
|
--cpsl-color-text-inverted: var(--cpsl-color-foreground-96);
|
|
101
|
-
--cpsl-color-text-
|
|
107
|
+
--cpsl-color-text-disabled: var(--cpsl-color-foreground-48);
|
|
108
|
+
--cpsl-color-text-error: var(--cpsl-color-utility-red);
|
|
102
109
|
--cpsl-color-modal-surface-main: var(--cpsl-color-background-0);
|
|
103
110
|
--cpsl-color-modal-surface-footer: var(--cpsl-color-background-8);
|
|
104
111
|
--cpsl-color-modal-border: var(--cpsl-color-background-8);
|
|
105
112
|
--cpsl-color-input-surface-disabled: var(--cpsl-color-background-8);
|
|
106
|
-
--cpsl-color-input-surface-default: var(--cpsl-color-background-
|
|
107
|
-
--cpsl-color-input-border-placeholder: var(--cpsl-color-
|
|
108
|
-
--cpsl-color-input-border-active: var(--cpsl-color-foreground-
|
|
109
|
-
--cpsl-color-input-border-error:
|
|
113
|
+
--cpsl-color-input-surface-default: var(--cpsl-color-background-4);
|
|
114
|
+
--cpsl-color-input-border-placeholder: var(--cpsl-color-background-4);
|
|
115
|
+
--cpsl-color-input-border-active: var(--cpsl-color-foreground-0);
|
|
116
|
+
--cpsl-color-input-border-error: var(--cpsl-color-utility-red);
|
|
110
117
|
--cpsl-color-tile-button-surface-default: var(--cpsl-color-background-0);
|
|
111
118
|
--cpsl-color-tile-button-surface-hover: var(--cpsl-color-background-8);
|
|
112
119
|
--cpsl-color-tile-button-surface-pressed: var(--cpsl-color-background-48);
|
|
113
120
|
--cpsl-color-tile-button-border: var(--cpsl-color-background-8);
|
|
121
|
+
--cpsl-color-primary-button-text: var(--cpsl-color-text-inverted);
|
|
114
122
|
--cpsl-color-primary-button-surface-default: var(--cpsl-color-foreground-0);
|
|
115
123
|
--cpsl-color-primary-button-surface-hover: var(--cpsl-color-foreground-16);
|
|
116
124
|
--cpsl-color-primary-button-surface-pressed: var(--cpsl-color-foreground-32);
|
|
117
125
|
--cpsl-color-primary-button-surface-disabled: var(--cpsl-color-background-32);
|
|
118
|
-
--cpsl-color-primary-button-border-default: var(--cpsl-color-foreground-
|
|
126
|
+
--cpsl-color-primary-button-border-default: var(--cpsl-color-foreground-0);
|
|
119
127
|
--cpsl-color-primary-button-border-disabled: var(--cpsl-color-background-32);
|
|
120
128
|
--cpsl-color-primary-button-outline: var(--cpsl-color-foreground-32);
|
|
129
|
+
--cpsl-color-secondary-button-text: var(--cpsl-color-text-primary);
|
|
121
130
|
--cpsl-color-secondary-button-surface-default: var(--cpsl-color-background-0);
|
|
122
131
|
--cpsl-color-secondary-button-surface-hover: var(--cpsl-color-background-16);
|
|
123
132
|
--cpsl-color-secondary-button-surface-pressed: var(--cpsl-color-background-32);
|
|
124
133
|
--cpsl-color-secondary-button-surface-disabled: var(--cpsl-color-foreground-32);
|
|
125
|
-
--cpsl-color-secondary-button-border-default: var(--cpsl-color-background-
|
|
134
|
+
--cpsl-color-secondary-button-border-default: var(--cpsl-color-background-32);
|
|
126
135
|
--cpsl-color-secondary-button-border-disabled: var(--cpsl-color-foreground-32);
|
|
127
136
|
--cpsl-color-secondary-button-outline: var(--cpsl-color-background-32);
|
|
137
|
+
--cpsl-color-icon-button-default: var(--cpsl-color-text-secondary);
|
|
138
|
+
--cpsl-color-icon-button-disabled: var(--cpsl-color-text-secondary);
|
|
139
|
+
--cpsl-color-icon-button-hover: var(--cpsl-color-text-primary);
|
|
128
140
|
--cpsl-color-divider: var(--cpsl-color-background-32);
|
|
129
141
|
--cpsl-color-spinner-path: var(--cpsl-color-background-32);
|
|
130
142
|
--cpsl-color-spinner-circle: var(--cpsl-color-foreground-0);
|
|
@@ -151,16 +163,39 @@ body.backdrop-no-scroll {
|
|
|
151
163
|
--cpsl-color-tabs-slider-background: var(--cpsl-color-background-0);
|
|
152
164
|
--cpsl-color-alert-surface-error: #fee4e2;
|
|
153
165
|
--cpsl-color-alert-border-error: #f97066;
|
|
154
|
-
--cpsl-
|
|
155
|
-
--cpsl-
|
|
166
|
+
--cpsl-color-switch-surface-default: var(--cpsl-color-background-4);
|
|
167
|
+
--cpsl-color-switch-surface-checked: var(--cpsl-color-foreground-0);
|
|
168
|
+
--cpsl-color-switch-thumb-default: var(--cpsl-color-background-0);
|
|
169
|
+
--cpsl-color-switch-thumb-checked: var(--cpsl-color-background-0);
|
|
170
|
+
--cpsl-color-checkbox-surface-default: var(--cpsl-color-background-0);
|
|
171
|
+
--cpsl-color-checkbox-surface-checked: var(--cpsl-color-foreground-0);
|
|
172
|
+
--cpsl-color-checkbox-border-default: var(--cpsl-color-background-16);
|
|
173
|
+
--cpsl-color-checkbox-border-checked: var(--cpsl-color-foreground-0);
|
|
174
|
+
--cpsl-color-checkbox-icon: var(--cpsl-color-background-0);
|
|
175
|
+
--cpsl-color-radio-surface-default: var(--cpsl-color-background-0);
|
|
176
|
+
--cpsl-color-radio-surface-checked: var(--cpsl-color-background-0);
|
|
177
|
+
--cpsl-color-radio-border-default: var(--cpsl-color-background-16);
|
|
178
|
+
--cpsl-color-radio-border-checked: var(--cpsl-color-foreground-0);
|
|
179
|
+
--cpsl-color-avatar-surface: var(--cpsl-color-background-0);
|
|
180
|
+
--cpsl-color-avatar-border: var(--cpsl-color-foreground-96);
|
|
181
|
+
--cpsl-color-card-surface: var(--cpsl-color-background-0);
|
|
182
|
+
--cpsl-color-card-border: var(--cpsl-color-background-16);
|
|
183
|
+
--cpsl-border-radius-input: 16px;
|
|
184
|
+
--cpsl-border-radius-alert: 12px;
|
|
156
185
|
--cpsl-border-radius-tabs: 8px;
|
|
157
|
-
--cpsl-border-radius-primary-button:
|
|
158
|
-
--cpsl-border-radius-secondary-button:
|
|
186
|
+
--cpsl-border-radius-primary-button: 12px;
|
|
187
|
+
--cpsl-border-radius-secondary-button: 12px;
|
|
159
188
|
--cpsl-border-radius-tile-button: 8px;
|
|
160
|
-
--cpsl-border-radius-modal:
|
|
189
|
+
--cpsl-border-radius-modal: 20px;
|
|
161
190
|
--cpsl-border-radius-pill: 1000px;
|
|
162
191
|
--cpsl-border-radius-qr-code: 24px;
|
|
163
192
|
--cpsl-border-radius-info-box: 8px;
|
|
193
|
+
--cpsl-border-radius-table-container: 20px;
|
|
194
|
+
--cpsl-border-radius-switch: 1000px;
|
|
195
|
+
--cpsl-border-radius-checkbox: 4px;
|
|
196
|
+
--cpsl-border-radius-radio: 1000px;
|
|
197
|
+
--cpsl-border-radius-avatar: 8px;
|
|
198
|
+
--cpsl-border-radius-card: 16px;
|
|
164
199
|
--cpsl-font-size-body-2xs: clamp(8px, 0.625rem, 15px);
|
|
165
200
|
--cpsl-font-size-body-xs: clamp(9.6px, 0.75rem, 18px);
|
|
166
201
|
--cpsl-font-size-body-s: clamp(11.2px, 0.875rem, 21px);
|
package/css/capsule-core.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../src/themes/capsule.functions.font.scss","../src/themes/capsule.mixins.scss","../src/css/capsule-core.scss"],"names":[],"mappings":"AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AC/CA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACZA;EACE;EACA;EACA;;;AAGF;EACE;;;AAiCF;EAvBE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAeF;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAGJ;EACE;IACE;;;AAGJ;EACE;IACE;;EAEF;IACE;;EAEF;IACE","file":"capsule-core.css","sourcesContent":["@use 'sass:math';\n\n$baselineSize: 16px !default;\n$baselineUnit: 1rem !default;\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font($size, $unit: $baselineUnit) {\n @return (math.div($size, $baselineSize)) * $unit;\n}\n\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font-max($size, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $maxScale: $size * $maxScale;\n\n @return min($baseScale, $maxScale);\n}\n\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font-min($minScale, $size, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $minScale: $size * $minScale;\n\n @return max($minScale, $baseScale);\n}\n\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font-clamp($minScale, $baseSize, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($baseSize, $unit);\n $maxScale: $baseSize * $maxScale;\n $minScale: $baseSize * $minScale;\n\n @return clamp($minScale, $baseScale, $maxScale);\n}\n","/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n@mixin tablet-viewport() {\n @media screen and (min-width: 768px) {\n @content;\n }\n}\n\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n@mixin mobile-viewport() {\n @media screen and (max-width: 767px) {\n @content;\n }\n}\n\n@mixin input-cover() {\n @include position(0, null, null, 0);\n @include margin(0);\n\n position: absolute;\n\n width: 100%;\n height: 100%;\n\n border: 0;\n background: transparent;\n cursor: pointer;\n\n appearance: none;\n outline: none;\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n@mixin visually-hidden() {\n position: absolute;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n width: 100%;\n height: 100%;\n\n margin: 0;\n padding: 0;\n\n border: 0;\n outline: 0;\n clip: rect(0 0 0 0);\n\n opacity: 0;\n overflow: hidden;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n@mixin text-inherit() {\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n text-align: inherit;\n white-space: inherit;\n color: inherit;\n}\n\n@mixin button-state() {\n @include position(0, 0, 0, 0);\n\n position: absolute;\n\n content: '';\n\n opacity: 0;\n}\n\n// Get the key from a map based on the index\n@function index-to-key($map, $index) {\n $keys: map-keys($map);\n\n @return nth($keys, $index);\n}\n\n// Breakpoint Mixins\n// ---------------------------------------------------------------------------------\n\n// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$screen-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// ---------------------------------------------------------------------------------\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $screen-breakpoints) {\n $min: map-get($breakpoints, $name);\n\n @return if($name != index-to-key($breakpoints, 1), $min, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $screen-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, '', '-#{$name}');\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $screen-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $screen-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Maximum breakpoint width. Null for the smallest (first) breakpoint.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n//\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\t// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\t// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $screen-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - 0.02, null);\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $screen-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Text Direction - ltr / rtl\n//\n// CSS defaults to use the ltr css, and adds [dir=rtl] selectors\n// to override ltr defaults.\n// ----------------------------------------------------------\n\n@mixin multi-dir() {\n @content;\n\n // $root: #{&};\n // @at-root [dir] {\n // #{$root} {\n // @content;\n // }\n // }\n}\n\n@mixin rtl() {\n $root: #{&};\n\n $rootSplit: str-split($root, ',');\n $selectors: #{add-root-selector($root, '[dir=rtl]')};\n $selectorsSplit: str-split($selectors, ',');\n\n $hostContextSelectors: ();\n $restSelectors: ();\n $dirSelectors: ();\n\n // Selectors must be split into individual selectors in case the browser\n // doesn't support a specific selector.\n // For example, Firefox and Safari doesn't support `:host-context()`.\n // If an invalid selector is used, then the entire group of selectors\n // will be ignored.\n // @link https://www.w3.org/TR/selectors-3/#grouping\n @each $selector in $selectorsSplit {\n // Group the selectors back into a single selector to optimize the output.\n @if str-index($selector, ':host-context') {\n $hostContextSelectors: append($hostContextSelectors, $selector, comma);\n } @else {\n // Group the selectors back into a single selector to optimize the output.\n $restSelectors: append($restSelectors, $selector, comma);\n }\n }\n\n // Supported by Chrome.\n @if length($hostContextSelectors) > 0 {\n @at-root #{$hostContextSelectors} {\n @content;\n }\n }\n\n // Supported by all browsers.\n @if length($restSelectors) > 0 {\n @at-root #{$restSelectors} {\n @content;\n }\n }\n\n // If browser can support `:dir()`, then add the `:dir()` selectors.\n @supports selector(:dir(rtl)) {\n // Adding :dir() in case the browser doesn't support `:host-context()` and does support `:dir()`.\n // `:host-context()` is added:\n // - through the `add-root-selector()` function.\n // - first so that it takes precedence over `:dir()`.\n // For example,\n // - Firefox doesn't support `:host-context()`, but does support `:dir()`.\n // - Safari doesn't support `:host-context()`, but Safari 16.4+ supports `:dir()`\n // @link https://webkit.org/blog/13966/webkit-features-in-safari-16-4/\n // -- However, there is a Webkit bug on v16 that prevents `:dir()` from working when\n // -- the app direction is changed dynamically. v17+ works fine.\n // -- @link https://bugs.webkit.org/show_bug.cgi?id=257133\n\n // Supported by Firefox.\n @at-root #{add-root-selector($root, \":dir(rtl)\", false)} {\n @content;\n }\n }\n}\n\n@mixin ltr() {\n @content;\n}\n\n// SVG Background Image Mixin\n// @param {string} $svg\n// ----------------------------------------------------------\n@mixin svg-background-image($svg, $flip-rtl: false) {\n $url: url-encode($svg);\n $viewBox: str-split(str-extract($svg, \"viewBox='\", \"'\"), ' ');\n\n @if $flip-rtl != true or $viewBox == null {\n @include multi-dir() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n } @else {\n $transform: \"transform='translate(#{nth($viewBox, 3)}, 0) scale(-1, 1)'\";\n $flipped-url: $svg;\n $flipped-url: str-replace($flipped-url, '<path', '<path #{$transform}');\n $flipped-url: str-replace($flipped-url, '<line', '<line #{$transform}');\n $flipped-url: str-replace($flipped-url, '<polygon', '<polygon #{$transform}');\n $flipped-url: url-encode($flipped-url);\n\n @include ltr() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n @include rtl() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$flipped-url}');\n }\n }\n}\n\n// Add property horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin property-horizontal($prop, $start, $end: $start) {\n @if $start == 0 and $end == 0 {\n #{$prop}-left: $start;\n #{$prop}-right: $end;\n } @else {\n -webkit-#{$prop}-start: $start;\n #{$prop}-inline-start: $start;\n -webkit-#{$prop}-end: $end;\n #{$prop}-inline-end: $end;\n }\n}\n\n// Add property for all directions\n// @param {string} $prop\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// @param {boolean} $content include content or use default\n// ----------------------------------------------------------\n@mixin property($prop, $top, $end: $top, $bottom: $top, $start: $end) {\n @include property-horizontal($prop, $start, $end);\n #{$prop}-top: $top;\n #{$prop}-bottom: $bottom;\n}\n\n// Add padding horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin padding-horizontal($start, $end: $start) {\n @include property-horizontal(padding, $start, $end);\n}\n\n// Add padding for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin padding($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(padding, $top, $end, $bottom, $start);\n}\n\n// Add margin horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin margin-horizontal($start, $end: $start) {\n @include property-horizontal(margin, $start, $end);\n}\n\n// Add margin for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin margin($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(margin, $top, $end, $bottom, $start);\n}\n\n// Add position horizontal\n// @param {string} $start - amount to position start\n// @param {string} $end - amount to left: 0; end\n// ----------------------------------------------------------\n@mixin position-horizontal($start: null, $end: null) {\n @if $start == $end {\n @include multi-dir() {\n left: $start;\n right: $end;\n }\n } @else {\n @at-root {\n @supports (inset-inline-start: 0) {\n & {\n inset-inline-start: $start;\n inset-inline-end: $end;\n }\n }\n }\n\n // TODO FW-3766\n @at-root {\n @supports not (inset-inline-start: 0) {\n & {\n @include ltr() {\n left: $start;\n right: $end;\n }\n @include rtl() {\n left: unset;\n right: unset;\n\n left: $end;\n right: $start;\n }\n }\n }\n }\n }\n}\n\n// Add position for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin position($top: null, $end: null, $bottom: null, $start: null) {\n @include position-horizontal($start, $end);\n top: $top;\n bottom: $bottom;\n}\n\n// Add border for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin border($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(border, $top, $end, $bottom, $start);\n}\n\n// Add border radius for all directions\n// @param {string} $top-start\n// @param {string} $top-end\n// @param {string} $bottom-end\n// @param {string} $bottom-start\n// ----------------------------------------------------------\n@mixin border-radius($top-start, $top-end: $top-start, $bottom-end: $top-start, $bottom-start: $top-end) {\n @if $top-start == $top-end and $top-start == $bottom-end and $top-start == $bottom-start {\n @include multi-dir() {\n border-radius: $top-start;\n }\n } @else {\n @include ltr() {\n border-top-left-radius: $top-start;\n border-top-right-radius: $top-end;\n border-bottom-right-radius: $bottom-end;\n border-bottom-left-radius: $bottom-start;\n }\n\n @include rtl() {\n border-top-left-radius: $top-end;\n border-top-right-radius: $top-start;\n border-bottom-right-radius: $bottom-start;\n border-bottom-left-radius: $bottom-end;\n }\n }\n}\n\n// Add direction for all directions\n// @param {string} $dir - Direction on LTR\n@mixin direction($dir) {\n $other-dir: null;\n\n @if $dir == ltr {\n $other-dir: rtl;\n } @else {\n $other-dir: ltr;\n }\n\n @include ltr() {\n direction: $dir;\n }\n @include rtl() {\n direction: $other-dir;\n }\n}\n\n// Add float for all directions\n// @param {string} $side\n// @param {string} $decorator - !important\n@mixin float($side, $decorator: null) {\n @if $side == start {\n @include ltr() {\n float: left $decorator;\n }\n @include rtl() {\n float: right $decorator;\n }\n } @else if $side == end {\n @include ltr() {\n float: right $decorator;\n }\n @include rtl() {\n float: left $decorator;\n }\n } @else {\n @include multi-dir() {\n float: $side $decorator;\n }\n }\n}\n\n@mixin background-position($horizontal, $horizontal-amount: null, $vertical: null, $vertical-amount: null) {\n @if $horizontal == start or $horizontal == end {\n $horizontal-ltr: null;\n $horizontal-rtl: null;\n @if $horizontal == start {\n $horizontal-ltr: left;\n $horizontal-rtl: right;\n } @else {\n $horizontal-ltr: right;\n $horizontal-rtl: left;\n }\n\n @include ltr() {\n background-position: $horizontal-ltr $horizontal-amount $vertical $vertical-amount;\n }\n @include rtl() {\n background-position: $horizontal-rtl $horizontal-amount $vertical $vertical-amount;\n }\n } @else {\n @include multi-dir() {\n background-position: $horizontal $horizontal-amount $vertical $vertical-amount;\n }\n }\n}\n\n@mixin transform-origin($x-axis, $y-axis: null) {\n @if $x-axis == start {\n @include ltr() {\n transform-origin: left $y-axis;\n }\n @include rtl() {\n transform-origin: right $y-axis;\n }\n } @else if $x-axis == end {\n @include ltr() {\n transform-origin: right $y-axis;\n }\n @include rtl() {\n transform-origin: left $y-axis;\n }\n } @else if $x-axis == left or $x-axis == right {\n @include multi-dir() {\n transform-origin: $x-axis $y-axis;\n }\n } @else {\n @include ltr() {\n transform-origin: $x-axis $y-axis;\n }\n @include rtl() {\n transform-origin: calc(100% - #{$x-axis}) $y-axis;\n }\n }\n}\n\n// Add transform for all directions\n// @param {string} $transforms - comma separated list of transforms\n@mixin transform($transforms...) {\n $extra: null;\n\n $x: null;\n $ltr-translate: null;\n $rtl-translate: null;\n\n @each $transform in $transforms {\n @if (str-index($transform, translate3d)) {\n $transform: str-replace($transform, 'translate3d(');\n $transform: str-replace($transform, ')');\n\n $coordinates: str-split($transform, ',');\n\n $x: nth($coordinates, 1);\n $y: nth($coordinates, 2);\n $z: nth($coordinates, 3);\n\n $ltr-translate: translate3d($x, $y, $z);\n $rtl-translate: translate3d(calc(-1 * #{$x}), $y, $z);\n } @else {\n @if $extra == null {\n $extra: $transform;\n } @else {\n $extra: $extra $transform;\n }\n }\n }\n\n @if $x == '0' or $x == null {\n @include multi-dir() {\n transform: $ltr-translate $extra;\n }\n } @else {\n @include ltr() {\n transform: $ltr-translate $extra;\n }\n\n @include rtl() {\n transform: $rtl-translate $extra;\n }\n }\n}\n","@import '../themes/capsule.globals.scss';\n\n// Capsule Font Family\n// --------------------------------------------------\n\nhtml {\n --cpsl-default-font: 'Helvetica', sans-serif;\n --cpsl-default-dynamic-font: -apple-system-body;\n --cpsl-font-family: var(--cpsl-default-font);\n}\n\nbody.backdrop-no-scroll {\n overflow: hidden;\n}\n\n// Capsule Colors\n// --------------------------------------------------\n// Generates the default color vars\n\n@mixin generate-color($color-name) {\n $value: map-get($colors, $color-name);\n\n --cpsl-color-#{$color-name}: #{$value};\n}\n\n// Capsule Border Radii\n// --------------------------------------------------\n// Generates the default border vars\n\n@mixin generate-border-radius($border-radius-name) {\n $value: map-get($borderRadii, $border-radius-name);\n\n --cpsl-border-radius-#{$border-radius-name}: #{$value};\n}\n\n// Capsule Font Sizes\n// --------------------------------------------------\n// Generates the default font sizes\n\n@mixin generate-font-size($font-size-name) {\n $value: map-get($fontSizes, $font-size-name);\n\n --cpsl-font-size-#{$font-size-name}: #{dynamic-font-clamp(0.8, $value, 1.5)};\n}\n\n:root {\n @each $color-name, $value in $colors {\n @include generate-color($color-name);\n }\n @each $border-radius-name, $value in $borderRadii {\n @include generate-border-radius($border-radius-name);\n }\n @each $font-size-name, $value in $fontSizes {\n @include generate-font-size($font-size-name);\n }\n}\n\n@keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n}\n@-moz-keyframes spin {\n 100% {\n -moz-transform: rotate(360deg);\n }\n}\n@-webkit-keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n }\n 50% {\n -webkit-transform: rotate(180deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n }\n}\n"]}
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../src/themes/capsule.functions.font.scss","../src/themes/capsule.mixins.scss","../src/css/capsule-core.scss"],"names":[],"mappings":"AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AC/CA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACZA;EACE;EACA;EACA;;;AAGF;EACE;;;AAiCF;EAvBE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAeF;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAGJ;EACE;IACE;;;AAGJ;EACE;IACE;;EAEF;IACE;;EAEF;IACE","file":"capsule-core.css","sourcesContent":["@use 'sass:math';\n\n$baselineSize: 16px !default;\n$baselineUnit: 1rem !default;\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font($size, $unit: $baselineUnit) {\n @return (math.div($size, $baselineSize)) * $unit;\n}\n\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font-max($size, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $maxScale: $size * $maxScale;\n\n @return min($baseScale, $maxScale);\n}\n\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font-min($minScale, $size, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $minScale: $size * $minScale;\n\n @return max($minScale, $baseScale);\n}\n\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n@function dynamic-font-clamp($minScale, $baseSize, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($baseSize, $unit);\n $maxScale: $baseSize * $maxScale;\n $minScale: $baseSize * $minScale;\n\n @return clamp($minScale, $baseScale, $maxScale);\n}\n","/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n@mixin tablet-viewport() {\n @media screen and (min-width: 768px) {\n @content;\n }\n}\n\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n@mixin mobile-viewport() {\n @media screen and (max-width: 767px) {\n @content;\n }\n}\n\n@mixin input-cover() {\n @include position(0, null, null, 0);\n @include margin(0);\n\n position: absolute;\n\n width: 100%;\n height: 100%;\n\n border: 0;\n background: transparent;\n cursor: pointer;\n\n appearance: none;\n outline: none;\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n@mixin visually-hidden() {\n position: absolute;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n width: 100%;\n height: 100%;\n\n margin: 0;\n padding: 0;\n\n border: 0;\n outline: 0;\n clip: rect(0 0 0 0);\n\n opacity: 0;\n overflow: hidden;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n@mixin text-inherit() {\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n text-align: inherit;\n white-space: inherit;\n color: inherit;\n}\n\n@mixin button-state() {\n @include position(0, 0, 0, 0);\n\n position: absolute;\n\n content: '';\n\n opacity: 0;\n}\n\n// Get the key from a map based on the index\n@function index-to-key($map, $index) {\n $keys: map-keys($map);\n\n @return nth($keys, $index);\n}\n\n// Breakpoint Mixins\n// ---------------------------------------------------------------------------------\n\n// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$screen-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// ---------------------------------------------------------------------------------\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $screen-breakpoints) {\n $min: map-get($breakpoints, $name);\n\n @return if($name != index-to-key($breakpoints, 1), $min, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $screen-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, '', '-#{$name}');\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $screen-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $screen-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Maximum breakpoint width. Null for the smallest (first) breakpoint.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n//\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\t// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\t// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $screen-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - 0.02, null);\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $screen-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Text Direction - ltr / rtl\n//\n// CSS defaults to use the ltr css, and adds [dir=rtl] selectors\n// to override ltr defaults.\n// ----------------------------------------------------------\n\n@mixin multi-dir() {\n @content;\n\n // $root: #{&};\n // @at-root [dir] {\n // #{$root} {\n // @content;\n // }\n // }\n}\n\n@mixin rtl() {\n $root: #{&};\n\n $rootSplit: str-split($root, ',');\n $selectors: #{add-root-selector($root, '[dir=rtl]')};\n $selectorsSplit: str-split($selectors, ',');\n\n $hostContextSelectors: ();\n $restSelectors: ();\n $dirSelectors: ();\n\n // Selectors must be split into individual selectors in case the browser\n // doesn't support a specific selector.\n // For example, Firefox and Safari doesn't support `:host-context()`.\n // If an invalid selector is used, then the entire group of selectors\n // will be ignored.\n // @link https://www.w3.org/TR/selectors-3/#grouping\n @each $selector in $selectorsSplit {\n // Group the selectors back into a single selector to optimize the output.\n @if str-index($selector, ':host-context') {\n $hostContextSelectors: append($hostContextSelectors, $selector, comma);\n } @else {\n // Group the selectors back into a single selector to optimize the output.\n $restSelectors: append($restSelectors, $selector, comma);\n }\n }\n\n // Supported by Chrome.\n @if length($hostContextSelectors) > 0 {\n @at-root #{$hostContextSelectors} {\n @content;\n }\n }\n\n // Supported by all browsers.\n @if length($restSelectors) > 0 {\n @at-root #{$restSelectors} {\n @content;\n }\n }\n\n // If browser can support `:dir()`, then add the `:dir()` selectors.\n @supports selector(:dir(rtl)) {\n // Adding :dir() in case the browser doesn't support `:host-context()` and does support `:dir()`.\n // `:host-context()` is added:\n // - through the `add-root-selector()` function.\n // - first so that it takes precedence over `:dir()`.\n // For example,\n // - Firefox doesn't support `:host-context()`, but does support `:dir()`.\n // - Safari doesn't support `:host-context()`, but Safari 16.4+ supports `:dir()`\n // @link https://webkit.org/blog/13966/webkit-features-in-safari-16-4/\n // -- However, there is a Webkit bug on v16 that prevents `:dir()` from working when\n // -- the app direction is changed dynamically. v17+ works fine.\n // -- @link https://bugs.webkit.org/show_bug.cgi?id=257133\n\n // Supported by Firefox.\n @at-root #{add-root-selector($root, \":dir(rtl)\", false)} {\n @content;\n }\n }\n}\n\n@mixin ltr() {\n @content;\n}\n\n// SVG Background Image Mixin\n// @param {string} $svg\n// ----------------------------------------------------------\n@mixin svg-background-image($svg, $flip-rtl: false) {\n $url: url-encode($svg);\n $viewBox: str-split(str-extract($svg, \"viewBox='\", \"'\"), ' ');\n\n @if $flip-rtl != true or $viewBox == null {\n @include multi-dir() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n } @else {\n $transform: \"transform='translate(#{nth($viewBox, 3)}, 0) scale(-1, 1)'\";\n $flipped-url: $svg;\n $flipped-url: str-replace($flipped-url, '<path', '<path #{$transform}');\n $flipped-url: str-replace($flipped-url, '<line', '<line #{$transform}');\n $flipped-url: str-replace($flipped-url, '<polygon', '<polygon #{$transform}');\n $flipped-url: url-encode($flipped-url);\n\n @include ltr() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n @include rtl() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$flipped-url}');\n }\n }\n}\n\n// Add property horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin property-horizontal($prop, $start, $end: $start) {\n @if $start == 0 and $end == 0 {\n #{$prop}-left: $start;\n #{$prop}-right: $end;\n } @else {\n -webkit-#{$prop}-start: $start;\n #{$prop}-inline-start: $start;\n -webkit-#{$prop}-end: $end;\n #{$prop}-inline-end: $end;\n }\n}\n\n// Add property for all directions\n// @param {string} $prop\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// @param {boolean} $content include content or use default\n// ----------------------------------------------------------\n@mixin property($prop, $top, $end: $top, $bottom: $top, $start: $end) {\n @include property-horizontal($prop, $start, $end);\n #{$prop}-top: $top;\n #{$prop}-bottom: $bottom;\n}\n\n// Add padding horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin padding-horizontal($start, $end: $start) {\n @include property-horizontal(padding, $start, $end);\n}\n\n// Add padding for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin padding($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(padding, $top, $end, $bottom, $start);\n}\n\n// Add margin horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin margin-horizontal($start, $end: $start) {\n @include property-horizontal(margin, $start, $end);\n}\n\n// Add margin for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin margin($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(margin, $top, $end, $bottom, $start);\n}\n\n// Add position horizontal\n// @param {string} $start - amount to position start\n// @param {string} $end - amount to left: 0; end\n// ----------------------------------------------------------\n@mixin position-horizontal($start: null, $end: null) {\n @if $start == $end {\n @include multi-dir() {\n left: $start;\n right: $end;\n }\n } @else {\n @at-root {\n @supports (inset-inline-start: 0) {\n & {\n inset-inline-start: $start;\n inset-inline-end: $end;\n }\n }\n }\n\n // TODO FW-3766\n @at-root {\n @supports not (inset-inline-start: 0) {\n & {\n @include ltr() {\n left: $start;\n right: $end;\n }\n @include rtl() {\n left: unset;\n right: unset;\n\n left: $end;\n right: $start;\n }\n }\n }\n }\n }\n}\n\n// Add position for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin position($top: null, $end: null, $bottom: null, $start: null) {\n @include position-horizontal($start, $end);\n top: $top;\n bottom: $bottom;\n}\n\n// Add border for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin border($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(border, $top, $end, $bottom, $start);\n}\n\n// Add border radius for all directions\n// @param {string} $top-start\n// @param {string} $top-end\n// @param {string} $bottom-end\n// @param {string} $bottom-start\n// ----------------------------------------------------------\n@mixin border-radius($top-start, $top-end: $top-start, $bottom-end: $top-start, $bottom-start: $top-end) {\n @if $top-start == $top-end and $top-start == $bottom-end and $top-start == $bottom-start {\n @include multi-dir() {\n border-radius: $top-start;\n }\n } @else {\n @include ltr() {\n border-top-left-radius: $top-start;\n border-top-right-radius: $top-end;\n border-bottom-right-radius: $bottom-end;\n border-bottom-left-radius: $bottom-start;\n }\n\n @include rtl() {\n border-top-left-radius: $top-end;\n border-top-right-radius: $top-start;\n border-bottom-right-radius: $bottom-start;\n border-bottom-left-radius: $bottom-end;\n }\n }\n}\n\n// Add direction for all directions\n// @param {string} $dir - Direction on LTR\n@mixin direction($dir) {\n $other-dir: null;\n\n @if $dir == ltr {\n $other-dir: rtl;\n } @else {\n $other-dir: ltr;\n }\n\n @include ltr() {\n direction: $dir;\n }\n @include rtl() {\n direction: $other-dir;\n }\n}\n\n// Add float for all directions\n// @param {string} $side\n// @param {string} $decorator - !important\n@mixin float($side, $decorator: null) {\n @if $side == start {\n @include ltr() {\n float: left $decorator;\n }\n @include rtl() {\n float: right $decorator;\n }\n } @else if $side == end {\n @include ltr() {\n float: right $decorator;\n }\n @include rtl() {\n float: left $decorator;\n }\n } @else {\n @include multi-dir() {\n float: $side $decorator;\n }\n }\n}\n\n@mixin background-position($horizontal, $horizontal-amount: null, $vertical: null, $vertical-amount: null) {\n @if $horizontal == start or $horizontal == end {\n $horizontal-ltr: null;\n $horizontal-rtl: null;\n @if $horizontal == start {\n $horizontal-ltr: left;\n $horizontal-rtl: right;\n } @else {\n $horizontal-ltr: right;\n $horizontal-rtl: left;\n }\n\n @include ltr() {\n background-position: $horizontal-ltr $horizontal-amount $vertical $vertical-amount;\n }\n @include rtl() {\n background-position: $horizontal-rtl $horizontal-amount $vertical $vertical-amount;\n }\n } @else {\n @include multi-dir() {\n background-position: $horizontal $horizontal-amount $vertical $vertical-amount;\n }\n }\n}\n\n@mixin transform-origin($x-axis, $y-axis: null) {\n @if $x-axis == start {\n @include ltr() {\n transform-origin: left $y-axis;\n }\n @include rtl() {\n transform-origin: right $y-axis;\n }\n } @else if $x-axis == end {\n @include ltr() {\n transform-origin: right $y-axis;\n }\n @include rtl() {\n transform-origin: left $y-axis;\n }\n } @else if $x-axis == left or $x-axis == right {\n @include multi-dir() {\n transform-origin: $x-axis $y-axis;\n }\n } @else {\n @include ltr() {\n transform-origin: $x-axis $y-axis;\n }\n @include rtl() {\n transform-origin: calc(100% - #{$x-axis}) $y-axis;\n }\n }\n}\n\n// Add transform for all directions\n// @param {string} $transforms - comma separated list of transforms\n@mixin transform($transforms...) {\n $extra: null;\n\n $x: null;\n $ltr-translate: null;\n $rtl-translate: null;\n\n @each $transform in $transforms {\n @if (str-index($transform, translate3d)) {\n $transform: str-replace($transform, 'translate3d(');\n $transform: str-replace($transform, ')');\n\n $coordinates: str-split($transform, ',');\n\n $x: nth($coordinates, 1);\n $y: nth($coordinates, 2);\n $z: nth($coordinates, 3);\n\n $ltr-translate: translate3d($x, $y, $z);\n $rtl-translate: translate3d(calc(-1 * #{$x}), $y, $z);\n } @else {\n @if $extra == null {\n $extra: $transform;\n } @else {\n $extra: $extra $transform;\n }\n }\n }\n\n @if $x == '0' or $x == null {\n @include multi-dir() {\n transform: $ltr-translate $extra;\n }\n } @else {\n @include ltr() {\n transform: $ltr-translate $extra;\n }\n\n @include rtl() {\n transform: $rtl-translate $extra;\n }\n }\n}\n","@import '../themes/capsule.globals.scss';\n\n// Capsule Font Family\n// --------------------------------------------------\n\nhtml {\n --cpsl-default-font: 'Helvetica', sans-serif;\n --cpsl-default-dynamic-font: -apple-system-body;\n --cpsl-font-family: var(--cpsl-default-font);\n}\n\nbody.backdrop-no-scroll {\n overflow: hidden;\n}\n\n// Capsule Colors\n// --------------------------------------------------\n// Generates the default color vars\n\n@mixin generate-color($color-name) {\n $value: map-get($colors, $color-name);\n\n --cpsl-color-#{$color-name}: #{$value};\n}\n\n// Capsule Border Radii\n// --------------------------------------------------\n// Generates the default border vars\n\n@mixin generate-border-radius($border-radius-name) {\n $value: map-get($borderRadii, $border-radius-name);\n\n --cpsl-border-radius-#{$border-radius-name}: #{$value};\n}\n\n// Capsule Font Sizes\n// --------------------------------------------------\n// Generates the default font sizes\n\n@mixin generate-font-size($font-size-name) {\n $value: map-get($fontSizes, $font-size-name);\n\n --cpsl-font-size-#{$font-size-name}: #{dynamic-font-clamp(0.8, $value, 1.5)};\n}\n\n:root {\n @each $color-name, $value in $colors {\n @include generate-color($color-name);\n }\n @each $border-radius-name, $value in $borderRadii {\n @include generate-border-radius($border-radius-name);\n }\n @each $font-size-name, $value in $fontSizes {\n @include generate-font-size($font-size-name);\n }\n}\n\n@keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n}\n@-moz-keyframes spin {\n 100% {\n -moz-transform: rotate(360deg);\n }\n}\n@-webkit-keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n }\n 50% {\n -webkit-transform: rotate(180deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n }\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,b as t}from"./p-
|
|
1
|
+
import{p as e,b as t}from"./p-86e48e61.js";export{s as setNonce}from"./p-86e48e61.js";import{g as l}from"./p-e1255160.js";const a=()=>{const t=import.meta.url;const s={};if(t!==""){s.resourcesUrl=new URL(".",t).href}return e(s)};a().then((async e=>{await l();return t([["p-d28b96ba",[[1,"cpsl-animation",{src:[1],replayAnimation:[64]}]]],["p-0d0a0037",[[1,"cpsl-col",{offset:[1],offsetXs:[1,"offset-xs"],offsetSm:[1,"offset-sm"],offsetMd:[1,"offset-md"],offsetLg:[1,"offset-lg"],offsetXl:[1,"offset-xl"],pull:[1],pullXs:[1,"pull-xs"],pullSm:[1,"pull-sm"],pullMd:[1,"pull-md"],pullLg:[1,"pull-lg"],pullXl:[1,"pull-xl"],push:[1],pushXs:[1,"push-xs"],pushSm:[1,"push-sm"],pushMd:[1,"push-md"],pushLg:[1,"push-lg"],pushXl:[1,"push-xl"],size:[1],sizeXs:[1,"size-xs"],sizeSm:[1,"size-sm"],sizeMd:[1,"size-md"],sizeLg:[1,"size-lg"],sizeXl:[1,"size-xl"]},[[9,"resize","onResize"]]]]],["p-fa078837",[[1,"cpsl-grid",{fixed:[4]}]]],["p-fcead80b",[[1,"cpsl-info-box"]]],["p-ad14a817",[[1,"cpsl-row"]]],["p-107e1ff5",[[1,"cpsl-pagination",{initialPage:[2,"initial-page"],totalPages:[2,"total-pages"],visiblePages:[1026,"visible-pages"],currentPage:[32]},null,{currentPage:["watchChange"]}],[1,"cpsl-alert",{icon:[1],variant:[1]}],[1,"cpsl-checkbox",{checked:[4]}],[1,"cpsl-code-input",{code:[1025],errorText:[1,"error-text"],helperText:[1,"helper-text"],length:[2],type:[1]}],[1,"cpsl-drawer",{anchor:[1],open:[4],size:[2],transitionDuration:[2,"transition-duration"],transitionFunction:[1,"transition-function"],variant:[1]}],[1,"cpsl-modal",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],footerExpanded:[4,"footer-expanded"],footerTransitionDuration:[2,"footer-transition-duration"],noOverlay:[4,"no-overlay"],open:[4],zIndexOverride:[2,"z-index-override"],hasFooter:[32]},null,{footerExpanded:["toggleHeight"],open:["toggleModal"]}],[1,"cpsl-slide-button",{disabled:[4],endIcon:[1,"end-icon"],endText:[1,"end-text"],startIcon:[1,"start-icon"],startText:[1,"start-text"]}],[1,"cpsl-table",{columns:[16],rows:[16]}],[1,"cpsl-tile-button",{src:[1],icon:[1]}],[1,"cpsl-app-bar",{height:[2],position:[1]}],[1,"cpsl-avatar",{alt:[1],src:[1],variant:[1]}],[1,"cpsl-card"],[1,"cpsl-divider"],[1,"cpsl-dropdown",{width:[1],hasCpslSearch:[4,"has-cpsl-search"],items:[16],selectedItem:[1040],isOpen:[32],searchQuery:[32],filteredItems:[32]},[[9,"resize","handleResize"]],{selectedItem:["handleSelectedItemChange"],isOpen:["handleOpenChange"]}],[1,"cpsl-input",{autocapitalize:[1],autocomplete:[1],autocorrect:[1],noAutoDisable:[4,"no-auto-disable"],autofocus:[4],disabled:[4],enterkeyhint:[1],errorText:[1,"error-text"],helperText:[1,"helper-text"],inputmode:[1],label:[1],max:[8],maxlength:[2],min:[8],minlength:[2],multiple:[4],name:[1],pattern:[1],placeholder:[1],readonly:[4],required:[4],showOptionalLabel:[4,"show-optional-label"],spellcheck:[4],startIconSrc:[1,"start-icon-src"],startIcon:[1,"start-icon"],step:[1],type:[1],value:[1025],hasFocus:[32]},null,{disabled:["handleDisable"]}],[1,"cpsl-nav-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-pill",{text:[1]}],[1,"cpsl-progress-indicator",{totalSteps:[2,"total-steps"],step:[2]}],[1,"cpsl-qr-code",{url:[1],imageSrc:[1,"image-src"],size:[2]}],[1,"cpsl-radio",{checked:[4]}],[1,"cpsl-spinner",{size:[2],speed:[2]}],[1,"cpsl-switch",{checked:[4]}],[1,"cpsl-tab",{selected:[4],tab:[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{fullWidth:[4,"full-width"],selectedTab:[1,"selected-tab"],selectedTabRect:[32],loaded:[32]},null,{fullWidth:["updateSlider"],selectedTab:["updateTab"]}],[1,"cpsl-button",{disabled:[516],fullWidth:[4,"full-width"],size:[1],variant:[1]}],[1,"cpsl-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-overlay",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],open:[4],zIndexOverride:[2,"z-index-override"]},null,{open:["toggleHeight"]}],[1,"cpsl-text",{color:[1],variant:[1],weight:[1]}],[1,"cpsl-icon",{src:[1],icon:[1]}]]]],e)}));
|
|
2
2
|
//# sourceMappingURL=capsule.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","src","replayAnimation","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","pull","pullXs","pullSm","pullMd","pullLg","pullXl","push","pushXs","pushSm","pushMd","pushLg","pushXl","size","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","fixed","code","errorText","helperText","length","type","
|
|
1
|
+
{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","src","replayAnimation","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","pull","pullXs","pullSm","pullMd","pullLg","pullXl","push","pushXs","pushSm","pushMd","pushLg","pushXl","size","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","fixed","initialPage","totalPages","visiblePages","currentPage","icon","variant","checked","code","errorText","helperText","length","type","anchor","open","transitionDuration","transitionFunction","enterTransitionDuration","exitTransitionDuration","footerExpanded","footerTransitionDuration","noOverlay","zIndexOverride","hasFooter","disabled","endIcon","endText","startIcon","startText","columns","rows","height","position","alt","width","hasCpslSearch","items","selectedItem","isOpen","searchQuery","filteredItems","autocapitalize","autocomplete","autocorrect","noAutoDisable","autofocus","enterkeyhint","inputmode","label","max","maxlength","min","minlength","multiple","name","pattern","placeholder","readonly","required","showOptionalLabel","spellcheck","startIconSrc","step","value","hasFocus","selectedId","text","totalSteps","imageSrc","speed","selected","tab","fullWidth","selectedTab","selectedTabRect","loaded","color","weight"],"sources":["../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.12.5 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n // NOTE!! This fn cannot use async/await!\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo('Running in development mode.');\n }\n if (BUILD.cloneNodeFix) {\n // opted-in to polyfill cloneNode() for slot polyfilled components\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts\n ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n s.getAttribute('data-stencil-namespace') === NAMESPACE)\n : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n if (importMeta !== '') {\n opts.resourcesUrl = new URL('.', importMeta).href;\n }\n return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function (deep) {\n if (this.nodeName === 'TEMPLATE') {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAKA,MAAMA,EAAe,KAajB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACnBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACrD,CACI,OAAOC,EAAeJ,EAAK,ECnB/BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAc,oCAA8B,CAAOC,IAAE,IAAAC,gBAAA,uCAAAC,OAAA,IAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,2EAAAC,MAAA,kHAAAC,YAAA,mBAAAC,WAAA,kBAAAC,aAAA,uBAAAC,YAAA,YAAAA,YAAA,mCAAAC,KAAA,IAAAC,QAAA,0BAAAC,QAAA,4BAAAC,KAAA,OAAAC,UAAA,iBAAAC,WAAA,kBAAAC,OAAA,IAAAC,KAAA,wBAAAC,OAAA,IAAAC,KAAA,IAAApB,KAAA,IAAAqB,mBAAA,0BAAAC,mBAAA,0BAAAV,QAAA,uBAAAW,wBAAA,gCAAAC,uBAAA,+BAAAC,eAAA,sBAAAC,yBAAA,iCAAAC,UAAA,iBAAAP,KAAA,IAAAQ,eAAA,uBAAAC,UAAA,YAAAJ,eAAA,iBAAAL,KAAA,0CAAAU,SAAA,IAAAC,QAAA,eAAAC,QAAA,eAAAC,UAAA,iBAAAC,UAAA,oCAAAC,QAAA,KAAAC,KAAA,8BAAAxD,IAAA,IAAA+B,KAAA,yBAAA0B,OAAA,IAAAC,SAAA,wBAAAC,IAAA,IAAA3D,IAAA,IAAAgC,QAAA,6DAAA4B,MAAA,IAAAC,cAAA,sBAAAC,MAAA,KAAAC,aAAA,OAAAC,OAAA,KAAAC,YAAA,KAAAC,cAAA,qCAAAH,aAAA,6BAAAC,OAAA,wCAAAG,eAAA,IAAAC,aAAA,IAAAC,YAAA,IAAAC,cAAA,sBAAAC,UAAA,IAAArB,SAAA,IAAAsB,aAAA,IAAArC,UAAA,iBAAAC,WAAA,kBAAAqC,UAAA,IAAAC,MAAA,IAAAC,IAAA,IAAAC,UAAA,IAAAC,IAAA,IAAAC,UAAA,IAAAC,SAAA,IAAAC,KAAA,IAAAC,QAAA,IAAAC,YAAA,IAAAC,SAAA,IAAAC,SAAA,IAAAC,kBAAA,0BAAAC,WAAA,IAAAC,aAAA,qBAAAlC,UAAA,iBAAAmC,KAAA,IAAAlD,KAAA,IAAAmD,MAAA,OAAAC,SAAA,YAAAxC,SAAA,gDAAAyC,WAAA,yBAAAA,WAAA,iCAAAC,KAAA,oCAAAC,WAAA,kBAAAL,KAAA,yBAAAnG,IAAA,IAAAyG,SAAA,gBAAA1E,KAAA,uBAAAa,QAAA,yBAAAb,KAAA,IAAA2E,MAAA,wBAAA9D,QAAA,qBAAA+D,SAAA,IAAAC,IAAA,8FAAAC,UAAA,iBAAAC,YAAA,mBAAAC,gBAAA,KAAAC,OAAA,YAAAH,UAAA,iBAAAC,YAAA,kCAAAjD,SAAA,MAAAgD,UAAA,iBAAA9E,KAAA,IAAAY,QAAA,8BAAA2D,WAAA,yBAAAA,WAAA,oCAAAhD,wBAAA,gCAAAC,uBAAA,+BAAAJ,KAAA,IAAAQ,eAAA,8BAAAR,KAAA,mCAAA8D,MAAA,IAAAtE,QAAA,IAAAuE,OAAA,sBAAAvG,IAAA,IAAA+B,KAAA,SAAAlC,EAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{D as o}from"./p-c2bf050b.js";const n=({borderRadius:o})=>{if(!Boolean(o)){return}let n=8;let t=16;let e=24;const r=1e3;let c=false;let s=false;switch(o){case"none":{s=true;n=0;t=0;e=0;break}case"xs":{n=4;t=12;e=20;break}case"md":{n=12;t=20;e=28;break}case"lg":{n=16;t=24;e=32;break}case"full":{n=16;t=24;e=32;c=true;break}}document.documentElement.style.setProperty("--cpsl-border-radius-input",`${c?r:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-alert",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tabs",`${c?r:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-primary-button",`${c?r:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-secondary-button",`${c?r:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tile-button",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-modal",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-pill",`${s?0:r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-qr-code",`${e}px`);document.documentElement.style.setProperty("--cpsl-border-radius-info-box",`${n}px`)};const t={body2XS:"body-2xs",bodyXS:"body-xs",bodyS:"body-s",bodyM:"body-m",bodyL:"body-l",bodyXL:"body-xl",headingXS:"heading-xs",headingS:"heading-s",headingM:"heading-m",headingL:"heading-l",headingXL:"heading-xl",heading2XL:"heading-2xl"};const e=({font:o,customFontSizes:n})=>{if(Boolean(o)){document.documentElement.style.setProperty("--cpsl-default-font",o)}Object.entries(t).forEach((([o,t])=>{if(n===null||n===void 0?void 0:n[o]){document.documentElement.style.setProperty(`--cpsl-font-size-${t}`,n[o])}else{document.documentElement.style.removeProperty(`--cpsl-font-size-${t}`)}}))};function r(o,n,t){return Math.min(Math.max(o,t),n)}class c extends Error{constructor(o){super(`Failed to parse color: "${o}"`)}}var s=c;function d(o){if(typeof o!=="string")throw new s(o);if(o.trim().toLowerCase()==="transparent")return[0,0,0,0];let n=o.trim();n=m.test(o)?_(o):o;const t=f.exec(n);if(t){const o=Array.from(t).slice(1);return[...o.slice(0,3).map((o=>parseInt(i(o,2),16))),parseInt(i(o[3]||"f",2),16)/255]}const e=p.exec(n);if(e){const o=Array.from(e).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,16))),parseInt(o[3]||"ff",16)/255]}const c=b.exec(n);if(c){const o=Array.from(c).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,10))),parseFloat(o[3]||"1")]}const d=g.exec(n);if(d){const[n,t,e,c]=Array.from(d).slice(1).map(parseFloat);if(r(0,100,t)!==t)throw new s(o);if(r(0,100,e)!==e)throw new s(o);return[...k(n,t,e),Number.isNaN(c)?1:c]}throw new s(o)}function l(o){let n=5381;let t=o.length;while(t){n=n*33^o.charCodeAt(--t)}return(n>>>0)%2341}const u=o=>parseInt(o.replace(/_/g,""),36);const a="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce(((o,n)=>{const t=u(n.substring(0,3));const e=u(n.substring(3)).toString(16);let r="";for(let o=0;o<6-e.length;o++){r+="0"}o[t]=`${r}${e}`;return o}),{});function _(o){const n=o.toLowerCase().trim();const t=a[l(n)];if(!t)throw new s(o);return`#${t}`}const i=(o,n)=>Array.from(Array(n)).map((()=>o)).join("");const f=new RegExp(`^#${i("([a-f0-9])",3)}([a-f0-9])?$`,"i");const p=new RegExp(`^#${i("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i");const b=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${i(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i");const g=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i;const m=/^[a-z]+$/i;const z=o=>Math.round(o*255);const k=(o,n,t)=>{let e=t/100;if(n===0){return[e,e,e].map(z)}const r=(o%360+360)%360/60;const c=(1-Math.abs(2*e-1))*(n/100);const s=c*(1-Math.abs(r%2-1));let d=0;let l=0;let u=0;if(r>=0&&r<1){d=c;l=s}else if(r>=1&&r<2){d=s;l=c}else if(r>=2&&r<3){l=c;u=s}else if(r>=3&&r<4){l=s;u=c}else if(r>=4&&r<5){d=s;u=c}else if(r>=5&&r<6){d=c;u=s}const a=e-c/2;const _=d+a;const i=l+a;const f=u+a;return[_,i,f].map(z)};function y(o){if(o==="transparent")return 0;function n(o){const n=o/255;return n<=.04045?n/12.92:Math.pow((n+.055)/1.055,2.4)}const[t,e,r]=d(o);return.2126*n(t)+.7152*n(e)+.0722*n(r)}function h(o,n,t,e){return`rgba(${r(0,255,o).toFixed()}, ${r(0,255,n).toFixed()}, ${r(0,255,t).toFixed()}, ${parseFloat(r(0,1,e).toFixed(3))})`}function x(o,n,t){const e=(o,n)=>n===3?o:o/255;const[r,c,s,l]=d(o).map(e);const[u,a,_,i]=d(n).map(e);const f=i-l;const p=t*2-1;const b=p*f===-1?p:p+f/(1+p*f);const g=(b+1)/2;const m=1-g;const z=(r*m+u*g)*255;const k=(c*m+a*g)*255;const y=(s*m+_*g)*255;const x=i*t+l*(1-t);return h(z,k,y,x)}function w(o){return y(o)>.179}const j=o=>{const n=(new Option).style;n.color=o;return n.color!==""};const $=o=>o.replace(/([a-z0–9])([A-Z])/g,"$1-$2").toLowerCase();const v=(o,n)=>{let t={};for(const e in n){const r=`${o}-${$(e)}`;if(typeof n[e]==="object"&&n[e]!==null){t=Object.assign(Object.assign({},t),v(r,n[e]))}else{t[r]=n[e]}}return t};const q=o=>v("--cpsl-color",o);const F=[0,.08,.16,.32,.48,.64,.8,.96];const C=({foregroundColor:n,backgroundColor:t,customPalette:e})=>{if(!Boolean(n)||!j(n)){n=o.foregroundColor}if(!Boolean(t)||!j(t)){t=o.backgroundColor}const r=!w(t);const c={foregroundColors:[],backgroundColors:[],isDarkBackground:r};const s=r?"#FFFFFF":"#000000";const d=r?"#000000":"#FFFFFF";F.forEach((o=>{c.foregroundColors.push(x(n,d,o));c.backgroundColors.push(x(t,s,o))}));document.documentElement.style.setProperty("--cpsl-color-background-0",c.backgroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-background-8",c.backgroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-background-16",c.backgroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-background-32",c.backgroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-background-48",c.backgroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-background-64",c.backgroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-background-80",c.backgroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-background-96",c.backgroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-foreground-0",c.foregroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-foreground-8",c.foregroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-foreground-16",c.foregroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-foreground-32",c.foregroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-foreground-48",c.foregroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-foreground-64",c.foregroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-foreground-80",c.foregroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-foreground-96",c.foregroundColors[7]);if(Boolean(e)){const o=q(e);Object.entries(o).forEach((([o,n])=>document.documentElement.style.setProperty(o,n)))}return c};const M=({foregroundColor:t=o.foregroundColor,backgroundColor:r=o.backgroundColor,font:c,customPalette:s,borderRadius:d,customFontSizes:l})=>{const u=C({foregroundColor:t,backgroundColor:r,customPalette:s});e({font:c,customFontSizes:l});n({borderRadius:d});return u.isDarkBackground};export{M as generateTheme};
|
|
1
|
+
import{D as o,C as n,U as t}from"./p-b6b38e73.js";const r=({borderRadius:o})=>{if(!Boolean(o)){return}let n,t,r,e;const c=1e3;let s=false;let u=false;switch(o){case"none":{u=true;n=0;t=0;r=0;e=0;break}case"xs":{n=2;t=4;r=12;e=20;break}case"sm":{n=2;t=8;r=16;e=24;break}case"lg":{n=8;t=16;r=24;e=32;break}case"full":{n=8;t=16;r=24;e=32;s=true;break}default:case"md":{n=4;t=12;r=20;e=28;break}}document.documentElement.style.setProperty("--cpsl-border-radius-input",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-alert",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tabs",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-primary-button",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-secondary-button",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tile-button",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-modal",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-pill",`${u?0:c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-qr-code",`${e}px`);document.documentElement.style.setProperty("--cpsl-border-radius-info-box",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-table-container",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-switch",`${u?0:c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-checkbox",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-radio",`${c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-avatar",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-card",`${r}px`)};const e={body2XS:"body-2xs",bodyXS:"body-xs",bodyS:"body-s",bodyM:"body-m",bodyL:"body-l",bodyXL:"body-xl",headingXS:"heading-xs",headingS:"heading-s",headingM:"heading-m",headingL:"heading-l",headingXL:"heading-xl",heading2XL:"heading-2xl"};const c=({font:o,customFontSizes:n})=>{if(Boolean(o)){document.documentElement.style.setProperty("--cpsl-default-font",o)}Object.entries(e).forEach((([o,t])=>{if(n===null||n===void 0?void 0:n[o]){document.documentElement.style.setProperty(`--cpsl-font-size-${t}`,n[o])}else{document.documentElement.style.removeProperty(`--cpsl-font-size-${t}`)}}))};function s(o,n,t){return Math.min(Math.max(o,t),n)}class u extends Error{constructor(o){super(`Failed to parse color: "${o}"`)}}var d=u;function a(o){if(typeof o!=="string")throw new d(o);if(o.trim().toLowerCase()==="transparent")return[0,0,0,0];let n=o.trim();n=k.test(o)?f(o):o;const t=b.exec(n);if(t){const o=Array.from(t).slice(1);return[...o.slice(0,3).map((o=>parseInt(p(o,2),16))),parseInt(p(o[3]||"f",2),16)/255]}const r=g.exec(n);if(r){const o=Array.from(r).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,16))),parseInt(o[3]||"ff",16)/255]}const e=m.exec(n);if(e){const o=Array.from(e).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,10))),parseFloat(o[3]||"1")]}const c=h.exec(n);if(c){const[n,t,r,e]=Array.from(c).slice(1).map(parseFloat);if(s(0,100,t)!==t)throw new d(o);if(s(0,100,r)!==r)throw new d(o);return[...y(n,t,r),Number.isNaN(e)?1:e]}throw new d(o)}function l(o){let n=5381;let t=o.length;while(t){n=n*33^o.charCodeAt(--t)}return(n>>>0)%2341}const i=o=>parseInt(o.replace(/_/g,""),36);const _="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce(((o,n)=>{const t=i(n.substring(0,3));const r=i(n.substring(3)).toString(16);let e="";for(let o=0;o<6-r.length;o++){e+="0"}o[t]=`${e}${r}`;return o}),{});function f(o){const n=o.toLowerCase().trim();const t=_[l(n)];if(!t)throw new d(o);return`#${t}`}const p=(o,n)=>Array.from(Array(n)).map((()=>o)).join("");const b=new RegExp(`^#${p("([a-f0-9])",3)}([a-f0-9])?$`,"i");const g=new RegExp(`^#${p("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i");const m=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${p(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i");const h=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i;const k=/^[a-z]+$/i;const z=o=>Math.round(o*255);const y=(o,n,t)=>{let r=t/100;if(n===0){return[r,r,r].map(z)}const e=(o%360+360)%360/60;const c=(1-Math.abs(2*r-1))*(n/100);const s=c*(1-Math.abs(e%2-1));let u=0;let d=0;let a=0;if(e>=0&&e<1){u=c;d=s}else if(e>=1&&e<2){u=s;d=c}else if(e>=2&&e<3){d=c;a=s}else if(e>=3&&e<4){d=s;a=c}else if(e>=4&&e<5){u=s;a=c}else if(e>=5&&e<6){u=c;a=s}const l=r-c/2;const i=u+l;const _=d+l;const f=a+l;return[i,_,f].map(z)};function x(o){if(o==="transparent")return 0;function n(o){const n=o/255;return n<=.04045?n/12.92:Math.pow((n+.055)/1.055,2.4)}const[t,r,e]=a(o);return.2126*n(t)+.7152*n(r)+.0722*n(e)}function w(o,n,t,r){return`rgba(${s(0,255,o).toFixed()}, ${s(0,255,n).toFixed()}, ${s(0,255,t).toFixed()}, ${parseFloat(s(0,1,r).toFixed(3))})`}function $(o,n,t){const r=(o,n)=>n===3?o:o/255;const[e,c,s,u]=a(o).map(r);const[d,l,i,_]=a(n).map(r);const f=_-u;const p=t*2-1;const b=p*f===-1?p:p+f/(1+p*f);const g=(b+1)/2;const m=1-g;const h=(e*m+d*g)*255;const k=(c*m+l*g)*255;const z=(s*m+i*g)*255;const y=_*t+u*(1-t);return w(h,k,z,y)}function j(o){return x(o)>.179}function v(o,n,t){return{r:255*t(o.r/255,n.r/255),g:255*t(o.g/255,n.g/255),b:255*t(o.b/255,n.b/255)}}function q(o,n){return o*n}function F(o,n){return o+n-o*n}function M(o,n){return C(n,o)}function C(o,n){return n<=.5?q(o,2*n):F(o,2*n-1)}function S(o,n,t){return Math.min(Math.max(o||0,n),t)}function A(o){return{r:S(o.r,0,255),g:S(o.g,0,255),b:S(o.b,0,255),a:S(o.a,0,1)}}function I(o){return{r:255*o.r,g:255*o.g,b:255*o.b,a:o.a}}function O(o){return{r:o.r/255,g:o.g/255,b:o.b/255,a:o.a}}function B(o,n){void 0===n&&(n=0);var t=Math.pow(10,n);return{r:Math.round(o.r*t)/t,g:Math.round(o.g*t)/t,b:Math.round(o.b*t)/t,a:o.a}}function R(o,n,t,r,e,c){return(1-n/t)*r+n/t*Math.round((1-o)*e+o*c)}function X(o,n,t,r,e){void 0===e&&(e={unitInput:!1,unitOutput:!1,roundOutput:!0}),e.unitInput&&(o=I(o),n=I(n)),o=A(o);var c=(n=A(n)).a+o.a-n.a*o.a,s=t(o,n,r),u=A({r:R(o.a,n.a,c,o.r,n.r,s.r),g:R(o.a,n.a,c,o.g,n.g,s.g),b:R(o.a,n.a,c,o.b,n.b,s.b),a:c});return u=e.unitOutput?O(u):e.roundOutput?B(u):function(o){return B(o,9)}(u),u}function L(o,n){return X(o,n,v,M)}const E=o=>{const n=(new Option).style;n.color=o;return n.color!==""};const P=o=>o.replace(/([a-z0–9])([A-Z])/g,"$1-$2").toLowerCase();const D=(o,n)=>{let t={};for(const r in n){const e=`${o}-${P(r)}`;if(typeof n[r]==="object"&&n[r]!==null){t=Object.assign(Object.assign({},t),D(e,n[r]))}else{t[e]=n[r]}}return t};const N=o=>D("--cpsl-color",o);const U=(o,n)=>{const t=a(o);const r=a(n);const e=L({r:t[0],g:t[1],b:t[2],a:.1},{r:r[0],g:r[1],b:r[2],a:r[3]});return w(e.r,e.g,e.b,e.a)};const Z=({foregroundColor:r,backgroundColor:e,customPalette:c})=>{if(!Boolean(r)||!E(r)){r=o.foregroundColor}if(!Boolean(e)||!E(e)){e=o.backgroundColor}const s=!j(e);const u={foregroundColors:[],backgroundColors:[],isDarkBackground:s};const d=s?"#FFFFFF":"#000000";const a=s?"#000000":"#FFFFFF";n.forEach((o=>{u.foregroundColors.push($(r,a,o));u.backgroundColors.push($(e,d,o))}));document.documentElement.style.setProperty("--cpsl-color-background-0",u.backgroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-background-4",u.backgroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-background-8",u.backgroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-background-16",u.backgroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-background-32",u.backgroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-background-48",u.backgroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-background-64",u.backgroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-background-80",u.backgroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-background-96",u.backgroundColors[8]);document.documentElement.style.setProperty("--cpsl-color-foreground-0",u.foregroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-foreground-4",u.foregroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-foreground-8",u.foregroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-foreground-16",u.foregroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-foreground-32",u.foregroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-foreground-48",u.foregroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-foreground-64",u.foregroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-foreground-80",u.foregroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-foreground-96",u.foregroundColors[8]);document.documentElement.style.setProperty("--cpsl-color-utility-red",U(r,t.red));document.documentElement.style.setProperty("--cpsl-color-utility-yellow",U(r,t.yellow));document.documentElement.style.setProperty("--cpsl-color-utility-green",U(r,t.green));if(Boolean(c)){const o=N(c);Object.entries(o).forEach((([o,n])=>document.documentElement.style.setProperty(o,n)))}return u};const G=({foregroundColor:n=o.foregroundColor,backgroundColor:t=o.backgroundColor,font:e,customPalette:s,borderRadius:u,customFontSizes:d})=>{const a=Z({foregroundColor:n,backgroundColor:t,customPalette:s});c({font:e,customFontSizes:d});r({borderRadius:u});return a.isDarkBackground};export{G as generateTheme};
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["generateBorderRadii","borderRadius","Boolean","smallRadius","mediumRadius","largeRadius","fullRadius","isFull","isNone","document","documentElement","style","setProperty","FONT_NAME_MAP","body2XS","bodyXS","bodyS","bodyM","bodyL","bodyXL","headingXS","headingS","headingM","headingL","headingXL","heading2XL","generateFont","font","customFontSizes","Object","entries","forEach","key","value","removeProperty","guard","low","high","Math","min","max","ColorError","Error","constructor","color","super","ColorError$1","parseToRgba","trim","toLowerCase","normalizedColor","namedColorRegex","test","nameToHex","reducedHexMatch","reducedHexRegex","exec","arr","Array","from","slice","map","x","parseInt","r","hexMatch","hexRegex","rgbaMatch","rgbaRegex","parseFloat","hslaMatch","hslaRegex","h","s","l","a","hslToRgb","Number","isNaN","hash","str","i","length","charCodeAt","colorToInt","replace","compressedColorMap","split","reduce","acc","next","substring","hex","toString","prefix","normalizedColorName","result","amount","join","RegExp","roundColor","round","hue","saturation","lightness","huePrime","chroma","abs","secondComponent","red","green","blue","lightnessModification","finalRed","finalGreen","finalBlue","getLuminance","f","channel","pow","g","b","rgba","alpha","toFixed","mix","color1","color2","weight","normalize","n","index","r1","g1","b1","a1","r2","g2","b2","a2","alphaDelta","normalizedWeight","combinedWeight","weight2","weight1","readableColorIsBlack","isColor","strColor","Option","toKebabCase","pascal","buildVars","prev","obj","resp","k","name","assign","getCssColors","customPalette","MIXES","generatePalette","foregroundColor","backgroundColor","DEFAULT_THEME","isDarkBackground","palette","foregroundColors","backgroundColors","backgroundMixColor","foregroundMixColor","push","cssColorVars","v","generateTheme"],"sources":["src/utils/theme/generateBorderRadii.ts","src/utils/theme/generateFont.ts","../node_modules/color2k/dist/index.module.es.js","src/utils/theme/utils.ts","src/utils/theme/generatePalette.ts","src/utils/theme/generateTheme.ts"],"sourcesContent":["import { Theme } from '../../interface';\n\nexport const generateBorderRadii = ({ borderRadius }: Pick<Theme, 'borderRadius'>) => {\n if (!Boolean(borderRadius)) {\n return;\n }\n\n let smallRadius = 8;\n let mediumRadius = 16;\n let largeRadius = 24;\n const fullRadius = 1000;\n let isFull = false;\n let isNone = false;\n\n switch (borderRadius) {\n case 'none': {\n isNone = true;\n smallRadius = 0;\n mediumRadius = 0;\n largeRadius = 0;\n break;\n }\n case 'xs': {\n smallRadius = 4;\n mediumRadius = 12;\n largeRadius = 20;\n break;\n }\n case 'md': {\n smallRadius = 12;\n mediumRadius = 20;\n largeRadius = 28;\n break;\n }\n case 'lg': {\n smallRadius = 16;\n mediumRadius = 24;\n largeRadius = 32;\n break;\n }\n case 'full': {\n smallRadius = 16;\n mediumRadius = 24;\n largeRadius = 32;\n isFull = true;\n break;\n }\n }\n\n document.documentElement.style.setProperty('--cpsl-border-radius-input', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-alert', `${smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-tabs', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-primary-button', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-secondary-button', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-tile-button', `${smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-modal', `${mediumRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-pill', `${isNone ? 0 : fullRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-qr-code', `${largeRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-info-box', `${smallRadius}px`);\n};\n","import { Theme } from '../../interface';\n\nconst FONT_NAME_MAP = {\n body2XS: 'body-2xs',\n bodyXS: 'body-xs',\n bodyS: 'body-s',\n bodyM: 'body-m',\n bodyL: 'body-l',\n bodyXL: 'body-xl',\n headingXS: 'heading-xs',\n headingS: 'heading-s',\n headingM: 'heading-m',\n headingL: 'heading-l',\n headingXL: 'heading-xl',\n heading2XL: 'heading-2xl',\n};\n\nexport const generateFont = ({ font, customFontSizes }: Pick<Theme, 'font' | 'customFontSizes'>) => {\n if (Boolean(font)) {\n document.documentElement.style.setProperty('--cpsl-default-font', font);\n }\n\n Object.entries(FONT_NAME_MAP).forEach(([key, value]) => {\n if (customFontSizes?.[key]) {\n document.documentElement.style.setProperty(`--cpsl-font-size-${value}`, customFontSizes[key]);\n } else {\n document.documentElement.style.removeProperty(`--cpsl-font-size-${value}`);\n }\n });\n};\n","/**\n * A simple guard function:\n *\n * ```js\n * Math.min(Math.max(low, value), high)\n * ```\n */\nfunction guard(low, high, value) {\n return Math.min(Math.max(low, value), high);\n}\n\nclass ColorError extends Error {\n constructor(color) {\n super(`Failed to parse color: \"${color}\"`);\n }\n}\nvar ColorError$1 = ColorError;\n\n/**\n * Parses a color into red, gree, blue, alpha parts\n *\n * @param color the input color. Can be a RGB, RBGA, HSL, HSLA, or named color\n */\nfunction parseToRgba(color) {\n if (typeof color !== 'string') throw new ColorError$1(color);\n if (color.trim().toLowerCase() === 'transparent') return [0, 0, 0, 0];\n let normalizedColor = color.trim();\n normalizedColor = namedColorRegex.test(color) ? nameToHex(color) : color;\n const reducedHexMatch = reducedHexRegex.exec(normalizedColor);\n if (reducedHexMatch) {\n const arr = Array.from(reducedHexMatch).slice(1);\n return [...arr.slice(0, 3).map(x => parseInt(r(x, 2), 16)), parseInt(r(arr[3] || 'f', 2), 16) / 255];\n }\n const hexMatch = hexRegex.exec(normalizedColor);\n if (hexMatch) {\n const arr = Array.from(hexMatch).slice(1);\n return [...arr.slice(0, 3).map(x => parseInt(x, 16)), parseInt(arr[3] || 'ff', 16) / 255];\n }\n const rgbaMatch = rgbaRegex.exec(normalizedColor);\n if (rgbaMatch) {\n const arr = Array.from(rgbaMatch).slice(1);\n return [...arr.slice(0, 3).map(x => parseInt(x, 10)), parseFloat(arr[3] || '1')];\n }\n const hslaMatch = hslaRegex.exec(normalizedColor);\n if (hslaMatch) {\n const [h, s, l, a] = Array.from(hslaMatch).slice(1).map(parseFloat);\n if (guard(0, 100, s) !== s) throw new ColorError$1(color);\n if (guard(0, 100, l) !== l) throw new ColorError$1(color);\n return [...hslToRgb(h, s, l), Number.isNaN(a) ? 1 : a];\n }\n throw new ColorError$1(color);\n}\nfunction hash(str) {\n let hash = 5381;\n let i = str.length;\n while (i) {\n hash = hash * 33 ^ str.charCodeAt(--i);\n }\n\n /* JavaScript does bitwise operations (like XOR, above) on 32-bit signed\n * integers. Since we want the results to be always positive, convert the\n * signed int to an unsigned by doing an unsigned bitshift. */\n return (hash >>> 0) % 2341;\n}\nconst colorToInt = x => parseInt(x.replace(/_/g, ''), 36);\nconst compressedColorMap = '1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm'.split(' ').reduce((acc, next) => {\n const key = colorToInt(next.substring(0, 3));\n const hex = colorToInt(next.substring(3)).toString(16);\n\n // NOTE: padStart could be used here but it breaks Node 6 compat\n // https://github.com/ricokahler/color2k/issues/351\n let prefix = '';\n for (let i = 0; i < 6 - hex.length; i++) {\n prefix += '0';\n }\n acc[key] = `${prefix}${hex}`;\n return acc;\n}, {});\n\n/**\n * Checks if a string is a CSS named color and returns its equivalent hex value, otherwise returns the original color.\n */\nfunction nameToHex(color) {\n const normalizedColorName = color.toLowerCase().trim();\n const result = compressedColorMap[hash(normalizedColorName)];\n if (!result) throw new ColorError$1(color);\n return `#${result}`;\n}\nconst r = (str, amount) => Array.from(Array(amount)).map(() => str).join('');\nconst reducedHexRegex = new RegExp(`^#${r('([a-f0-9])', 3)}([a-f0-9])?$`, 'i');\nconst hexRegex = new RegExp(`^#${r('([a-f0-9]{2})', 3)}([a-f0-9]{2})?$`, 'i');\nconst rgbaRegex = new RegExp(`^rgba?\\\\(\\\\s*(\\\\d+)\\\\s*${r(',\\\\s*(\\\\d+)\\\\s*', 2)}(?:,\\\\s*([\\\\d.]+))?\\\\s*\\\\)$`, 'i');\nconst hslaRegex = /^hsla?\\(\\s*([\\d.]+)\\s*,\\s*([\\d.]+)%\\s*,\\s*([\\d.]+)%(?:\\s*,\\s*([\\d.]+))?\\s*\\)$/i;\nconst namedColorRegex = /^[a-z]+$/i;\nconst roundColor = color => {\n return Math.round(color * 255);\n};\nconst hslToRgb = (hue, saturation, lightness) => {\n let l = lightness / 100;\n if (saturation === 0) {\n // achromatic\n return [l, l, l].map(roundColor);\n }\n\n // formulae from https://en.wikipedia.org/wiki/HSL_and_HSV\n const huePrime = (hue % 360 + 360) % 360 / 60;\n const chroma = (1 - Math.abs(2 * l - 1)) * (saturation / 100);\n const secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));\n let red = 0;\n let green = 0;\n let blue = 0;\n if (huePrime >= 0 && huePrime < 1) {\n red = chroma;\n green = secondComponent;\n } else if (huePrime >= 1 && huePrime < 2) {\n red = secondComponent;\n green = chroma;\n } else if (huePrime >= 2 && huePrime < 3) {\n green = chroma;\n blue = secondComponent;\n } else if (huePrime >= 3 && huePrime < 4) {\n green = secondComponent;\n blue = chroma;\n } else if (huePrime >= 4 && huePrime < 5) {\n red = secondComponent;\n blue = chroma;\n } else if (huePrime >= 5 && huePrime < 6) {\n red = chroma;\n blue = secondComponent;\n }\n const lightnessModification = l - chroma / 2;\n const finalRed = red + lightnessModification;\n const finalGreen = green + lightnessModification;\n const finalBlue = blue + lightnessModification;\n return [finalRed, finalGreen, finalBlue].map(roundColor);\n};\n\n// taken from:\n// https://github.com/styled-components/polished/blob/a23a6a2bb26802b3d922d9c3b67bac3f3a54a310/src/internalHelpers/_rgbToHsl.js\n\n/**\n * Parses a color in hue, saturation, lightness, and the alpha channel.\n *\n * Hue is a number between 0 and 360, saturation, lightness, and alpha are\n * decimal percentages between 0 and 1\n */\nfunction parseToHsla(color) {\n const [red, green, blue, alpha] = parseToRgba(color).map((value, index) =>\n // 3rd index is alpha channel which is already normalized\n index === 3 ? value : value / 255);\n const max = Math.max(red, green, blue);\n const min = Math.min(red, green, blue);\n const lightness = (max + min) / 2;\n\n // achromatic\n if (max === min) return [0, 0, lightness, alpha];\n const delta = max - min;\n const saturation = lightness > 0.5 ? delta / (2 - max - min) : delta / (max + min);\n const hue = 60 * (red === max ? (green - blue) / delta + (green < blue ? 6 : 0) : green === max ? (blue - red) / delta + 2 : (red - green) / delta + 4);\n return [hue, saturation, lightness, alpha];\n}\n\n/**\n * Takes in hsla parts and constructs an hsla string\n *\n * @param hue The color circle (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue\n * @param saturation Percentage of saturation, given as a decimal between 0 and 1\n * @param lightness Percentage of lightness, given as a decimal between 0 and 1\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction hsla(hue, saturation, lightness, alpha) {\n return `hsla(${(hue % 360).toFixed()}, ${guard(0, 100, saturation * 100).toFixed()}%, ${guard(0, 100, lightness * 100).toFixed()}%, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Adjusts the current hue of the color by the given degrees. Wraps around when\n * over 360.\n *\n * @param color input color\n * @param degrees degrees to adjust the input color, accepts degree integers\n * (0 - 360) and wraps around on overflow\n */\nfunction adjustHue(color, degrees) {\n const [h, s, l, a] = parseToHsla(color);\n return hsla(h + degrees, s, l, a);\n}\n\n/**\n * Darkens using lightness. This is equivalent to subtracting the lightness\n * from the L in HSL.\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction darken(color, amount) {\n const [hue, saturation, lightness, alpha] = parseToHsla(color);\n return hsla(hue, saturation, lightness - amount, alpha);\n}\n\n/**\n * Desaturates the input color by the given amount via subtracting from the `s`\n * in `hsla`.\n *\n * @param amount The amount to desaturate, given as a decimal between 0 and 1\n */\nfunction desaturate(color, amount) {\n const [h, s, l, a] = parseToHsla(color);\n return hsla(h, s - amount, l, a);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getLuminance.js\n\n/**\n * Returns a number (float) representing the luminance of a color.\n */\nfunction getLuminance(color) {\n if (color === 'transparent') return 0;\n function f(x) {\n const channel = x / 255;\n return channel <= 0.04045 ? channel / 12.92 : Math.pow((channel + 0.055) / 1.055, 2.4);\n }\n const [r, g, b] = parseToRgba(color);\n return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getContrast.js\n\n/**\n * Returns the contrast ratio between two colors based on\n * [W3's recommended equation for calculating contrast](http://www.w3.org/TR/WCAG20/#contrast-ratiodef).\n */\nfunction getContrast(color1, color2) {\n const luminance1 = getLuminance(color1);\n const luminance2 = getLuminance(color2);\n return luminance1 > luminance2 ? (luminance1 + 0.05) / (luminance2 + 0.05) : (luminance2 + 0.05) / (luminance1 + 0.05);\n}\n\n/**\n * Takes in rgba parts and returns an rgba string\n *\n * @param red The amount of red in the red channel, given in a number between 0 and 255 inclusive\n * @param green The amount of green in the red channel, given in a number between 0 and 255 inclusive\n * @param blue The amount of blue in the red channel, given in a number between 0 and 255 inclusive\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction rgba(red, green, blue, alpha) {\n return `rgba(${guard(0, 255, red).toFixed()}, ${guard(0, 255, green).toFixed()}, ${guard(0, 255, blue).toFixed()}, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Mixes two colors together. Taken from sass's implementation.\n */\nfunction mix(color1, color2, weight) {\n const normalize = (n, index) =>\n // 3rd index is alpha channel which is already normalized\n index === 3 ? n : n / 255;\n const [r1, g1, b1, a1] = parseToRgba(color1).map(normalize);\n const [r2, g2, b2, a2] = parseToRgba(color2).map(normalize);\n\n // The formula is copied from the original Sass implementation:\n // http://sass-lang.com/documentation/Sass/Script/Functions.html#mix-instance_method\n const alphaDelta = a2 - a1;\n const normalizedWeight = weight * 2 - 1;\n const combinedWeight = normalizedWeight * alphaDelta === -1 ? normalizedWeight : normalizedWeight + alphaDelta / (1 + normalizedWeight * alphaDelta);\n const weight2 = (combinedWeight + 1) / 2;\n const weight1 = 1 - weight2;\n const r = (r1 * weight1 + r2 * weight2) * 255;\n const g = (g1 * weight1 + g2 * weight2) * 255;\n const b = (b1 * weight1 + b2 * weight2) * 255;\n const a = a2 * weight + a1 * (1 - weight);\n return rgba(r, g, b, a);\n}\n\n/**\n * Given a series colors, this function will return a `scale(x)` function that\n * accepts a percentage as a decimal between 0 and 1 and returns the color at\n * that percentage in the scale.\n *\n * ```js\n * const scale = getScale('red', 'yellow', 'green');\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(0.5)); // rgba(255, 255, 0, 1)\n * console.log(scale(1)); // rgba(0, 128, 0, 1)\n * ```\n *\n * If you'd like to limit the domain and range like chroma-js, we recommend\n * wrapping scale again.\n *\n * ```js\n * const _scale = getScale('red', 'yellow', 'green');\n * const scale = x => _scale(x / 100);\n *\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(50)); // rgba(255, 255, 0, 1)\n * console.log(scale(100)); // rgba(0, 128, 0, 1)\n * ```\n */\nfunction getScale(...colors) {\n return n => {\n const lastIndex = colors.length - 1;\n const lowIndex = guard(0, lastIndex, Math.floor(n * lastIndex));\n const highIndex = guard(0, lastIndex, Math.ceil(n * lastIndex));\n const color1 = colors[lowIndex];\n const color2 = colors[highIndex];\n const unit = 1 / lastIndex;\n const weight = (n - unit * lowIndex) / unit;\n return mix(color1, color2, weight);\n };\n}\n\nconst guidelines = {\n decorative: 1.5,\n readable: 3,\n aa: 4.5,\n aaa: 7\n};\n\n/**\n * Returns whether or not a color has bad contrast against a background\n * according to a given standard.\n */\nfunction hasBadContrast(color, standard = 'aa', background = '#fff') {\n return getContrast(color, background) < guidelines[standard];\n}\n\n/**\n * Lightens a color by a given amount. This is equivalent to\n * `darken(color, -amount)`\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction lighten(color, amount) {\n return darken(color, -amount);\n}\n\n/**\n * Takes in a color and makes it more transparent by convert to `rgba` and\n * decreasing the amount in the alpha channel.\n *\n * @param amount The amount to increase the transparency by, given as a decimal between 0 and 1\n */\nfunction transparentize(color, amount) {\n const [r, g, b, a] = parseToRgba(color);\n return rgba(r, g, b, a - amount);\n}\n\n/**\n * Takes a color and un-transparentizes it. Equivalent to\n * `transparentize(color, -amount)`\n *\n * @param amount The amount to increase the opacity by, given as a decimal between 0 and 1\n */\nfunction opacify(color, amount) {\n return transparentize(color, -amount);\n}\n\n/**\n * An alternative function to `readableColor`. Returns whether or not the \n * readable color (i.e. the color to be place on top the input color) should be\n * black.\n */\nfunction readableColorIsBlack(color) {\n return getLuminance(color) > 0.179;\n}\n\n/**\n * Returns black or white for best contrast depending on the luminosity of the\n * given color.\n */\nfunction readableColor(color) {\n return readableColorIsBlack(color) ? '#000' : '#fff';\n}\n\n/**\n * Saturates a color by converting it to `hsl` and increasing the saturation\n * amount. Equivalent to `desaturate(color, -amount)`\n * \n * @param color Input color\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction saturate(color, amount) {\n return desaturate(color, -amount);\n}\n\n/**\n * Takes in any color and returns it as a hex code.\n */\nfunction toHex(color) {\n const [r, g, b, a] = parseToRgba(color);\n let hex = x => {\n const h = guard(0, 255, x).toString(16);\n // NOTE: padStart could be used here but it breaks Node 6 compat\n // https://github.com/ricokahler/color2k/issues/351\n return h.length === 1 ? `0${h}` : h;\n };\n return `#${hex(r)}${hex(g)}${hex(b)}${a < 1 ? hex(Math.round(a * 255)) : ''}`;\n}\n\n/**\n * Takes in any color and returns it as an rgba string.\n */\nfunction toRgba(color) {\n return rgba(...parseToRgba(color));\n}\n\n/**\n * Takes in any color and returns it as an hsla string.\n */\nfunction toHsla(color) {\n return hsla(...parseToHsla(color));\n}\n\nexport { ColorError$1 as ColorError, adjustHue, darken, desaturate, getContrast, getLuminance, getScale, guard, hasBadContrast, hsla, lighten, mix, opacify, parseToHsla, parseToRgba, readableColor, readableColorIsBlack, rgba, saturate, toHex, toHsla, toRgba, transparentize };\n//# sourceMappingURL=index.module.es.js.map\n","import { CustomPalette } from '../../interface';\n\nexport const isColor = strColor => {\n const s = new Option().style;\n s.color = strColor;\n return s.color !== '';\n};\n\nconst toKebabCase = (pascal: string) => pascal.replace(/([a-z0–9])([A-Z])/g, '$1-$2').toLowerCase();\n\n// This function handles arrays and objects\nconst buildVars = (prev: string, obj: any): { [k: string]: string } => {\n let resp = {};\n\n for (const k in obj) {\n const name = `${prev}-${toKebabCase(k)}`;\n if (typeof obj[k] === 'object' && obj[k] !== null) {\n resp = { ...resp, ...buildVars(name, obj[k]) };\n } else {\n resp[name] = obj[k];\n }\n }\n\n return resp;\n};\n\nexport const getCssColors = (customPalette: CustomPalette): { [k: string]: string } => buildVars('--cpsl-color', customPalette);\n","import { mix, readableColorIsBlack } from 'color2k';\nimport { Theme } from '../../interface';\nimport { getCssColors, isColor } from './utils';\nimport { DEFAULT_THEME } from '../../constants';\n\nexport type Palette = {\n foregroundColors: string[];\n backgroundColors: string[];\n isDarkBackground: boolean;\n};\n\nconst MIXES = [0, 0.08, 0.16, 0.32, 0.48, 0.64, 0.8, 0.96];\n\nexport const generatePalette = ({ foregroundColor, backgroundColor, customPalette }: Pick<Theme, 'foregroundColor' | 'backgroundColor' | 'customPalette'>): Palette => {\n if (!Boolean(foregroundColor) || !isColor(foregroundColor)) {\n foregroundColor = DEFAULT_THEME.foregroundColor;\n }\n if (!Boolean(backgroundColor) || !isColor(backgroundColor)) {\n backgroundColor = DEFAULT_THEME.backgroundColor;\n }\n\n const isDarkBackground = !readableColorIsBlack(backgroundColor);\n\n const palette: Palette = {\n foregroundColors: [],\n backgroundColors: [],\n isDarkBackground,\n };\n\n const backgroundMixColor = isDarkBackground ? '#FFFFFF' : '#000000';\n const foregroundMixColor = isDarkBackground ? '#000000' : '#FFFFFF';\n\n MIXES.forEach(value => {\n palette.foregroundColors.push(mix(foregroundColor, foregroundMixColor, value));\n palette.backgroundColors.push(mix(backgroundColor, backgroundMixColor, value));\n });\n\n // BACKGROUND\n document.documentElement.style.setProperty('--cpsl-color-background-0', palette.backgroundColors[0]);\n document.documentElement.style.setProperty('--cpsl-color-background-8', palette.backgroundColors[1]);\n document.documentElement.style.setProperty('--cpsl-color-background-16', palette.backgroundColors[2]);\n document.documentElement.style.setProperty('--cpsl-color-background-32', palette.backgroundColors[3]);\n document.documentElement.style.setProperty('--cpsl-color-background-48', palette.backgroundColors[4]);\n document.documentElement.style.setProperty('--cpsl-color-background-64', palette.backgroundColors[5]);\n document.documentElement.style.setProperty('--cpsl-color-background-80', palette.backgroundColors[6]);\n document.documentElement.style.setProperty('--cpsl-color-background-96', palette.backgroundColors[7]);\n\n // FOREGROUND\n document.documentElement.style.setProperty('--cpsl-color-foreground-0', palette.foregroundColors[0]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-8', palette.foregroundColors[1]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-16', palette.foregroundColors[2]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-32', palette.foregroundColors[3]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-48', palette.foregroundColors[4]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-64', palette.foregroundColors[5]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-80', palette.foregroundColors[6]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-96', palette.foregroundColors[7]);\n\n if (Boolean(customPalette)) {\n const cssColorVars = getCssColors(customPalette);\n Object.entries(cssColorVars).forEach(([k, v]) => document.documentElement.style.setProperty(k, v));\n }\n\n return palette;\n};\n","import { DEFAULT_THEME } from '../../constants';\nimport { Theme } from '../../interface';\nimport { generateBorderRadii } from './generateBorderRadii';\nimport { generateFont } from './generateFont';\nimport { generatePalette } from './generatePalette';\n\n/**\n * Generates css theme variables.\n * @returns @boolean Whether background is dark or not.\n */\nexport const generateTheme = ({\n foregroundColor = DEFAULT_THEME.foregroundColor,\n backgroundColor = DEFAULT_THEME.backgroundColor,\n font,\n customPalette,\n borderRadius,\n customFontSizes,\n}: Theme): boolean => {\n const palette = generatePalette({ foregroundColor, backgroundColor, customPalette });\n\n generateFont({ font, customFontSizes });\n\n generateBorderRadii({ borderRadius });\n\n return palette.isDarkBackground;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["generateBorderRadii","borderRadius","Boolean","xSmallRadius","smallRadius","mediumRadius","largeRadius","fullRadius","isFull","isNone","document","documentElement","style","setProperty","FONT_NAME_MAP","body2XS","bodyXS","bodyS","bodyM","bodyL","bodyXL","headingXS","headingS","headingM","headingL","headingXL","heading2XL","generateFont","font","customFontSizes","Object","entries","forEach","key","value","removeProperty","guard","low","high","Math","min","max","ColorError","Error","constructor","color","super","ColorError$1","parseToRgba","trim","toLowerCase","normalizedColor","namedColorRegex","test","nameToHex","reducedHexMatch","reducedHexRegex","exec","arr","Array","from","slice","map","x","parseInt","r","hexMatch","hexRegex","rgbaMatch","rgbaRegex","parseFloat","hslaMatch","hslaRegex","h","s","l","a","hslToRgb","Number","isNaN","hash","str","i","length","charCodeAt","colorToInt","replace","compressedColorMap","split","reduce","acc","next","substring","hex","toString","prefix","normalizedColorName","result","amount","join","RegExp","roundColor","round","hue","saturation","lightness","huePrime","chroma","abs","secondComponent","red","green","blue","lightnessModification","finalRed","finalGreen","finalBlue","getLuminance","f","channel","pow","g","b","rgba","alpha","toFixed","mix","color1","color2","weight","normalize","n","index","r1","g1","b1","a1","r2","g2","b2","a2","alphaDelta","normalizedWeight","combinedWeight","weight2","weight1","readableColorIsBlack","t","u","M","m","d","p","v","o","O","unitInput","unitOutput","roundOutput","e","c","D","isColor","strColor","Option","toKebabCase","pascal","buildVars","prev","obj","resp","k","name","assign","getCssColors","customPalette","overlayMix","baseColor","overlayColor","baseRGBA","overlayRGBA","finalRGBA","overlay","generatePalette","foregroundColor","backgroundColor","DEFAULT_THEME","isDarkBackground","palette","foregroundColors","backgroundColors","backgroundMixColor","foregroundMixColor","COLOR_MIXES","push","UTILITY_COLORS","yellow","cssColorVars","generateTheme"],"sources":["src/utils/theme/generateBorderRadii.ts","src/utils/theme/generateFont.ts","../node_modules/color2k/dist/index.module.es.js","../node_modules/color-blend/dist/index.modern.js","src/utils/theme/utils.ts","src/utils/theme/generatePalette.ts","src/utils/theme/generateTheme.ts"],"sourcesContent":["import { Theme } from '../../interface';\n\nexport const generateBorderRadii = ({ borderRadius }: Pick<Theme, 'borderRadius'>) => {\n if (!Boolean(borderRadius)) {\n return;\n }\n\n let xSmallRadius: number, smallRadius: number, mediumRadius: number, largeRadius: number;\n const fullRadius = 1000;\n let isFull = false;\n let isNone = false;\n\n switch (borderRadius) {\n case 'none': {\n isNone = true;\n xSmallRadius = 0;\n smallRadius = 0;\n mediumRadius = 0;\n largeRadius = 0;\n break;\n }\n case 'xs': {\n xSmallRadius = 2;\n smallRadius = 4;\n mediumRadius = 12;\n largeRadius = 20;\n break;\n }\n case 'sm': {\n xSmallRadius = 2;\n smallRadius = 8;\n mediumRadius = 16;\n largeRadius = 24;\n break;\n }\n case 'lg': {\n xSmallRadius = 8;\n smallRadius = 16;\n mediumRadius = 24;\n largeRadius = 32;\n break;\n }\n case 'full': {\n xSmallRadius = 8;\n smallRadius = 16;\n mediumRadius = 24;\n largeRadius = 32;\n isFull = true;\n break;\n }\n default:\n case 'md': {\n xSmallRadius = 4;\n smallRadius = 12;\n mediumRadius = 20;\n largeRadius = 28;\n break;\n }\n }\n\n document.documentElement.style.setProperty('--cpsl-border-radius-input', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-alert', `${smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-tabs', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-primary-button', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-secondary-button', `${isFull ? fullRadius : smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-tile-button', `${smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-modal', `${mediumRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-pill', `${isNone ? 0 : fullRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-qr-code', `${largeRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-info-box', `${smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-table-container', `${mediumRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-switch', `${isNone ? 0 : fullRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-checkbox', `${xSmallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-radio', `${fullRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-avatar', `${smallRadius}px`);\n document.documentElement.style.setProperty('--cpsl-border-radius-card', `${mediumRadius}px`);\n};\n","import { Theme } from '../../interface';\n\nconst FONT_NAME_MAP = {\n body2XS: 'body-2xs',\n bodyXS: 'body-xs',\n bodyS: 'body-s',\n bodyM: 'body-m',\n bodyL: 'body-l',\n bodyXL: 'body-xl',\n headingXS: 'heading-xs',\n headingS: 'heading-s',\n headingM: 'heading-m',\n headingL: 'heading-l',\n headingXL: 'heading-xl',\n heading2XL: 'heading-2xl',\n};\n\nexport const generateFont = ({ font, customFontSizes }: Pick<Theme, 'font' | 'customFontSizes'>) => {\n if (Boolean(font)) {\n document.documentElement.style.setProperty('--cpsl-default-font', font);\n }\n\n Object.entries(FONT_NAME_MAP).forEach(([key, value]) => {\n if (customFontSizes?.[key]) {\n document.documentElement.style.setProperty(`--cpsl-font-size-${value}`, customFontSizes[key]);\n } else {\n document.documentElement.style.removeProperty(`--cpsl-font-size-${value}`);\n }\n });\n};\n","/**\n * A simple guard function:\n *\n * ```js\n * Math.min(Math.max(low, value), high)\n * ```\n */\nfunction guard(low, high, value) {\n return Math.min(Math.max(low, value), high);\n}\n\nclass ColorError extends Error {\n constructor(color) {\n super(`Failed to parse color: \"${color}\"`);\n }\n}\nvar ColorError$1 = ColorError;\n\n/**\n * Parses a color into red, gree, blue, alpha parts\n *\n * @param color the input color. Can be a RGB, RBGA, HSL, HSLA, or named color\n */\nfunction parseToRgba(color) {\n if (typeof color !== 'string') throw new ColorError$1(color);\n if (color.trim().toLowerCase() === 'transparent') return [0, 0, 0, 0];\n let normalizedColor = color.trim();\n normalizedColor = namedColorRegex.test(color) ? nameToHex(color) : color;\n const reducedHexMatch = reducedHexRegex.exec(normalizedColor);\n if (reducedHexMatch) {\n const arr = Array.from(reducedHexMatch).slice(1);\n return [...arr.slice(0, 3).map(x => parseInt(r(x, 2), 16)), parseInt(r(arr[3] || 'f', 2), 16) / 255];\n }\n const hexMatch = hexRegex.exec(normalizedColor);\n if (hexMatch) {\n const arr = Array.from(hexMatch).slice(1);\n return [...arr.slice(0, 3).map(x => parseInt(x, 16)), parseInt(arr[3] || 'ff', 16) / 255];\n }\n const rgbaMatch = rgbaRegex.exec(normalizedColor);\n if (rgbaMatch) {\n const arr = Array.from(rgbaMatch).slice(1);\n return [...arr.slice(0, 3).map(x => parseInt(x, 10)), parseFloat(arr[3] || '1')];\n }\n const hslaMatch = hslaRegex.exec(normalizedColor);\n if (hslaMatch) {\n const [h, s, l, a] = Array.from(hslaMatch).slice(1).map(parseFloat);\n if (guard(0, 100, s) !== s) throw new ColorError$1(color);\n if (guard(0, 100, l) !== l) throw new ColorError$1(color);\n return [...hslToRgb(h, s, l), Number.isNaN(a) ? 1 : a];\n }\n throw new ColorError$1(color);\n}\nfunction hash(str) {\n let hash = 5381;\n let i = str.length;\n while (i) {\n hash = hash * 33 ^ str.charCodeAt(--i);\n }\n\n /* JavaScript does bitwise operations (like XOR, above) on 32-bit signed\n * integers. Since we want the results to be always positive, convert the\n * signed int to an unsigned by doing an unsigned bitshift. */\n return (hash >>> 0) % 2341;\n}\nconst colorToInt = x => parseInt(x.replace(/_/g, ''), 36);\nconst compressedColorMap = '1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm'.split(' ').reduce((acc, next) => {\n const key = colorToInt(next.substring(0, 3));\n const hex = colorToInt(next.substring(3)).toString(16);\n\n // NOTE: padStart could be used here but it breaks Node 6 compat\n // https://github.com/ricokahler/color2k/issues/351\n let prefix = '';\n for (let i = 0; i < 6 - hex.length; i++) {\n prefix += '0';\n }\n acc[key] = `${prefix}${hex}`;\n return acc;\n}, {});\n\n/**\n * Checks if a string is a CSS named color and returns its equivalent hex value, otherwise returns the original color.\n */\nfunction nameToHex(color) {\n const normalizedColorName = color.toLowerCase().trim();\n const result = compressedColorMap[hash(normalizedColorName)];\n if (!result) throw new ColorError$1(color);\n return `#${result}`;\n}\nconst r = (str, amount) => Array.from(Array(amount)).map(() => str).join('');\nconst reducedHexRegex = new RegExp(`^#${r('([a-f0-9])', 3)}([a-f0-9])?$`, 'i');\nconst hexRegex = new RegExp(`^#${r('([a-f0-9]{2})', 3)}([a-f0-9]{2})?$`, 'i');\nconst rgbaRegex = new RegExp(`^rgba?\\\\(\\\\s*(\\\\d+)\\\\s*${r(',\\\\s*(\\\\d+)\\\\s*', 2)}(?:,\\\\s*([\\\\d.]+))?\\\\s*\\\\)$`, 'i');\nconst hslaRegex = /^hsla?\\(\\s*([\\d.]+)\\s*,\\s*([\\d.]+)%\\s*,\\s*([\\d.]+)%(?:\\s*,\\s*([\\d.]+))?\\s*\\)$/i;\nconst namedColorRegex = /^[a-z]+$/i;\nconst roundColor = color => {\n return Math.round(color * 255);\n};\nconst hslToRgb = (hue, saturation, lightness) => {\n let l = lightness / 100;\n if (saturation === 0) {\n // achromatic\n return [l, l, l].map(roundColor);\n }\n\n // formulae from https://en.wikipedia.org/wiki/HSL_and_HSV\n const huePrime = (hue % 360 + 360) % 360 / 60;\n const chroma = (1 - Math.abs(2 * l - 1)) * (saturation / 100);\n const secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));\n let red = 0;\n let green = 0;\n let blue = 0;\n if (huePrime >= 0 && huePrime < 1) {\n red = chroma;\n green = secondComponent;\n } else if (huePrime >= 1 && huePrime < 2) {\n red = secondComponent;\n green = chroma;\n } else if (huePrime >= 2 && huePrime < 3) {\n green = chroma;\n blue = secondComponent;\n } else if (huePrime >= 3 && huePrime < 4) {\n green = secondComponent;\n blue = chroma;\n } else if (huePrime >= 4 && huePrime < 5) {\n red = secondComponent;\n blue = chroma;\n } else if (huePrime >= 5 && huePrime < 6) {\n red = chroma;\n blue = secondComponent;\n }\n const lightnessModification = l - chroma / 2;\n const finalRed = red + lightnessModification;\n const finalGreen = green + lightnessModification;\n const finalBlue = blue + lightnessModification;\n return [finalRed, finalGreen, finalBlue].map(roundColor);\n};\n\n// taken from:\n// https://github.com/styled-components/polished/blob/a23a6a2bb26802b3d922d9c3b67bac3f3a54a310/src/internalHelpers/_rgbToHsl.js\n\n/**\n * Parses a color in hue, saturation, lightness, and the alpha channel.\n *\n * Hue is a number between 0 and 360, saturation, lightness, and alpha are\n * decimal percentages between 0 and 1\n */\nfunction parseToHsla(color) {\n const [red, green, blue, alpha] = parseToRgba(color).map((value, index) =>\n // 3rd index is alpha channel which is already normalized\n index === 3 ? value : value / 255);\n const max = Math.max(red, green, blue);\n const min = Math.min(red, green, blue);\n const lightness = (max + min) / 2;\n\n // achromatic\n if (max === min) return [0, 0, lightness, alpha];\n const delta = max - min;\n const saturation = lightness > 0.5 ? delta / (2 - max - min) : delta / (max + min);\n const hue = 60 * (red === max ? (green - blue) / delta + (green < blue ? 6 : 0) : green === max ? (blue - red) / delta + 2 : (red - green) / delta + 4);\n return [hue, saturation, lightness, alpha];\n}\n\n/**\n * Takes in hsla parts and constructs an hsla string\n *\n * @param hue The color circle (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue\n * @param saturation Percentage of saturation, given as a decimal between 0 and 1\n * @param lightness Percentage of lightness, given as a decimal between 0 and 1\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction hsla(hue, saturation, lightness, alpha) {\n return `hsla(${(hue % 360).toFixed()}, ${guard(0, 100, saturation * 100).toFixed()}%, ${guard(0, 100, lightness * 100).toFixed()}%, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Adjusts the current hue of the color by the given degrees. Wraps around when\n * over 360.\n *\n * @param color input color\n * @param degrees degrees to adjust the input color, accepts degree integers\n * (0 - 360) and wraps around on overflow\n */\nfunction adjustHue(color, degrees) {\n const [h, s, l, a] = parseToHsla(color);\n return hsla(h + degrees, s, l, a);\n}\n\n/**\n * Darkens using lightness. This is equivalent to subtracting the lightness\n * from the L in HSL.\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction darken(color, amount) {\n const [hue, saturation, lightness, alpha] = parseToHsla(color);\n return hsla(hue, saturation, lightness - amount, alpha);\n}\n\n/**\n * Desaturates the input color by the given amount via subtracting from the `s`\n * in `hsla`.\n *\n * @param amount The amount to desaturate, given as a decimal between 0 and 1\n */\nfunction desaturate(color, amount) {\n const [h, s, l, a] = parseToHsla(color);\n return hsla(h, s - amount, l, a);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getLuminance.js\n\n/**\n * Returns a number (float) representing the luminance of a color.\n */\nfunction getLuminance(color) {\n if (color === 'transparent') return 0;\n function f(x) {\n const channel = x / 255;\n return channel <= 0.04045 ? channel / 12.92 : Math.pow((channel + 0.055) / 1.055, 2.4);\n }\n const [r, g, b] = parseToRgba(color);\n return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getContrast.js\n\n/**\n * Returns the contrast ratio between two colors based on\n * [W3's recommended equation for calculating contrast](http://www.w3.org/TR/WCAG20/#contrast-ratiodef).\n */\nfunction getContrast(color1, color2) {\n const luminance1 = getLuminance(color1);\n const luminance2 = getLuminance(color2);\n return luminance1 > luminance2 ? (luminance1 + 0.05) / (luminance2 + 0.05) : (luminance2 + 0.05) / (luminance1 + 0.05);\n}\n\n/**\n * Takes in rgba parts and returns an rgba string\n *\n * @param red The amount of red in the red channel, given in a number between 0 and 255 inclusive\n * @param green The amount of green in the red channel, given in a number between 0 and 255 inclusive\n * @param blue The amount of blue in the red channel, given in a number between 0 and 255 inclusive\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction rgba(red, green, blue, alpha) {\n return `rgba(${guard(0, 255, red).toFixed()}, ${guard(0, 255, green).toFixed()}, ${guard(0, 255, blue).toFixed()}, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Mixes two colors together. Taken from sass's implementation.\n */\nfunction mix(color1, color2, weight) {\n const normalize = (n, index) =>\n // 3rd index is alpha channel which is already normalized\n index === 3 ? n : n / 255;\n const [r1, g1, b1, a1] = parseToRgba(color1).map(normalize);\n const [r2, g2, b2, a2] = parseToRgba(color2).map(normalize);\n\n // The formula is copied from the original Sass implementation:\n // http://sass-lang.com/documentation/Sass/Script/Functions.html#mix-instance_method\n const alphaDelta = a2 - a1;\n const normalizedWeight = weight * 2 - 1;\n const combinedWeight = normalizedWeight * alphaDelta === -1 ? normalizedWeight : normalizedWeight + alphaDelta / (1 + normalizedWeight * alphaDelta);\n const weight2 = (combinedWeight + 1) / 2;\n const weight1 = 1 - weight2;\n const r = (r1 * weight1 + r2 * weight2) * 255;\n const g = (g1 * weight1 + g2 * weight2) * 255;\n const b = (b1 * weight1 + b2 * weight2) * 255;\n const a = a2 * weight + a1 * (1 - weight);\n return rgba(r, g, b, a);\n}\n\n/**\n * Given a series colors, this function will return a `scale(x)` function that\n * accepts a percentage as a decimal between 0 and 1 and returns the color at\n * that percentage in the scale.\n *\n * ```js\n * const scale = getScale('red', 'yellow', 'green');\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(0.5)); // rgba(255, 255, 0, 1)\n * console.log(scale(1)); // rgba(0, 128, 0, 1)\n * ```\n *\n * If you'd like to limit the domain and range like chroma-js, we recommend\n * wrapping scale again.\n *\n * ```js\n * const _scale = getScale('red', 'yellow', 'green');\n * const scale = x => _scale(x / 100);\n *\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(50)); // rgba(255, 255, 0, 1)\n * console.log(scale(100)); // rgba(0, 128, 0, 1)\n * ```\n */\nfunction getScale(...colors) {\n return n => {\n const lastIndex = colors.length - 1;\n const lowIndex = guard(0, lastIndex, Math.floor(n * lastIndex));\n const highIndex = guard(0, lastIndex, Math.ceil(n * lastIndex));\n const color1 = colors[lowIndex];\n const color2 = colors[highIndex];\n const unit = 1 / lastIndex;\n const weight = (n - unit * lowIndex) / unit;\n return mix(color1, color2, weight);\n };\n}\n\nconst guidelines = {\n decorative: 1.5,\n readable: 3,\n aa: 4.5,\n aaa: 7\n};\n\n/**\n * Returns whether or not a color has bad contrast against a background\n * according to a given standard.\n */\nfunction hasBadContrast(color, standard = 'aa', background = '#fff') {\n return getContrast(color, background) < guidelines[standard];\n}\n\n/**\n * Lightens a color by a given amount. This is equivalent to\n * `darken(color, -amount)`\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction lighten(color, amount) {\n return darken(color, -amount);\n}\n\n/**\n * Takes in a color and makes it more transparent by convert to `rgba` and\n * decreasing the amount in the alpha channel.\n *\n * @param amount The amount to increase the transparency by, given as a decimal between 0 and 1\n */\nfunction transparentize(color, amount) {\n const [r, g, b, a] = parseToRgba(color);\n return rgba(r, g, b, a - amount);\n}\n\n/**\n * Takes a color and un-transparentizes it. Equivalent to\n * `transparentize(color, -amount)`\n *\n * @param amount The amount to increase the opacity by, given as a decimal between 0 and 1\n */\nfunction opacify(color, amount) {\n return transparentize(color, -amount);\n}\n\n/**\n * An alternative function to `readableColor`. Returns whether or not the \n * readable color (i.e. the color to be place on top the input color) should be\n * black.\n */\nfunction readableColorIsBlack(color) {\n return getLuminance(color) > 0.179;\n}\n\n/**\n * Returns black or white for best contrast depending on the luminosity of the\n * given color.\n */\nfunction readableColor(color) {\n return readableColorIsBlack(color) ? '#000' : '#fff';\n}\n\n/**\n * Saturates a color by converting it to `hsl` and increasing the saturation\n * amount. Equivalent to `desaturate(color, -amount)`\n * \n * @param color Input color\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction saturate(color, amount) {\n return desaturate(color, -amount);\n}\n\n/**\n * Takes in any color and returns it as a hex code.\n */\nfunction toHex(color) {\n const [r, g, b, a] = parseToRgba(color);\n let hex = x => {\n const h = guard(0, 255, x).toString(16);\n // NOTE: padStart could be used here but it breaks Node 6 compat\n // https://github.com/ricokahler/color2k/issues/351\n return h.length === 1 ? `0${h}` : h;\n };\n return `#${hex(r)}${hex(g)}${hex(b)}${a < 1 ? hex(Math.round(a * 255)) : ''}`;\n}\n\n/**\n * Takes in any color and returns it as an rgba string.\n */\nfunction toRgba(color) {\n return rgba(...parseToRgba(color));\n}\n\n/**\n * Takes in any color and returns it as an hsla string.\n */\nfunction toHsla(color) {\n return hsla(...parseToHsla(color));\n}\n\nexport { ColorError$1 as ColorError, adjustHue, darken, desaturate, getContrast, getLuminance, getScale, guard, hasBadContrast, hsla, lighten, mix, opacify, parseToHsla, parseToRgba, readableColor, readableColorIsBlack, rgba, saturate, toHex, toHsla, toRgba, transparentize };\n//# sourceMappingURL=index.module.es.js.map\n","function n(n,r,t){return{r:255*t(n.r/255,r.r/255),g:255*t(n.g/255,r.g/255),b:255*t(n.b/255,r.b/255)}}function r(n,r){return r}function t(n,r){return n*r}function u(n,r){return n+r-n*r}function i(n,r){return a(r,n)}function o(n,r){return Math.min(n,r)}function e(n,r){return Math.min(Math.max(n,r),1)}function c(n,r){return 0===n?0:1===r?1:Math.min(1,n/(1-r))}function f(n,r){return 1===n?1:0===r?0:1-Math.min(1,(1-n)/r)}function a(n,r){return r<=.5?t(n,2*r):u(n,2*r-1)}function b(n,r){return r<=.5?n-(1-2*r)*n*(1-n):n+(2*r-1)*((n<=.25?((16*n-12)*n+4)*n:Math.sqrt(n))-n)}function g(n,r){return Math.abs(n-r)}function h(n,r){return n+r-2*n*r}function M(n,r,t){return Math.min(Math.max(n||0,r),t)}function m(n){return{r:M(n.r,0,255),g:M(n.g,0,255),b:M(n.b,0,255),a:M(n.a,0,1)}}function d(n){return{r:255*n.r,g:255*n.g,b:255*n.b,a:n.a}}function p(n){return{r:n.r/255,g:n.g/255,b:n.b/255,a:n.a}}function v(n,r){void 0===r&&(r=0);var t=Math.pow(10,r);return{r:Math.round(n.r*t)/t,g:Math.round(n.g*t)/t,b:Math.round(n.b*t)/t,a:n.a}}function x(n,r,t,u,i,o){return(1-r/t)*u+r/t*Math.round((1-n)*i+n*o)}function O(n,r,t,u,i){void 0===i&&(i={unitInput:!1,unitOutput:!1,roundOutput:!0}),i.unitInput&&(n=d(n),r=d(r)),n=m(n);var o=(r=m(r)).a+n.a-r.a*n.a,e=t(n,r,u),c=m({r:x(n.a,r.a,o,n.r,r.r,e.r),g:x(n.a,r.a,o,n.g,r.g,e.g),b:x(n.a,r.a,o,n.b,r.b,e.b),a:o});return c=i.unitOutput?p(c):i.roundOutput?v(c):function(n){return v(n,9)}(c),c}function s(n,r,t){return d(t(p(n),p(r)))}function I(n){return.3*n.r+.59*n.g+.11*n.b}function q(n,r){var t=r-I(n);return function(n){var r=I(n),t=n.r,u=n.g,i=n.b,o=Math.min(t,u,i),e=Math.max(t,u,i);function c(n){return r+(n-r)*r/(r-o)}function f(n){return r+(n-r)*(1-r)/(e-r)}return o<0&&(t=c(t),u=c(u),i=c(i)),e>1&&(t=f(t),u=f(u),i=f(i)),{r:t,g:u,b:i}}({r:n.r+t,g:n.g+t,b:n.b+t})}function w(n){return Math.max(n.r,n.g,n.b)-Math.min(n.r,n.g,n.b)}function j(n,r){var t=[\"r\",\"g\",\"b\"].sort(function(r,t){return n[r]-n[t]}),u=t[0],i=t[1],o=t[2],e={r:n.r,g:n.g,b:n.b};return e[o]>e[u]?(e[i]=(e[i]-e[u])*r/(e[o]-e[u]),e[o]=r):e[i]=e[o]=0,e[u]=0,e}function k(n,r){return q(j(r,w(n)),I(n))}function l(n,r){return q(j(n,w(r)),I(n))}function y(n,r){return q(r,I(n))}function z(n,r){return q(n,I(r))}function A(t,u){return O(t,u,n,r)}function B(r,u){return O(r,u,n,t)}function C(r,t){return O(r,t,n,u)}function D(r,t){return O(r,t,n,i)}function E(r,t){return O(r,t,n,o)}function F(r,t){return O(r,t,n,e)}function G(r,t){return O(r,t,n,c)}function H(r,t){return O(r,t,n,f)}function J(r,t){return O(r,t,n,a)}function K(r,t){return O(r,t,n,b)}function L(r,t){return O(r,t,n,g)}function N(r,t){return O(r,t,n,h)}function P(n,r){return O(n,r,s,k)}function Q(n,r){return O(n,r,s,l)}function R(n,r){return O(n,r,s,y)}function S(n,r){return O(n,r,s,z)}export{R as color,H as colorBurn,G as colorDodge,E as darken,L as difference,N as exclusion,J as hardLight,P as hue,F as lighten,S as luminosity,B as multiply,A as normal,D as overlay,Q as saturation,C as screen,K as softLight};\n//# sourceMappingURL=index.modern.js.map\n","import { parseToRgba, rgba } from 'color2k';\nimport { CustomPalette } from '../../interface';\nimport { overlay } from 'color-blend';\n\nexport const isColor = strColor => {\n const s = new Option().style;\n s.color = strColor;\n return s.color !== '';\n};\n\nconst toKebabCase = (pascal: string) => pascal.replace(/([a-z0–9])([A-Z])/g, '$1-$2').toLowerCase();\n\n// This function handles arrays and objects\nconst buildVars = (prev: string, obj: any): { [k: string]: string } => {\n let resp = {};\n\n for (const k in obj) {\n const name = `${prev}-${toKebabCase(k)}`;\n if (typeof obj[k] === 'object' && obj[k] !== null) {\n resp = { ...resp, ...buildVars(name, obj[k]) };\n } else {\n resp[name] = obj[k];\n }\n }\n\n return resp;\n};\n\nexport const getCssColors = (customPalette: CustomPalette): { [k: string]: string } => buildVars('--cpsl-color', customPalette);\n\nexport const overlayMix = (baseColor: string, overlayColor: string) => {\n const baseRGBA = parseToRgba(baseColor);\n const overlayRGBA = parseToRgba(overlayColor);\n\n const finalRGBA = overlay({ r: baseRGBA[0], g: baseRGBA[1], b: baseRGBA[2], a: 0.1 }, { r: overlayRGBA[0], g: overlayRGBA[1], b: overlayRGBA[2], a: overlayRGBA[3] });\n\n return rgba(finalRGBA.r, finalRGBA.g, finalRGBA.b, finalRGBA.a);\n};\n","import { mix, readableColorIsBlack } from 'color2k';\nimport { Theme } from '../../interface';\nimport { getCssColors, isColor, overlayMix } from './utils';\nimport { COLOR_MIXES, DEFAULT_THEME, UTILITY_COLORS } from '../../constants';\n\nexport type Palette = {\n foregroundColors: string[];\n backgroundColors: string[];\n isDarkBackground: boolean;\n};\n\nexport const generatePalette = ({ foregroundColor, backgroundColor, customPalette }: Pick<Theme, 'foregroundColor' | 'backgroundColor' | 'customPalette'>): Palette => {\n if (!Boolean(foregroundColor) || !isColor(foregroundColor)) {\n foregroundColor = DEFAULT_THEME.foregroundColor;\n }\n if (!Boolean(backgroundColor) || !isColor(backgroundColor)) {\n backgroundColor = DEFAULT_THEME.backgroundColor;\n }\n\n const isDarkBackground = !readableColorIsBlack(backgroundColor);\n\n const palette: Palette = {\n foregroundColors: [],\n backgroundColors: [],\n isDarkBackground,\n };\n\n const backgroundMixColor = isDarkBackground ? '#FFFFFF' : '#000000';\n const foregroundMixColor = isDarkBackground ? '#000000' : '#FFFFFF';\n\n COLOR_MIXES.forEach(value => {\n palette.foregroundColors.push(mix(foregroundColor, foregroundMixColor, value));\n palette.backgroundColors.push(mix(backgroundColor, backgroundMixColor, value));\n });\n\n // BACKGROUND\n document.documentElement.style.setProperty('--cpsl-color-background-0', palette.backgroundColors[0]);\n document.documentElement.style.setProperty('--cpsl-color-background-4', palette.backgroundColors[1]);\n document.documentElement.style.setProperty('--cpsl-color-background-8', palette.backgroundColors[2]);\n document.documentElement.style.setProperty('--cpsl-color-background-16', palette.backgroundColors[3]);\n document.documentElement.style.setProperty('--cpsl-color-background-32', palette.backgroundColors[4]);\n document.documentElement.style.setProperty('--cpsl-color-background-48', palette.backgroundColors[5]);\n document.documentElement.style.setProperty('--cpsl-color-background-64', palette.backgroundColors[6]);\n document.documentElement.style.setProperty('--cpsl-color-background-80', palette.backgroundColors[7]);\n document.documentElement.style.setProperty('--cpsl-color-background-96', palette.backgroundColors[8]);\n\n // FOREGROUND\n document.documentElement.style.setProperty('--cpsl-color-foreground-0', palette.foregroundColors[0]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-4', palette.foregroundColors[1]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-8', palette.foregroundColors[2]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-16', palette.foregroundColors[3]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-32', palette.foregroundColors[4]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-48', palette.foregroundColors[5]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-64', palette.foregroundColors[6]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-80', palette.foregroundColors[7]);\n document.documentElement.style.setProperty('--cpsl-color-foreground-96', palette.foregroundColors[8]);\n\n // UTILITY\n document.documentElement.style.setProperty('--cpsl-color-utility-red', overlayMix(foregroundColor, UTILITY_COLORS.red));\n document.documentElement.style.setProperty('--cpsl-color-utility-yellow', overlayMix(foregroundColor, UTILITY_COLORS.yellow));\n document.documentElement.style.setProperty('--cpsl-color-utility-green', overlayMix(foregroundColor, UTILITY_COLORS.green));\n\n if (Boolean(customPalette)) {\n const cssColorVars = getCssColors(customPalette);\n Object.entries(cssColorVars).forEach(([k, v]) => document.documentElement.style.setProperty(k, v));\n }\n\n return palette;\n};\n","import { DEFAULT_THEME } from '../../constants';\nimport { Theme } from '../../interface';\nimport { generateBorderRadii } from './generateBorderRadii';\nimport { generateFont } from './generateFont';\nimport { generatePalette } from './generatePalette';\n\n/**\n * Generates css theme variables.\n * @returns @boolean Whether background is dark or not.\n */\nexport const generateTheme = ({\n foregroundColor = DEFAULT_THEME.foregroundColor,\n backgroundColor = DEFAULT_THEME.backgroundColor,\n font,\n customPalette,\n borderRadius,\n customFontSizes,\n}: Theme): boolean => {\n const palette = generatePalette({ foregroundColor, backgroundColor, customPalette });\n\n generateFont({ font, customFontSizes });\n\n generateBorderRadii({ borderRadius });\n\n return palette.isDarkBackground;\n};\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as d,f as i,h as n,H as a}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as d,f as i,h as n,H as a}from"./p-86e48e61.js";const p={xs:"(min-width: 0px)",sm:"(min-width: 576px)",md:"(min-width: 768px)",lg:"(min-width: 992px)",xl:"(min-width: 1200px)"};const l=d=>{if(d===undefined||d===""){return true}if(window.matchMedia){const i=p[d];return window.matchMedia(i).matches}return false};const r=":host{-webkit-padding-start:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;box-sizing:border-box;position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px}@media (min-width: 576px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 768px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 992px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 1200px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px))}}";const c=r;const g=typeof window!=="undefined"?window:undefined;const s=g&&!!(g.CSS&&g.CSS.supports&&g.CSS.supports("--a: 0"));const t=["","xs","sm","md","lg","xl"];const e=class{constructor(i){d(this,i);this.offset=undefined;this.offsetXs=undefined;this.offsetSm=undefined;this.offsetMd=undefined;this.offsetLg=undefined;this.offsetXl=undefined;this.pull=undefined;this.pullXs=undefined;this.pullSm=undefined;this.pullMd=undefined;this.pullLg=undefined;this.pullXl=undefined;this.push=undefined;this.pushXs=undefined;this.pushSm=undefined;this.pushMd=undefined;this.pushLg=undefined;this.pushXl=undefined;this.size=undefined;this.sizeXs=undefined;this.sizeSm=undefined;this.sizeMd=undefined;this.sizeLg=undefined;this.sizeXl=undefined}onResize(){i(this)}getColumns(d){let i;for(const n of t){const a=l(n);const p=this[d+n.charAt(0).toUpperCase()+n.slice(1)];if(a&&p!==undefined){i=p}}return i}calculateSize(){const d=this.getColumns("size");if(!d||d===""){return}const i=d==="auto"?"auto":s?`calc(calc(${d} / var(--ion-grid-columns, 12)) * 100%)`:d/12*100+"%";return{flex:`0 0 ${i}`,width:`${i}`,"max-width":`${i}`}}calculatePosition(d,i){const n=this.getColumns(d);if(!n){return}const a=s?`calc(calc(${n} / var(--ion-grid-columns, 12)) * 100%)`:n>0&&n<12?n/12*100+"%":"auto";return{[i]:a}}calculateOffset(d){return this.calculatePosition("offset",d?"margin-right":"margin-left")}calculatePull(d){return this.calculatePosition("pull",d?"left":"right")}calculatePush(d){return this.calculatePosition("push",d?"right":"left")}render(){const d=document.dir==="rtl";return n(a,{key:"e883138d5be5bfcffaa61fc3f440cfaf3c2c567d",style:Object.assign(Object.assign(Object.assign(Object.assign({},this.calculateOffset(d)),this.calculatePull(d)),this.calculatePush(d)),this.calculateSize())},n("slot",{key:"51c74a5a0895f34074b65441be91f02c3243ba8c"}))}};e.style=c;export{e as cpsl_col};
|
|
2
|
+
//# sourceMappingURL=p-0d0a0037.entry.js.map
|