@usecapsule/core-components 3.0.0 → 3.0.1-dev.1
Sign up to get free protection for your applications and to get access to all the features.
- package/css/capsule-core.css +83 -14
- 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-0d0a0037.entry.js → p-127ac658.entry.js} +2 -2
- package/dist/capsule/{p-0d0a0037.entry.js.map → p-127ac658.entry.js.map} +1 -1
- package/dist/capsule/p-39584a7b.entry.js +2 -0
- package/dist/capsule/p-39584a7b.entry.js.map +1 -0
- package/dist/capsule/p-69756614.entry.js +10 -0
- package/dist/capsule/{p-d28b96ba.entry.js.map → p-69756614.entry.js.map} +1 -1
- package/dist/capsule/p-73398222.entry.js +2 -0
- package/dist/capsule/{p-fcead80b.entry.js.map → p-73398222.entry.js.map} +1 -1
- package/dist/capsule/p-8de15b15.entry.js +29 -0
- package/dist/capsule/p-8de15b15.entry.js.map +1 -0
- package/dist/capsule/p-97c33636.js +3 -0
- package/dist/capsule/p-97c33636.js.map +1 -0
- package/dist/capsule/p-f2393be6.js +2 -0
- package/dist/capsule/p-f2393be6.js.map +1 -0
- package/dist/capsule/p-f72482c3.entry.js +2 -0
- package/dist/capsule/{p-ad14a817.entry.js.map → p-f72482c3.entry.js.map} +1 -1
- package/dist/capsule/{p-fa078837.entry.js → p-fd26ce6e.entry.js} +2 -2
- package/dist/capsule/{p-fa078837.entry.js.map → p-fd26ce6e.entry.js.map} +1 -1
- package/dist/cjs/capsule.cjs.js +10 -10
- package/dist/cjs/capsule.cjs.js.map +1 -1
- package/dist/cjs/{constants-0869a780.js → constants-9b1b01bb.js} +3 -3
- package/dist/cjs/{constants-0869a780.js.map → constants-9b1b01bb.js.map} +1 -1
- package/dist/cjs/{cpsl-alert_29.cjs.entry.js → cpsl-alert_33.cjs.entry.js} +608 -95
- package/dist/cjs/cpsl-alert_33.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 +3 -3
- package/dist/cjs/cpsl-info-box.cjs.entry.js.map +1 -1
- package/dist/cjs/cpsl-modal-v2.cjs.entry.js +55 -0
- package/dist/cjs/cpsl-modal-v2.cjs.entry.js.map +1 -0
- package/dist/cjs/cpsl-row.cjs.entry.js +2 -2
- package/dist/cjs/index-5293d431.js +1414 -0
- package/dist/cjs/index-5293d431.js.map +1 -0
- package/dist/cjs/index.cjs.js +16 -4
- 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/chevron-up.svg +2 -2
- package/dist/collection/assets/icons/close.svg +3 -4
- package/dist/collection/assets/icons/cube.svg +3 -0
- package/dist/collection/assets/icons/file.svg +3 -0
- package/dist/collection/assets/icons/image.svg +3 -0
- package/dist/collection/assets/icons/index.js +10 -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/menu.svg +3 -0
- package/dist/collection/assets/icons/refresh.svg +3 -0
- package/dist/collection/assets/icons/stars.svg +4 -0
- package/dist/collection/assets/icons/x.svg +3 -0
- package/dist/collection/collection-manifest.json +7 -2
- package/dist/collection/components/cpsl-alert/cpsl-alert.js +2 -2
- 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.js +20 -4
- package/dist/collection/components/cpsl-app-bar/cpsl-app-bar.js.map +1 -1
- package/dist/collection/components/cpsl-avatar/cpsl-avatar.js +1 -1
- package/dist/collection/components/cpsl-button/cpsl-button.css +113 -17
- package/dist/collection/components/cpsl-button/cpsl-button.js +63 -7
- package/dist/collection/components/cpsl-button/cpsl-button.js.map +1 -1
- package/dist/collection/components/cpsl-button-group/cpsl-button-group.css +1 -0
- package/dist/collection/components/cpsl-button-group/cpsl-button-group.js +1 -1
- package/dist/collection/components/cpsl-card/cpsl-card.css +1 -1
- package/dist/collection/components/cpsl-card/cpsl-card.js +1 -1
- package/dist/collection/components/cpsl-card/cpsl-card.js.map +1 -1
- package/dist/collection/components/cpsl-checkbox/cpsl-checkbox.css +2 -2
- package/dist/collection/components/cpsl-checkbox/cpsl-checkbox.js +1 -1
- package/dist/collection/components/cpsl-code-input/cpsl-code-input.css +1 -1
- package/dist/collection/components/cpsl-code-input/cpsl-code-input.js +2 -2
- package/dist/collection/components/cpsl-code-input/cpsl-code-input.js.map +1 -1
- package/dist/collection/components/cpsl-col/cpsl-col.js +1 -1
- package/dist/collection/components/cpsl-divider/cpsl-divider.css +1 -1
- package/dist/collection/components/cpsl-divider/cpsl-divider.js +1 -1
- package/dist/collection/components/cpsl-drawer/cpsl-drawer.js +84 -11
- package/dist/collection/components/cpsl-drawer/cpsl-drawer.js.map +1 -1
- package/dist/collection/components/cpsl-dropdown/cpsl-dropdown.js +1 -1
- package/dist/collection/components/cpsl-dropdown/cpsl-dropdown.js.map +1 -1
- package/dist/collection/components/cpsl-file-upload/cpsl-file-upload.css +210 -0
- package/dist/collection/components/cpsl-file-upload/cpsl-file-upload.js +406 -0
- package/dist/collection/components/cpsl-file-upload/cpsl-file-upload.js.map +1 -0
- package/dist/collection/components/cpsl-file-upload/test/cpsl-file-upload.e2e.js +29 -0
- package/dist/collection/components/cpsl-file-upload/test/cpsl-file-upload.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-file-upload/test/cpsl-file-upload.spec.js +37 -0
- package/dist/collection/components/cpsl-file-upload/test/cpsl-file-upload.spec.js.map +1 -0
- 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.css +1 -1
- package/dist/collection/components/cpsl-info-box/cpsl-info-box.js +1 -1
- package/dist/collection/components/cpsl-input/cpsl-input.css +7 -6
- package/dist/collection/components/cpsl-input/cpsl-input.js +3 -8
- package/dist/collection/components/cpsl-input/cpsl-input.js.map +1 -1
- package/dist/collection/components/cpsl-modal/cpsl-modal.css +4 -4
- package/dist/collection/components/cpsl-modal/cpsl-modal.js +1 -0
- package/dist/collection/components/cpsl-modal/cpsl-modal.js.map +1 -1
- package/dist/collection/components/cpsl-modal-v2/cpsl-modal-v2.css +91 -0
- package/dist/collection/components/cpsl-modal-v2/cpsl-modal-v2.js +224 -0
- package/dist/collection/components/cpsl-modal-v2/cpsl-modal-v2.js.map +1 -0
- package/dist/collection/components/cpsl-modal-v2/test/cpsl-modal-v2.e2e.js +29 -0
- package/dist/collection/components/cpsl-modal-v2/test/cpsl-modal-v2.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-modal-v2/test/cpsl-modal-v2.spec.js +37 -0
- package/dist/collection/components/cpsl-modal-v2/test/cpsl-modal-v2.spec.js.map +1 -0
- package/dist/collection/components/cpsl-nav-button-group/cpsl-nav-button-group.js +1 -1
- package/dist/collection/components/cpsl-overlay/cpsl-overlay.css +1 -1
- package/dist/collection/components/cpsl-overlay/cpsl-overlay.js +1 -1
- package/dist/collection/components/cpsl-pagination/cpsl-pagination.js +1 -1
- package/dist/collection/components/cpsl-pill/cpsl-pill.css +1 -1
- package/dist/collection/components/cpsl-pill/cpsl-pill.js +1 -1
- package/dist/collection/components/cpsl-popover/cpsl-popover.css +98 -0
- package/dist/collection/components/cpsl-popover/cpsl-popover.js +470 -0
- package/dist/collection/components/cpsl-popover/cpsl-popover.js.map +1 -0
- package/dist/collection/components/cpsl-popover/test/cpsl-popover.e2e.js +29 -0
- package/dist/collection/components/cpsl-popover/test/cpsl-popover.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-popover/test/cpsl-popover.spec.js +37 -0
- package/dist/collection/components/cpsl-popover/test/cpsl-popover.spec.js.map +1 -0
- package/dist/collection/components/cpsl-progress-indicator/cpsl-progress-indicator.css +3 -3
- package/dist/collection/components/cpsl-qr-code/cpsl-qr-code.css +1 -1
- package/dist/collection/components/cpsl-qr-code/cpsl-qr-code.js +1 -1
- package/dist/collection/components/cpsl-radio/cpsl-radio.css +2 -2
- package/dist/collection/components/cpsl-radio/cpsl-radio.js +1 -1
- package/dist/collection/components/cpsl-row/cpsl-row.js +1 -1
- package/dist/collection/components/cpsl-select/cpsl-select.css +227 -0
- package/dist/collection/components/cpsl-select/cpsl-select.js +393 -0
- package/dist/collection/components/cpsl-select/cpsl-select.js.map +1 -0
- package/dist/collection/components/cpsl-select/test/cpsl-select.e2e.js +29 -0
- package/dist/collection/components/cpsl-select/test/cpsl-select.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-select/test/cpsl-select.spec.js +37 -0
- package/dist/collection/components/cpsl-select/test/cpsl-select.spec.js.map +1 -0
- package/dist/collection/components/cpsl-select-item/cpsl-select-item.css +104 -0
- package/dist/collection/components/cpsl-select-item/cpsl-select-item.js +85 -0
- package/dist/collection/components/cpsl-select-item/cpsl-select-item.js.map +1 -0
- package/dist/collection/components/cpsl-select-item/test/cpsl-select-item.e2e.js +29 -0
- package/dist/collection/components/cpsl-select-item/test/cpsl-select-item.e2e.js.map +1 -0
- package/dist/collection/components/cpsl-select-item/test/cpsl-select-item.spec.js +37 -0
- package/dist/collection/components/cpsl-select-item/test/cpsl-select-item.spec.js.map +1 -0
- package/dist/collection/components/cpsl-slide-button/cpsl-slide-button.css +3 -3
- 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 +4 -4
- package/dist/collection/components/cpsl-switch/cpsl-switch.js +1 -1
- package/dist/collection/components/cpsl-tab/cpsl-tab.js +1 -1
- package/dist/collection/components/cpsl-table/cpsl-table.css +25 -64
- package/dist/collection/components/cpsl-table/cpsl-table.js +1 -63
- package/dist/collection/components/cpsl-table/cpsl-table.js.map +1 -1
- package/dist/collection/components/cpsl-tabs/cpsl-tabs.css +2 -2
- package/dist/collection/components/cpsl-tabs/cpsl-tabs.js +1 -1
- package/dist/collection/components/cpsl-text/cpsl-text.css +4 -0
- package/dist/collection/components/cpsl-text/cpsl-text.js +5 -4
- package/dist/collection/components/cpsl-text/cpsl-text.js.map +1 -1
- package/dist/collection/components/cpsl-tile-button/cpsl-tile-button.css +1 -1
- package/dist/collection/components/cpsl-tile-button/cpsl-tile-button.js +2 -2
- package/dist/collection/constants.js +2 -2
- 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 +4 -0
- package/dist/collection/utils/theme/generateBorderRadii.js.map +1 -1
- package/dist/collection/utils/theme/generatePalette.js +11 -3
- package/dist/collection/utils/theme/generatePalette.js.map +1 -1
- package/dist/esm/capsule.js +11 -11
- package/dist/esm/capsule.js.map +1 -1
- package/dist/esm/{constants-6acf4ea8.js → constants-fce138fa.js} +3 -3
- package/dist/esm/{constants-6acf4ea8.js.map → constants-fce138fa.js.map} +1 -1
- package/dist/esm/{cpsl-alert_29.entry.js → cpsl-alert_33.entry.js} +605 -96
- package/dist/esm/cpsl-alert_33.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 +3 -3
- package/dist/esm/cpsl-info-box.entry.js.map +1 -1
- package/dist/esm/cpsl-modal-v2.entry.js +51 -0
- package/dist/esm/cpsl-modal-v2.entry.js.map +1 -0
- package/dist/esm/cpsl-row.entry.js +2 -2
- package/dist/esm/index-97ed6ec1.js +1383 -0
- package/dist/esm/index-97ed6ec1.js.map +1 -0
- package/dist/esm/index.js +16 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/loader/cdn.js +1 -3
- package/dist/loader/index.cjs.js +1 -3
- package/dist/loader/index.es2017.js +1 -3
- package/dist/loader/index.js +1 -3
- package/dist/types/assets/icons/index.d.ts +9 -0
- package/dist/types/components/cpsl-app-bar/cpsl-app-bar.d.ts +1 -0
- package/dist/types/components/cpsl-button/cpsl-button.d.ts +4 -1
- package/dist/types/components/cpsl-drawer/cpsl-drawer.d.ts +10 -1
- package/dist/types/components/cpsl-file-upload/cpsl-file-upload.d.ts +34 -0
- package/dist/types/components/cpsl-input/cpsl-input.d.ts +1 -1
- package/dist/types/components/cpsl-modal-v2/cpsl-modal-v2.d.ts +17 -0
- package/dist/types/components/cpsl-popover/cpsl-popover.d.ts +33 -0
- package/dist/types/components/cpsl-select/cpsl-select.d.ts +35 -0
- package/dist/types/components/cpsl-select-item/cpsl-select-item.d.ts +8 -0
- package/dist/types/components/cpsl-table/cpsl-table.d.ts +0 -3
- package/dist/types/components/cpsl-text/cpsl-text.d.ts +1 -1
- package/dist/types/components.d.ts +580 -28
- package/dist/types/constants.d.ts +2 -2
- package/dist/types/index.d.ts +1 -1
- package/dist/types/interface.d.ts +44 -0
- package/dist/types/stencil-public-runtime.d.ts +3 -8
- package/package.json +2 -3
- package/dist/capsule/p-4d8e4d86.entry.js +0 -29
- package/dist/capsule/p-4d8e4d86.entry.js.map +0 -1
- package/dist/capsule/p-86e48e61.js +0 -3
- package/dist/capsule/p-86e48e61.js.map +0 -1
- package/dist/capsule/p-ad14a817.entry.js +0 -2
- package/dist/capsule/p-b6b38e73.js +0 -2
- package/dist/capsule/p-b6b38e73.js.map +0 -1
- package/dist/capsule/p-d28b96ba.entry.js +0 -10
- package/dist/capsule/p-fcead80b.entry.js +0 -2
- package/dist/cjs/cpsl-alert_29.cjs.entry.js.map +0 -1
- package/dist/cjs/index-5733071e.js +0 -2020
- package/dist/cjs/index-5733071e.js.map +0 -1
- package/dist/collection/components/cpsl-table/table-interface.js +0 -2
- package/dist/collection/components/cpsl-table/table-interface.js.map +0 -1
- package/dist/esm/cpsl-alert_29.entry.js.map +0 -1
- package/dist/esm/index-8fe9f35e.js +0 -1990
- package/dist/esm/index-8fe9f35e.js.map +0 -1
- package/dist/esm/polyfills/core-js.js +0 -11
- package/dist/esm/polyfills/dom.js +0 -79
- package/dist/esm/polyfills/es5-html-element.js +0 -1
- package/dist/esm/polyfills/index.js +0 -34
- package/dist/esm/polyfills/system.js +0 -6
- package/dist/types/components/cpsl-table/table-interface.d.ts +0 -19
package/css/capsule-core.css
CHANGED
|
@@ -59,6 +59,10 @@ html {
|
|
|
59
59
|
--cpsl-font-family: var(--cpsl-default-font);
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
+
div {
|
|
63
|
+
box-sizing: border-box;
|
|
64
|
+
}
|
|
65
|
+
|
|
62
66
|
body.backdrop-no-scroll {
|
|
63
67
|
overflow: hidden;
|
|
64
68
|
}
|
|
@@ -97,8 +101,11 @@ body.backdrop-no-scroll {
|
|
|
97
101
|
--cpsl-color-foreground-80: rgb(209, 209, 209);
|
|
98
102
|
--cpsl-color-foreground-96: rgb(246, 246, 246);
|
|
99
103
|
--cpsl-color-utility-red: rgb(240, 68, 56);
|
|
104
|
+
--cpsl-color-utility-red-light: rgb(251, 203, 199);
|
|
100
105
|
--cpsl-color-utility-yellow: rgb(251, 188, 4);
|
|
106
|
+
--cpsl-color-utility-yellow-light: rgb(254, 236, 185);
|
|
101
107
|
--cpsl-color-utility-green: rgb(52, 168, 83);
|
|
108
|
+
--cpsl-color-utility-green-light: rgb(198, 231, 207);
|
|
102
109
|
--cpsl-color-text-primary: var(--cpsl-color-foreground-0);
|
|
103
110
|
--cpsl-color-text-secondary: var(--cpsl-color-background-64);
|
|
104
111
|
--cpsl-color-text-tertiary: var(--cpsl-color-foreground-32);
|
|
@@ -111,32 +118,53 @@ body.backdrop-no-scroll {
|
|
|
111
118
|
--cpsl-color-modal-border: var(--cpsl-color-background-8);
|
|
112
119
|
--cpsl-color-input-surface-disabled: var(--cpsl-color-background-8);
|
|
113
120
|
--cpsl-color-input-surface-default: var(--cpsl-color-background-4);
|
|
121
|
+
--cpsl-color-input-surface-hover: var(--cpsl-color-background-16);
|
|
114
122
|
--cpsl-color-input-border-placeholder: var(--cpsl-color-background-4);
|
|
115
123
|
--cpsl-color-input-border-active: var(--cpsl-color-foreground-0);
|
|
116
124
|
--cpsl-color-input-border-error: var(--cpsl-color-utility-red);
|
|
117
|
-
--cpsl-color-
|
|
118
|
-
--cpsl-color-
|
|
119
|
-
--cpsl-color-
|
|
120
|
-
--cpsl-color-
|
|
125
|
+
--cpsl-color-select-surface-disabled: var(--cpsl-color-background-8);
|
|
126
|
+
--cpsl-color-select-surface-default: var(--cpsl-color-background-4);
|
|
127
|
+
--cpsl-color-select-surface-hover: var(--cpsl-color-background-16);
|
|
128
|
+
--cpsl-color-select-border-placeholder: var(--cpsl-color-background-4);
|
|
129
|
+
--cpsl-color-select-border-active: var(--cpsl-color-foreground-0);
|
|
130
|
+
--cpsl-color-select-border-error: var(--cpsl-color-utility-red);
|
|
131
|
+
--cpsl-color-select-dropdown-border: var(--cpsl-color-background-16);
|
|
132
|
+
--cpsl-color-file-surface-disabled: var(--cpsl-color-background-8);
|
|
133
|
+
--cpsl-color-file-surface-default: var(--cpsl-color-background-4);
|
|
134
|
+
--cpsl-color-file-surface-drag: var(--cpsl-color-background-16);
|
|
135
|
+
--cpsl-color-file-border-placeholder: var(--cpsl-color-background-4);
|
|
136
|
+
--cpsl-color-file-border-error: var(--cpsl-color-utility-red);
|
|
137
|
+
--cpsl-color-tile-button-surface-default: var(--cpsl-color-background-4);
|
|
138
|
+
--cpsl-color-tile-button-surface-hover: var(--cpsl-color-background-16);
|
|
139
|
+
--cpsl-color-tile-button-surface-pressed: var(--cpsl-color-background-16);
|
|
140
|
+
--cpsl-color-tile-button-border: var(--cpsl-color-background-4);
|
|
121
141
|
--cpsl-color-primary-button-text: var(--cpsl-color-text-inverted);
|
|
122
142
|
--cpsl-color-primary-button-surface-default: var(--cpsl-color-foreground-0);
|
|
123
143
|
--cpsl-color-primary-button-surface-hover: var(--cpsl-color-foreground-16);
|
|
124
|
-
--cpsl-color-primary-button-surface-pressed: var(--cpsl-color-foreground-
|
|
125
|
-
--cpsl-color-primary-button-surface-disabled: var(--cpsl-color-background-
|
|
144
|
+
--cpsl-color-primary-button-surface-pressed: var(--cpsl-color-foreground-16);
|
|
145
|
+
--cpsl-color-primary-button-surface-disabled: var(--cpsl-color-background-16);
|
|
126
146
|
--cpsl-color-primary-button-border-default: var(--cpsl-color-foreground-0);
|
|
127
|
-
--cpsl-color-primary-button-border-disabled: var(--cpsl-color-background-
|
|
147
|
+
--cpsl-color-primary-button-border-disabled: var(--cpsl-color-background-16);
|
|
128
148
|
--cpsl-color-primary-button-outline: var(--cpsl-color-foreground-32);
|
|
129
149
|
--cpsl-color-secondary-button-text: var(--cpsl-color-text-primary);
|
|
130
|
-
--cpsl-color-secondary-button-surface-default:
|
|
150
|
+
--cpsl-color-secondary-button-surface-default: transparent;
|
|
131
151
|
--cpsl-color-secondary-button-surface-hover: var(--cpsl-color-background-16);
|
|
132
|
-
--cpsl-color-secondary-button-surface-pressed: var(--cpsl-color-background-
|
|
133
|
-
--cpsl-color-secondary-button-surface-disabled: var(--cpsl-color-foreground-
|
|
152
|
+
--cpsl-color-secondary-button-surface-pressed: var(--cpsl-color-background-16);
|
|
153
|
+
--cpsl-color-secondary-button-surface-disabled: var(--cpsl-color-foreground-96);
|
|
134
154
|
--cpsl-color-secondary-button-border-default: var(--cpsl-color-background-32);
|
|
135
|
-
--cpsl-color-secondary-button-border-disabled: var(--cpsl-color-foreground-
|
|
155
|
+
--cpsl-color-secondary-button-border-disabled: var(--cpsl-color-foreground-96);
|
|
136
156
|
--cpsl-color-secondary-button-outline: var(--cpsl-color-background-32);
|
|
137
|
-
--cpsl-color-
|
|
138
|
-
--cpsl-color-
|
|
139
|
-
--cpsl-color-
|
|
157
|
+
--cpsl-color-destructive-button-text: var(--cpsl-color-text-error);
|
|
158
|
+
--cpsl-color-destructive-button-surface-default: transparent;
|
|
159
|
+
--cpsl-color-destructive-button-surface-hover: var(--cpsl-color-utility-red-light);
|
|
160
|
+
--cpsl-color-destructive-button-surface-pressed: var(--cpsl-color-utility-red-light);
|
|
161
|
+
--cpsl-color-destructive-button-surface-disabled: var(--cpsl-color-foreground-96);
|
|
162
|
+
--cpsl-color-destructive-button-border-default: var(--cpsl-color-utility-red);
|
|
163
|
+
--cpsl-color-destructive-button-border-disabled: var(--cpsl-color-foreground-96);
|
|
164
|
+
--cpsl-color-destructive-button-outline: var(--cpsl-color-background-32);
|
|
165
|
+
--cpsl-color-ghost-button-default: var(--cpsl-color-text-secondary);
|
|
166
|
+
--cpsl-color-ghost-button-disabled: var(--cpsl-color-text-secondary);
|
|
167
|
+
--cpsl-color-ghost-button-hover: var(--cpsl-color-text-primary);
|
|
140
168
|
--cpsl-color-divider: var(--cpsl-color-background-32);
|
|
141
169
|
--cpsl-color-spinner-path: var(--cpsl-color-background-32);
|
|
142
170
|
--cpsl-color-spinner-circle: var(--cpsl-color-foreground-0);
|
|
@@ -181,10 +209,13 @@ body.backdrop-no-scroll {
|
|
|
181
209
|
--cpsl-color-card-surface: var(--cpsl-color-background-0);
|
|
182
210
|
--cpsl-color-card-border: var(--cpsl-color-background-16);
|
|
183
211
|
--cpsl-border-radius-input: 16px;
|
|
212
|
+
--cpsl-border-radius-select: 16px;
|
|
213
|
+
--cpsl-border-radius-file: 16px;
|
|
184
214
|
--cpsl-border-radius-alert: 12px;
|
|
185
215
|
--cpsl-border-radius-tabs: 8px;
|
|
186
216
|
--cpsl-border-radius-primary-button: 12px;
|
|
187
217
|
--cpsl-border-radius-secondary-button: 12px;
|
|
218
|
+
--cpsl-border-radius-destructive-button: 12px;
|
|
188
219
|
--cpsl-border-radius-tile-button: 8px;
|
|
189
220
|
--cpsl-border-radius-modal: 20px;
|
|
190
221
|
--cpsl-border-radius-pill: 1000px;
|
|
@@ -196,6 +227,7 @@ body.backdrop-no-scroll {
|
|
|
196
227
|
--cpsl-border-radius-radio: 1000px;
|
|
197
228
|
--cpsl-border-radius-avatar: 8px;
|
|
198
229
|
--cpsl-border-radius-card: 16px;
|
|
230
|
+
--cpsl-border-radius-button-group: 4px;
|
|
199
231
|
--cpsl-font-size-body-2xs: clamp(8px, 0.625rem, 15px);
|
|
200
232
|
--cpsl-font-size-body-xs: clamp(9.6px, 0.75rem, 18px);
|
|
201
233
|
--cpsl-font-size-body-s: clamp(11.2px, 0.875rem, 21px);
|
|
@@ -236,5 +268,42 @@ body.backdrop-no-scroll {
|
|
|
236
268
|
-webkit-transform: rotate(360deg);
|
|
237
269
|
}
|
|
238
270
|
}
|
|
271
|
+
.cpsl-table {
|
|
272
|
+
width: 100%;
|
|
273
|
+
border-spacing: 0;
|
|
274
|
+
border-collapse: separate;
|
|
275
|
+
font-family: var(--cpsl-font-family, inherit);
|
|
276
|
+
}
|
|
277
|
+
.cpsl-table th {
|
|
278
|
+
-webkit-padding-start: var(--table-header-padding-start);
|
|
279
|
+
padding-inline-start: var(--table-header-padding-start);
|
|
280
|
+
-webkit-padding-end: var(--table-header-padding-end);
|
|
281
|
+
padding-inline-end: var(--table-header-padding-end);
|
|
282
|
+
padding-top: var(--table-header-padding-top);
|
|
283
|
+
padding-bottom: var(--table-header-padding-bottom);
|
|
284
|
+
background: var(--table-header-background-color);
|
|
285
|
+
color: var(--cpsl-color-text-primary);
|
|
286
|
+
font-weight: 500;
|
|
287
|
+
font-size: var(--cpsl-font-size-body-xs);
|
|
288
|
+
border-bottom: var(--table-header-border-width) solid var(--table-header-border-color);
|
|
289
|
+
}
|
|
290
|
+
.cpsl-table td {
|
|
291
|
+
-webkit-padding-start: var(--table-content-padding-start);
|
|
292
|
+
padding-inline-start: var(--table-content-padding-start);
|
|
293
|
+
-webkit-padding-end: var(--table-content-padding-end);
|
|
294
|
+
padding-inline-end: var(--table-content-padding-end);
|
|
295
|
+
padding-top: var(--table-content-padding-top);
|
|
296
|
+
padding-bottom: var(--table-content-padding-bottom);
|
|
297
|
+
color: var(--cpsl-color-text-primary);
|
|
298
|
+
font-size: var(--cpsl-font-size-body-s);
|
|
299
|
+
border-bottom: var(--table-content-border-width) solid var(--table-content-border-color);
|
|
300
|
+
}
|
|
301
|
+
.cpsl-table tr:last-child td {
|
|
302
|
+
border-bottom: none;
|
|
303
|
+
}
|
|
304
|
+
.cpsl-table.sticky-header thead {
|
|
305
|
+
position: sticky;
|
|
306
|
+
top: 0;
|
|
307
|
+
}
|
|
239
308
|
|
|
240
309
|
/*# sourceMappingURL=capsule-core.css.map */
|
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;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
|
+
{"version":3,"sourceRoot":"","sources":["../src/themes/capsule.functions.font.scss","../src/themes/capsule.mixins.scss","../src/css/capsule-core.scss","../src/themes/capsule.globals.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;;;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;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;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;;;AAIJ;EACE;EAEA;EACA;EACA,aC5EiB;;AD8EjB;EDiOE,uBChOuH;EDiOvH,sBCjOuH;EDkOvH,qBClOkD;EDmOlD,oBCnOkD;EDiPpD,aCjPmB;EDkPnB,gBClPqF;EAEnF;EACA;EACA;EACA;EACA;;AAGF;EDuNE,uBCtN0H;EDuN1H,sBCvN0H;EDwN1H,qBCxNmD;EDyNnD,oBCzNmD;EDuOrD,aCvOmB;EDwOnB,gBCxOuF;EACrF;EACA;EACA;;AAGF;EACE;;AAIA;EACE;EACA","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\ndiv {\n box-sizing: border-box;\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\n.cpsl-table {\n width: 100%;\n\n border-spacing: 0;\n border-collapse: separate;\n font-family: $font-family-base;\n\n & th {\n @include padding(var(--table-header-padding-top), var(--table-header-padding-end), var(--table-header-padding-bottom), var(--table-header-padding-start));\n\n background: var(--table-header-background-color);\n color: var(--cpsl-color-text-primary);\n font-weight: 500;\n font-size: var(--cpsl-font-size-body-xs);\n border-bottom: var(--table-header-border-width) solid var(--table-header-border-color);\n }\n\n & td {\n @include padding(var(--table-content-padding-top), var(--table-content-padding-end), var(--table-content-padding-bottom), var(--table-content-padding-start));\n color: var(--cpsl-color-text-primary);\n font-size: var(--cpsl-font-size-body-s);\n border-bottom: var(--table-content-border-width) solid var(--table-content-border-color);\n }\n\n & tr:last-child td {\n border-bottom: none;\n }\n\n &.sticky-header {\n & thead {\n position: sticky;\n top: 0;\n }\n }\n}\n","// Global Utility Functions\n@import './capsule.functions.string';\n\n// Global Color Functions\n@import './capsule.functions.color';\n\n// Global Font Functions\n@import './capsule.functions.font';\n\n// Global Mixins\n@import './capsule.mixins';\n\n// Default Theme\n@import './capsule.theme.default';\n\n// Default General\n// --------------------------------------------------\n$font-family-base: var(--cpsl-font-family, inherit) !default;\n$font-size-base: var(--cpsl-font-size-base, 16px) !default;\n\n// The minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries\n$screen-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n) !default;\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-97c33636.js";export{s as setNonce}from"./p-97c33636.js";import{g as r}from"./p-e1255160.js";var o=()=>{const t=import.meta.url;const r={};if(t!==""){r.resourcesUrl=new URL(".",t).href}return e(r)};o().then((async e=>{await r();return t([["p-39584a7b",[[1,"cpsl-modal-v2",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],elevated:[4],noOverlay:[4,"no-overlay"],open:[4],zIndexOverride:[2,"z-index-override"]},null,{open:["toggleHeight"]}]]],["p-69756614",[[1,"cpsl-animation",{src:[1],replayAnimation:[64]}]]],["p-127ac658",[[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-fd26ce6e",[[1,"cpsl-grid",{fixed:[4]}]]],["p-73398222",[[1,"cpsl-info-box"]]],["p-f72482c3",[[1,"cpsl-row"]]],["p-8de15b15",[[1,"cpsl-pagination",{initialPage:[2,"initial-page"],totalPages:[2,"total-pages"],visiblePages:[1026,"visible-pages"],currentPage:[32]},null,{currentPage:["watchChange"]}],[1,"cpsl-file-upload",{errorText:[1,"error-text"],externalFilename:[1,"external-filename"],externalSrc:[1,"external-src"],fileTypes:[16],helperText:[1,"helper-text"],label:[1],required:[4],showOptionalLabel:[4,"show-optional-label"],uploadFile:[16],file:[32],dragOver:[32],dragError:[32],isUploading:[32],uploadError:[32]}],[1,"cpsl-select",{disabled:[4],dropdownMaxHeight:[2,"dropdown-max-height"],errorText:[1,"error-text"],formatValue:[16],helperText:[1,"helper-text"],id:[1],label:[1],placeholder:[1],required:[4],selectedValue:[1,"selected-value"],showFormattedSelectedItem:[4,"show-formatted-selected-item"],showOptionalLabel:[4,"show-optional-label"],hasFocus:[32],popoverOpen:[32],hasSelectedItem:[32]},[[0,"cpslSelectItemClick","selectItemClickHandler"],[0,"cpslOpen","onPopoverOpen"],[0,"cpslClose","onPopoverClose"]],{selectedValue:["onValueChange","handleValueChange"]}],[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],anchorPosition:[2,"anchor-position"],noOverlay:[4,"no-overlay"],open:[4],size:[8],transitionDuration:[2,"transition-duration"],transitionFunction:[1,"transition-function"],variant:[1],zIndexOverride:[2,"z-index-override"],closedAnchorPosition:[32],showTransition:[32]}],[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"],[1,"cpsl-tile-button",{src:[1],icon:[1]}],[1,"cpsl-app-bar",{height:[2],position:[1],zIndexOverride:[2,"z-index-override"]}],[1,"cpsl-avatar",{alt:[1],src:[1],variant:[1]}],[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-select-item",{selected:[4],value:[1]}],[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",{as:[1],disabled:[516],fullWidth:[4,"full-width"],href:[1],size:[1],target:[1],variant:[513]}],[1,"cpsl-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-popover",{anchorOriginHorizontal:[1,"anchor-origin-horizontal"],anchorOriginVertical:[1,"anchor-origin-vertical"],autoWidth:[4,"auto-width"],preventBlur:[4,"prevent-blur"],transformOriginHorizontal:[1,"transform-origin-horizontal"],transformOriginVertical:[1,"transform-origin-vertical"],triggerAction:[1,"trigger-action"],trigger:[1],windowPadding:[2,"window-padding"],open:[32],positionX:[32],positionY:[32],closePopover:[64]},null,{trigger:["onTriggerChange"],triggerAction:["onTriggerChange"],preventBlur:["onTriggerChange"],anchorOriginHorizontal:["onAnchorChange"],anchorOriginVertical:["onAnchorChange"],open:["onOpenChange"]}],[1,"cpsl-spinner",{size:[2],speed:[2]}],[1,"cpsl-card"],[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","initialPage","totalPages","visiblePages","currentPage","
|
|
1
|
+
{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","enterTransitionDuration","exitTransitionDuration","elevated","noOverlay","open","zIndexOverride","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","errorText","externalFilename","externalSrc","fileTypes","helperText","label","required","showOptionalLabel","uploadFile","file","dragOver","dragError","isUploading","uploadError","disabled","dropdownMaxHeight","formatValue","id","placeholder","selectedValue","showFormattedSelectedItem","hasFocus","popoverOpen","hasSelectedItem","icon","variant","checked","code","length","type","anchor","anchorPosition","transitionDuration","transitionFunction","closedAnchorPosition","showTransition","footerExpanded","footerTransitionDuration","hasFooter","endIcon","endText","startIcon","startText","height","position","alt","width","hasCpslSearch","items","selectedItem","isOpen","searchQuery","filteredItems","autocapitalize","autocomplete","autocorrect","noAutoDisable","autofocus","enterkeyhint","inputmode","max","maxlength","min","minlength","multiple","name","pattern","readonly","spellcheck","startIconSrc","step","value","selectedId","text","totalSteps","imageSrc","selected","tab","fullWidth","selectedTab","selectedTabRect","loaded","as","target","anchorOriginHorizontal","anchorOriginVertical","autoWidth","preventBlur","transformOriginHorizontal","transformOriginVertical","triggerAction","trigger","windowPadding","positionX","positionY","closePopover","speed","color","weight"],"sources":["../../developer-portal/node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.18.3 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || 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};\nvar 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 if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\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":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAc,mCAA8B,CAAAC,wBAAS,gCAAAC,uBAAA,+BAAAC,SAAA,IAAAC,UAAA,iBAAAC,KAAA,IAAAC,eAAA,8BAAAD,KAAA,yDAAAE,IAAA,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,yCAAAC,UAAA,iBAAAC,iBAAA,wBAAAC,YAAA,mBAAAC,UAAA,KAAAC,WAAA,kBAAAC,MAAA,IAAAC,SAAA,IAAAC,kBAAA,0BAAAC,WAAA,KAAAC,KAAA,KAAAC,SAAA,KAAAC,UAAA,KAAAC,YAAA,KAAAC,YAAA,yBAAAC,SAAA,IAAAC,kBAAA,0BAAAf,UAAA,iBAAAgB,YAAA,KAAAZ,WAAA,kBAAAa,GAAA,IAAAZ,MAAA,IAAAa,YAAA,IAAAZ,SAAA,IAAAa,cAAA,qBAAAC,0BAAA,mCAAAb,kBAAA,0BAAAc,SAAA,KAAAC,YAAA,KAAAC,gBAAA,4HAAAJ,cAAA,yDAAAK,KAAA,IAAAC,QAAA,0BAAAC,QAAA,4BAAAC,KAAA,OAAA3B,UAAA,iBAAAI,WAAA,kBAAAwB,OAAA,IAAAC,KAAA,wBAAAC,OAAA,IAAAC,eAAA,sBAAAjE,UAAA,iBAAAC,KAAA,IAAAsB,KAAA,IAAA2C,mBAAA,0BAAAC,mBAAA,0BAAAR,QAAA,IAAAzD,eAAA,uBAAAkE,qBAAA,KAAAC,eAAA,wBAAAxE,wBAAA,gCAAAC,uBAAA,+BAAAwE,eAAA,sBAAAC,yBAAA,iCAAAvE,UAAA,iBAAAC,KAAA,IAAAC,eAAA,uBAAAsE,UAAA,YAAAF,eAAA,iBAAArE,KAAA,0CAAA+C,SAAA,IAAAyB,QAAA,eAAAC,QAAA,eAAAC,UAAA,iBAAAC,UAAA,2DAAAzE,IAAA,IAAAuD,KAAA,yBAAAmB,OAAA,IAAAC,SAAA,IAAA5E,eAAA,2CAAA6E,IAAA,IAAA5E,IAAA,IAAAwD,QAAA,6CAAAqB,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,IAAA3C,SAAA,IAAA4C,aAAA,IAAA1D,UAAA,iBAAAI,WAAA,kBAAAuD,UAAA,IAAAtD,MAAA,IAAAuD,IAAA,IAAAC,UAAA,IAAAC,IAAA,IAAAC,UAAA,IAAAC,SAAA,IAAAC,KAAA,IAAAC,QAAA,IAAAhD,YAAA,IAAAiD,SAAA,IAAA7D,SAAA,IAAAC,kBAAA,0BAAA6D,WAAA,IAAAC,aAAA,qBAAA5B,UAAA,iBAAA6B,KAAA,IAAAzC,KAAA,IAAA0C,MAAA,OAAAlD,SAAA,YAAAP,SAAA,gDAAA0D,WAAA,yBAAAA,WAAA,iCAAAC,KAAA,oCAAAC,WAAA,kBAAAJ,KAAA,yBAAAtH,IAAA,IAAA2H,SAAA,gBAAAtF,KAAA,uBAAAqC,QAAA,6BAAAkD,SAAA,IAAAL,MAAA,wBAAA7C,QAAA,qBAAAkD,SAAA,IAAAC,IAAA,8FAAAC,UAAA,iBAAAC,YAAA,mBAAAC,gBAAA,KAAAC,OAAA,YAAAH,UAAA,iBAAAC,YAAA,kCAAAG,GAAA,IAAApE,SAAA,MAAAgE,UAAA,iBAAA1H,KAAA,IAAAiC,KAAA,IAAA8F,OAAA,IAAA1D,QAAA,gCAAA+C,WAAA,yBAAAA,WAAA,oCAAAY,uBAAA,+BAAAC,qBAAA,6BAAAC,UAAA,iBAAAC,YAAA,mBAAAC,0BAAA,kCAAAC,wBAAA,gCAAAC,cAAA,qBAAAC,QAAA,IAAAC,cAAA,qBAAA7H,KAAA,KAAA8H,UAAA,KAAAC,UAAA,KAAAC,aAAA,YAAAJ,QAAA,oBAAAD,cAAA,oBAAAH,YAAA,oBAAAH,uBAAA,mBAAAC,qBAAA,mBAAAtH,KAAA,sCAAAsB,KAAA,IAAA2G,MAAA,yCAAArI,wBAAA,gCAAAC,uBAAA,+BAAAG,KAAA,IAAAC,eAAA,8BAAAD,KAAA,mCAAAkI,MAAA,IAAAxE,QAAA,IAAAyE,OAAA,sBAAAjI,IAAA,IAAAuD,KAAA,SAAAhE,EAAA","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
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};
|
|
1
|
+
import{D as o,C as t,U as n}from"./p-f2393be6.js";const r=({borderRadius:o})=>{if(!Boolean(o)){return}let t,n,r,e;const c=1e3;let s=false;let u=false;switch(o){case"none":{u=true;t=0;n=0;r=0;e=0;break}case"xs":{t=2;n=4;r=12;e=20;break}case"sm":{t=2;n=8;r=16;e=24;break}case"lg":{t=8;n=16;r=24;e=32;break}case"full":{t=8;n=16;r=24;e=32;s=true;break}default:case"md":{t=4;n=12;r=20;e=28;break}}document.documentElement.style.setProperty("--cpsl-border-radius-input",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-select",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-file",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-alert",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tabs",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-primary-button",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-secondary-button",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-destructive-button",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tile-button",`${n}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",`${n}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",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-radio",`${c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-avatar",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-card",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-button-group",`${t}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:t})=>{if(Boolean(o)){document.documentElement.style.setProperty("--cpsl-default-font",o)}Object.entries(e).forEach((([o,n])=>{if(t===null||t===void 0?void 0:t[o]){document.documentElement.style.setProperty(`--cpsl-font-size-${n}`,t[o])}else{document.documentElement.style.removeProperty(`--cpsl-font-size-${n}`)}}))};function s(o,t,n){return Math.min(Math.max(o,n),t)}class u extends Error{constructor(o){super(`Failed to parse color: "${o}"`)}}var d=u;function l(o){if(typeof o!=="string")throw new d(o);if(o.trim().toLowerCase()==="transparent")return[0,0,0,0];let t=o.trim();t=y.test(o)?p(o):o;const n=b.exec(t);if(n){const o=Array.from(n).slice(1);return[...o.slice(0,3).map((o=>parseInt(f(o,2),16))),parseInt(f(o[3]||"f",2),16)/255]}const r=g.exec(t);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(t);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(t);if(c){const[t,n,r,e]=Array.from(c).slice(1).map(parseFloat);if(s(0,100,n)!==n)throw new d(o);if(s(0,100,r)!==r)throw new d(o);return[...z(t,n,r),Number.isNaN(e)?1:e]}throw new d(o)}function a(o){let t=5381;let n=o.length;while(n){t=t*33^o.charCodeAt(--n)}return(t>>>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,t)=>{const n=i(t.substring(0,3));const r=i(t.substring(3)).toString(16);let e="";for(let o=0;o<6-r.length;o++){e+="0"}o[n]=`${e}${r}`;return o}),{});function p(o){const t=o.toLowerCase().trim();const n=_[a(t)];if(!n)throw new d(o);return`#${n}`}const f=(o,t)=>Array.from(Array(t)).map((()=>o)).join("");const b=new RegExp(`^#${f("([a-f0-9])",3)}([a-f0-9])?$`,"i");const g=new RegExp(`^#${f("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i");const m=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${f(",\\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 y=/^[a-z]+$/i;const k=o=>Math.round(o*255);const z=(o,t,n)=>{let r=n/100;if(t===0){return[r,r,r].map(k)}const e=(o%360+360)%360/60;const c=(1-Math.abs(2*r-1))*(t/100);const s=c*(1-Math.abs(e%2-1));let u=0;let d=0;let l=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;l=s}else if(e>=3&&e<4){d=s;l=c}else if(e>=4&&e<5){u=s;l=c}else if(e>=5&&e<6){u=c;l=s}const a=r-c/2;const i=u+a;const _=d+a;const p=l+a;return[i,_,p].map(k)};function x(o){if(o==="transparent")return 0;function t(o){const t=o/255;return t<=.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)}const[n,r,e]=l(o);return.2126*t(n)+.7152*t(r)+.0722*t(e)}function $(o,t,n,r){return`rgba(${s(0,255,o).toFixed()}, ${s(0,255,t).toFixed()}, ${s(0,255,n).toFixed()}, ${parseFloat(s(0,1,r).toFixed(3))})`}function w(o,t,n){const r=(o,t)=>t===3?o:o/255;const[e,c,s,u]=l(o).map(r);const[d,a,i,_]=l(t).map(r);const p=_-u;const f=n*2-1;const b=f*p===-1?f:f+p/(1+f*p);const g=(b+1)/2;const m=1-g;const h=(e*m+d*g)*255;const y=(c*m+a*g)*255;const k=(s*m+i*g)*255;const z=_*n+u*(1-n);return $(h,y,k,z)}function j(o){return x(o)>.179}function v(o,t,n){return{r:255*n(o.r/255,t.r/255),g:255*n(o.g/255,t.g/255),b:255*n(o.b/255,t.b/255)}}function F(o,t){return o*t}function q(o,t){return o+t-o*t}function M(o,t){return C(t,o)}function C(o,t){return t<=.5?F(o,2*t):q(o,2*t-1)}function S(o,t,n){return Math.min(Math.max(o||0,t),n)}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,t){void 0===t&&(t=0);var n=Math.pow(10,t);return{r:Math.round(o.r*n)/n,g:Math.round(o.g*n)/n,b:Math.round(o.b*n)/n,a:o.a}}function R(o,t,n,r,e,c){return(1-t/n)*r+t/n*Math.round((1-o)*e+o*c)}function X(o,t,n,r,e){void 0===e&&(e={unitInput:!1,unitOutput:!1,roundOutput:!0}),e.unitInput&&(o=I(o),t=I(t)),o=A(o);var c=(t=A(t)).a+o.a-t.a*o.a,s=n(o,t,r),u=A({r:R(o.a,t.a,c,o.r,t.r,s.r),g:R(o.a,t.a,c,o.g,t.g,s.g),b:R(o.a,t.a,c,o.b,t.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,t){return X(o,t,v,M)}const E=o=>{const t=(new Option).style;t.color=o;return t.color!==""};const P=o=>o.replace(/([a-z0–9])([A-Z])/g,"$1-$2").toLowerCase();const D=(o,t)=>{let n={};for(const r in t){const e=`${o}-${P(r)}`;if(typeof t[r]==="object"&&t[r]!==null){n=Object.assign(Object.assign({},n),D(e,t[r]))}else{n[e]=t[r]}}return n};const N=o=>D("--cpsl-color",o);const U=(o,t)=>{const n=l(o);const r=l(t);const e=L({r:n[0],g:n[1],b:n[2],a:.1},{r:r[0],g:r[1],b:r[2],a:r[3]});return $(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 l=s?"#000000":"#FFFFFF";t.forEach((o=>{u.foregroundColors.push(w(r,l,o));u.backgroundColors.push(w(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]);const a="#FFFFFF";const i=.72;const _=U(r,n.red);const p=U(r,n.yellow);const f=U(r,n.green);document.documentElement.style.setProperty("--cpsl-color-utility-red",_);document.documentElement.style.setProperty("--cpsl-color-utility-yellow",p);document.documentElement.style.setProperty("--cpsl-color-utility-green",f);document.documentElement.style.setProperty("--cpsl-color-utility-red-light",w(_,a,i));document.documentElement.style.setProperty("--cpsl-color-utility-yellow-light",w(p,a,i));document.documentElement.style.setProperty("--cpsl-color-utility-green-light",w(f,a,i));if(Boolean(c)){const o=N(c);Object.entries(o).forEach((([o,t])=>document.documentElement.style.setProperty(o,t)))}return u};const G=({foregroundColor:t=o.foregroundColor,backgroundColor:n=o.backgroundColor,font:e,customPalette:s,borderRadius:u,customFontSizes:d})=>{const l=Z({foregroundColor:t,backgroundColor:n,customPalette:s});c({font:e,customFontSizes:d});r({borderRadius:u});return l.isDarkBackground};export{G as generateTheme};
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|