@usecapsule/core-components 3.0.1 → 3.1.1
Sign up to get free protection for your applications and to get access to all the features.
- package/css/capsule-core.css +93 -24
- 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-02072c68.entry.js +2 -0
- package/dist/capsule/p-02072c68.entry.js.map +1 -0
- package/dist/capsule/p-1474c545.entry.js +29 -0
- package/dist/capsule/p-1474c545.entry.js.map +1 -0
- package/dist/capsule/p-2c16694d.entry.js +2 -0
- package/dist/capsule/p-41088cd4.entry.js +2 -0
- package/dist/capsule/{p-fcead80b.entry.js.map → p-41088cd4.entry.js.map} +1 -1
- package/dist/capsule/{p-fa078837.entry.js → p-6dcaee48.entry.js} +2 -2
- package/dist/capsule/p-7dde3172.js +3 -0
- package/dist/capsule/p-7dde3172.js.map +1 -0
- package/dist/capsule/{p-d28b96ba.entry.js → p-a6aaf3f4.entry.js} +2 -2
- package/dist/capsule/{p-0d0a0037.entry.js → p-b976b6f0.entry.js} +2 -2
- package/dist/capsule/p-f2393be6.js +2 -0
- package/dist/capsule/p-f2393be6.js.map +1 -0
- package/dist/cjs/capsule.cjs.js +2 -2
- 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} +662 -87
- package/dist/cjs/cpsl-alert_33.cjs.entry.js.map +1 -0
- package/dist/cjs/cpsl-animation.cjs.entry.js +1 -1
- package/dist/cjs/cpsl-col.cjs.entry.js +1 -1
- 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-5733071e.js → index-528f7428.js} +86 -3
- package/dist/cjs/index-528f7428.js.map +1 -0
- package/dist/cjs/index.cjs.js +116 -107
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- 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/farcaster-brand.svg +10 -0
- package/dist/collection/assets/icons/farcaster.svg +10 -0
- package/dist/collection/assets/icons/image.svg +3 -0
- package/dist/collection/assets/icons/index.js +9 -1
- package/dist/collection/assets/icons/index.js.map +1 -1
- 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 +5 -0
- package/dist/collection/components/cpsl-alert/cpsl-alert.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-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-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-code-input/cpsl-code-input.css +1 -1
- package/dist/collection/components/cpsl-divider/cpsl-divider.css +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 +211 -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.css +4 -0
- package/dist/collection/components/cpsl-pagination/cpsl-pagination.js +1 -1
- package/dist/collection/components/cpsl-pagination/cpsl-pagination.js.map +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 +511 -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 +229 -0
- package/dist/collection/components/cpsl-select/cpsl-select.js +409 -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 +114 -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 +40 -60
- package/dist/collection/components/cpsl-table/cpsl-table.js +40 -58
- 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/interface.js.map +1 -1
- package/dist/collection/utils/theme/generateBorderRadii.js +40 -39
- 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/collection/utils/theme/generateTheme.js +2 -2
- package/dist/collection/utils/theme/generateTheme.js.map +1 -1
- package/dist/collection/utils/theme/utils.js +1 -0
- package/dist/collection/utils/theme/utils.js.map +1 -1
- package/dist/esm/capsule.js +3 -3
- 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} +659 -88
- package/dist/esm/cpsl-alert_33.entry.js.map +1 -0
- package/dist/esm/cpsl-animation.entry.js +1 -1
- package/dist/esm/cpsl-col.entry.js +1 -1
- 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-8fe9f35e.js → index-b188f201.js} +86 -4
- package/dist/esm/index-b188f201.js.map +1 -0
- package/dist/esm/index.js +116 -107
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/types/assets/icons/index.d.ts +8 -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 +35 -0
- package/dist/types/components/cpsl-select/cpsl-select.d.ts +38 -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 +8 -3
- package/dist/types/components/cpsl-text/cpsl-text.d.ts +1 -1
- package/dist/types/components.d.ts +596 -28
- package/dist/types/constants.d.ts +2 -2
- package/dist/types/interface.d.ts +68 -1
- package/dist/types/utils/theme/generateBorderRadii.d.ts +1 -1
- package/dist/types/utils/theme/generateTheme.d.ts +1 -1
- package/dist/types/utils/theme/utils.d.ts +4 -1
- package/package.json +2 -2
- package/dist/capsule/p-107e1ff5.entry.js +0 -29
- package/dist/capsule/p-107e1ff5.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-fcead80b.entry.js +0 -2
- package/dist/cjs/cpsl-alert_29.cjs.entry.js.map +0 -1
- 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.map +0 -1
- package/dist/types/components/cpsl-table/table-interface.d.ts +0 -19
- /package/dist/capsule/{p-ad14a817.entry.js.map → p-2c16694d.entry.js.map} +0 -0
- /package/dist/capsule/{p-fa078837.entry.js.map → p-6dcaee48.entry.js.map} +0 -0
- /package/dist/capsule/{p-d28b96ba.entry.js.map → p-a6aaf3f4.entry.js.map} +0 -0
- /package/dist/capsule/{p-0d0a0037.entry.js.map → p-b976b6f0.entry.js.map} +0 -0
@@ -2,8 +2,8 @@
|
|
2
2
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
4
4
|
|
5
|
-
const index = require('./index-
|
6
|
-
const constants = require('./constants-
|
5
|
+
const index = require('./index-528f7428.js');
|
6
|
+
const constants = require('./constants-9b1b01bb.js');
|
7
7
|
const _commonjsHelpers = require('./_commonjsHelpers-b3309d7b.js');
|
8
8
|
|
9
9
|
const cpslAlertCss = ":host{--container-gap:8px;--container-padding-top:14px;--container-padding-bottom:14px;--container-padding-start:16px;--container-padding-end:16px;--container-font-size:var(--cpsl-font-size-body-m);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-alert);--container-background-color:var(--cpsl-color-background-0);--container-color:var(--cpsl-color-text-primary);--container-icon-color:var(--container-color);display:inline-block;font-family:var(--cpsl-font-family, inherit)}:host(.error){--container-border-color:var(--cpsl-color-utility-red)}:host(.warning){--container-border-color:var(--cpsl-color-utility-yellow)}:host(.success){--container-border-color:var(--cpsl-color-utility-green)}:host cpsl-icon{--icon-color:var(--container-icon-color);--height:20px;--width:20px}.alert-container{border-radius:var(--container-border-radius);-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);font-size:var(--container-font-size);display:flex;align-items:center;justify-content:center;gap:var(--container-gap);border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);background-color:var(--container-background-color);color:var(--container-color)}";
|
@@ -46,14 +46,13 @@ const CpslAppBar = class {
|
|
46
46
|
index.registerInstance(this, hostRef);
|
47
47
|
this.height = undefined;
|
48
48
|
this.position = 'fixed';
|
49
|
+
this.zIndexOverride = undefined;
|
49
50
|
}
|
50
51
|
render() {
|
51
|
-
return (index.h(index.Host, { key: '
|
52
|
-
height: `${this.height}px`,
|
53
|
-
} }, index.h("div", { key: '7e3c3b25bb6dfe9177de027ee9920c190b55b265', class: "container", part: "container", style: {
|
52
|
+
return (index.h(index.Host, { key: '045bc58e1719b02dea67276200abb0cd05d6f717', style: Object.assign({ height: `${this.height}px` }, (Boolean(this.zIndexOverride) ? { zIndex: `${this.zIndexOverride}` } : {})) }, index.h("div", { key: 'e29aa3326057f15b83e4ca9e2718074fda98e177', class: "container", part: "container", style: {
|
54
53
|
position: this.position,
|
55
54
|
height: `${this.height}px`,
|
56
|
-
} }, index.h("slot", { key: '
|
55
|
+
} }, index.h("slot", { key: '566c990b33134045c54195b7c762f07049a6bd22' })), this.position === 'fixed' && (index.h("div", { style: {
|
57
56
|
height: `${this.height}px`,
|
58
57
|
} }))));
|
59
58
|
}
|
@@ -77,32 +76,36 @@ const CpslAvatar = class {
|
|
77
76
|
};
|
78
77
|
CpslAvatar.style = CpslAvatarStyle0;
|
79
78
|
|
80
|
-
const cpslButtonCss = ":host{--button-border-width:1px;--button-border-width-start:var(--button-border-width);--button-border-width-end:var(--button-border-width);--button-border-width-top:var(--button-border-width);--button-border-width-bottom:var(--button-border-width);--button-gap:8px;--button-justify-content:center;--button-border-radius-top-start:var(--button-border-radius);--button-border-radius-top-end:var(--button-border-radius);--button-border-radius-bottom-end:var(--button-border-radius);--button-border-radius-bottom-start:var(--button-border-radius);--button-padding-start:16px;--button-padding-end:16px;--button-icon-size:var(--cpls-font-size-body-l);--button-primary-color:var(--cpsl-color-primary-button-text);--button-primary-background-color:var(--cpsl-color-primary-button-surface-default);--button-primary-border-color:var(--cpsl-color-primary-button-border-default);--button-primary-icon-color:var(--cpsl-color-primary-button-text);--button-primary-disabled-color:var(--cpsl-color-primary-button-text);--button-primary-disabled-background-color:var(--cpsl-color-primary-button-surface-disabled);--button-primary-disabled-border-color:var(--cpsl-color-primary-button-border-disabled);--button-primary-disabled-icon-color:var(--cpsl-color-primary-button-text);--button-primary-hover-color:var(--cpsl-color-primary-button-text);--button-primary-hover-background-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-border-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-icon-color:var(--cpsl-color-primary-button-text);--button-primary-active-color:var(--cpsl-color-primary-button-text);--button-primary-active-background-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-border-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-icon-color:var(--cpsl-color-primary-button-text);--button-secondary-color:var(--cpsl-color-secondary-button-text);--button-secondary-background-color:var(--cpsl-color-secondary-button-surface-default);--button-secondary-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-disabled-color:var(--cpsl-color-secondary-button-text);--button-secondary-disabled-background-color:var(--cpsl-color-secondary-button-surface-disabled);--button-secondary-disabled-border-color:var(--cpsl-color-secondary-button-border-disabled);--button-secondary-disabled-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-background-color:var(--cpsl-color-secondary-button-surface-hover);--button-secondary-hover-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-hover-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-background-color:var(--cpsl-color-secondary-button-surface-pressed);--button-secondary-active-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-active-icon-color:var(--cpsl-color-secondary-button-text);--button-icon-color:var(--cpsl-color-icon-button-default);--button-icon-disabled-color:var(--cpsl-color-icon-button-disabled);--button-icon-hover-color:var(--cpsl-color-icon-button-hover);height:100%;display:inline-block;font-family:var(--cpsl-font-family, inherit)}:host(.full-width){width:100%;display:block}:host(.full-width) .button-native{width:100%}:host(.small){--button-font-size:var(--cpsl-font-size-body-s);--button-padding-top:12px;--button-padding-bottom:12px;--button-icon-size:var(--cpsl-font-size-body-m)}:host(.medium){--button-font-size:var(--cpsl-font-size-body-m);--button-padding-top:14px;--button-padding-bottom:14px;--button-icon-size:var(--cpsl-font-size-body-l)}:host(.disabled){cursor:default;pointer-events:none}:host ::slotted(cpsl-icon){--height:var(--button-icon-size);--width:var(--button-icon-size)}:host(.primary){--button-border-radius:var(--cpsl-border-radius-primary-button);--button-color:var(--button-primary-color);--button-background-color:var(--button-primary-background-color);--button-border-color:var(--button-primary-border-color)}:host(.primary) ::slotted(cpsl-icon){--icon-color:var(--button-primary-icon-color)}:host(.primary):host(.disabled){--button-color:var(--button-primary-disabled-color);--button-background-color:var(--button-primary-disabled-background-color);--button-border-color:var(--button-primary-disabled-border-color);--button-outline-color:transparent}:host(.primary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-primary-disabled-icon-color)}:host(.primary) :not(.disabled):hover{--button-color:var(--button-primary-hover-color);--button-background-color:var(--button-primary-hover-background-color);--button-border-color:var(--button-primary-hover-border-color)}:host(.primary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-primary-hover-icon-color)}:host(.primary) :not(.disabled):active{--button-color:var(--button-primary-active-color);--button-background-color:var(--button-primary-active-background-color);--button-border-color:var(--button-primary-active-border-color)}:host(.primary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-primary-active-icon-color)}:host(.primary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-primary-button-outline)}:host(.secondary){--button-border-radius:var(--cpsl-border-radius-secondary-button);--button-color:var(--button-secondary-color);--button-background-color:var(--button-primary-secondary-color);--button-border-color:var(--button-secondary-border-color)}:host(.secondary) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-icon-color)}:host(.secondary):host(.disabled){--button-color:var(--button-secondary-disabled-color);--button-background-color:var(--button-secondary-disabled-background-color);--button-border-color:var(--button-secondary-disabled-border-color);--button-outline-color:transparent}:host(.secondary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-disabled-icon-color)}:host(.secondary) :not(.disabled):hover{--button-color:var(--button-secondary-hover-color);--button-border-color:var(--button-secondary-hover-border-color);--button-background-color:var(--button-secondary-hover-background-color)}:host(.secondary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-secondary-hover-icon-color)}:host(.secondary) :not(.disabled):active{--button-color:var(--button-secondary-active-color);--button-border-color:var(--button-secondary-active-border-color);--button-background-color:var(--button-secondary-active-background-color)}:host(.secondary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-secondary-active-icon-color)}:host(.secondary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-secondary-button-outline)}:host(.icon){--button-color:transparent;--button-background-color:transparent;--button-border-color:transparent;--button-outline-color:transparent}:host(.icon) ::slotted(cpsl-icon){--icon-color:var(--button-icon-color)}:host(.icon):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-icon-disabled-color)}:host(.icon) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-icon-hover-color)}.button-native{border-top-left-radius:var(--button-border-radius-top-start);border-top-right-radius:var(--button-border-radius-top-end);border-bottom-right-radius:var(--button-border-radius-bottom-end);border-bottom-left-radius:var(--button-border-radius-bottom-start);-webkit-padding-start:var(--button-padding-start);padding-inline-start:var(--button-padding-start);-webkit-padding-end:var(--button-padding-end);padding-inline-end:var(--button-padding-end);padding-top:var(--button-padding-top);padding-bottom:var(--button-padding-bottom);font-size:var(--button-font-size);border:0px solid transparent;border-width:var(--button-border-width-top) var(--button-border-width-end) var(--button-border-width-bottom) var(--button-border-width-start);cursor:pointer;color:var(--button-color);background-color:var(--button-background-color);border-color:var(--button-border-color);display:flex;justify-content:var(--button-justify-content);align-items:center;height:100%;gap:var(--button-gap);word-break:break-all;outline-color:var(--button-outline-color)}:host-context([dir=rtl]) .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}[dir=rtl] .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}@supports selector(:dir(rtl)){.button-native:dir(rtl){border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}}:host ::slotted(cpsl-text){color:var(--button-color)}";
|
79
|
+
const cpslButtonCss = ":host{--button-border-width:1px;--button-border-width-start:var(--button-border-width);--button-border-width-end:var(--button-border-width);--button-border-width-top:var(--button-border-width);--button-border-width-bottom:var(--button-border-width);--button-gap:8px;--button-justify-content:center;--button-border-radius-top-start:var(--button-border-radius);--button-border-radius-top-end:var(--button-border-radius);--button-border-radius-bottom-end:var(--button-border-radius);--button-border-radius-bottom-start:var(--button-border-radius);--button-padding-start:16px;--button-padding-end:16px;--button-icon-size:var(--cpls-font-size-body-l);--button-font-weight:500;--button-primary-color:var(--cpsl-color-primary-button-text);--button-primary-background-color:var(--cpsl-color-primary-button-surface-default);--button-primary-border-color:var(--cpsl-color-primary-button-border-default);--button-primary-icon-color:var(--cpsl-color-primary-button-text);--button-primary-disabled-color:var(--cpsl-color-text-disabled);--button-primary-disabled-background-color:var(--cpsl-color-primary-button-surface-disabled);--button-primary-disabled-border-color:var(--cpsl-color-primary-button-border-disabled);--button-primary-disabled-icon-color:var(--cpsl-color-primary-button-text);--button-primary-hover-color:var(--cpsl-color-primary-button-text);--button-primary-hover-background-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-border-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-icon-color:var(--cpsl-color-primary-button-text);--button-primary-active-color:var(--cpsl-color-primary-button-text);--button-primary-active-background-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-border-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-icon-color:var(--cpsl-color-primary-button-text);--button-secondary-color:var(--cpsl-color-secondary-button-text);--button-secondary-background-color:var(--cpsl-color-secondary-button-surface-default);--button-secondary-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-disabled-color:var(--cpsl-color-text-disabled);--button-secondary-disabled-background-color:var(--cpsl-color-secondary-button-surface-disabled);--button-secondary-disabled-border-color:var(--cpsl-color-secondary-button-border-disabled);--button-secondary-disabled-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-background-color:var(--cpsl-color-secondary-button-surface-hover);--button-secondary-hover-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-hover-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-background-color:var(--cpsl-color-secondary-button-surface-pressed);--button-secondary-active-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-active-icon-color:var(--cpsl-color-secondary-button-text);--button-ghost-color:var(--cpsl-color-ghost-button-default);--button-ghost-disabled-color:var(--cpsl-color-ghost-button-disabled);--button-ghost-hover-color:var(--cpsl-color-ghost-button-hover);--button-destructive-color:var(--cpsl-color-destructive-button-text);--button-destructive-background-color:var(--cpsl-color-destructive-button-surface-default);--button-destructive-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-disabled-color:var(--cpsl-color-text-disabled);--button-destructive-disabled-background-color:var(--cpsl-color-destructive-button-surface-disabled);--button-destructive-disabled-border-color:var(--cpsl-color-destructive-button-border-disabled);--button-destructive-disabled-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-hover-color:var(--cpsl-color-destructive-button-text);--button-destructive-hover-background-color:var(--cpsl-color-destructive-button-surface-hover);--button-destructive-hover-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-hover-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-active-color:var(--cpsl-color-destructive-button-text);--button-destructive-active-background-color:var(--cpsl-color-destructive-button-surface-pressed);--button-destructive-active-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-active-icon-color:var(--cpsl-color-destructive-button-text);height:fit-content;width:fit-content;display:inline-block;font-family:var(--cpsl-font-family, inherit);-webkit-tap-highlight-color:transparent}:host a{height:fit-content;width:auto !important}:host(.full-width){width:100%;display:block}:host(.full-width) .button-native{width:100%}:host(.small){--button-font-size:var(--cpsl-font-size-body-s);--button-padding-top:12px;--button-padding-bottom:12px;--button-icon-size:var(--cpsl-font-size-body-m)}:host(.small.primary){--button-padding-top:13px;--button-padding-bottom:13px}:host(.medium){--button-font-size:var(--cpsl-font-size-body-m);--button-padding-top:14px;--button-padding-bottom:14px;--button-icon-size:var(--cpsl-font-size-body-l)}:host(.medium) :host(.primary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium.primary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.disabled){cursor:default;pointer-events:none}:host ::slotted(cpsl-icon){--height:var(--button-icon-size);--width:var(--button-icon-size)}:host(.primary){--button-border-radius:var(--cpsl-border-radius-primary-button);--button-color:var(--button-primary-color);--button-background-color:var(--button-primary-background-color);--button-border-color:var(--button-primary-border-color);--button-padding-start:17px;--button-padding-end:17px;--button-border-width:0px}:host(.primary) ::slotted(cpsl-icon){--icon-color:var(--button-primary-icon-color)}:host(.primary):host(.disabled){--button-color:var(--button-primary-disabled-color);--button-background-color:var(--button-primary-disabled-background-color);--button-border-color:var(--button-primary-disabled-border-color);--button-outline-color:transparent}:host(.primary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-primary-disabled-icon-color)}:host(.primary) :not(.disabled):hover{--button-color:var(--button-primary-hover-color);--button-background-color:var(--button-primary-hover-background-color);--button-border-color:var(--button-primary-hover-border-color)}:host(.primary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-primary-hover-icon-color)}:host(.primary) :not(.disabled):active{--button-color:var(--button-primary-active-color);--button-background-color:var(--button-primary-active-background-color);--button-border-color:var(--button-primary-active-border-color)}:host(.primary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-primary-active-icon-color)}:host(.primary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-primary-button-outline)}:host(.secondary){--button-border-radius:var(--cpsl-border-radius-destructive-button);--button-color:var(--button-secondary-color);--button-background-color:var(--button-secondary-background-color);--button-border-color:var(--button-secondary-border-color)}:host(.secondary) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-icon-color)}:host(.secondary):host(.disabled){--button-color:var(--button-secondary-disabled-color);--button-background-color:var(--button-secondary-disabled-background-color);--button-border-color:var(--button-secondary-disabled-border-color);--button-outline-color:transparent}:host(.secondary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-disabled-icon-color)}:host(.secondary) :not(.disabled):hover{--button-color:var(--button-secondary-hover-color);--button-border-color:var(--button-secondary-hover-border-color);--button-background-color:var(--button-secondary-hover-background-color)}:host(.secondary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-secondary-hover-icon-color)}:host(.secondary) :not(.disabled):active{--button-color:var(--button-secondary-active-color);--button-border-color:var(--button-secondary-active-border-color);--button-background-color:var(--button-secondary-active-background-color)}:host(.secondary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-secondary-active-icon-color)}:host(.secondary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-secondary-button-outline)}:host(.ghost){--button-color:var(--button-ghost-color);--button-background-color:transparent;--button-border-color:transparent;--button-outline-color:transparent;--button-padding-start:0px;--button-padding-end:0px;--button-padding-top:0px;--button-padding-bottom:0px;--button-border-width:0px}:host(.ghost) ::slotted(cpsl-icon){--icon-color:var(--button-ghost-color);--height:var(--cpsl-font-size-body-xl);--width:var(--cpsl-font-size-body-xl)}:host(.ghost):host(.disabled){--button-color:var(--button-ghost-disabled-color)}:host(.ghost):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-ghost-disabled-color)}:host(.ghost) :not(.disabled):hover{--button-color:var(--button-ghost-hover-color)}:host(.ghost) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-ghost-hover-color)}:host(.destructive){--button-border-radius:var(--cpsl-border-radius-secondary-button);--button-color:var(--button-destructive-color);--button-background-color:var(--button-destructive-background-color);--button-border-color:var(--button-destructive-border-color)}:host(.destructive) ::slotted(cpsl-icon){--icon-color:var(--button-destructive-icon-color)}:host(.destructive):host(.disabled){--button-color:var(--button-destructive-disabled-color);--button-background-color:var(--button-destructive-disabled-background-color);--button-border-color:var(--button-destructive-disabled-border-color);--button-outline-color:transparent}:host(.destructive):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-destructive-disabled-icon-color)}:host(.destructive) :not(.disabled):hover{--button-color:var(--button-destructive-hover-color);--button-border-color:var(--button-destructive-hover-border-color);--button-background-color:var(--button-destructive-hover-background-color)}:host(.destructive) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-destructive-hover-icon-color)}:host(.destructive) :not(.disabled):active{--button-color:var(--button-destructive-active-color);--button-border-color:var(--button-destructive-active-border-color);--button-background-color:var(--button-destructive-active-background-color)}:host(.destructive) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-destructive-active-icon-color)}:host(.destructive) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-destructive-button-outline)}.button-native{border-top-left-radius:var(--button-border-radius-top-start);border-top-right-radius:var(--button-border-radius-top-end);border-bottom-right-radius:var(--button-border-radius-bottom-end);border-bottom-left-radius:var(--button-border-radius-bottom-start);-webkit-padding-start:var(--button-padding-start);padding-inline-start:var(--button-padding-start);-webkit-padding-end:var(--button-padding-end);padding-inline-end:var(--button-padding-end);padding-top:var(--button-padding-top);padding-bottom:var(--button-padding-bottom);font-size:var(--button-font-size);font-weight:var(--button-font-weight);font-family:inherit;white-space:nowrap;text-decoration:none;border:0px solid transparent;border-width:var(--button-border-width-top) var(--button-border-width-end) var(--button-border-width-bottom) var(--button-border-width-start);cursor:pointer;color:var(--button-color);background:var(--button-background-color);border-color:var(--button-border-color);display:flex;justify-content:var(--button-justify-content);align-items:center;height:100%;gap:var(--button-gap);word-break:break-all;outline-color:var(--button-outline-color);-webkit-tap-highlight-color:transparent}:host-context([dir=rtl]) .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}[dir=rtl] .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}@supports selector(:dir(rtl)){.button-native:dir(rtl){border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}}:host ::slotted(cpsl-text){color:var(--button-color)}";
|
81
80
|
const CpslButtonStyle0 = cpslButtonCss;
|
82
81
|
|
83
82
|
const CpslButton = class {
|
84
83
|
constructor(hostRef) {
|
85
84
|
index.registerInstance(this, hostRef);
|
85
|
+
this.as = 'button';
|
86
86
|
this.disabled = false;
|
87
87
|
this.fullWidth = false;
|
88
|
+
this.href = undefined;
|
88
89
|
this.size = 'medium';
|
90
|
+
this.target = undefined;
|
89
91
|
this.variant = 'primary';
|
90
92
|
}
|
91
93
|
render() {
|
92
|
-
return (index.h(index.Host, { key: '
|
94
|
+
return (index.h(index.Host, { key: 'c8c19be90600d9ca236b51e4e112d8350d7f611c', class: {
|
93
95
|
'primary': this.variant === 'primary',
|
94
96
|
'secondary': this.variant === 'secondary',
|
95
|
-
'
|
97
|
+
'ghost': this.variant === 'ghost',
|
98
|
+
'destructive': this.variant === 'destructive',
|
96
99
|
'disabled': this.disabled,
|
97
100
|
'full-width': this.fullWidth,
|
98
101
|
'small': this.size === 'small',
|
99
102
|
'medium': this.size === 'medium',
|
100
|
-
} }, index.h(
|
103
|
+
} }, index.h(this.as, { key: '9ba756220f648f1d4123bd42df8d4db311800705', href: this.href, target: this.target, part: "button-native", class: "button-native" }, index.h("slot", { key: '7156e673a1a43ea808aeca1574b5f251c38bdc22', name: "start" }), index.h("slot", { key: 'a74790e4d6deb92b6e0380f6ca8551aacf5c3b8f' }), index.h("slot", { key: '73219152509968a55aeff2cdc56beefa9b9e5995', name: "end" }))));
|
101
104
|
}
|
102
105
|
};
|
103
106
|
CpslButton.style = CpslButtonStyle0;
|
104
107
|
|
105
|
-
const cpslButtonGroupCss = ":host{--button-size:32px;display:flex}:host ::slotted(cpsl-button:first-child){--button-border-radius-top-end:0px;--button-border-radius-bottom-end:0px}:host ::slotted(cpsl-button:last-child){--button-border-width-start:0px;--button-border-radius-top-start:0px;--button-border-radius-bottom-start:0px}:host ::slotted(cpsl-button:not(:first-child):not(:last-child)){--button-border-width-start:0px;--button-border-radius-top-start:0px;--button-border-radius-bottom-start:0px;--button-border-radius-top-end:0px;--button-border-radius-bottom-end:0px}:host ::slotted(cpsl-button){--button-color:var(--cpsl-color-text-tertiary);--button-padding-start:0px;--button-padding-end:0px;--button-padding-top:0px;--button-padding-bottom:0px;height:var(--button-size);width:var(--button-size)}:host ::slotted(cpsl-button.selected){--button-color:var(--cpsl-color-text-primary)}";
|
108
|
+
const cpslButtonGroupCss = ":host{--button-size:32px;display:flex}:host ::slotted(cpsl-button:first-child){--button-border-radius-top-end:0px;--button-border-radius-bottom-end:0px}:host ::slotted(cpsl-button:last-child){--button-border-width-start:0px;--button-border-radius-top-start:0px;--button-border-radius-bottom-start:0px}:host ::slotted(cpsl-button:not(:first-child):not(:last-child)){--button-border-width-start:0px;--button-border-radius-top-start:0px;--button-border-radius-bottom-start:0px;--button-border-radius-top-end:0px;--button-border-radius-bottom-end:0px}:host ::slotted(cpsl-button){--button-color:var(--cpsl-color-text-tertiary);--button-padding-start:0px;--button-padding-end:0px;--button-padding-top:0px;--button-padding-bottom:0px;--button-border-radius:var(--cpsl-border-radius-button-group);height:var(--button-size);width:var(--button-size)}:host ::slotted(cpsl-button.selected){--button-color:var(--cpsl-color-text-primary)}";
|
106
109
|
const CpslButtonGroupStyle0 = cpslButtonGroupCss;
|
107
110
|
|
108
111
|
const CpslButtonGroup = class {
|
@@ -148,7 +151,7 @@ const CpslButtonGroup = class {
|
|
148
151
|
};
|
149
152
|
CpslButtonGroup.style = CpslButtonGroupStyle0;
|
150
153
|
|
151
|
-
const cpslCardCss = ":host{--card-padding-top:24px;--card-padding-end:24px;--card-padding-bottom:24px;--card-padding-start:24px;--card-border-width:1px;--card-border-color:var(--cpsl-color-card-border);--card-border-radius:var(--cpsl-border-radius-card);--card-background-color:var(--cpsl-color-card-surface);display:block}.card{-webkit-padding-start:var(--card-padding-start);padding-inline-start:var(--card-padding-start);-webkit-padding-end:var(--card-padding-end);padding-inline-end:var(--card-padding-end);padding-top:var(--card-padding-top);padding-bottom:var(--card-padding-bottom);display:block;box-sizing:border-box;overflow:hidden;border:var(--card-border-width) solid var(--card-border-color);border-radius:var(--card-border-radius);background
|
154
|
+
const cpslCardCss = ":host{--card-padding-top:24px;--card-padding-end:24px;--card-padding-bottom:24px;--card-padding-start:24px;--card-border-width:1px;--card-border-color:var(--cpsl-color-card-border);--card-border-radius:var(--cpsl-border-radius-card);--card-background-color:var(--cpsl-color-card-surface);display:block}.card{-webkit-padding-start:var(--card-padding-start);padding-inline-start:var(--card-padding-start);-webkit-padding-end:var(--card-padding-end);padding-inline-end:var(--card-padding-end);padding-top:var(--card-padding-top);padding-bottom:var(--card-padding-bottom);display:block;box-sizing:border-box;overflow:hidden;border:var(--card-border-width) solid var(--card-border-color);border-radius:var(--card-border-radius);background:var(--card-background-color)}";
|
152
155
|
const CpslCardStyle0 = cpslCardCss;
|
153
156
|
|
154
157
|
const CpslCard = class {
|
@@ -156,12 +159,12 @@ const CpslCard = class {
|
|
156
159
|
index.registerInstance(this, hostRef);
|
157
160
|
}
|
158
161
|
render() {
|
159
|
-
return (index.h(index.Host, { key: '8633aeaedaaf81af67835ee3ffc8964ec28ced92' }, index.h("div", { key: '
|
162
|
+
return (index.h(index.Host, { key: '8633aeaedaaf81af67835ee3ffc8964ec28ced92' }, index.h("div", { key: '432fabd329701f8ef51fc43ba0ca8af3d5182a47', class: { card: true }, part: "card-container" }, index.h("slot", { key: 'a23d1063d0a1c74ebc076fc67b63c4023f7f8565' }))));
|
160
163
|
}
|
161
164
|
};
|
162
165
|
CpslCard.style = CpslCardStyle0;
|
163
166
|
|
164
|
-
const cpslCheckboxCss = ":host{--container-height:20px;--container-width:20px;--container-border-radius:var(--cpsl-border-radius-checkbox);--container-border-width:2px;--container-background-color-default:var(--cpsl-color-checkbox-surface-default);--container-border-color-default:var(--cpsl-color-checkbox-border-default);--container-background-color-checked:var(--cpsl-color-checkbox-surface-checked);--container-border-color-checked:var(--cpsl-color-checkbox-border-checked);--icon-height:16px;--icon-width:16px;--checkbox-icon-color:var(--cpsl-color-checkbox-icon);display:block;position:relative;height:var(--container-height);width:var(--container-width);cursor:pointer}input{position:absolute;width:100%;height:100%;margin:0px;opacity:0}span.container{display:flex;align-items:center;justify-content:center;position:relative;box-sizing:border-box;width:100%;height:100%;border-radius:var(--container-border-radius);border:var(--container-border-width) solid;background
|
167
|
+
const cpslCheckboxCss = ":host{--container-height:20px;--container-width:20px;--container-border-radius:var(--cpsl-border-radius-checkbox);--container-border-width:2px;--container-background-color-default:var(--cpsl-color-checkbox-surface-default);--container-border-color-default:var(--cpsl-color-checkbox-border-default);--container-background-color-checked:var(--cpsl-color-checkbox-surface-checked);--container-border-color-checked:var(--cpsl-color-checkbox-border-checked);--icon-height:16px;--icon-width:16px;--checkbox-icon-color:var(--cpsl-color-checkbox-icon);display:block;position:relative;height:var(--container-height);width:var(--container-width);cursor:pointer}input{position:absolute;width:100%;height:100%;margin:0px;opacity:0}span.container{display:flex;align-items:center;justify-content:center;position:relative;box-sizing:border-box;width:100%;height:100%;border-radius:var(--container-border-radius);border:var(--container-border-width) solid;background:var(--container-background-color-default);border-color:var(--container-border-color-default);transition:all 0.15s ease-in-out}span.container cpsl-icon{--height:var(--icon-height);--width:var(--icon-width);opacity:0;--icon-color:var(--checkbox-icon-color);transition:all 0.15s ease-in-out}span.container.checked{background:var(--container-background-color-checked);border-color:var(--container-border-color-checked)}span.container.checked cpsl-icon{opacity:1}";
|
165
168
|
const CpslCheckboxStyle0 = cpslCheckboxCss;
|
166
169
|
|
167
170
|
const CpslCheckbox = class {
|
@@ -179,7 +182,7 @@ const CpslCheckbox = class {
|
|
179
182
|
};
|
180
183
|
CpslCheckbox.style = CpslCheckboxStyle0;
|
181
184
|
|
182
|
-
const cpslCodeInputCss = ":host{--input-width:40px;--input-height:54px;--input-border-radius:var(--cpsl-border-radius-input);--input-border-color:var(--cpsl-color-input-border-placeholder);--input-border-width:1px;--input-background-color:var(--cpsl-color-input-surface-default);--input-border-error-color:var(--cpsl-color-input-border-error);--input-font-size:clamp(20px, 1.25rem, 30px);--input-color:var(--cpsl-color-text-primary);--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:12px;--helper-text-margin-top:6px;display:block;font-family:var(--cpsl-font-family, inherit)}.code-container{display:flex;gap:8px}.code-input{font-family:var(--cpsl-font-family, inherit);border-radius:var(--input-border-radius);font-size:var(--input-font-size);border-color:var(--input-border-color);border-width:var(--input-border-width);border-style:solid;font-size:var(--input-font-size);color:var(--input-color);width:var(--input-width);height:var(--input-height);background
|
185
|
+
const cpslCodeInputCss = ":host{--input-width:40px;--input-height:54px;--input-border-radius:var(--cpsl-border-radius-input);--input-border-color:var(--cpsl-color-input-border-placeholder);--input-border-width:1px;--input-background-color:var(--cpsl-color-input-surface-default);--input-border-error-color:var(--cpsl-color-input-border-error);--input-font-size:clamp(20px, 1.25rem, 30px);--input-color:var(--cpsl-color-text-primary);--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:12px;--helper-text-margin-top:6px;display:block;font-family:var(--cpsl-font-family, inherit)}.code-container{display:flex;gap:8px}.code-input{font-family:var(--cpsl-font-family, inherit);border-radius:var(--input-border-radius);font-size:var(--input-font-size);border-color:var(--input-border-color);border-width:var(--input-border-width);border-style:solid;font-size:var(--input-font-size);color:var(--input-color);width:var(--input-width);height:var(--input-height);background:var(--input-background-color);box-sizing:border-box;text-align:center;outline:none}.code-input:focus{--input-border-color:var(--cpsl-color-input-border-active)}.code-input::-webkit-outer-spin-button,.code-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.code-input .error-container{border-color:var(--input-border-error-color)}input[type=number]{-moz-appearance:textfield}.helper-text-container{flex-basis:100%;display:flex;align-items:center;gap:4px;color:var(--helper-text-color);font-size:var(--helper-text-font-size);margin-top:var(--helper-text-margin-top)}.helper-text-container cpsl-icon{--height:var(--helper-text-icon-size);--width:var(--helper-text-icon-size);--icon-color:var(--helper-text-icon-color)}.error-text{color:var(--helper-text-error-color)}.error-text cpsl-icon{--icon-color:var(--helper-text-icon-error-color)}";
|
183
186
|
const CpslCodeInputStyle0 = cpslCodeInputCss;
|
184
187
|
|
185
188
|
const CpslCodeInput = class {
|
@@ -278,7 +281,7 @@ const CpslCodeInput = class {
|
|
278
281
|
};
|
279
282
|
CpslCodeInput.style = CpslCodeInputStyle0;
|
280
283
|
|
281
|
-
const cpslDividerCss = ":host{--divider-height:1px;--divider-color:var(--cpsl-color-divider);display:flex;align-items:center;height:24px;color:var(--cpsl-color-text-subtle);font-family:var(--cpsl-font-family, inherit);font-size:clamp(14px, 0.875rem, 21px);font-weight:600;gap:16px}:host div{flex:1;background
|
284
|
+
const cpslDividerCss = ":host{--divider-height:1px;--divider-color:var(--cpsl-color-divider);display:flex;align-items:center;height:24px;color:var(--cpsl-color-text-subtle);font-family:var(--cpsl-font-family, inherit);font-size:clamp(14px, 0.875rem, 21px);font-weight:600;gap:16px}:host div{flex:1;background:var(--divider-color);height:var(--divider-height)}";
|
282
285
|
const CpslDividerStyle0 = cpslDividerCss;
|
283
286
|
|
284
287
|
const CpslDivider = class {
|
@@ -297,28 +300,44 @@ const CpslDrawerStyle0 = cpslDrawerCss;
|
|
297
300
|
const CpslDrawer = class {
|
298
301
|
constructor(hostRef) {
|
299
302
|
index.registerInstance(this, hostRef);
|
303
|
+
this.closedAnchorPosition = undefined;
|
304
|
+
this.showTransition = undefined;
|
300
305
|
this.anchor = undefined;
|
306
|
+
this.anchorPosition = undefined;
|
307
|
+
this.noOverlay = undefined;
|
301
308
|
this.open = undefined;
|
302
309
|
this.size = undefined;
|
303
310
|
this.transitionDuration = 0.15;
|
304
311
|
this.transitionFunction = 'ease-in-out';
|
305
312
|
this.variant = 'temporary';
|
313
|
+
this.zIndexOverride = undefined;
|
314
|
+
}
|
315
|
+
componentDidLoad() {
|
316
|
+
this.closedAnchorPosition = `-${this.getContainerHeight()}px`;
|
317
|
+
setTimeout(() => {
|
318
|
+
this.showTransition = true;
|
319
|
+
}, 100);
|
320
|
+
}
|
321
|
+
getContainerHeight() {
|
322
|
+
var _a;
|
323
|
+
return (_a = this.containerEl) === null || _a === void 0 ? void 0 : _a.clientHeight;
|
324
|
+
}
|
325
|
+
get containerEl() {
|
326
|
+
return this.el.shadowRoot.getElementById('container');
|
306
327
|
}
|
307
328
|
render() {
|
329
|
+
var _a;
|
308
330
|
const setHeight = this.anchor === 'top' || this.anchor === 'bottom';
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
transitionDuration: `${this.transitionDuration}s`,
|
313
|
-
transitionTimingFunction: `${this.transitionFunction}`,
|
314
|
-
[this.anchor]: this.open || this.variant === 'permanent' ? '0px' : `-${this.size}px`,
|
315
|
-
}, class: {
|
331
|
+
const startingAnchor = (_a = `${this.anchorPosition}px`) !== null && _a !== void 0 ? _a : '0px';
|
332
|
+
const size = this.size === 'auto' ? 'auto' : `${this.size}px`;
|
333
|
+
return (index.h(index.Host, { key: 'c8f7717bd060bdd83edec49865d99d2bc885aace', style: Object.assign({ width: setHeight ? '100vw' : size, height: setHeight ? size : '100vh', transitionDuration: `${this.showTransition ? this.transitionDuration : 0}s`, transitionTimingFunction: `${this.transitionFunction}`, [this.anchor]: this.open || this.variant === 'permanent' ? startingAnchor : this.closedAnchorPosition, opacity: this.closedAnchorPosition === undefined ? '0' : '1' }, (Boolean(this.zIndexOverride) ? { zIndex: `${this.zIndexOverride}` } : {})), class: {
|
316
334
|
top: this.anchor === 'top',
|
317
335
|
bottom: this.anchor === 'bottom',
|
318
336
|
left: this.anchor === 'left',
|
319
337
|
right: this.anchor === 'right',
|
320
|
-
} }, this.variant === 'temporary' && index.h("cpsl-overlay", { open: this.open, zIndexOverride: constants.DEFAULT_Z_INDICES.modal + 1 }), index.h("div", { key: '
|
338
|
+
} }, this.variant === 'temporary' && !this.noOverlay && index.h("cpsl-overlay", { open: this.open, zIndexOverride: constants.DEFAULT_Z_INDICES.modal + 1 }), index.h("div", { key: 'f63a22d66da7ed0b7cb2bd0f9b68dbf7e7c4f985', id: "container", class: "container", part: "container" }, index.h("slot", { key: 'c5d208e37ea87f4ae95c5d9064218f1d1edbc304' }))));
|
321
339
|
}
|
340
|
+
get el() { return index.getElement(this); }
|
322
341
|
};
|
323
342
|
CpslDrawer.style = CpslDrawerStyle0;
|
324
343
|
|
@@ -4443,8 +4462,8 @@ const Check = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" strok
|
|
4443
4462
|
</svg>
|
4444
4463
|
`;
|
4445
4464
|
|
4446
|
-
const ChevronUp = `<svg width="
|
4447
|
-
<path d="
|
4465
|
+
const ChevronUp = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4466
|
+
<path d="M18 15L12 9L6 15" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4448
4467
|
</svg>
|
4449
4468
|
`;
|
4450
4469
|
|
@@ -4453,11 +4472,9 @@ const Clock = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" strok
|
|
4453
4472
|
</svg>
|
4454
4473
|
`;
|
4455
4474
|
|
4456
|
-
const Close = `<svg width="24" height="24" viewBox="0 0
|
4457
|
-
<path d="
|
4458
|
-
|
4459
|
-
</svg>
|
4460
|
-
`;
|
4475
|
+
const Close = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4476
|
+
<path d="M17 7L7 17M7 7L17 17" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4477
|
+
</svg>`;
|
4461
4478
|
|
4462
4479
|
const ClubhouseBrand = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
4463
4480
|
<path d="M1.74167 17.875C0.783333 17.875 0 18.6583 0 19.6167C0 20.575 0.783333 21.3583 1.74167 21.3583C2.7 21.3583 3.48333 20.575 3.48333 19.6167C3.48333 18.6583 2.70833 17.875 1.74167 17.875Z" fill="#6515DD"/>
|
@@ -4476,6 +4493,11 @@ const Copy = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke
|
|
4476
4493
|
</svg>
|
4477
4494
|
`;
|
4478
4495
|
|
4496
|
+
const Cube = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4497
|
+
<path d="M3.5 8H16M16 8V20.5M16 8L20.5 3.5M21 15.3373V3.8C21 3.51997 21 3.37996 20.9455 3.273C20.8976 3.17892 20.8211 3.10243 20.727 3.0545C20.62 3 20.48 3 20.2 3H8.66274C8.41815 3 8.29586 3 8.18077 3.02763C8.07873 3.05213 7.98119 3.09253 7.89172 3.14736C7.7908 3.2092 7.70432 3.29568 7.53137 3.46863L3.46863 7.53137C3.29568 7.70432 3.2092 7.7908 3.14736 7.89172C3.09253 7.98119 3.05213 8.07873 3.02763 8.18077C3 8.29586 3 8.41815 3 8.66274V20.2C3 20.48 3 20.62 3.0545 20.727C3.10243 20.8211 3.17892 20.8976 3.273 20.9455C3.37996 21 3.51997 21 3.8 21H15.3373C15.5818 21 15.7041 21 15.8192 20.9724C15.9213 20.9479 16.0188 20.9075 16.1083 20.8526C16.2092 20.7908 16.2957 20.7043 16.4686 20.5314L20.5314 16.4686C20.7043 16.2957 20.7908 16.2092 20.8526 16.1083C20.9075 16.0188 20.9479 15.9213 20.9724 15.8192C21 15.7041 21 15.5818 21 15.3373Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4498
|
+
</svg>
|
4499
|
+
`;
|
4500
|
+
|
4479
4501
|
const DecentBrand = `<svg width="26" height="21" viewBox="0 0 26 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
4480
4502
|
<path d="M12.778 2.78753C14.0232 2.78753 14.984 4.90478 15.5758 6.3203C15.9631 7.2468 16.7703 8.7695 17.7174 9.6841C18.9174 6.8477 19.7749 1e-05 20.9598 0C22.4868 1e-05 25.2514 4.71852 25.2514 10.4107C25.2514 16.1232 22.4888 20.8962 20.96 20.8962C19.7774 20.8962 18.9206 14.0677 17.7252 11.2048C16.773 12.1181 15.9607 13.6496 15.5717 14.58C14.98 15.9955 14.0191 18.1128 12.7739 18.1128C11.5287 18.1128 10.5679 15.9955 9.97612 14.58C9.54017 13.5372 8.57227 11.739 7.47171 10.9028C6.84001 11.4891 6.29866 12.5072 6.04207 13.121C5.65917 14.0369 5.03745 15.4069 4.23174 15.4069C3.42602 15.4069 2.8043 14.0369 2.4214 13.121C2.05134 12.2358 1.07371 10.5066 0.101214 10.4476C0.0674785 10.4496 0.0337325 10.4496 0 10.4476C0.0337143 10.4455 0.0674613 10.4455 0.101214 10.4476C1.07268 10.3887 2.03506 8.6625 2.40511 7.7773C2.78801 6.8614 3.40973 5.4914 4.21545 5.4914C5.02116 5.4914 5.64288 6.8614 6.02578 7.7773C6.28377 8.3944 6.82965 9.4203 7.4658 10.005C8.57048 9.1721 9.5429 7.3663 9.98018 6.3203C10.5719 4.90478 11.5328 2.78753 12.778 2.78753Z" fill="#9969FF"/>
|
4481
4503
|
</svg>
|
@@ -4563,6 +4585,28 @@ const Facebook = `<svg width="24" height="24" viewBox="0 0 24 24" fill="currentC
|
|
4563
4585
|
</svg>
|
4564
4586
|
`;
|
4565
4587
|
|
4588
|
+
const FarcasterBrand = `<svg width="32" height="29" viewBox="0 0 32 29" fill="none" xmlns="http://www.w3.org/2000/svg">
|
4589
|
+
<g clip-path="url(#clip0_2332_9702)">
|
4590
|
+
<path d="M5.50705 0.0720215H26.0971V4.16702H31.9521L30.7251 8.26302H29.6861V24.833C30.2071 24.833 30.6301 25.249 30.6301 25.763V26.88H30.8191C31.3411 26.88 31.7641 27.297 31.7641 27.811V28.928H21.1851V27.811C21.1851 27.297 21.6081 26.88 22.1301 26.88H22.3191V25.763C22.3191 25.316 22.6391 24.943 23.0651 24.853L23.0451 15.71C22.7111 12.057 19.5961 9.19402 15.8021 9.19402C12.0081 9.19402 8.89305 12.057 8.55905 15.71L8.53905 24.845C9.04305 24.919 9.66305 25.302 9.66305 25.763V26.88H9.85205C10.3731 26.88 10.7961 27.297 10.7961 27.811V28.928H0.218053V27.811C0.218053 27.297 0.641053 26.88 1.16205 26.88H1.35105V25.763C1.35105 25.249 1.77405 24.833 2.29605 24.833V8.26302H1.25705L0.0290527 4.16702H5.50705V0.0720215Z" fill="#8A63D2"/>
|
4591
|
+
</g>
|
4592
|
+
<defs>
|
4593
|
+
<clipPath id="clip0_2332_9702">
|
4594
|
+
<rect width="32" height="29" fill="white"/>
|
4595
|
+
</clipPath>
|
4596
|
+
</defs>
|
4597
|
+
</svg>`;
|
4598
|
+
|
4599
|
+
const Farcaster = `<svg width="32" height="29" viewBox="0 0 32 29" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4600
|
+
<g clip-path="url(#clip0_2332_9702)">
|
4601
|
+
<path d="M5.50705 0.0720215H26.0971V4.16702H31.9521L30.7251 8.26302H29.6861V24.833C30.2071 24.833 30.6301 25.249 30.6301 25.763V26.88H30.8191C31.3411 26.88 31.7641 27.297 31.7641 27.811V28.928H21.1851V27.811C21.1851 27.297 21.6081 26.88 22.1301 26.88H22.3191V25.763C22.3191 25.316 22.6391 24.943 23.0651 24.853L23.0451 15.71C22.7111 12.057 19.5961 9.19402 15.8021 9.19402C12.0081 9.19402 8.89305 12.057 8.55905 15.71L8.53905 24.845C9.04305 24.919 9.66305 25.302 9.66305 25.763V26.88H9.85205C10.3731 26.88 10.7961 27.297 10.7961 27.811V28.928H0.218053V27.811C0.218053 27.297 0.641053 26.88 1.16205 26.88H1.35105V25.763C1.35105 25.249 1.77405 24.833 2.29605 24.833V8.26302H1.25705L0.0290527 4.16702H5.50705V0.0720215Z"/>
|
4602
|
+
</g>
|
4603
|
+
<defs>
|
4604
|
+
<clipPath id="clip0_2332_9702">
|
4605
|
+
<rect width="32" height="29" fill="white"/>
|
4606
|
+
</clipPath>
|
4607
|
+
</defs>
|
4608
|
+
</svg>`;
|
4609
|
+
|
4566
4610
|
const FigmaBrand = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
4567
4611
|
<g clip-path="url(#clip0_106_21188)">
|
4568
4612
|
<path d="M8.00006 24C10.2081 24 12.0001 22.208 12.0001 20V15.9999H8.00006C5.79205 15.9999 4 17.792 4 20C4 22.208 5.79205 24 8.00006 24Z" fill="#0ACF83"/>
|
@@ -4692,6 +4736,11 @@ const Home = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke
|
|
4692
4736
|
</svg>
|
4693
4737
|
`;
|
4694
4738
|
|
4739
|
+
const Image$1 = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4740
|
+
<path d="M4.27209 20.7279L10.8686 14.1314C11.2646 13.7354 11.4627 13.5373 11.691 13.4632C11.8918 13.3979 12.1082 13.3979 12.309 13.4632C12.5373 13.5373 12.7354 13.7354 13.1314 14.1314L19.6839 20.6839M14 15L16.8686 12.1314C17.2646 11.7354 17.4627 11.5373 17.691 11.4632C17.8918 11.3979 18.1082 11.3979 18.309 11.4632C18.5373 11.5373 18.7354 11.7354 19.1314 12.1314L22 15M10 9C10 10.1046 9.10457 11 8 11C6.89543 11 6 10.1046 6 9C6 7.89543 6.89543 7 8 7C9.10457 7 10 7.89543 10 9ZM6.8 21H17.2C18.8802 21 19.7202 21 20.362 20.673C20.9265 20.3854 21.3854 19.9265 21.673 19.362C22 18.7202 22 17.8802 22 16.2V7.8C22 6.11984 22 5.27976 21.673 4.63803C21.3854 4.07354 20.9265 3.6146 20.362 3.32698C19.7202 3 18.8802 3 17.2 3H6.8C5.11984 3 4.27976 3 3.63803 3.32698C3.07354 3.6146 2.6146 4.07354 2.32698 4.63803C2 5.27976 2 6.11984 2 7.8V16.2C2 17.8802 2 18.7202 2.32698 19.362C2.6146 19.9265 3.07354 20.3854 3.63803 20.673C4.27976 21 5.11984 21 6.8 21Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4741
|
+
</svg>
|
4742
|
+
`;
|
4743
|
+
|
4695
4744
|
const InfoCircle = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4696
4745
|
<path d="M12 16V12M12 8H12.01M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4697
4746
|
</svg>
|
@@ -4769,6 +4818,11 @@ const Mail = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke
|
|
4769
4818
|
</svg>
|
4770
4819
|
`;
|
4771
4820
|
|
4821
|
+
const Menu = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4822
|
+
<path d="M3 12H21M3 6H21M3 18H21" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4823
|
+
</svg>
|
4824
|
+
`;
|
4825
|
+
|
4772
4826
|
const MoreLoginOptions = `<svg width="17" height="16" viewBox="0 0 17 16" fill="currentColor" stroke="none" xmlns="http://www.w3.org/2000/svg">
|
4773
4827
|
<g id="Group 4">
|
4774
4828
|
<path id="Vector" d="M2.1 16C2.98366 16 3.7 15.2836 3.7 14.4C3.7 13.5163 2.98366 12.8 2.1 12.8C1.21634 12.8 0.5 13.5163 0.5 14.4C0.5 15.2836 1.21634 16 2.1 16Z"/>
|
@@ -4849,6 +4903,11 @@ const Reddit = `<svg width="24" height="24" viewBox="0 0 24 24" fill="currentCol
|
|
4849
4903
|
</svg>
|
4850
4904
|
`;
|
4851
4905
|
|
4906
|
+
const Refresh = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4907
|
+
<path d="M2 10C2 10 2.12132 9.15076 5.63604 5.63604C9.15076 2.12132 14.8492 2.12132 18.364 5.63604C19.6092 6.88131 20.4133 8.40072 20.7762 10M2 10V4M2 10H8M22 14C22 14 21.8787 14.8492 18.364 18.364C14.8492 21.8787 9.15076 21.8787 5.63604 18.364C4.39076 17.1187 3.58669 15.5993 3.22383 14M22 14V20M22 14H16" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4908
|
+
</svg>
|
4909
|
+
`;
|
4910
|
+
|
4852
4911
|
const Settings = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4853
4912
|
<path d="M9.39516 19.3711L9.97961 20.6856C10.1533 21.0768 10.4369 21.4093 10.7958 21.6426C11.1548 21.8759 11.5737 22.0001 12.0018 22C12.4299 22.0001 12.8489 21.8759 13.2078 21.6426C13.5668 21.4093 13.8503 21.0768 14.0241 20.6856L14.6085 19.3711C14.8165 18.9047 15.1665 18.5159 15.6085 18.26C16.0533 18.0034 16.5678 17.8941 17.0785 17.9478L18.5085 18.1C18.9342 18.145 19.3638 18.0656 19.7452 17.8713C20.1266 17.6771 20.4435 17.3763 20.6574 17.0056C20.8716 16.635 20.9736 16.2103 20.9511 15.7829C20.9286 15.3555 20.7826 14.9438 20.5307 14.5978L19.6841 13.4344C19.3826 13.0171 19.2215 12.5148 19.2241 12C19.224 11.4866 19.3866 10.9864 19.6885 10.5711L20.5352 9.40778C20.787 9.06175 20.9331 8.65007 20.9556 8.22267C20.978 7.79528 20.876 7.37054 20.6618 7C20.4479 6.62923 20.1311 6.32849 19.7496 6.13423C19.3682 5.93997 18.9386 5.86053 18.5129 5.90556L17.0829 6.05778C16.5723 6.11141 16.0577 6.00212 15.6129 5.74556C15.1701 5.48825 14.82 5.09736 14.6129 4.62889L14.0241 3.31444C13.8503 2.92317 13.5668 2.59072 13.2078 2.3574C12.8489 2.12408 12.4299 1.99993 12.0018 2C11.5737 1.99993 11.1548 2.12408 10.7958 2.3574C10.4369 2.59072 10.1533 2.92317 9.97961 3.31444L9.39516 4.62889C9.18809 5.09736 8.83804 5.48825 8.39516 5.74556C7.95038 6.00212 7.43583 6.11141 6.92516 6.05778L5.49072 5.90556C5.06505 5.86053 4.63546 5.93997 4.25403 6.13423C3.87261 6.32849 3.55574 6.62923 3.34183 7C3.12765 7.37054 3.02561 7.79528 3.0481 8.22267C3.07058 8.65007 3.21662 9.06175 3.4685 9.40778L4.31516 10.5711C4.61711 10.9864 4.7797 11.4866 4.77961 12C4.7797 12.5134 4.61711 13.0137 4.31516 13.4289L3.4685 14.5922C3.21662 14.9382 3.07058 15.3499 3.0481 15.7773C3.02561 16.2047 3.12765 16.6295 3.34183 17C3.55595 17.3706 3.87286 17.6712 4.25423 17.8654C4.6356 18.0596 5.06508 18.1392 5.49072 18.0944L6.92072 17.9422C7.43139 17.8886 7.94594 17.9979 8.39072 18.2544C8.83525 18.511 9.18693 18.902 9.39516 19.3711Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4854
4913
|
<path d="M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3432 9 9.00004 10.3431 9.00004 12C9.00004 13.6569 10.3432 15 12 15Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
@@ -4876,6 +4935,12 @@ const Snapchat = `<svg width="24" height="24" viewBox="0 0 24 24" fill="currentC
|
|
4876
4935
|
</svg>
|
4877
4936
|
`;
|
4878
4937
|
|
4938
|
+
const Stars = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
4939
|
+
<path d="M6.5 13L7.28446 14.5689C7.54995 15.0999 7.68269 15.3654 7.86003 15.5954C8.01739 15.7996 8.20041 15.9826 8.40455 16.14C8.63462 16.3173 8.9001 16.4501 9.43108 16.7155L11 17.5L9.43108 18.2845C8.9001 18.5499 8.63462 18.6827 8.40455 18.86C8.20041 19.0174 8.01739 19.2004 7.86003 19.4046C7.68269 19.6346 7.54995 19.9001 7.28446 20.4311L6.5 22L5.71554 20.4311C5.45005 19.9001 5.31731 19.6346 5.13997 19.4046C4.98261 19.2004 4.79959 19.0174 4.59545 18.86C4.36538 18.6827 4.0999 18.5499 3.56892 18.2845L2 17.5L3.56892 16.7155C4.0999 16.4501 4.36538 16.3173 4.59545 16.14C4.79959 15.9826 4.98261 15.7996 5.13997 15.5954C5.31731 15.3654 5.45005 15.0999 5.71554 14.5689L6.5 13Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4940
|
+
<path d="M15 2L16.1786 5.06442C16.4606 5.79765 16.6016 6.16426 16.8209 6.47264C17.0153 6.74595 17.254 6.98475 17.5274 7.17909C17.8357 7.39836 18.2024 7.53937 18.9356 7.82138L22 9L18.9356 10.1786C18.2024 10.4606 17.8357 10.6016 17.5274 10.8209C17.254 11.0153 17.0153 11.254 16.8209 11.5274C16.6016 11.8357 16.4606 12.2024 16.1786 12.9356L15 16L13.8214 12.9356C13.5394 12.2024 13.3984 11.8357 13.1791 11.5274C12.9847 11.254 12.746 11.0153 12.4726 10.8209C12.1643 10.6016 11.7976 10.4606 11.0644 10.1786L8 9L11.0644 7.82138C11.7976 7.53937 12.1643 7.39836 12.4726 7.17909C12.746 6.98475 12.9847 6.74595 13.1791 6.47264C13.3984 6.16426 13.5394 5.79765 13.8214 5.06442L15 2Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
4941
|
+
</svg>
|
4942
|
+
`;
|
4943
|
+
|
4879
4944
|
const TelegramBrand = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
4880
4945
|
<g clip-path="url(#clip0_106_21213)">
|
4881
4946
|
<path d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z" fill="url(#paint0_linear_106_21213)"/>
|
@@ -4958,6 +5023,11 @@ const Wallet = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stro
|
|
4958
5023
|
</svg>
|
4959
5024
|
`;
|
4960
5025
|
|
5026
|
+
const X = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
5027
|
+
<path d="M17 7L7 17M7 7L17 17" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
5028
|
+
</svg>
|
5029
|
+
`;
|
5030
|
+
|
4961
5031
|
const YoutubeBrand = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
4962
5032
|
<g clip-path="url(#clip0_106_21177)">
|
4963
5033
|
<path d="M23.522 6.18547C23.3863 5.67489 23.1189 5.20889 22.7465 4.83413C22.3741 4.45936 21.9099 4.18897 21.4002 4.05002C19.5238 3.54547 12.0238 3.54547 12.0238 3.54547C12.0238 3.54547 4.5238 3.54547 2.64744 4.05002C2.13773 4.18897 1.67346 4.45936 1.30109 4.83413C0.92872 5.20889 0.661309 5.67489 0.525622 6.18547C0.0238038 8.07002 0.0238037 12 0.0238037 12C0.0238037 12 0.0238038 15.93 0.525622 17.8146C0.661309 18.3251 0.92872 18.7911 1.30109 19.1659C1.67346 19.5407 2.13773 19.8111 2.64744 19.95C4.5238 20.4546 12.0238 20.4546 12.0238 20.4546C12.0238 20.4546 19.5238 20.4546 21.4002 19.95C21.9099 19.8111 22.3741 19.5407 22.7465 19.1659C23.1189 18.7911 23.3863 18.3251 23.522 17.8146C24.0238 15.93 24.0238 12 24.0238 12C24.0238 12 24.0238 8.07002 23.522 6.18547Z" fill="#FF0302"/>
|
@@ -4976,7 +5046,7 @@ const Youtube = `<svg width="24" height="24" viewBox="0 0 24 24" fill="currentCo
|
|
4976
5046
|
</svg>
|
4977
5047
|
`;
|
4978
5048
|
|
4979
|
-
const Icons = { AD: AD, AE: AE, AF: AF, AG: AG, AI: AI, AL: AL, AM: AM, AO: AO, AR: AR, AS: AS, AT: AT, AU: AU, AW: AW, AX: AX, AZ: AZ, BA: BA, BB: BB, BD: BD, BE: BE, BF: BF, BG: BG, BH: BH, BI: BI, BJ: BJ, BL: BL, BM: BM, BN: BN, BO: BO, BQ: BQ, BQ2: BQ2, BQ3: BQ3, BR: BR, BS: BS, BT: BT, BW: BW, BY: BY, BZ: BZ, CA: CA, CC: CC, CD: CD, CD2: CD2, CF: CF, CH: CH, CK: CK, CL: CL, CM: CM, CN: CN, CO: CO, CR: CR, CU: CU, CW: CW, CX: CX, CY: CY, CZ: CZ, DE: DE, DJ: DJ, DK: DK, DM: DM, DO: DO, DS: DS, DZ: DZ, EC: EC, EE: EE, EG: EG, EH: EH, ER: ER, ES: ES, ET: ET, FI: FI, FJ: FJ, FK: FK, FM: FM, FO: FO, FR: FR, GA: GA, GB2: GB2, GB: GB, GD: GD, GE: GE, GG: GG, GH: GH, GI: GI, GL: GL, GM: GM, GN: GN, GQ: GQ, GR: GR, GT: GT, GU: GU, GW: GW, GY: GY, HK: HK, HN: HN, HR: HR, HT: HT, HU: HU, ID: ID, IE: IE, IL: IL, IM: IM, IN: IN, IO: IO, IQ: IQ, IR: IR, IS: IS, IT: IT, JE: JE, JM: JM, JO: JO, JP: JP, KE: KE, KG: KG, KH: KH, KI: KI, KM: KM, KN: KN, KP: KP, KR: KR, KW: KW, KY: KY, KZ: KZ, LA: LA, LB: LB, LC: LC, LI: LI, LK: LK, LR: LR, LS: LS, LT: LT, LU: LU, LV: LV, LY: LY, MA: MA, MC: MC, MD: MD, ME: ME, MG: MG, MH: MH, MK: MK, ML: ML, MM: MM, MN: MN, MO: MO, MP: MP, MQ: MQ, MR: MR, MS: MS, MT: MT, MU: MU, MV: MV, MW: MW, MX: MX, MY: MY, MZ: MZ, NA: NA, NE: NE, NF: NF, NG: NG, NI: NI, NL: NL, NO: NO, NP: NP, NR: NR, NU: NU, NZ: NZ, OM: OM, PA: PA, PE: PE, PF: PF, PG: PG, PH: PH, PK: PK, PL: PL, PN: PN, PR: PR, PS: PS, PT: PT, PW: PW, PY: PY, QA: QA, RO: RO, RS: RS, RU: RU, RW: RW, SA: SA, SB: SB, SC: SC, SE: SE, SG: SG, SI: SI, SK: SK, SL: SL, SM: SM, SN: SN, SO: SO, SR: SR, SS: SS, ST: ST, SV: SV, SX: SX, SY: SY, SZ: SZ, TC: TC, TD: TD, TG: TG, TH: TH, TJ: TJ, TK: TK, TL: TL, TM: TM, TN: TN, TO: TO, TR: TR, TT: TT, TV: TV, TW: TW, TZ: TZ, UA: UA, UG: UG, US: US, UY: UY, UZ: UZ, VC: VC, VE: VE, VG: VG, VI: VI, VN: VN, VU: VU, WS: WS, YE: YE, ZA: ZA, ZM: ZM, ZW: ZW, alertCircle: AlertCircle, angelListBrand: AngelListBrand, angelList: AngelList, appleBrand: AppleBrand, apple: Apple, arrowNarrow: ArrowNarrow, arrow: Arrow, backupKit: BackupKit, brush: Brush, capsuleLogo: CapsuleLogo, capsuleRingsDark: CapsuleRingsDark, capsuleRings: CapsuleRings, capsule: Capsule, checkCircle: CheckCircle, check: Check, chevronUp: ChevronUp, clock: Clock, close: Close, clubhouseBrand: ClubhouseBrand, clubhouse: Clubhouse, copy: Copy, decentBrand: DecentBrand, decent: Decent, discordBrand: DiscordBrand, discord: Discord, downloadCloud: DownloadCloud, dribbbleBrand: DribbbleBrand, dribbble: Dribbble, earth: Earth, eyeOff: EyeOff, eye: Eye, facebookBrand: FacebookBrand, facebook: Facebook, figmaBrand: FigmaBrand, figma: Figma, file: File, githubBrand: GithubBrand, github: Github, googleBrand: GoogleBrand, google: Google, helpCircle: HelpCircle, heroEmail: HeroEmail, heroLock: HeroLock, heroPasskey: HeroPasskey, heroPhone: HeroPhone, heroWallet: HeroWallet, home: Home, infoCircle: InfoCircle, instagramBrand: InstagramBrand, instagram: Instagram, key: Key, lightning01: Lightning01, lightning: Lightning, linkedinBrand: LinkedinBrand, linkedin: Linkedin, mail: Mail, moreLoginOptions: MoreLoginOptions, phone: Phone, pintrestBrand: PintrestBrand, pintrest: Pintrest, plusCircle: PlusCircle, rampNetworkBrand: RampNetworkBrand, rampNetwork: RampNetwork, redditBrand: RedditBrand, reddit: Reddit, settings: Settings, signalBrand: SignalBrand, signal: Signal, snapchatBrand: SnapchatBrand, snapchat: Snapchat, telegramBrand: TelegramBrand, telegram: Telegram, tikTokBrand: TikTokBrand, tikTok: TikTok, tumblrBrand: TumblrBrand, tumblr: Tumblr, twitterBrand: TwitterBrand, twitter: Twitter, wallet: Wallet, youtubeBrand: YoutubeBrand, youtube: Youtube, };
|
5049
|
+
const Icons = { AD: AD, AE: AE, AF: AF, AG: AG, AI: AI, AL: AL, AM: AM, AO: AO, AR: AR, AS: AS, AT: AT, AU: AU, AW: AW, AX: AX, AZ: AZ, BA: BA, BB: BB, BD: BD, BE: BE, BF: BF, BG: BG, BH: BH, BI: BI, BJ: BJ, BL: BL, BM: BM, BN: BN, BO: BO, BQ: BQ, BQ2: BQ2, BQ3: BQ3, BR: BR, BS: BS, BT: BT, BW: BW, BY: BY, BZ: BZ, CA: CA, CC: CC, CD: CD, CD2: CD2, CF: CF, CH: CH, CK: CK, CL: CL, CM: CM, CN: CN, CO: CO, CR: CR, CU: CU, CW: CW, CX: CX, CY: CY, CZ: CZ, DE: DE, DJ: DJ, DK: DK, DM: DM, DO: DO, DS: DS, DZ: DZ, EC: EC, EE: EE, EG: EG, EH: EH, ER: ER, ES: ES, ET: ET, FI: FI, FJ: FJ, FK: FK, FM: FM, FO: FO, FR: FR, GA: GA, GB2: GB2, GB: GB, GD: GD, GE: GE, GG: GG, GH: GH, GI: GI, GL: GL, GM: GM, GN: GN, GQ: GQ, GR: GR, GT: GT, GU: GU, GW: GW, GY: GY, HK: HK, HN: HN, HR: HR, HT: HT, HU: HU, ID: ID, IE: IE, IL: IL, IM: IM, IN: IN, IO: IO, IQ: IQ, IR: IR, IS: IS, IT: IT, JE: JE, JM: JM, JO: JO, JP: JP, KE: KE, KG: KG, KH: KH, KI: KI, KM: KM, KN: KN, KP: KP, KR: KR, KW: KW, KY: KY, KZ: KZ, LA: LA, LB: LB, LC: LC, LI: LI, LK: LK, LR: LR, LS: LS, LT: LT, LU: LU, LV: LV, LY: LY, MA: MA, MC: MC, MD: MD, ME: ME, MG: MG, MH: MH, MK: MK, ML: ML, MM: MM, MN: MN, MO: MO, MP: MP, MQ: MQ, MR: MR, MS: MS, MT: MT, MU: MU, MV: MV, MW: MW, MX: MX, MY: MY, MZ: MZ, NA: NA, NE: NE, NF: NF, NG: NG, NI: NI, NL: NL, NO: NO, NP: NP, NR: NR, NU: NU, NZ: NZ, OM: OM, PA: PA, PE: PE, PF: PF, PG: PG, PH: PH, PK: PK, PL: PL, PN: PN, PR: PR, PS: PS, PT: PT, PW: PW, PY: PY, QA: QA, RO: RO, RS: RS, RU: RU, RW: RW, SA: SA, SB: SB, SC: SC, SE: SE, SG: SG, SI: SI, SK: SK, SL: SL, SM: SM, SN: SN, SO: SO, SR: SR, SS: SS, ST: ST, SV: SV, SX: SX, SY: SY, SZ: SZ, TC: TC, TD: TD, TG: TG, TH: TH, TJ: TJ, TK: TK, TL: TL, TM: TM, TN: TN, TO: TO, TR: TR, TT: TT, TV: TV, TW: TW, TZ: TZ, UA: UA, UG: UG, US: US, UY: UY, UZ: UZ, VC: VC, VE: VE, VG: VG, VI: VI, VN: VN, VU: VU, WS: WS, YE: YE, ZA: ZA, ZM: ZM, ZW: ZW, alertCircle: AlertCircle, angelListBrand: AngelListBrand, angelList: AngelList, appleBrand: AppleBrand, apple: Apple, arrowNarrow: ArrowNarrow, arrow: Arrow, backupKit: BackupKit, brush: Brush, capsuleLogo: CapsuleLogo, capsuleRingsDark: CapsuleRingsDark, capsuleRings: CapsuleRings, capsule: Capsule, checkCircle: CheckCircle, check: Check, chevronUp: ChevronUp, clock: Clock, close: Close, clubhouseBrand: ClubhouseBrand, clubhouse: Clubhouse, copy: Copy, cube: Cube, decentBrand: DecentBrand, decent: Decent, discordBrand: DiscordBrand, discord: Discord, downloadCloud: DownloadCloud, dribbbleBrand: DribbbleBrand, dribbble: Dribbble, earth: Earth, eyeOff: EyeOff, eye: Eye, facebookBrand: FacebookBrand, facebook: Facebook, farcasterBrand: FarcasterBrand, farcaster: Farcaster, figmaBrand: FigmaBrand, figma: Figma, file: File, githubBrand: GithubBrand, github: Github, googleBrand: GoogleBrand, google: Google, helpCircle: HelpCircle, heroEmail: HeroEmail, heroLock: HeroLock, heroPasskey: HeroPasskey, heroPhone: HeroPhone, heroWallet: HeroWallet, home: Home, image: Image$1, infoCircle: InfoCircle, instagramBrand: InstagramBrand, instagram: Instagram, key: Key, lightning01: Lightning01, lightning: Lightning, linkedinBrand: LinkedinBrand, linkedin: Linkedin, mail: Mail, menu: Menu, moreLoginOptions: MoreLoginOptions, phone: Phone, pintrestBrand: PintrestBrand, pintrest: Pintrest, plusCircle: PlusCircle, rampNetworkBrand: RampNetworkBrand, rampNetwork: RampNetwork, redditBrand: RedditBrand, reddit: Reddit, refresh: Refresh, settings: Settings, signalBrand: SignalBrand, signal: Signal, snapchatBrand: SnapchatBrand, snapchat: Snapchat, stars: Stars, telegramBrand: TelegramBrand, telegram: Telegram, tikTokBrand: TikTokBrand, tikTok: TikTok, tumblrBrand: TumblrBrand, tumblr: Tumblr, twitterBrand: TwitterBrand, twitter: Twitter, wallet: Wallet, x: X, youtubeBrand: YoutubeBrand, youtube: Youtube, };
|
4980
5050
|
|
4981
5051
|
const cpslDropdownCss = ":host{display:block;position:relative;font-family:Arial, sans-serif;--input-color:var(--cpsl-color-text-primary);--container-background-color:var(--cpsl-color-input-surface-default);--container-border-color:var(--cpsl-color-input-border-active);--scrollbar-color:var(--cpsl-color-text-subtle);--divider-color:var(--cpsl-color-divider);--input-placeholder-color:var(--cpsl-color-text-secondary);--input-font-size:var(--cpsl-font-size-body-m);--button-hover-color:var(--cpsl-color-tile-button-surface-hover);font-family:var(--cpsl-font-family, inherit)}.input-container{position:relative;width:100%}::slotted(cpsl-dropdown){position:absolute;width:100%;top:100%;left:0;z-index:2}.dropdown-button{display:flex;width:100%;padding:0 4px;background:none;border:none;align-items:center;justify-content:space-between;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--input-color)}.dropdown-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.dropdown-button div{margin-left:8px;display:flex;align-items:center}.dropdown-options{display:none;position:fixed;list-style:none;padding:0;margin-top:4px;border:1px solid var(--container-border-color);border-radius:8px;z-index:999999999999;overflow-y:auto;max-height:300px;box-sizing:border-box;background-color:var(--container-background-color);}.dropdown-options.open{display:block}.dropdown-options li{padding:8px;cursor:pointer;display:flex;align-items:center;border-bottom:1px solid var(--cpsl-color-divider);color:var(--input-color);background:var(--container-background-color);font-size:var(--input-font-size)}.dropdown-options li:hover{background-color:var(--button-hover-color)}.dropdown-options li svg{width:24px;height:24px;margin-right:8px;padding:0 8px;vertical-align:middle;}.dropdown-options::-webkit-scrollbar{width:8px;height:8px;background-color:transparent;}.dropdown-options::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color);border-radius:10px;border:2px solid transparent;background-clip:content-box;height:8px}.dropdown-options::-webkit-scrollbar-track{background:transparent;}.dropdown-value{margin-left:8px;color:var(--cpsl-color-text-secondary)}.dropdown-button .chevron{transition:transform 0.3s ease}.dropdown-button .chevron.closed{transform:rotate(180deg)}.search-bar{padding:0;border-bottom:1px solid var(--cpsl-color-divider);position:sticky;top:0;background:var(--container-background-color);z-index:1;}.search-bar input{width:100%;padding:8px;border:none;box-sizing:border-box;font-size:var(--input-font-size);color:var(--input-color);background-color:var(--container-background-color);border-radius:0;}.search-bar input::placeholder{color:var(--input-placeholder-color)}.search-bar input:focus{outline:none;border-color:transparent;}";
|
4982
5052
|
const CpslDropdownStyle0 = cpslDropdownCss;
|
@@ -5077,7 +5147,7 @@ const CpslDropdown = class {
|
|
5077
5147
|
}
|
5078
5148
|
render() {
|
5079
5149
|
var _a, _b, _c;
|
5080
|
-
return (index.h(index.Host, { key: '
|
5150
|
+
return (index.h(index.Host, { key: '121a65b9e15c7fb81a1ecd98c30f2d3d47a0af2c' }, index.h("button", { key: 'bdea591df3159d30de22a3615362abcd3f222c65', class: "dropdown-button", onClick: this.toggleDropdown }, `${((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.selectedLabel) || ((_b = this.selectedItem) === null || _b === void 0 ? void 0 : _b.label)} ${(_c = this.selectedItem) === null || _c === void 0 ? void 0 : _c.value}`, index.h("div", { key: '778a3ea1cc1d6c7df3b961acb2b687aefcce38b3', class: `chevron ${this.isOpen ? '' : 'closed'}`, innerHTML: Icons['chevronUp'] })), index.h("ul", { key: '490af95f8b21a330a7432e10b0591b4ed81aa1b7', class: { 'dropdown-options': true, 'open': this.isOpen }, style: { width: this.width } }, this.hasCpslSearch && (index.h("li", { class: "search-bar" }, index.h("input", { type: "text", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchQueryChange }))), this.filteredItems.map(item => (index.h("li", { onClick: this.handleItemSelect(item) }, index.h("span", { innerHTML: Icons[item.icon] }), item.label, " ", index.h("span", { class: "dropdown-value" }, item.value)))))));
|
5081
5151
|
}
|
5082
5152
|
get el() { return index.getElement(this); }
|
5083
5153
|
static get watchers() { return {
|
@@ -5087,6 +5157,138 @@ const CpslDropdown = class {
|
|
5087
5157
|
};
|
5088
5158
|
CpslDropdown.style = CpslDropdownStyle0;
|
5089
5159
|
|
5160
|
+
const cpslFileUploadCss = ":host{--container-box-shadow:none;--container-box-shadow-color:var(--cpsl-color-file-border-placeholder);--container-border-color:var(--cpsl-color-file-border-placeholder);--container-border-color-error:var(--cpsl-color-file-border-error);--container-background-color:var(--cpsl-color-file-surface-default);--container-background-color-disabled:var(--cpsl-color-file-surface-disabled);--container-background-color-drag:var(--cpsl-color-file-surface-drag);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-file);--container-padding-top:12px;--container-padding-bottom:12px;--container-padding-end:12px;--container-padding-start:12px;--container-height:48px;--container-gap:8px;--optional-label-color:var(--cpsl-color-text-secondary);--label-color:var(--cpsl-color-text-primary);--label-font-size:var(--cpsl-font-size-body-s);--label-margin-bottom:0px;--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:var(--cpsl-font-size-body-xs);--helper-text-margin-top:0px;--sample-img-height:40px;--sample-img-width:40px;--sample-img-border-radius:8px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}.container{-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);display:flex;align-items:center;box-sizing:border-box;flex-wrap:wrap;width:100%;gap:var(--container-gap);cursor:pointer;position:relative;border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);border-radius:var(--container-border-radius);background:var(--container-background-color);box-shadow:var(--container-box-shadow)}.container.drag,.container:active{background:var(--container-background-color-drag)}.container.drag-error{cursor:no-drop}.container.error{border-color:var(--container-border-color-error)}input{position:absolute;width:100%;height:100%;top:0;left:0;margin:0px;opacity:0;cursor:pointer}.sample-img{height:var(--sample-img-height);width:var(--sample-img-width);border-radius:var(--sample-img-border-radius);object-fit:contain}.sample-image-name-container{display:flex;gap:4px;align-items:center;text-align:center}.sample-image-name-container cpsl-icon{z-index:10000;--height:16px;--width:16px}.inline-text{display:inline-block}.sample-image-name{display:inline-block;color:var(--cpsl-color-text-tertiary)}.label-container{flex:1}.file-container{display:flex;flex-direction:column;flex:1;gap:8px;justify-content:center;align-items:center}.label{display:inline-block;color:var(--label-color);font-size:var(--label-font-size);font-weight:500;margin-bottom:var(--label-margin-bottom)}.optional-label{display:inline-block;color:var(--optional-label-color);font-size:var(--label-font-size);font-weight:500}.helper-text-container{display:flex;align-items:center;gap:4px;color:var(--helper-text-color);font-size:var(--helper-text-font-size);font-weight:500;margin-top:var(--helper-text-margin-top)}.helper-text-container cpsl-icon{--height:var(--helper-text-icon-size);--width:var(--helper-text-icon-size);--icon-color:var(--helper-text-icon-color)}.error-text{color:var(--helper-text-error-color)}.error-text cpsl-icon{--icon-color:var(--helper-text-icon-error-color)}";
|
5161
|
+
const CpslFileUploadStyle0 = cpslFileUploadCss;
|
5162
|
+
|
5163
|
+
var __awaiter$1 = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
|
5164
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
5165
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
5166
|
+
function fulfilled(value) { try {
|
5167
|
+
step(generator.next(value));
|
5168
|
+
}
|
5169
|
+
catch (e) {
|
5170
|
+
reject(e);
|
5171
|
+
} }
|
5172
|
+
function rejected(value) { try {
|
5173
|
+
step(generator["throw"](value));
|
5174
|
+
}
|
5175
|
+
catch (e) {
|
5176
|
+
reject(e);
|
5177
|
+
} }
|
5178
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
5179
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
5180
|
+
});
|
5181
|
+
};
|
5182
|
+
const CpslFileUpload = class {
|
5183
|
+
constructor(hostRef) {
|
5184
|
+
index.registerInstance(this, hostRef);
|
5185
|
+
this.cpslOnDrop = index.createEvent(this, "cpslOnDrop", 7);
|
5186
|
+
this.cpslOnDragEnter = index.createEvent(this, "cpslOnDragEnter", 7);
|
5187
|
+
this.cpslOnDragLeave = index.createEvent(this, "cpslOnDragLeave", 7);
|
5188
|
+
this.cpslFileChange = index.createEvent(this, "cpslFileChange", 7);
|
5189
|
+
this.cpslFileRemoved = index.createEvent(this, "cpslFileRemoved", 7);
|
5190
|
+
this.inputId = `cpsl-file-upload-${inputIds$2++}`;
|
5191
|
+
this.handleDrop = (ev) => __awaiter$1(this, void 0, void 0, function* () {
|
5192
|
+
var _a;
|
5193
|
+
ev.preventDefault();
|
5194
|
+
const item = (_a = Array.from(ev.dataTransfer.items)) === null || _a === void 0 ? void 0 : _a[0];
|
5195
|
+
if (item && this.isValidFile(item.type)) {
|
5196
|
+
const file = item.getAsFile();
|
5197
|
+
yield this.addFile(file);
|
5198
|
+
}
|
5199
|
+
this.dragOver = false;
|
5200
|
+
this.dragError = false;
|
5201
|
+
this.cpslOnDrop.emit(ev);
|
5202
|
+
});
|
5203
|
+
this.handleDragEnter = (ev) => {
|
5204
|
+
var _a;
|
5205
|
+
ev.preventDefault();
|
5206
|
+
this.dragOver = true;
|
5207
|
+
const item = (_a = Array.from(ev.dataTransfer.items)) === null || _a === void 0 ? void 0 : _a[0];
|
5208
|
+
if (item && this.isValidFile(item.type)) {
|
5209
|
+
this.dragError = true;
|
5210
|
+
}
|
5211
|
+
this.cpslOnDragEnter.emit(ev);
|
5212
|
+
};
|
5213
|
+
this.handleDragLeave = (ev) => {
|
5214
|
+
ev.preventDefault();
|
5215
|
+
this.dragOver = false;
|
5216
|
+
this.dragError = false;
|
5217
|
+
this.cpslOnDragLeave.emit(ev);
|
5218
|
+
};
|
5219
|
+
this.handleInputChange = (ev) => __awaiter$1(this, void 0, void 0, function* () {
|
5220
|
+
ev.preventDefault();
|
5221
|
+
const input = this.inputEl;
|
5222
|
+
if (Boolean(input.files.length)) {
|
5223
|
+
const file = input.files[0];
|
5224
|
+
if (this.isValidFile(file.type)) {
|
5225
|
+
yield this.addFile(file);
|
5226
|
+
}
|
5227
|
+
}
|
5228
|
+
});
|
5229
|
+
this.isValidFile = (type) => {
|
5230
|
+
var _a;
|
5231
|
+
if (Boolean((_a = this.fileTypes) === null || _a === void 0 ? void 0 : _a.length) ? !this.fileTypes.includes(type) : false) {
|
5232
|
+
return false;
|
5233
|
+
}
|
5234
|
+
return true;
|
5235
|
+
};
|
5236
|
+
this.addFile = (file) => __awaiter$1(this, void 0, void 0, function* () {
|
5237
|
+
this.file = file;
|
5238
|
+
this.cpslFileChange.emit(file);
|
5239
|
+
this.uploadError = false;
|
5240
|
+
this.isUploading = true;
|
5241
|
+
const uploadSuccess = Boolean(this.uploadFile) ? yield this.uploadFile(file) : true;
|
5242
|
+
if (!uploadSuccess) {
|
5243
|
+
this.uploadError = true;
|
5244
|
+
const input = this.inputEl;
|
5245
|
+
input.value = '';
|
5246
|
+
}
|
5247
|
+
this.isUploading = false;
|
5248
|
+
});
|
5249
|
+
this.removeFile = (e) => {
|
5250
|
+
e.preventDefault();
|
5251
|
+
this.file = undefined;
|
5252
|
+
const input = this.inputEl;
|
5253
|
+
input.value = '';
|
5254
|
+
this.cpslFileRemoved.emit();
|
5255
|
+
};
|
5256
|
+
this.file = undefined;
|
5257
|
+
this.dragOver = undefined;
|
5258
|
+
this.dragError = undefined;
|
5259
|
+
this.isUploading = undefined;
|
5260
|
+
this.uploadError = undefined;
|
5261
|
+
this.errorText = undefined;
|
5262
|
+
this.externalFilename = undefined;
|
5263
|
+
this.externalSrc = undefined;
|
5264
|
+
this.fileTypes = undefined;
|
5265
|
+
this.helperText = undefined;
|
5266
|
+
this.label = undefined;
|
5267
|
+
this.required = false;
|
5268
|
+
this.showOptionalLabel = false;
|
5269
|
+
this.uploadFile = undefined;
|
5270
|
+
}
|
5271
|
+
get inputEl() {
|
5272
|
+
return this.el.shadowRoot.getElementById(this.inputId);
|
5273
|
+
}
|
5274
|
+
get FileContent() {
|
5275
|
+
var _a;
|
5276
|
+
const hasFile = Boolean(this.file) || Boolean(this.externalSrc);
|
5277
|
+
const isUploading = this.isUploading;
|
5278
|
+
const error = this.uploadError;
|
5279
|
+
const text = !hasFile ? (index.h(index.Fragment, null, 'Drag file here or ', index.h("cpsl-text", { class: "inline-text", variant: "bodyXS" }, "upload file"))) : isUploading ? (`${this.file.name} is uploading`) : error ? ('Upload Failed') : (((_a = this.file) === null || _a === void 0 ? void 0 : _a.name) || this.externalFilename || '');
|
5280
|
+
const TopElement = !hasFile ? (index.h("cpsl-icon", { icon: "image" })) : isUploading ? (index.h("cpsl-spinner", null)) : error ? (index.h("cpsl-icon", { icon: "close" })) : (index.h("img", { class: "sample-img", src: Boolean(this.file) ? URL.createObjectURL(this.file) : this.externalSrc, alt: "Sample Image" }));
|
5281
|
+
return (index.h(index.Fragment, null, TopElement, index.h("span", { class: "sample-image-name-container" }, index.h("cpsl-text", { class: "sample-image-name", variant: "bodyXS" }, text), hasFile && !error && !isUploading && index.h("cpsl-icon", { icon: "close", onClick: this.removeFile }))));
|
5282
|
+
}
|
5283
|
+
render() {
|
5284
|
+
var _a, _b, _c;
|
5285
|
+
return (index.h(index.Host, { key: '71d945bcac5d443719737781fd9ec5166952760d' }, this.label && (index.h("label", { class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? index.h("span", { class: "optional-label" }, "(optional)") : '')), index.h("slot", { key: '63786e91e0a230d85344da507d0508ac1524cc88', name: "label" }), index.h("div", { key: '74e7296a0c8ef732094c0e7fab3e0a7db916694b', class: { 'container': true, 'error': Boolean(this.errorText), 'drag': this.dragOver, 'drag-error': this.dragError } }, index.h("div", { key: '1a3030a828d8e7a742f3dfbff784e213f845859e', class: { 'label-container': true } }, index.h("slot", { key: '1f77e4c6566deffe7cd830fccb96d21c22daee4b', name: "left-content" })), index.h("div", { key: '3dc0a113348d15d52aae929792de6ee48da795ca', class: { 'file-container': true } }, this.FileContent), index.h("input", { key: 'a6fc37d212b5e4284f4eeec56dc4e7a32ff8374b', id: this.inputId, type: "file", accept: (_b = (_a = this.fileTypes) === null || _a === void 0 ? void 0 : _a.join(', ')) !== null && _b !== void 0 ? _b : '*', files: Boolean(this.file) ? [this.file] : undefined, onDrop: this.handleDrop, onDragEnter: this.handleDragEnter, onDragLeave: this.handleDragLeave, onChange: this.handleInputChange })), (this.errorText || this.helperText) && (index.h("div", { class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, index.h("span", null, (_c = this.errorText) !== null && _c !== void 0 ? _c : this.helperText)))));
|
5286
|
+
}
|
5287
|
+
get el() { return index.getElement(this); }
|
5288
|
+
};
|
5289
|
+
let inputIds$2 = 0;
|
5290
|
+
CpslFileUpload.style = CpslFileUploadStyle0;
|
5291
|
+
|
5090
5292
|
const cpslIconCss = ":host{display:block;--height:24px;--width:24px;--icon-color:var(--cpsl-color-text-primary);--icon-fill-color:var(--cpsl-color-text-primary);--icon-stroke-color:var(--cpsl-color-text-primary);width:var(--width);height:var(--height)}:host div{display:flex;width:var(--width);height:var(--height);color:var(--icon-color)}:host svg{width:var(--width);height:var(--height)}:host svg .background-16{fill:var(--cpsl-color-background-16)}:host svg .foreground-0{fill:var(--cpsl-color-foreground-0)}:host svg .fill{fill:var(--icon-fill-color)}:host svg .stroke{stroke:var(--icon-stroke-color)}:host img{width:var(--width);height:var(--height);object-fit:contain}";
|
5091
5293
|
const CpslIconStyle0 = cpslIconCss;
|
5092
5294
|
|
@@ -5097,12 +5299,12 @@ const CpslIcon = class {
|
|
5097
5299
|
this.icon = undefined;
|
5098
5300
|
}
|
5099
5301
|
render() {
|
5100
|
-
return (index.h(index.Host, { key: '
|
5302
|
+
return (index.h(index.Host, { key: '06850dc9a6d40b95e8b92ea8722bedfa1dc7b36f', part: "icon", role: "img" }, !Boolean(this.icon) ? index.h("img", { src: this.src }) : index.h("div", { innerHTML: Icons[this.icon] })));
|
5101
5303
|
}
|
5102
5304
|
};
|
5103
5305
|
CpslIcon.style = CpslIconStyle0;
|
5104
5306
|
|
5105
|
-
const cpslInputCss = ":host{--container-box-shadow:none;--container-box-shadow-color:
|
5307
|
+
const cpslInputCss = ":host{--container-box-shadow:none;--container-box-shadow-color:none;--container-border-color:var(--cpsl-color-input-border-active);--container-border-error-color:var(--cpsl-color-input-border-error);--container-background-color:var(--cpsl-color-input-surface-default);--container-background-color-disabled:var(--cpsl-color-input-surface-disabled);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-input);--container-padding-top:0px;--container-padding-bottom:0px;--container-padding-end:12px;--container-padding-start:12px;--container-height:48px;--container-gap:8px;--input-background-color:var(--cpsl-color-input-surface-default);--input-background-color-disabled:var(--cpsl-color-input-surface-disabled);--input-color:var(--cpsl-color-text-primary);--input-placeholder-color:var(--cpsl-color-text-secondary);--input-font-size:var(--cpsl-font-size-body-m);--optional-label-color:var(--cpsl-color-text-secondary);--label-color:var(--cpsl-color-text-primary);--label-font-size:var(--cpsl-font-size-body-s);--label-margin-bottom:0px;--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:var(--cpsl-font-size-body-xs);--helper-text-margin-top:0px;--button-padding:4px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}:host(:not(.has-value)){--container-border-color:var(--cpsl-color-input-border-placeholder);--input-color:var(--cpsl-color-text-secondary)}:host(.disabled){--container-background-color:var(--container-background-color-disabled);--input-background-color:var(--input-background-color-disabled);--input-color:var(--cpsl-color-text-disabled);--container-border-color:transparent}:host(.focused){--container-box-shadow:0px 0px 0px 2px var(--container-box-shadow-color);--container-border-color:var(--cpsl-color-input-border-active);--container-background-color:var(--cpsl-color-input-surface-default)}.input-container{-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);display:flex;align-items:center;box-sizing:border-box;height:var(--container-height);gap:var(--container-gap);border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);border-radius:var(--container-border-radius);background:var(--container-background-color);box-shadow:var(--container-box-shadow)}.error-container{border-color:var(--container-border-error-color)}.native-input{flex:1;min-width:0;border:none;height:100%;box-sizing:border-box;font-size:var(--input-font-size);color:var(--input-color);background:var(--input-background-color);font-family:var(--cpsl-font-family, inherit)}.native-input:focus,.native-input:focus-visible{outline:none}.native-input::placeholder{color:var(--input-placeholder-color);opacity:1;}.label{display:inline-block;color:var(--label-color);font-size:var(--label-font-size);font-weight:500;margin-bottom:var(--label-margin-bottom)}.optional-label{display:inline-block;color:var(--optional-label-color);font-size:var(--label-font-size);font-weight:500}.helper-text-container{display:flex;align-items:center;gap:4px;color:var(--helper-text-color);font-size:var(--helper-text-font-size);font-weight:500;margin-top:var(--helper-text-margin-top)}.helper-text-container cpsl-icon{--height:var(--helper-text-icon-size);--width:var(--helper-text-icon-size);--icon-color:var(--helper-text-icon-color)}.error-text{color:var(--helper-text-error-color)}.error-text cpsl-icon{--icon-color:var(--helper-text-icon-error-color)}:host ::slotted([slot=start]){flex:0 0 auto}:host ::slotted([slot=end]){flex:0 0 auto}:host ::slotted(cpsl-icon){--icon-color:var(--input-color)}:host ::slotted(cpsl-button){width:calc(var(--container-height) - var(--button-padding) * 2);height:calc(var(--container-height) - var(--button-padding) * 2);--button-border-radius:calc(var(--container-border-radius) - 2px)}:host slot[name=end]::slotted(cpsl-button){margin-right:calc((var(--container-padding-end) - var(--button-padding)) * -1)}:host slot[name=start]::slotted(cpsl-button){margin-left:calc((var(--container-padding-end) - var(--button-padding)) * -1)}";
|
5106
5308
|
const CpslInputStyle0 = cpslInputCss;
|
5107
5309
|
|
5108
5310
|
const CpslInput = class {
|
@@ -5113,7 +5315,7 @@ const CpslInput = class {
|
|
5113
5315
|
this.cpslBlur = index.createEvent(this, "cpslBlur", 7);
|
5114
5316
|
this.cpslFocus = index.createEvent(this, "cpslFocus", 7);
|
5115
5317
|
this.cpslPaste = index.createEvent(this, "cpslPaste", 7);
|
5116
|
-
this.inputId = `cpsl-input-${inputIds++}`;
|
5318
|
+
this.inputId = `cpsl-input-${inputIds$1++}`;
|
5117
5319
|
this.onInput = (ev) => {
|
5118
5320
|
const input = ev.target;
|
5119
5321
|
if (Boolean(input)) {
|
@@ -5227,9 +5429,7 @@ const CpslInput = class {
|
|
5227
5429
|
}
|
5228
5430
|
}
|
5229
5431
|
emitInputChange(event) {
|
5230
|
-
|
5231
|
-
const newValue = value == null ? value : value.toString();
|
5232
|
-
this.cpslInput.emit({ value: newValue, event });
|
5432
|
+
this.cpslInput.emit({ value: this.nativeInput.value, event });
|
5233
5433
|
}
|
5234
5434
|
emitValueChange(event) {
|
5235
5435
|
const { value } = this;
|
@@ -5237,9 +5437,6 @@ const CpslInput = class {
|
|
5237
5437
|
this.focusedValue = newValue;
|
5238
5438
|
this.cpslChange.emit({ value: newValue, event });
|
5239
5439
|
}
|
5240
|
-
get nativeInput() {
|
5241
|
-
return this.el.shadowRoot.getElementById(this.inputId);
|
5242
|
-
}
|
5243
5440
|
get startEl() {
|
5244
5441
|
return this.el.querySelector('[slot="start"]');
|
5245
5442
|
}
|
@@ -5248,14 +5445,14 @@ const CpslInput = class {
|
|
5248
5445
|
}
|
5249
5446
|
render() {
|
5250
5447
|
var _a;
|
5251
|
-
return (index.h(index.Host, { key: '
|
5448
|
+
return (index.h(index.Host, { key: '28937d4a0e8c5a4e7b7a00e610013e52fa171f3a', class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.focusedValue) || Boolean(this.value) } }, this.label && (index.h("label", { class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? index.h("span", { class: "optional-label" }, "(optional)") : '')), index.h("div", { key: '8a2c5e7d32c93af2b0d463563c48e8104c639604', class: { 'input-container': true, 'error-container': Boolean(this.errorText) } }, index.h("slot", { key: 'd24440dff32cd3837638565764d2683bf16414ca', name: "start" }), index.h("input", { key: 'a3df402a5fd5f9a9d2483a1f0b65f9061468df15', class: "native-input", ref: input => (this.nativeInput = input), id: this.inputId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, type: this.type, value: this.value, onInput: this.onInput, onChange: this.onChange, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.focusInput, onPaste: this.onPaste }), index.h("slot", { key: 'f7472b02d119b4a458252128da5e61ebbfbdee56', name: "end" })), (this.errorText || this.helperText) && (index.h("div", { class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, index.h("span", null, (_a = this.errorText) !== null && _a !== void 0 ? _a : this.helperText)))));
|
5252
5449
|
}
|
5253
5450
|
get el() { return index.getElement(this); }
|
5254
5451
|
static get watchers() { return {
|
5255
5452
|
"disabled": ["handleDisable"]
|
5256
5453
|
}; }
|
5257
5454
|
};
|
5258
|
-
let inputIds = 0;
|
5455
|
+
let inputIds$1 = 0;
|
5259
5456
|
CpslInput.style = CpslInputStyle0;
|
5260
5457
|
|
5261
5458
|
function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
@@ -14404,7 +14601,7 @@ Draggable.zIndex = 1000;
|
|
14404
14601
|
Draggable.version = "3.12.5";
|
14405
14602
|
_getGSAP() && gsap.registerPlugin(Draggable);
|
14406
14603
|
|
14407
|
-
const cpslModalCss = ":host{--container-width:360px;--container-gap:16px;--container-border-radius:var(--cpsl-border-radius-modal);--container-border-width:1px;--container-border-color:var(--cpsl-color-modal-border);--container-background-color:var(--cpsl-color-modal-surface-footer);--container-padding-bottom:16px;--container-box-shadow:0px
|
14604
|
+
const cpslModalCss = ":host{--container-width:360px;--container-gap:16px;--container-border-radius:var(--cpsl-border-radius-modal);--container-border-width:1px;--container-border-color:var(--cpsl-color-modal-border);--container-background-color:var(--cpsl-color-modal-surface-footer);--container-padding-bottom:16px;--container-box-shadow:0px 8px 16px 0px rgba(0, 0, 0, 0.12);--inner-container-background-color:var(--cpsl-color-modal-surface-main);--inner-container-border-radius:var(--cpsl-border-radius-modal);--inner-container-box-shadow:0px 1px 2px 0px var(--cpsl-color-alpha-black-8);--inner-container-padding-top:16px;--inner-container-padding-end:16px;--inner-container-padding-bottom:24px;--inner-container-padding-start:16px;--inner-container-margin-bottom:16px;display:block;z-index:10005;position:relative}:host cpsl-overlay{z-index:10005}@media (max-width: 480px){:host(.include-mobile-styling) .modal-wrapper{scale:none;top:100%;left:0;height:unset;opacity:1}:host(.include-mobile-styling) .modal-container{width:100%;max-width:none;border-bottom-left-radius:0px;border-bottom-right-radius:0px}}:host(.no-overlay){z-index:0}.modal-header{position:sticky;top:0;padding-top:var(--inner-container-padding-top);background:var(--inner-container-background-color)}.modal-wrapper{z-index:10005;position:fixed;top:0;left:0;display:none;height:100%;width:100%;justify-content:center;align-items:center;scale:0.8;opacity:0;transform:none}.modal-container{position:relative;overflow:hidden;-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);width:var(--container-width);display:flex;flex-direction:column;border:var(--container-border-width) solid var(--container-border-color);border-radius:var(--container-border-radius);box-shadow:var(--container-box-shadow);background:var(--container-background-color);max-width:95vw;max-height:95vh;max-height:95dvh;overflow:auto;-ms-overflow-style:none;scrollbar-width:none;}.modal-container ::-webkit-scrollbar{display:none}.modal-inner-container{-webkit-padding-start:var(--inner-container-padding-start);padding-inline-start:var(--inner-container-padding-start);-webkit-padding-end:var(--inner-container-padding-end);padding-inline-end:var(--inner-container-padding-end);padding-top:0;padding-bottom:var(--inner-container-padding-bottom);margin-bottom:var(--inner-container-margin-bottom);border-radius:var(--inner-container-border-radius);box-shadow:var(--inner-container-box-shadow);background:var(--inner-container-background-color)}.expanded{height:0px;overflow:hidden;display:none}.modal-inner-container.no-footer{margin-bottom:0px;box-shadow:none}.modal-container.no-footer{padding-bottom:0px}.no-opacity{opacity:0}";
|
14408
14605
|
const CpslModalStyle0 = cpslModalCss;
|
14409
14606
|
|
14410
14607
|
gsapWithCSS.registerPlugin(Draggable);
|
@@ -14449,6 +14646,7 @@ const CpslModal = class {
|
|
14449
14646
|
this.initDraggable();
|
14450
14647
|
gsapWithCSS.timeline({}).set(this.modalWrapperEl, { scale: 1, opacity: 1, yPercent: this.open ? -100 : 0 });
|
14451
14648
|
});
|
14649
|
+
this.hasFooter = this.footerSlotEl.assignedNodes().length >= 1;
|
14452
14650
|
this.footerSlotEl.addEventListener('slotchange', () => {
|
14453
14651
|
if (this.footerSlotEl.assignedNodes().length >= 1) {
|
14454
14652
|
this.hasFooter = true;
|
@@ -14670,7 +14868,7 @@ const CpslNavButtonGroup = class {
|
|
14670
14868
|
return this.el.querySelectorAll('&> *:not(cpsl-button)');
|
14671
14869
|
}
|
14672
14870
|
render() {
|
14673
|
-
return (index.h(index.Host, { key: '
|
14871
|
+
return (index.h(index.Host, { key: 'e5cf1902a3d5f8b6df197441e144987dcb016762' }, index.h("slot", { key: '56322f15e640f356fae1c9eb16f525753d91fdae' })));
|
14674
14872
|
}
|
14675
14873
|
get el() { return index.getElement(this); }
|
14676
14874
|
static get watchers() { return {
|
@@ -14679,7 +14877,7 @@ const CpslNavButtonGroup = class {
|
|
14679
14877
|
};
|
14680
14878
|
CpslNavButtonGroup.style = CpslNavButtonGroupStyle0;
|
14681
14879
|
|
14682
|
-
const cpslOverlayCss = ":host{position:fixed;width:100%;height:100%;inset:0px;z-index:10001;opacity:0%;display:none;background-
|
14880
|
+
const cpslOverlayCss = ":host{position:fixed;width:100%;height:100%;inset:0px;z-index:10001;opacity:0%;display:none;background:linear-gradient(180deg, rgba(0, 0, 0, 0.14) 0%, rgba(0, 0, 0, 0.7) 100%)}:host(.over-modal){z-index:10005}";
|
14683
14881
|
const CpslOverlayStyle0 = cpslOverlayCss;
|
14684
14882
|
|
14685
14883
|
const CpslOverlay = class {
|
@@ -14710,7 +14908,7 @@ const CpslOverlay = class {
|
|
14710
14908
|
}
|
14711
14909
|
}
|
14712
14910
|
render() {
|
14713
|
-
return (index.h(index.Host, { key: '
|
14911
|
+
return (index.h(index.Host, { key: 'daa05884bc8489f8227873b6778e129bdf922ffd', style: Boolean(this.zIndexOverride) ? { zIndex: `${this.zIndexOverride}` } : {} }, index.h("slot", { key: 'd0783d37893a51fe16fe292c5847dc4acee627ee' })));
|
14714
14912
|
}
|
14715
14913
|
get el() { return index.getElement(this); }
|
14716
14914
|
static get watchers() { return {
|
@@ -14719,7 +14917,7 @@ const CpslOverlay = class {
|
|
14719
14917
|
};
|
14720
14918
|
CpslOverlay.style = CpslOverlayStyle0;
|
14721
14919
|
|
14722
|
-
const cpslPaginationCss = ":host{display:block}.icon{--height:20px;--width:20px}.start-icon{transform:rotate(180deg)}";
|
14920
|
+
const cpslPaginationCss = ":host{display:block}.icon{--height:20px;--width:20px}.start-icon{transform:rotate(180deg)}.arrow-button{--button-secondary-icon-color:var(--cpsl-color-text-tertiary)}";
|
14723
14921
|
const CpslPaginationStyle0 = cpslPaginationCss;
|
14724
14922
|
|
14725
14923
|
const CpslPagination = class {
|
@@ -14796,7 +14994,7 @@ const CpslPagination = class {
|
|
14796
14994
|
filteredPages.push(this.totalPages - 1);
|
14797
14995
|
}
|
14798
14996
|
}
|
14799
|
-
return (index.h(index.Host, { key: '
|
14997
|
+
return (index.h(index.Host, { key: '42ae13b8cdb18ea35db7abc8195d49e36ee4494e' }, index.h("cpsl-button-group", { key: 'a031f2cda1cbd10724ef65cd2fd74b5b237b9841', selectedId: `${this.currentPage}` }, index.h("cpsl-button", { key: '83d653a99ce0eea881eb6332c9d7088b328c20dd', class: "arrow-button", onClick: this.handlePrevClick }, index.h("cpsl-icon", { key: '2e6650d7c873a9e2de4922c08c5b5b2fe27f2b33', class: { 'icon': true, 'start-icon': true }, icon: "arrowNarrow" })), filteredPages.map(page => (index.h("cpsl-button", { key: page, variant: "secondary", fullWidth: true, id: `${page}`, onClick: this.handlePageClick(page) }, index.h("cpsl-text", { variant: "bodyS" }, page + 1)))), index.h("cpsl-button", { key: '4cd4c8623368c96f3457d818a0542fd7ab560182', class: "arrow-button", onClick: this.handleNextClick }, index.h("cpsl-icon", { key: '52865869846d7afbe7a66f44f9564913caf97380', class: "icon", icon: "arrowNarrow" })))));
|
14800
14998
|
}
|
14801
14999
|
static get watchers() { return {
|
14802
15000
|
"currentPage": ["watchChange"]
|
@@ -14804,7 +15002,7 @@ const CpslPagination = class {
|
|
14804
15002
|
};
|
14805
15003
|
CpslPagination.style = CpslPaginationStyle0;
|
14806
15004
|
|
14807
|
-
const cpslPillCss = ":host{--pill-text-color:var(--cpsl-pill-text);--pill-text-size:clamp(10px, 0.625rem, 15px);--pill-text-line-height:100%;--pill-container-height:18px;--pill-container-background-color:var(--cpsl-color-pill-container-background);--pill-container-border-color:var(--cpsl-color-pill-container-border);--pill-container-padding-start:8px;--pill-container-padding-end:8px;--pill-container-border-radius:var(--cpsl-border-radius-pill);font-family:var(--cpsl-font-family, inherit);display:inline-block}.pill-container{-webkit-padding-start:var(--pill-container-padding-start);padding-inline-start:var(--pill-container-padding-start);-webkit-padding-end:var(--pill-container-padding-end);padding-inline-end:var(--pill-container-padding-end);padding-top:var(--pill-container-padding-top);padding-bottom:var(--pill-container-padding-bottom);display:flex;justify-content:center;align-items:center;box-sizing:border-box;height:var(--pill-container-height);background
|
15005
|
+
const cpslPillCss = ":host{--pill-text-color:var(--cpsl-pill-text);--pill-text-size:clamp(10px, 0.625rem, 15px);--pill-text-line-height:100%;--pill-container-height:18px;--pill-container-background-color:var(--cpsl-color-pill-container-background);--pill-container-border-color:var(--cpsl-color-pill-container-border);--pill-container-padding-start:8px;--pill-container-padding-end:8px;--pill-container-border-radius:var(--cpsl-border-radius-pill);font-family:var(--cpsl-font-family, inherit);display:inline-block}.pill-container{-webkit-padding-start:var(--pill-container-padding-start);padding-inline-start:var(--pill-container-padding-start);-webkit-padding-end:var(--pill-container-padding-end);padding-inline-end:var(--pill-container-padding-end);padding-top:var(--pill-container-padding-top);padding-bottom:var(--pill-container-padding-bottom);display:flex;justify-content:center;align-items:center;box-sizing:border-box;height:var(--pill-container-height);background:var(--pill-container-background-color);border:1px solid;border-color:var(--pill-container-border-color);border-radius:var(--pill-container-border-radius);color:var(--pill-text-color);font-size:var(--pill-text-size);line-height:var(--pill-text-line-height)}.pill-container span{display:inline-block}";
|
14808
15006
|
const CpslPillStyle0 = cpslPillCss;
|
14809
15007
|
|
14810
15008
|
const CpslPill = class {
|
@@ -14813,12 +15011,242 @@ const CpslPill = class {
|
|
14813
15011
|
this.text = undefined;
|
14814
15012
|
}
|
14815
15013
|
render() {
|
14816
|
-
return (index.h(index.Host, { key: '
|
15014
|
+
return (index.h(index.Host, { key: 'c57c4206cb82aef700747dee7712ed15ff5907b9' }, index.h("div", { key: 'bc60013838c2d7a7632269b711a506aa83e5b98c', class: "pill-container" }, index.h("span", { key: '6eb81137bfbe02e9fa68a5ef1399b7d73b6bc89b' }, this.text))));
|
14817
15015
|
}
|
14818
15016
|
};
|
14819
15017
|
CpslPill.style = CpslPillStyle0;
|
14820
15018
|
|
14821
|
-
const
|
15019
|
+
const cpslPopoverCss = ":host{position:fixed;display:block;z-index:-1;overflow:auto}:host(.open){z-index:10006}.container{visibility:hidden}.open{visibility:visible;z-index:10006}:host(.transform-h-left){transform:translateX(0)}:host(.transform-h-center){transform:translateX(-50%)}:host(.transform-h-right){transform:translateX(-100%)}:host(.transform-v-top){transform:translateY(0)}:host(.transform-v-center){transform:translateY(-50%)}:host(.transform-v-bottom){transform:translateY(-100%)}";
|
15020
|
+
const CpslPopoverStyle0 = cpslPopoverCss;
|
15021
|
+
|
15022
|
+
var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
|
15023
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
15024
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
15025
|
+
function fulfilled(value) { try {
|
15026
|
+
step(generator.next(value));
|
15027
|
+
}
|
15028
|
+
catch (e) {
|
15029
|
+
reject(e);
|
15030
|
+
} }
|
15031
|
+
function rejected(value) { try {
|
15032
|
+
step(generator["throw"](value));
|
15033
|
+
}
|
15034
|
+
catch (e) {
|
15035
|
+
reject(e);
|
15036
|
+
} }
|
15037
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
15038
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
15039
|
+
});
|
15040
|
+
};
|
15041
|
+
const CpslPopover = class {
|
15042
|
+
constructor(hostRef) {
|
15043
|
+
index.registerInstance(this, hostRef);
|
15044
|
+
this.cpslOpen = index.createEvent(this, "cpslOpen", 7);
|
15045
|
+
this.cpslClose = index.createEvent(this, "cpslClose", 7);
|
15046
|
+
this.triggerClicked = false;
|
15047
|
+
this.configureTriggerInteraction = () => {
|
15048
|
+
const { trigger, triggerAction, destroyTriggerInteraction } = this;
|
15049
|
+
if (Boolean(destroyTriggerInteraction)) {
|
15050
|
+
destroyTriggerInteraction();
|
15051
|
+
}
|
15052
|
+
if (trigger === undefined) {
|
15053
|
+
return;
|
15054
|
+
}
|
15055
|
+
this.triggerEl = document.getElementById(trigger);
|
15056
|
+
if (!Boolean(this.triggerEl)) {
|
15057
|
+
console.error(`A trigger element with the ID "${trigger}" was not found in the DOM.`, this.el);
|
15058
|
+
return;
|
15059
|
+
}
|
15060
|
+
let triggerCallbacks = [];
|
15061
|
+
switch (triggerAction) {
|
15062
|
+
case 'hover':
|
15063
|
+
triggerCallbacks = [
|
15064
|
+
{
|
15065
|
+
eventName: 'mouseenter',
|
15066
|
+
callback: () => __awaiter(this, void 0, void 0, function* () {
|
15067
|
+
this.present();
|
15068
|
+
}),
|
15069
|
+
},
|
15070
|
+
{
|
15071
|
+
eventName: 'mouseleave',
|
15072
|
+
callback: () => {
|
15073
|
+
if (!this.containerEl.matches(':hover')) {
|
15074
|
+
this.close();
|
15075
|
+
}
|
15076
|
+
else {
|
15077
|
+
this.containerEl.addEventListener('mouseleave', () => {
|
15078
|
+
this.close();
|
15079
|
+
});
|
15080
|
+
}
|
15081
|
+
},
|
15082
|
+
},
|
15083
|
+
{
|
15084
|
+
eventName: 'click',
|
15085
|
+
callback: (ev) => ev.stopPropagation(),
|
15086
|
+
},
|
15087
|
+
];
|
15088
|
+
break;
|
15089
|
+
case 'click':
|
15090
|
+
default:
|
15091
|
+
triggerCallbacks = [
|
15092
|
+
{
|
15093
|
+
eventName: 'mousedown',
|
15094
|
+
callback: e => {
|
15095
|
+
if (this.preventBlur) {
|
15096
|
+
e.preventDefault();
|
15097
|
+
}
|
15098
|
+
this.present();
|
15099
|
+
},
|
15100
|
+
},
|
15101
|
+
];
|
15102
|
+
break;
|
15103
|
+
}
|
15104
|
+
triggerCallbacks.forEach(({ eventName, callback }) => this.triggerEl.addEventListener(eventName, callback));
|
15105
|
+
this.destroyTriggerInteraction = () => {
|
15106
|
+
triggerCallbacks.forEach(({ eventName, callback }) => this.triggerEl.removeEventListener(eventName, callback));
|
15107
|
+
};
|
15108
|
+
};
|
15109
|
+
this.setPosition = () => {
|
15110
|
+
var _a;
|
15111
|
+
const anchorEl = (_a = this.anchorEl) !== null && _a !== void 0 ? _a : this.triggerEl;
|
15112
|
+
if (Boolean(anchorEl)) {
|
15113
|
+
const windowWidth = window.innerWidth;
|
15114
|
+
const windowHeight = window.innerHeight;
|
15115
|
+
const elWidth = this.el.clientWidth;
|
15116
|
+
const elHeight = this.el.clientHeight;
|
15117
|
+
const { top, left, height, width } = anchorEl.getBoundingClientRect();
|
15118
|
+
switch (this.anchorOriginHorizontal) {
|
15119
|
+
case 'left': {
|
15120
|
+
this.positionX = left;
|
15121
|
+
break;
|
15122
|
+
}
|
15123
|
+
case 'center': {
|
15124
|
+
this.positionX = left + width / 2;
|
15125
|
+
break;
|
15126
|
+
}
|
15127
|
+
case 'right': {
|
15128
|
+
this.positionX = left + width;
|
15129
|
+
break;
|
15130
|
+
}
|
15131
|
+
}
|
15132
|
+
switch (this.anchorOriginVertical) {
|
15133
|
+
case 'top': {
|
15134
|
+
this.positionY = top;
|
15135
|
+
break;
|
15136
|
+
}
|
15137
|
+
case 'center': {
|
15138
|
+
this.positionY = top + height / 2;
|
15139
|
+
break;
|
15140
|
+
}
|
15141
|
+
case 'bottom': {
|
15142
|
+
this.positionY = top + height;
|
15143
|
+
break;
|
15144
|
+
}
|
15145
|
+
}
|
15146
|
+
if (this.positionY < this.windowPadding) {
|
15147
|
+
this.positionY = this.windowPadding;
|
15148
|
+
}
|
15149
|
+
if (this.positionY + elHeight > windowHeight - 16) {
|
15150
|
+
this.positionY = windowHeight - this.windowPadding - elHeight;
|
15151
|
+
}
|
15152
|
+
if (this.positionX < this.windowPadding) {
|
15153
|
+
this.positionX = this.windowPadding;
|
15154
|
+
}
|
15155
|
+
if (this.positionX + elWidth > windowWidth - 16) {
|
15156
|
+
this.positionX = windowWidth - this.windowPadding - elWidth;
|
15157
|
+
}
|
15158
|
+
}
|
15159
|
+
};
|
15160
|
+
this.handleClickOutside = (event) => {
|
15161
|
+
if (!this.triggerClicked && this.triggerEl.contains(event.target)) {
|
15162
|
+
this.triggerClicked = true;
|
15163
|
+
return;
|
15164
|
+
}
|
15165
|
+
if (this.open && !this.el.contains(event.target)) {
|
15166
|
+
event.preventDefault();
|
15167
|
+
this.close();
|
15168
|
+
}
|
15169
|
+
};
|
15170
|
+
this.present = () => {
|
15171
|
+
if (!this.open && !this.disabled) {
|
15172
|
+
this.open = true;
|
15173
|
+
this.cpslOpen.emit();
|
15174
|
+
this.setPosition();
|
15175
|
+
}
|
15176
|
+
};
|
15177
|
+
this.close = () => {
|
15178
|
+
this.open = false;
|
15179
|
+
this.triggerClicked = false;
|
15180
|
+
this.cpslClose.emit();
|
15181
|
+
};
|
15182
|
+
this.open = false;
|
15183
|
+
this.positionX = undefined;
|
15184
|
+
this.positionY = undefined;
|
15185
|
+
this.anchorEl = undefined;
|
15186
|
+
this.anchorOriginHorizontal = 'left';
|
15187
|
+
this.anchorOriginVertical = 'bottom';
|
15188
|
+
this.autoWidth = true;
|
15189
|
+
this.disabled = undefined;
|
15190
|
+
this.preventBlur = undefined;
|
15191
|
+
this.transformOriginHorizontal = 'left';
|
15192
|
+
this.transformOriginVertical = 'top';
|
15193
|
+
this.triggerAction = 'click';
|
15194
|
+
this.trigger = undefined;
|
15195
|
+
this.windowPadding = 16;
|
15196
|
+
}
|
15197
|
+
closePopover() {
|
15198
|
+
return __awaiter(this, void 0, void 0, function* () {
|
15199
|
+
this.close();
|
15200
|
+
});
|
15201
|
+
}
|
15202
|
+
onTriggerChange() {
|
15203
|
+
this.configureTriggerInteraction();
|
15204
|
+
}
|
15205
|
+
onAnchorChange() {
|
15206
|
+
this.setPosition();
|
15207
|
+
}
|
15208
|
+
onOpenChange() {
|
15209
|
+
if (this.open) {
|
15210
|
+
window.addEventListener('click', this.handleClickOutside);
|
15211
|
+
window.addEventListener('scroll', () => this.setPosition(), true);
|
15212
|
+
}
|
15213
|
+
else {
|
15214
|
+
window.removeEventListener('click', this.handleClickOutside);
|
15215
|
+
window.addEventListener('scroll', () => this.setPosition());
|
15216
|
+
}
|
15217
|
+
}
|
15218
|
+
componentDidLoad() {
|
15219
|
+
this.configureTriggerInteraction();
|
15220
|
+
}
|
15221
|
+
get containerEl() {
|
15222
|
+
var _a, _b;
|
15223
|
+
return (_b = (_a = this.el) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.getElementById('container');
|
15224
|
+
}
|
15225
|
+
render() {
|
15226
|
+
var _a;
|
15227
|
+
return (index.h(index.Host, { key: '0932bff390ad54961067dcae19e121dc2ed701a0', class: {
|
15228
|
+
'open': this.open,
|
15229
|
+
'transform-h-left': this.transformOriginHorizontal === 'left',
|
15230
|
+
'transform-h-center': this.transformOriginHorizontal === 'center',
|
15231
|
+
'transform-h-right': this.transformOriginHorizontal === 'right',
|
15232
|
+
'transform-v-top': this.transformOriginVertical === 'top',
|
15233
|
+
'transform-v-center': this.transformOriginVertical === 'center',
|
15234
|
+
'transform-v-bottom': this.transformOriginVertical === 'bottom',
|
15235
|
+
}, style: { top: `${this.positionY}px`, left: `${this.positionX}px`, width: this.autoWidth ? 'auto' : `${(_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.clientWidth}px` } }, index.h("div", { key: 'a320096955a8ba71b14f8620fbe69eed66b4dc5d', id: "container", class: { container: true, open: this.open } }, index.h("slot", { key: '745bbee183c48bdbe079d7219690c556e9a9b442' }))));
|
15236
|
+
}
|
15237
|
+
get el() { return index.getElement(this); }
|
15238
|
+
static get watchers() { return {
|
15239
|
+
"trigger": ["onTriggerChange"],
|
15240
|
+
"triggerAction": ["onTriggerChange"],
|
15241
|
+
"preventBlur": ["onTriggerChange"],
|
15242
|
+
"anchorOriginHorizontal": ["onAnchorChange"],
|
15243
|
+
"anchorOriginVertical": ["onAnchorChange"],
|
15244
|
+
"open": ["onOpenChange"]
|
15245
|
+
}; }
|
15246
|
+
};
|
15247
|
+
CpslPopover.style = CpslPopoverStyle0;
|
15248
|
+
|
15249
|
+
const cpslProgressIndicatorCss = ":host{--step-height:3px;--step-active-color:var(--cpsl-color-progressIndicator-active);--step-next-color:var(--cpsl-color-progressIndicator-next);--step-previous-color:var(--cpsl-color-progressIndicator-previous);display:flex;align-items:center;justify-content:center;gap:4px}.step{background:var(--step-next-color);border-radius:var(--step-border-radius, calc(var(--step-height) * 2));height:var(--step-height);flex:1;transition:all 0.5s}.previous{background:var(--step-previous-color)}.active{background:var(--step-active-color);flex:2}";
|
14822
15250
|
const CpslProgressIndicatorStyle0 = cpslProgressIndicatorCss;
|
14823
15251
|
|
14824
15252
|
const CpslProgressIndicator = class {
|
@@ -14852,7 +15280,7 @@ var qrCodeStyling = {exports: {}};
|
|
14852
15280
|
|
14853
15281
|
const QRCodeStyling = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(qrCodeStyling.exports);
|
14854
15282
|
|
14855
|
-
const cpslQrCodeCss = ":host{--qr-color:var(--cpsl-color-qr-fill);--qr-background-color:var(--cpsl-color-qr-background);--qr-border-color:var(--cpsl-color-qr-border);--qr-border-radius:var(--cpsl-border-radius-qr-code);--qr-border-width:1px;--qr-box-shadow:0px 1px 2px var(--cpsl-color-alpha-black-10);display:inline-block}.qr-container{-webkit-padding-start:var(--qr-padding-start);padding-inline-start:var(--qr-padding-start);-webkit-padding-end:var(--qr-padding-end);padding-inline-end:var(--qr-padding-end);padding-top:var(--qr-padding-top);padding-bottom:var(--qr-padding-bottom);display:flex;color:var(--qr-color);border-style:solid;border-width:var(--qr-border-width);border-color:var(--qr-border-color);border-radius:var(--qr-border-radius);background
|
15283
|
+
const cpslQrCodeCss = ":host{--qr-color:var(--cpsl-color-qr-fill);--qr-background-color:var(--cpsl-color-qr-background);--qr-border-color:var(--cpsl-color-qr-border);--qr-border-radius:var(--cpsl-border-radius-qr-code);--qr-border-width:1px;--qr-box-shadow:0px 1px 2px var(--cpsl-color-alpha-black-10);display:inline-block}.qr-container{-webkit-padding-start:var(--qr-padding-start);padding-inline-start:var(--qr-padding-start);-webkit-padding-end:var(--qr-padding-end);padding-inline-end:var(--qr-padding-end);padding-top:var(--qr-padding-top);padding-bottom:var(--qr-padding-bottom);display:flex;color:var(--qr-color);border-style:solid;border-width:var(--qr-border-width);border-color:var(--qr-border-color);border-radius:var(--qr-border-radius);background:var(--qr-background-color);box-shadow:var(--qr-box-shadow)}";
|
14856
15284
|
const CpslQrCodeStyle0 = cpslQrCodeCss;
|
14857
15285
|
|
14858
15286
|
const CpslQrCode = class {
|
@@ -14888,13 +15316,13 @@ const CpslQrCode = class {
|
|
14888
15316
|
qrCode.append(container);
|
14889
15317
|
}
|
14890
15318
|
render() {
|
14891
|
-
return (index.h(index.Host, { key: '
|
15319
|
+
return (index.h(index.Host, { key: '7f549a58192515bbb5a8b42948f042e7b4eaf271' }, index.h("div", { key: '4464496f4e8236abcdbde9e6e0f20f2e04b5b392', id: "qr-container", class: "qr-container" })));
|
14892
15320
|
}
|
14893
15321
|
get el() { return index.getElement(this); }
|
14894
15322
|
};
|
14895
15323
|
CpslQrCode.style = CpslQrCodeStyle0;
|
14896
15324
|
|
14897
|
-
const cpslRadioCss = ":host{--container-height:20px;--container-width:20px;--container-border-radius:var(--cpsl-border-radius-radio);--container-border-width-default:2px;--container-border-width-checked:5px;--container-background-color-default:var(--cpsl-color-radio-surface-default);--container-border-color-default:var(--cpsl-color-radio-border-default);--container-background-color-checked:var(--cpsl-color-radio-surface-checked);--container-border-color-checked:var(--cpsl-color-radio-border-checked);display:block;position:relative;height:var(--container-height);width:var(--container-width);cursor:pointer}input{position:absolute;width:100%;height:100%;margin:0px;opacity:0}span.container{display:inline-block;position:relative;box-sizing:border-box;width:100%;height:100%;border-radius:var(--container-border-radius);border:var(--container-border-width-default) solid;background
|
15325
|
+
const cpslRadioCss = ":host{--container-height:20px;--container-width:20px;--container-border-radius:var(--cpsl-border-radius-radio);--container-border-width-default:2px;--container-border-width-checked:5px;--container-background-color-default:var(--cpsl-color-radio-surface-default);--container-border-color-default:var(--cpsl-color-radio-border-default);--container-background-color-checked:var(--cpsl-color-radio-surface-checked);--container-border-color-checked:var(--cpsl-color-radio-border-checked);display:block;position:relative;height:var(--container-height);width:var(--container-width);cursor:pointer}input{position:absolute;width:100%;height:100%;margin:0px;opacity:0}span.container{display:inline-block;position:relative;box-sizing:border-box;width:100%;height:100%;border-radius:var(--container-border-radius);border:var(--container-border-width-default) solid;background:var(--container-background-color-default);border-color:var(--container-border-color-default);transition:all 0.15s ease-in-out}span.container.checked{background:var(--container-background-color-checked);border-color:var(--container-border-color-checked);border-width:var(--container-border-width-checked)}";
|
14898
15326
|
const CpslRadioStyle0 = cpslRadioCss;
|
14899
15327
|
|
14900
15328
|
const CpslRadio = class {
|
@@ -14909,12 +15337,132 @@ const CpslRadio = class {
|
|
14909
15337
|
this.checked = undefined;
|
14910
15338
|
}
|
14911
15339
|
render() {
|
14912
|
-
return (index.h(index.Host, { key: '
|
15340
|
+
return (index.h(index.Host, { key: '15b4fdf30799927941280b3f11f4611e4e4d27b2' }, index.h("input", { key: 'd5bf9704061977610d98b99a6188933f720ffce3', type: "radio", checked: this.checked }), index.h("span", { key: 'd56242703448531efc847167b55013b420f17715', onClick: this.handleRadioClick, class: { container: true, checked: this.checked } })));
|
14913
15341
|
}
|
14914
15342
|
};
|
14915
15343
|
CpslRadio.style = CpslRadioStyle0;
|
14916
15344
|
|
14917
|
-
const
|
15345
|
+
const cpslSelectCss = ":host{--container-box-shadow:none;--container-box-shadow-color:var(--cpsl-color-select-border-placeholder);--container-border-color:var(--cpsl-color-select-border-active);--container-border-error-color:var(--cpsl-color-select-border-error);--container-background-color:var(--cpsl-color-select-surface-default);--container-background-color-disabled:var(--cpsl-color-select-surface-disabled);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-select);--container-padding-top:0px;--container-padding-bottom:0px;--container-padding-end:12px;--container-padding-start:12px;--container-height:48px;--container-gap:8px;--dropdown-margin-top:4px;--dropdown-border-width:1px;--dropdown-border-radius:var(--cpsl-border-radius-select);--dropdown-border-color:var(--cpsl-color-select-dropdown-border);--optional-label-color:var(--cpsl-color-text-secondary);--label-color:var(--cpsl-color-text-primary);--label-font-size:var(--cpsl-font-size-body-s);--label-margin-bottom:0px;--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:var(--cpsl-font-size-body-xs);--helper-text-margin-top:0px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}input{box-sizing:border-box;position:absolute;width:100%;height:100%;margin:0px;opacity:0;top:0;left:0;z-index:-1;cursor:pointer}input.disabled{cursor:default}:host(:not(.has-value)){--container-border-color:var(--cpsl-color-select-border-placeholder);--select-color:var(--cpsl-color-text-secondary)}:host(.disabled){--container-background-color:var(--container-background-color-disabled);--select-background-color:var(--select-background-color-disabled);--select-color:var(--cpsl-color-text-disabled)}:host(.focused){--container-box-shadow:0px 0px 0px 2px var(--container-box-shadow-color);--container-border-color:var(--cpsl-color-select-border-active);--container-background-color:var(--cpsl-color-select-surface-default)}.select-container{-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:var(--container-height);gap:var(--container-gap);cursor:pointer;border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);border-radius:var(--container-border-radius);background:var(--container-background-color);box-shadow:var(--container-box-shadow)}.error-container{border-color:var(--container-border-error-color)}.label{display:inline-block;color:var(--label-color);font-size:var(--label-font-size);font-weight:500;margin-bottom:var(--label-margin-bottom)}.optional-label{display:inline-block;color:var(--optional-label-color);font-size:var(--label-font-size);font-weight:500}.helper-text-container{display:flex;align-items:center;gap:4px;color:var(--helper-text-color);font-size:var(--helper-text-font-size);font-weight:500;margin-top:var(--helper-text-margin-top)}.helper-text-container cpsl-icon{--height:var(--helper-text-icon-size);--width:var(--helper-text-icon-size);--icon-color:var(--helper-text-icon-color)}.error-text{color:var(--helper-text-error-color)}.error-text cpsl-icon{--icon-color:var(--helper-text-icon-error-color)}.selected-container-content{flex:1}.chevron{transition:transform 0.3s ease;transform:rotate(180deg);--icon-color:var(--cpsl-color-text-disabled)}.chevron.open{transform:rotate(0deg);--icon-color:var(--cpsl-color-text-primary)}.chevron.has-value{--icon-color:var(--cpsl-color-text-primary)}.selected-text{color:var(--cpsl-color-text-primary)}.selected-text.placeholder{color:var(--cpsl-color-text-disabled)}.dropdown{margin-top:var(--dropdown-margin-top);border-style:solid;border-width:var(--dropdown-border-width);border-color:var(--dropdown-border-color);border-radius:var(--dropdown-border-radius);overflow:hidden}.dropdown ::slotted(*:last-child){--container-border-width:0px}.dropdown-inner{overflow:auto;scrollbar-width:thin}";
|
15346
|
+
const CpslSelectStyle0 = cpslSelectCss;
|
15347
|
+
|
15348
|
+
const CpslSelect = class {
|
15349
|
+
constructor(hostRef) {
|
15350
|
+
index.registerInstance(this, hostRef);
|
15351
|
+
this.cpslBlur = index.createEvent(this, "cpslBlur", 7);
|
15352
|
+
this.cpslFocus = index.createEvent(this, "cpslFocus", 7);
|
15353
|
+
this.cpslSelectValueChange = index.createEvent(this, "cpslSelectValueChange", 7);
|
15354
|
+
this.inputId = `cpsl-select-${inputIds++}`;
|
15355
|
+
this.onBlur = (ev) => {
|
15356
|
+
this.hasFocus = false;
|
15357
|
+
this.popoverEl.closePopover();
|
15358
|
+
this.cpslBlur.emit(ev);
|
15359
|
+
};
|
15360
|
+
this.onFocus = (ev) => {
|
15361
|
+
this.hasFocus = true;
|
15362
|
+
this.cpslFocus.emit(ev);
|
15363
|
+
};
|
15364
|
+
this.handleEnterPress = (ev) => {
|
15365
|
+
if (ev.key === 'Enter') {
|
15366
|
+
ev.preventDefault();
|
15367
|
+
this.el.dispatchEvent(new MouseEvent('mousedown'));
|
15368
|
+
}
|
15369
|
+
};
|
15370
|
+
this.selectItem = () => {
|
15371
|
+
const items = Array.from(this.el.querySelectorAll('cpsl-select-item'));
|
15372
|
+
items.forEach(item => {
|
15373
|
+
if (item.value === this.selectedValue) {
|
15374
|
+
item.setAttribute('selected', 'true');
|
15375
|
+
this.hasSelectedItem = true;
|
15376
|
+
}
|
15377
|
+
else {
|
15378
|
+
item.setAttribute('selected', 'false');
|
15379
|
+
}
|
15380
|
+
});
|
15381
|
+
if (!Boolean(this.selectedValue)) {
|
15382
|
+
this.hasSelectedItem = false;
|
15383
|
+
}
|
15384
|
+
};
|
15385
|
+
this.handleClickOutside = (event) => {
|
15386
|
+
if (this.hasFocus && !this.el.contains(event.target)) {
|
15387
|
+
this.hasFocus = false;
|
15388
|
+
window.removeEventListener('click', this.handleClickOutside);
|
15389
|
+
}
|
15390
|
+
};
|
15391
|
+
this.handleClick = () => {
|
15392
|
+
if (!this.disabled) {
|
15393
|
+
this.hasFocus = true;
|
15394
|
+
window.addEventListener('click', this.handleClickOutside);
|
15395
|
+
}
|
15396
|
+
};
|
15397
|
+
this.anchorEl = undefined;
|
15398
|
+
this.hasFocus = false;
|
15399
|
+
this.popoverOpen = false;
|
15400
|
+
this.hasSelectedItem = false;
|
15401
|
+
this.disabled = false;
|
15402
|
+
this.dropdownMaxHeight = undefined;
|
15403
|
+
this.errorText = undefined;
|
15404
|
+
this.formatValue = undefined;
|
15405
|
+
this.helperText = undefined;
|
15406
|
+
this.id = `${this.inputId}-trigger`;
|
15407
|
+
this.label = undefined;
|
15408
|
+
this.placeholder = undefined;
|
15409
|
+
this.required = false;
|
15410
|
+
this.selectedValue = undefined;
|
15411
|
+
this.showFormattedSelectedItem = undefined;
|
15412
|
+
this.showOptionalLabel = false;
|
15413
|
+
}
|
15414
|
+
onValueChange() {
|
15415
|
+
this.popoverEl.closePopover();
|
15416
|
+
}
|
15417
|
+
handleValueChange() {
|
15418
|
+
this.selectItem();
|
15419
|
+
}
|
15420
|
+
selectItemClickHandler(event) {
|
15421
|
+
this.cpslSelectValueChange.emit(event.detail);
|
15422
|
+
}
|
15423
|
+
onPopoverOpen() {
|
15424
|
+
this.popoverOpen = true;
|
15425
|
+
}
|
15426
|
+
onPopoverClose() {
|
15427
|
+
this.popoverOpen = false;
|
15428
|
+
}
|
15429
|
+
componentDidLoad() {
|
15430
|
+
this.popoverEl = this.el.shadowRoot.querySelector(`cpsl-popover`);
|
15431
|
+
this.anchorEl = this.el.shadowRoot.getElementById('select-container');
|
15432
|
+
this.selectItem();
|
15433
|
+
}
|
15434
|
+
render() {
|
15435
|
+
var _a, _b, _c, _d;
|
15436
|
+
return (index.h(index.Host, { key: '96b15a986afbf40228adfb0ddfb5934ea79a9df0', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) } }, this.label && (index.h("label", { class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? index.h("span", { class: "optional-label" }, "(optional)") : '')), index.h("div", { key: 'b43bb6ef5670aff411a82391c5695f8840412f85', id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && index.h("slot", { name: "selected-item" }), index.h("div", { key: 'fa5654cfbeb30c963fd918599c4fc304e9d894c5', class: "selected-container-content", id: "selected-container-content" }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (index.h("cpsl-text", { class: { 'selected-text': true, 'placeholder': !Boolean(this.selectedValue) } }, !Boolean(this.selectedValue) ? (_a = this.placeholder) !== null && _a !== void 0 ? _a : 'Select' : (_c = (_b = this.formatValue) === null || _b === void 0 ? void 0 : _b.call(this, this.selectedValue)) !== null && _c !== void 0 ? _c : this.selectedValue))), index.h("cpsl-icon", { key: '063de47032a31e2c7d114467cc4eaedfcf8d59a8', class: { 'chevron': true, 'open': this.popoverOpen, 'has-value': Boolean(this.selectedValue) }, icon: "chevronUp" }), index.h("input", { key: '760922353c0971b766d80ac45430ebc806833a9a', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" })), (this.errorText || this.helperText) && (index.h("div", { class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, index.h("span", null, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText))), index.h("cpsl-popover", { key: 'fcbf94fcc199d5415dc62faa3b7a0280f16418fa', autoWidth: false, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, index.h("div", { key: '95aa9ce659bf279c502b0f8b6e068765a1f29d5d', class: "dropdown" }, index.h("div", { key: '4b83c05b33d370d9ce8fa7450b11b24c75ddb025', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, index.h("slot", { key: 'a94a087322953b56c4b9e488b5e23ab6f020d37f', name: "items" }))))));
|
15437
|
+
}
|
15438
|
+
get el() { return index.getElement(this); }
|
15439
|
+
static get watchers() { return {
|
15440
|
+
"selectedValue": ["onValueChange", "handleValueChange"]
|
15441
|
+
}; }
|
15442
|
+
};
|
15443
|
+
let inputIds = 0;
|
15444
|
+
CpslSelect.style = CpslSelectStyle0;
|
15445
|
+
|
15446
|
+
const cpslSelectItemCss = ":host{--outer-container-padding-start:8px;--outer-container-padding-end:8px;--outer-container-padding-top:8px;--outer-container-padding-bottom:8px;--container-background-color:var(--cpsl-color-select-surface-default);--container-hover-background-color:var(--cpsl-color-select-surface-hover);--container-border-radius:calc(var(--cpsl-border-radius-select) - 4px);--container-padding-start:8px;--container-padding-end:8px;--container-padding-top:8px;--container-padding-bottom:8px;display:block;font-family:var(--cpsl-font-family, inherit);cursor:pointer}.inner-container{-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);background-color:var(--container-background-color);border-radius:var(--container-border-radius);height:100%;display:flex;align-items:center}.outer-container{-webkit-padding-start:var(--outer-container-padding-start);padding-inline-start:var(--outer-container-padding-start);-webkit-padding-end:var(--outer-container-padding-end);padding-inline-end:var(--outer-container-padding-end);padding-top:var(--outer-container-padding-top);padding-bottom:var(--outer-container-padding-bottom);background-color:var(--container-background-color)}.outer-container:hover>.inner-container{background-color:var(--container-hover-background-color)}.selected{background-color:var(--container-hover-background-color)}:host(.in-select-box){--container-background-color:transparent;--container-hover-background-color:transparent;--container-border-width:0px;--container-padding-start:0px;--container-padding-end:0px;--container-padding-top:0px;--container-padding-bottom:0px;flex:1;height:100%}";
|
15447
|
+
const CpslSelectItemStyle0 = cpslSelectItemCss;
|
15448
|
+
|
15449
|
+
const CpslSelectItem = class {
|
15450
|
+
constructor(hostRef) {
|
15451
|
+
index.registerInstance(this, hostRef);
|
15452
|
+
this.cpslSelectItemClick = index.createEvent(this, "cpslSelectItemClick", 7);
|
15453
|
+
this.handleItemClick = () => {
|
15454
|
+
this.cpslSelectItemClick.emit(this.value);
|
15455
|
+
};
|
15456
|
+
this.selected = undefined;
|
15457
|
+
this.value = undefined;
|
15458
|
+
}
|
15459
|
+
render() {
|
15460
|
+
return (index.h(index.Host, { key: '5841f3aa3d70c17dcdfc8b1e0517ac822667ec87' }, index.h("div", { key: 'cbac6744fdce3f011765f0588f51fe89112239ad', class: "outer-container", onClick: this.handleItemClick }, index.h("div", { key: '30aee519e6dfd394a01d7ff9c503752cff1c7d64', class: { 'inner-container': true, 'selected': this.selected } }, index.h("slot", { key: '9458a0da2d73be3de5703c0dde0b6208cdd8a196' })))));
|
15461
|
+
}
|
15462
|
+
};
|
15463
|
+
CpslSelectItem.style = CpslSelectItemStyle0;
|
15464
|
+
|
15465
|
+
const cpslSlideButtonCss = ":host{--slider-container-font-size:14px;--slider-container-height:44px;--slider-container-border-width:1px;--slider-container-box-shadow:0px 0px 4px 0px var(--cpsl-color-alpha-black-10) inset;--slider-container-start-background-color:var(--cpsl-color-slideButton-slider-container-start-background);--slider-container-end-background-color:var(--cpsl-color-slideButton-slider-container-end-background);--slider-container-start-border-color:var(--cpsl-color-slideButton-slider-container-start-border);--slider-container-end-border-color:var(--cpsl-color-slideButton-slider-container-end-border);--slider-border-width:1px;--slider-box-shadow:3px 0px 4px 0px var(--cpsl-color-alpha-black-16);--slider-border-color:var(--cpsl-color-slideButton-slider-border);--slider-background-color:var(--cpsl-color-slideButton-slider-background);--slider-color:var(--cpsl-color-slideButton-slider-text);--start-text-color:var(--cpsl-color-slideButton-start-text);--end-text-color:var(--cpsl-color-slideButton-end-text);font-family:var(--cpsl-font-family, inherit);display:block}.slider-container{overflow:hidden;position:relative;box-sizing:border-box;display:flex;align-items:center;font-size:var(--slider-container-font-size);font-weight:500;height:var(--slider-container-height);border-width:var(--slider-container-border-width);border-style:solid;border-radius:calc(var(--slider-container-height) / 2);box-shadow:var(--slider-container-box-shadow)}.slider-container-background{position:absolute;top:0;bottom:0;left:0;right:0}.start-slider-container-background{background:var(--slider-container-start-background-color);border-color:var(--slider-container-start-border-color);opacity:100%}.end-slider-container-background{background:var(--slider-container-end-background-color);border-color:var(--slider-container-end-border-color);opacity:0%}.start-text{user-select:none;color:var(--start-text-color);position:absolute;text-align:center;opacity:100%;width:calc(100% - var(--slider-container-height) - 8px - 16px);left:calc(var(--slider-container-height) - 4px + 8px)}.start-text.disabled{left:0;width:100%}.end-text{user-select:none;color:var(--end-text-color);position:absolute;text-align:center;opacity:0%;width:calc(100% - var(--slider-container-height) - 8px);left:16px}.icon{position:absolute}.start-icon{opacity:100%}.end-icon{opacity:0%}.slider{left:1px;cursor:pointer;box-sizing:border-box;display:flex;align-items:center;justify-content:center;position:absolute;z-index:10;height:calc(var(--slider-container-height) - 4px);width:calc(var(--slider-container-height) - 4px);color:var(--slider-color);background:var(--slider-background-color);border-width:var(--slider-border-width);border-style:solid;border-color:var(--slider-border-color);border-radius:100%;box-shadow:var(--slider-box-shadow)}.slider cpsl-icon{--icon-color:var(--slider-color)}.slider.disabled{visibility:hidden}";
|
14918
15466
|
const CpslSlideButtonStyle0 = cpslSlideButtonCss;
|
14919
15467
|
|
14920
15468
|
const CpslSlideButton = class {
|
@@ -15034,7 +15582,7 @@ const CpslSlideButton = class {
|
|
15034
15582
|
return this.el.shadowRoot.getElementById('end-icon');
|
15035
15583
|
}
|
15036
15584
|
render() {
|
15037
|
-
return (index.h(index.Host, { key: '
|
15585
|
+
return (index.h(index.Host, { key: '0538d1828e3eed534326536946e16b205e34fd96' }, index.h("div", { key: 'dfca014b41bcdb615a0fd8ce6242cf361a0399d7', id: "slider-container", class: "slider-container" }, index.h("div", { key: '8cad818d06a7fcc8b7e5a22b7714a6faf777db16', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), index.h("div", { key: '0692e2b89ba22df7dca29d3b927810492591dd51', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), index.h("div", { key: '865dc1b876daa97033541efeb32779ac07078179', id: "slider", class: { slider: true, disabled: this.disabled } }, index.h("cpsl-icon", { key: '2e5e0049eee016583715ae1a33dff74e36c6a515', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), index.h("cpsl-icon", { key: '6e484c8497bf2e7777ebf93d3af141477d8f82e8', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), index.h("span", { key: 'b7b8064fa212af5802ee21c170133ef0e32ff14c', id: "start-text", class: { 'start-text': true, 'disabled': this.disabled } }, this.startText), index.h("span", { key: 'b42e78a763a983bb17e7d02ed51253982be4546f', id: "end-text", class: "end-text" }, this.endText))));
|
15038
15586
|
}
|
15039
15587
|
get el() { return index.getElement(this); }
|
15040
15588
|
};
|
@@ -15050,18 +15598,18 @@ const CpslSpinner = class {
|
|
15050
15598
|
this.speed = 1;
|
15051
15599
|
}
|
15052
15600
|
render() {
|
15053
|
-
return (index.h(index.Host, { key: '
|
15601
|
+
return (index.h(index.Host, { key: '146fc6a1a8101f6738263e432b49ed6c927d8eb3', style: {
|
15054
15602
|
'height': `${this.size}px`,
|
15055
15603
|
'width': `${this.size}px`,
|
15056
15604
|
'animation': `spin ${this.speed}s linear infinite`,
|
15057
15605
|
'-webkit-animation': `spin ${this.speed}s linear infinite`,
|
15058
15606
|
'-moz-animation': `spin ${this.speed}s linear infinite`,
|
15059
|
-
} }, index.h("svg", { key: '
|
15607
|
+
} }, index.h("svg", { key: '2f7fadd536c94b7919180bcb38a64e54cf8ff073', height: this.size, width: this.size, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 54 54", fill: "none" }, index.h("path", { key: '427351f7b255cbf337f8b1d45272339b3fef873e', d: "M43.1586 17C39.8082 11.5978 33.8243 8 27 8C16.5066 8 8 16.5066 8 27C8 37.4934 16.5066 46 27 46C33.8242 46 39.8082 42.4022 43.1586 37", "stroke-width": "6", "stroke-linecap": "round" }), index.h("circle", { key: '43787fa0376df4defda8a47f5c5c8d01258dde10', cx: "45", cy: "27", r: "5" }))));
|
15060
15608
|
}
|
15061
15609
|
};
|
15062
15610
|
CpslSpinner.style = CpslSpinnerStyle0;
|
15063
15611
|
|
15064
|
-
const cpslSwitchCss = ":host{--container-height:24px;--container-width:44px;--container-padding:2px;--container-border-radius:var(--cpsl-border-radius-switch);--container-background-color-default:var(--cpsl-color-switch-surface-default);--container-background-color-checked:var(--cpsl-color-switch-surface-checked);--thumb-size:calc(var(--container-height) - var(--container-padding) * 2);--thumb-border-radius:var(--cpsl-border-radius-switch);--thumb-background-color-default:var(--cpsl-color-switch-thumb-default);--thumb-background-color-checked:var(--cpsl-color-switch-thumb-checked);display:block;position:relative;height:var(--container-height);width:var(--container-width);cursor:pointer}input{position:absolute;width:100%;height:100%;margin:0px;opacity:0}span.container{display:inline-block;position:relative;box-sizing:border-box;width:100%;height:100%;padding:var(--container-padding);border-radius:var(--container-border-radius);background
|
15612
|
+
const cpslSwitchCss = ":host{--container-height:24px;--container-width:44px;--container-padding:2px;--container-border-radius:var(--cpsl-border-radius-switch);--container-background-color-default:var(--cpsl-color-switch-surface-default);--container-background-color-checked:var(--cpsl-color-switch-surface-checked);--thumb-size:calc(var(--container-height) - var(--container-padding) * 2);--thumb-border-radius:var(--cpsl-border-radius-switch);--thumb-background-color-default:var(--cpsl-color-switch-thumb-default);--thumb-background-color-checked:var(--cpsl-color-switch-thumb-checked);display:block;position:relative;height:var(--container-height);width:var(--container-width);cursor:pointer}input{position:absolute;width:100%;height:100%;margin:0px;opacity:0}span.container{display:inline-block;position:relative;box-sizing:border-box;width:100%;height:100%;padding:var(--container-padding);border-radius:var(--container-border-radius);background:var(--container-background-color-default);box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.08) inset;transition:all 0.15s ease-in-out}span.container.checked{background:var(--container-background-color-checked);box-shadow:none}span.thumb{display:inline-block;position:relative;background:var(--thumb-background-color-default);box-shadow:0px 1px 1px 0px rgba(0, 0, 0, 0.1);height:var(--thumb-size);width:var(--thumb-size);border-radius:var(--thumb-border-radius);transform:translateX(0);left:0;transition:all 0.15s ease-in-out}span.thumb.checked{background:var(--thumb-background-color-checked);left:100%;transform:translateX(-100%)}";
|
15065
15613
|
const CpslSwitchStyle0 = cpslSwitchCss;
|
15066
15614
|
|
15067
15615
|
const CpslSwitch = class {
|
@@ -15074,7 +15622,7 @@ const CpslSwitch = class {
|
|
15074
15622
|
this.checked = undefined;
|
15075
15623
|
}
|
15076
15624
|
render() {
|
15077
|
-
return (index.h(index.Host, { key: '
|
15625
|
+
return (index.h(index.Host, { key: '5757a05c5149c8fb785bcb796d7c110f4725bbfa' }, index.h("input", { key: 'fdbbc3cdac8674bc3bbcf5563302a763d3678905', type: "checkbox", checked: this.checked }), index.h("span", { key: '471c0ae137ad553c6b7186a08722e156959ed3cc', onClick: this.handleSwitchClick, class: { container: true, checked: this.checked } }, index.h("span", { key: '53bbfd9b807c36bc49130ad71611d274757b5fb1', class: { thumb: true, checked: this.checked } }))));
|
15078
15626
|
}
|
15079
15627
|
};
|
15080
15628
|
CpslSwitch.style = CpslSwitchStyle0;
|
@@ -15106,20 +15654,42 @@ const CpslTab = class {
|
|
15106
15654
|
}
|
15107
15655
|
}
|
15108
15656
|
render() {
|
15109
|
-
return (index.h(index.Host, { key: '
|
15657
|
+
return (index.h(index.Host, { key: 'b899e8122b57fdf859c43d9cf9ade27af3bf5c5f', onClick: this.onTabClicked }, index.h("div", { key: 'f96ead5f65606af3fe63c708af511adfb022f386', class: { 'tab-container': true } }, index.h("slot", { key: '780d6deda346635aaced9c3dfa875b44ffece7eb' }))));
|
15110
15658
|
}
|
15111
15659
|
get el() { return index.getElement(this); }
|
15112
15660
|
};
|
15113
15661
|
CpslTab.style = CpslTabStyle0;
|
15114
15662
|
|
15115
|
-
const cpslTableCss = ":host{--container-
|
15663
|
+
const cpslTableCss = ":host{--container-border-radius:var(--cpsl-border-radius-table-container);--container-border-color:var(--cpsl-color-background-16);--container-background-color:var(--cpsl-color-background-0);--container-border-width:1px;--container-header-padding-top:24px;--container-header-padding-bottom:24px;--container-header-padding-start:24px;--container-header-padding-end:24px;--container-header-border-width:1px;--container-header-border-color:var(--cpsl-color-background-16);--container-footer-padding-top:16px;--container-footer-padding-bottom:16px;--container-footer-padding-start:24px;--container-footer-padding-end:24px;--container-footer-border-width:1px;--container-footer-border-color:var(--cpsl-color-background-8);--table-header-padding-top:16px;--table-header-padding-bottom:16px;--table-header-padding-start:24px;--table-header-padding-end:24px;--table-header-background-color:var(--cpsl-color-background-4);--table-header-border-color:var(--cpsl-color-background-16);--table-header-border-width:1px;--table-content-padding-top:16px;--table-content-padding-bottom:16px;--table-content-padding-start:24px;--table-content-padding-end:24px;--table-content-border-color:var(--cpsl-color-background-8);--table-content-border-width:1px;display:block}:host cpsl-card{height:100%;--card-padding-top:0px;--card-padding-bottom:0px;--card-padding-start:0px;--card-padding-end:0px;--card-border-width:var(--container-border-width);--card-border-color:var(--container-border-color);--card-border-radius:var(--container-border-radius);--card-background-color:var(--container-background-color)}:host cpsl-card::part(card-container){height:100%;display:flex;flex-direction:column}.content{flex:1;overflow:auto;position:relative}.overlay{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.overlay.horizontal-scroll:not(.vertical-scroll){box-shadow:-24px 0px 24px -24px rgba(0, 0, 0, 0.1) inset}.overlay.vertical-scroll:not(.horizontal-scroll){box-shadow:0px -24px 24px -24px rgba(0, 0, 0, 0.1) inset}.overlay.horizontal-scroll.vertical-scroll{box-shadow:-24px -24px 24px -24px rgba(0, 0, 0, 0.1) inset}.table-wrapper{overflow:auto;height:100%}.container-header{display:none;-webkit-padding-start:var(--container-header-padding-start);padding-inline-start:var(--container-header-padding-start);-webkit-padding-end:var(--container-header-padding-end);padding-inline-end:var(--container-header-padding-end);padding-top:var(--container-header-padding-top);padding-bottom:var(--container-header-padding-bottom);border-bottom:var(--container-header-border-width) solid var(--container-header-border-color)}.container-footer{display:none;-webkit-padding-start:var(--container-footer-padding-start);padding-inline-start:var(--container-footer-padding-start);-webkit-padding-end:var(--container-footer-padding-end);padding-inline-end:var(--container-footer-padding-end);padding-top:var(--container-footer-padding-top);padding-bottom:var(--container-footer-padding-bottom);border-top:var(--container-footer-border-width) solid var(--container-footer-border-color)}.shown{display:block}";
|
15116
15664
|
const CpslTableStyle0 = cpslTableCss;
|
15117
15665
|
|
15118
15666
|
const CpslTable = class {
|
15119
15667
|
constructor(hostRef) {
|
15120
15668
|
index.registerInstance(this, hostRef);
|
15121
|
-
this.
|
15122
|
-
|
15669
|
+
this.resizeOb = new ResizeObserver(entries => {
|
15670
|
+
const rect = entries[0].contentRect;
|
15671
|
+
const containerWidth = Math.round(rect.width);
|
15672
|
+
const containerHeight = Math.round(rect.height);
|
15673
|
+
const contentWidth = this.containerSlotEl.clientWidth;
|
15674
|
+
const contentHeight = this.containerSlotEl.clientHeight;
|
15675
|
+
if (contentWidth > containerWidth) {
|
15676
|
+
this.hasHorizontalScroll = true;
|
15677
|
+
}
|
15678
|
+
else {
|
15679
|
+
this.hasHorizontalScroll = false;
|
15680
|
+
}
|
15681
|
+
if (contentHeight > containerHeight) {
|
15682
|
+
this.hasVerticalScroll = true;
|
15683
|
+
}
|
15684
|
+
else {
|
15685
|
+
this.hasVerticalScroll = false;
|
15686
|
+
}
|
15687
|
+
});
|
15688
|
+
this.hasHorizontalScroll = false;
|
15689
|
+
this.hasVerticalScroll = false;
|
15690
|
+
}
|
15691
|
+
componentDidLoad() {
|
15692
|
+
this.resizeOb.observe(this.contentContainerEl);
|
15123
15693
|
}
|
15124
15694
|
get containerHeaderEl() {
|
15125
15695
|
return this.el.querySelector('[slot="header"]');
|
@@ -15127,26 +15697,26 @@ const CpslTable = class {
|
|
15127
15697
|
get containerFooterEl() {
|
15128
15698
|
return this.el.querySelector('[slot="footer"]');
|
15129
15699
|
}
|
15700
|
+
get contentContainerEl() {
|
15701
|
+
return this.el.shadowRoot.getElementById('content-container');
|
15702
|
+
}
|
15703
|
+
get headerEl() {
|
15704
|
+
return this.el.shadowRoot.getElementById('header-container');
|
15705
|
+
}
|
15706
|
+
get containerSlotEl() {
|
15707
|
+
return this.el.querySelector('[slot="content"]');
|
15708
|
+
}
|
15709
|
+
get footerEl() {
|
15710
|
+
return this.el.shadowRoot.getElementById('footer-container');
|
15711
|
+
}
|
15130
15712
|
render() {
|
15131
|
-
|
15132
|
-
return (index.h(index.Host, { key: '8ff024bee3c372cff775b8ecc68be3ee884eae3f' }, index.h("div", { key: 'cea1971fa6faf622f72a6ec103bcd6c6df81a457', class: "table-container", part: "table-container" }, index.h("div", { key: '191fbeab85091a081e6bacc76ea3a8f52e342c0d', class: { 'container-header': true, 'shown': Boolean(this.containerHeaderEl) } }, index.h("slot", { key: 'caf8cb186cb311b7db83f65e8bad15ee9ecf8cb8', name: "header" })), index.h("div", { key: 'b0d534df26ab4784fa89e8b1e6b74b6ea973b203', class: "table-wrapper", part: "table-wrapper" }, Boolean((_a = this.rows) === null || _a === void 0 ? void 0 : _a.length) ? (index.h("table", { class: "table" }, index.h("thead", null, index.h("tr", null, this.columns.map(col => {
|
15133
|
-
var _a;
|
15134
|
-
const align = (_a = col.align) !== null && _a !== void 0 ? _a : 'left';
|
15135
|
-
return (index.h("th", { class: { 'text-center': align === 'center', 'text-right': align === 'right', 'text-left': align === 'left' }, id: col.field, scope: "col" }, index.h("cpsl-text", { variant: "bodyXS", weight: "medium" }, col.headerName)));
|
15136
|
-
}))), index.h("tbody", null, this.rows.map(row => {
|
15137
|
-
return (index.h("tr", { style: { height: Boolean(row.height) ? `${row.height}px` : `80px` } }, this.columns.map(col => {
|
15138
|
-
var _a;
|
15139
|
-
const align = (_a = col.align) !== null && _a !== void 0 ? _a : 'left';
|
15140
|
-
const value = Boolean(col.valueGetter) ? col.valueGetter(row[col.field], row) : row[col.field];
|
15141
|
-
return (index.h("td", { class: { 'text-center': align === 'center', 'text-right': align === 'right', 'text-left': align === 'left' } }, Boolean(col.renderCell) ? (col.renderCell(value, row)) : (index.h("cpsl-text", { variant: "bodyXS", weight: "medium" }, value))));
|
15142
|
-
})));
|
15143
|
-
})))) : (index.h("div", { class: { 'container-no-content': true } }, index.h("slot", { name: "no-content" })))), index.h("div", { key: '5ac2bfcfdebca316cd61b39826772819ccfe5444', class: { 'container-footer': true, 'shown': Boolean(this.containerFooterEl) } }, index.h("slot", { key: 'f2506b2260272276a49ebd98c636064b148bccaa', name: "footer" })))));
|
15713
|
+
return (index.h(index.Host, { key: 'c697e33ff0d764f2a99ea98fbbedbb8b3813fb2d' }, index.h("cpsl-card", { key: 'a1ac41d42ef793cd3d5acd2e7d0468586351b3b4', part: "table-container", style: { position: 'relative' } }, index.h("div", { key: '5dcce6e3711ce9bdee0e890ab697c2452abdf29e', id: "header-container", class: { 'container-header': true, 'shown': Boolean(this.containerHeaderEl) } }, index.h("slot", { key: '6256e32a37806f8f6e1fb62a5bc61f937ee16c19', name: "header" })), index.h("div", { key: 'd151946e88ed755bac82490a237a9336be339abc', id: "content-container", class: { 'content': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll }, part: "content" }, index.h("slot", { key: '2afa462b208482a645e88060b74ef8150e4fc0d0', name: "content" })), this.headerEl && this.contentContainerEl && this.footerEl && (index.h("div", { style: { top: `${this.headerEl.clientHeight + 2}px`, height: `${this.contentContainerEl.clientHeight}px` }, class: { 'overlay': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll } })), index.h("div", { key: '0c8aceeb251955750a45017d5d44eb9be9e2fafc', id: "footer-container", class: { 'container-footer': true, 'shown': Boolean(this.containerFooterEl) } }, index.h("slot", { key: '0e9f35d9f1d50654a1cca75e008a3cc162fb316c', name: "footer" })))));
|
15144
15714
|
}
|
15145
15715
|
get el() { return index.getElement(this); }
|
15146
15716
|
};
|
15147
15717
|
CpslTable.style = CpslTableStyle0;
|
15148
15718
|
|
15149
|
-
const cpslTabsCss = ":host{--tab-top-padding:5px;--tab-bottom-padding:5px;--tab-left-padding:16px;--tab-right-padding:16px;--tabs-border-radius:var(--cpsl-border-radius-tabs);--tabs-font-size:12px;--tabs-line-height:24px;--tabs-border-width:1px;--tabs-border-color:var(--cpsl-color-tabs-border);--tabs-background-color:var(--cpsl-color-tabs-background);--slider-background-color:var(--cpsl-color-tabs-slider-background);display:inline-block;max-width:100%;font-family:var(--cpsl-font-family, inherit)}:host(.full-width){display:block}.tabs-container{position:relative;display:flex;overflow-x:scroll;overflow-y:hidden;border-width:var(--tabs-border-width);border-style:solid;border-color:var(--tabs-border-color);border-radius:var(--tabs-border-radius);background
|
15719
|
+
const cpslTabsCss = ":host{--tab-top-padding:5px;--tab-bottom-padding:5px;--tab-left-padding:16px;--tab-right-padding:16px;--tabs-border-radius:var(--cpsl-border-radius-tabs);--tabs-font-size:12px;--tabs-line-height:24px;--tabs-border-width:1px;--tabs-border-color:var(--cpsl-color-tabs-border);--tabs-background-color:var(--cpsl-color-tabs-background);--slider-background-color:var(--cpsl-color-tabs-slider-background);display:inline-block;max-width:100%;font-family:var(--cpsl-font-family, inherit)}:host(.full-width){display:block}.tabs-container{position:relative;display:flex;overflow-x:scroll;overflow-y:hidden;border-width:var(--tabs-border-width);border-style:solid;border-color:var(--tabs-border-color);border-radius:var(--tabs-border-radius);background:var(--tabs-background-color);font-size:var(--tabs-font-size);line-height:var(--tabs-line-height);-ms-overflow-style:none;scrollbar-width:none}.tabs-container::-webkit-scrollbar{display:none}.slider{position:absolute;top:calc(var(--tabs-border-width) * -1);bottom:calc(var(--tabs-border-width) * -1);left:-1px;border-width:var(--tabs-border-width);border-style:solid;border-color:var(--tabs-border-color);border-radius:var(--tabs-border-radius);background:var(--slider-background-color);box-shadow:-1px 0px 2px 0px var(--cpsl-color-alpha-black-10), 1px 0px 2px 0px var(--cpsl-color-alpha-black-10)}.loaded{transition:all 0.5s}";
|
15150
15720
|
const CpslTabsStyle0 = cpslTabsCss;
|
15151
15721
|
|
15152
15722
|
const CpslTabs = class {
|
@@ -15199,7 +15769,7 @@ const CpslTabs = class {
|
|
15199
15769
|
const tabsPosition = this.el.getBoundingClientRect();
|
15200
15770
|
const tabsBorderWidth = +getComputedStyle(this.el).getPropertyValue('--tabs-border-width').slice(0, -2);
|
15201
15771
|
const selectedTabRect = this.selectedTabRect;
|
15202
|
-
return (index.h(index.Host, { key: '
|
15772
|
+
return (index.h(index.Host, { key: 'f12c604fc3dadd8088792f02b42bd36618afa298', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, index.h("div", { key: 'be9cfe9c9e069c9593c40d32f474dd23bb8a63fd', class: "tabs-container" }, index.h("slot", { key: '50ec843d4ae261a0c4f0034d6f60366f5114f55c' }), index.h("div", { key: '814c5513a2945059ff240912b26a7936a0ee7478', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth * 2}px` } }))));
|
15203
15773
|
}
|
15204
15774
|
get el() { return index.getElement(this); }
|
15205
15775
|
static get watchers() { return {
|
@@ -15213,7 +15783,7 @@ const getTab = (tabs, tab) => {
|
|
15213
15783
|
};
|
15214
15784
|
CpslTabs.style = CpslTabsStyle0;
|
15215
15785
|
|
15216
|
-
const cpslTextCss = ":host{font-family:var(--cpsl-font-family, inherit);color:var(--cpsl-color-text-primary);padding:0px;margin:0px;display:block}:host p,h1,h2,h3,h4,h5,h6{padding:0px;margin:0px;font-weight:inherit;font-size:inherit;letter-spacing:inherit}:host(.primary){color:var(--cpsl-color-text-primary)}:host(.secondary){color:var(--cpsl-color-text-secondary)}:host(.subtle){color:var(--cpsl-color-text-subtle)}:host(.inverted){color:var(--cpsl-color-text-inverted)}:host(.error){color:var(--cpsl-color-text-error)}:host(.medium){font-weight:500}:host(.semi-bold){font-weight:600}:host(.bold){font-weight:700}:host(.body-2xs){font-size:var(--cpsl-font-size-body-2xs)}:host(.body-xs){font-size:var(--cpsl-font-size-body-xs)}:host(.body-s){font-size:var(--cpsl-font-size-body-s)}:host(.body-m){font-size:var(--cpsl-font-size-body-m)}:host(.body-l){font-size:var(--cpsl-font-size-body-l)}:host(.body-xl){font-size:var(--cpsl-font-size-body-xl)}:host(.heading-xs){font-size:var(--cpsl-font-size-heading-xs)}:host(.heading-s){font-size:var(--cpsl-font-size-heading-s)}:host(.heading-m){font-size:var(--cpsl-font-size-heading-m);letter-spacing:-0.4px}:host(.heading-l){font-size:var(--cpsl-font-size-heading-l);letter-spacing:-1.12px}:host(.heading-xl){font-size:var(--cpsl-font-size-heading-xl);letter-spacing:-1.28px}:host(.heading-2xl){font-size:var(--cpsl-font-size-heading-2xl);letter-spacing:-1.44px}";
|
15786
|
+
const cpslTextCss = ":host{font-family:var(--cpsl-font-family, inherit);color:var(--cpsl-color-text-primary);padding:0px;margin:0px;display:block}:host p,h1,h2,h3,h4,h5,h6{padding:0px;margin:0px;font-weight:inherit;font-size:inherit;letter-spacing:inherit}:host(.primary){color:var(--cpsl-color-text-primary)}:host(.secondary){color:var(--cpsl-color-text-secondary)}:host(.tertiary){color:var(--cpsl-color-text-tertiary)}:host(.subtle){color:var(--cpsl-color-text-subtle)}:host(.inverted){color:var(--cpsl-color-text-inverted)}:host(.error){color:var(--cpsl-color-text-error)}:host(.medium){font-weight:500}:host(.semi-bold){font-weight:600}:host(.bold){font-weight:700}:host(.body-2xs){font-size:var(--cpsl-font-size-body-2xs)}:host(.body-xs){font-size:var(--cpsl-font-size-body-xs)}:host(.body-s){font-size:var(--cpsl-font-size-body-s)}:host(.body-m){font-size:var(--cpsl-font-size-body-m)}:host(.body-l){font-size:var(--cpsl-font-size-body-l)}:host(.body-xl){font-size:var(--cpsl-font-size-body-xl)}:host(.heading-xs){font-size:var(--cpsl-font-size-heading-xs)}:host(.heading-s){font-size:var(--cpsl-font-size-heading-s)}:host(.heading-m){font-size:var(--cpsl-font-size-heading-m);letter-spacing:-0.4px}:host(.heading-l){font-size:var(--cpsl-font-size-heading-l);letter-spacing:-1.12px}:host(.heading-xl){font-size:var(--cpsl-font-size-heading-xl);letter-spacing:-1.28px}:host(.heading-2xl){font-size:var(--cpsl-font-size-heading-2xl);letter-spacing:-1.44px}";
|
15217
15787
|
const CpslTextStyle0 = cpslTextCss;
|
15218
15788
|
|
15219
15789
|
const CpslText = class {
|
@@ -15249,9 +15819,10 @@ const CpslText = class {
|
|
15249
15819
|
}
|
15250
15820
|
}
|
15251
15821
|
render() {
|
15252
|
-
return (index.h(index.Host, { key: '
|
15822
|
+
return (index.h(index.Host, { key: '97db3be68cbcd4a59851a74bfefac921b9f7efc0', class: {
|
15253
15823
|
'primary': this.color === 'primary',
|
15254
15824
|
'secondary': this.color === 'secondary',
|
15825
|
+
'tertiary': this.color === 'tertiary',
|
15255
15826
|
'subtle': this.color === 'subtle',
|
15256
15827
|
'inverted': this.color === 'inverted',
|
15257
15828
|
'error': this.color === 'error',
|
@@ -15275,7 +15846,7 @@ const CpslText = class {
|
|
15275
15846
|
};
|
15276
15847
|
CpslText.style = CpslTextStyle0;
|
15277
15848
|
|
15278
|
-
const cpslTileButtonCss = ":host{--button-icon-color:var(--cpsl-color-text-primary);--button-border-radius:var(--cpsl-border-radius-tile-button);--button-background-color:var(--cpsl-color-tile-button-surface-default);--button-border-color:var(--cpsl-color-tile-button-border);--button-width:72px;--button-height:56px;--button-gap:4px;--button-box-shadow:0px -4px 4px 0px var(--cpsl-color-alpha-black-2) inset, 0px 4px 4px 0px var(--cpsl-color-alpha-white-4) inset}:host :hover{--button-background-color:var(--cpsl-color-tile-button-surface-hover)}:host :active{--button-background-color:var(--cpsl-color-tile-button-surface-pressed)}.button-native{border-radius:var(--button-border-radius);-webkit-padding-start:var(--button-padding-start);padding-inline-start:var(--button-padding-start);-webkit-padding-end:var(--button-padding-end);padding-inline-end:var(--button-padding-end);padding-top:var(--button-padding-top);padding-bottom:var(--button-padding-bottom);border:1px solid transparent;cursor:pointer;background
|
15849
|
+
const cpslTileButtonCss = ":host{--button-icon-color:var(--cpsl-color-text-primary);--button-border-radius:var(--cpsl-border-radius-tile-button);--button-background-color:var(--cpsl-color-tile-button-surface-default);--button-border-color:var(--cpsl-color-tile-button-border);--button-width:72px;--button-height:56px;--button-gap:4px;--button-box-shadow:0px -4px 4px 0px var(--cpsl-color-alpha-black-2) inset, 0px 4px 4px 0px var(--cpsl-color-alpha-white-4) inset}:host :hover{--button-background-color:var(--cpsl-color-tile-button-surface-hover)}:host :active{--button-background-color:var(--cpsl-color-tile-button-surface-pressed)}.button-native{border-radius:var(--button-border-radius);-webkit-padding-start:var(--button-padding-start);padding-inline-start:var(--button-padding-start);-webkit-padding-end:var(--button-padding-end);padding-inline-end:var(--button-padding-end);padding-top:var(--button-padding-top);padding-bottom:var(--button-padding-bottom);border:1px solid transparent;cursor:pointer;background:var(--button-background-color);border-color:var(--button-border-color);display:flex;flex-direction:column;gap:var(--button-gap);align-items:center;justify-content:center;width:var(--button-width);height:var(--button-height);box-shadow:var(--button-box-shadow)}.button-native cpsl-icon{--icon-color:var(--button-icon-color)}";
|
15279
15850
|
const CpslTileButtonStyle0 = cpslTileButtonCss;
|
15280
15851
|
|
15281
15852
|
const CpslTileButton = class {
|
@@ -15285,7 +15856,7 @@ const CpslTileButton = class {
|
|
15285
15856
|
this.icon = undefined;
|
15286
15857
|
}
|
15287
15858
|
render() {
|
15288
|
-
return (index.h(index.Host, { key: '
|
15859
|
+
return (index.h(index.Host, { key: 'e12a3acf1adac28cb7ed464426bd50b48e5727d8' }, index.h("button", { key: '005df699f7b93807598568cd6542907f851d0234', class: "button-native" }, index.h("cpsl-icon", { key: 'af574fff1782925d1bc8d4146538fb179f63dead', exportparts: "icon", src: this.src, icon: this.icon }), index.h("slot", { key: 'b6a1d9557e7dbf974411496c7a29b1c0e5d648f3' }))));
|
15289
15860
|
}
|
15290
15861
|
};
|
15291
15862
|
CpslTileButton.style = CpslTileButtonStyle0;
|
@@ -15301,6 +15872,7 @@ exports.cpsl_code_input = CpslCodeInput;
|
|
15301
15872
|
exports.cpsl_divider = CpslDivider;
|
15302
15873
|
exports.cpsl_drawer = CpslDrawer;
|
15303
15874
|
exports.cpsl_dropdown = CpslDropdown;
|
15875
|
+
exports.cpsl_file_upload = CpslFileUpload;
|
15304
15876
|
exports.cpsl_icon = CpslIcon;
|
15305
15877
|
exports.cpsl_input = CpslInput;
|
15306
15878
|
exports.cpsl_modal = CpslModal;
|
@@ -15308,9 +15880,12 @@ exports.cpsl_nav_button_group = CpslNavButtonGroup;
|
|
15308
15880
|
exports.cpsl_overlay = CpslOverlay;
|
15309
15881
|
exports.cpsl_pagination = CpslPagination;
|
15310
15882
|
exports.cpsl_pill = CpslPill;
|
15883
|
+
exports.cpsl_popover = CpslPopover;
|
15311
15884
|
exports.cpsl_progress_indicator = CpslProgressIndicator;
|
15312
15885
|
exports.cpsl_qr_code = CpslQrCode;
|
15313
15886
|
exports.cpsl_radio = CpslRadio;
|
15887
|
+
exports.cpsl_select = CpslSelect;
|
15888
|
+
exports.cpsl_select_item = CpslSelectItem;
|
15314
15889
|
exports.cpsl_slide_button = CpslSlideButton;
|
15315
15890
|
exports.cpsl_spinner = CpslSpinner;
|
15316
15891
|
exports.cpsl_switch = CpslSwitch;
|
@@ -15320,4 +15895,4 @@ exports.cpsl_tabs = CpslTabs;
|
|
15320
15895
|
exports.cpsl_text = CpslText;
|
15321
15896
|
exports.cpsl_tile_button = CpslTileButton;
|
15322
15897
|
|
15323
|
-
//# sourceMappingURL=cpsl-
|
15898
|
+
//# sourceMappingURL=cpsl-alert_33.cjs.entry.js.map
|