@usecapsule/core-components 1.0.4 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/capsule/capsule.esm.js +1 -1
- package/dist/capsule/p-1dc07cd7.entry.js +2 -0
- package/dist/capsule/p-1dc07cd7.entry.js.map +1 -0
- package/dist/capsule/{p-7ceb7cc8.entry.js → p-2a036350.entry.js} +3 -3
- package/dist/capsule/{p-7ceb7cc8.entry.js.map → p-2a036350.entry.js.map} +1 -1
- package/dist/capsule/p-5c020abe.entry.js +2 -0
- package/dist/cjs/cpsl-alert_17.cjs.entry.js +13 -13
- package/dist/cjs/cpsl-alert_17.cjs.entry.js.map +1 -1
- package/dist/cjs/cpsl-info-box.cjs.entry.js +2 -2
- package/dist/cjs/cpsl-info-box.cjs.entry.js.map +1 -1
- package/dist/cjs/cpsl-row.cjs.entry.js +1 -1
- package/dist/collection/components/cpsl-divider/cpsl-divider.css +1 -1
- package/dist/collection/components/cpsl-info-box/cpsl-info-box.css +3 -0
- package/dist/collection/components/cpsl-info-box/cpsl-info-box.js +1 -1
- package/dist/collection/components/cpsl-info-box/cpsl-info-box.js.map +1 -1
- package/dist/collection/components/cpsl-input/cpsl-input.js +1 -1
- package/dist/collection/components/cpsl-modal/cpsl-modal.js +1 -1
- package/dist/collection/components/cpsl-overlay/cpsl-overlay.js +1 -1
- package/dist/collection/components/cpsl-pill/cpsl-pill.js +1 -1
- package/dist/collection/components/cpsl-qr-code/cpsl-qr-code.js +1 -1
- package/dist/collection/components/cpsl-row/cpsl-row.js +1 -1
- package/dist/collection/components/cpsl-slide-button/cpsl-slide-button.js +1 -1
- package/dist/collection/components/cpsl-spinner/cpsl-spinner.js +2 -2
- package/dist/collection/components/cpsl-tab/cpsl-tab.js +1 -1
- package/dist/collection/components/cpsl-tabs/cpsl-tabs.js +1 -1
- package/dist/collection/components/cpsl-text/cpsl-text.js +1 -1
- package/dist/collection/components/cpsl-tile-button/cpsl-tile-button.js +1 -1
- package/dist/esm/cpsl-alert_17.entry.js +13 -13
- package/dist/esm/cpsl-alert_17.entry.js.map +1 -1
- package/dist/esm/cpsl-info-box.entry.js +2 -2
- package/dist/esm/cpsl-info-box.entry.js.map +1 -1
- package/dist/esm/cpsl-row.entry.js +1 -1
- package/package.json +2 -2
- package/dist/capsule/p-b7cb3ddd.entry.js +0 -2
- package/dist/capsule/p-d871d963.entry.js +0 -2
- package/dist/capsule/p-d871d963.entry.js.map +0 -1
- /package/dist/capsule/{p-b7cb3ddd.entry.js.map → p-5c020abe.entry.js.map} +0 -0
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-2a026742.js');
|
|
6
6
|
|
|
7
|
-
const cpslInfoBoxCss = ":host{--box-border-radius:var(--cpsl-border-radius-info-box);--box-padding-top:16px;--box-padding-bottom:16px;--box-padding-start:16px;--box-padding-end:16px;--box-border-width:1px
|
|
7
|
+
const cpslInfoBoxCss = ":host{--box-border-radius:var(--cpsl-border-radius-info-box);--box-padding-top:16px;--box-padding-bottom:16px;--box-padding-start:16px;--box-padding-end:16px;--box-border-width:1px}.info-box-container{border-radius:var(--input-border-radius);-webkit-padding-start:var(--box-padding-start);padding-inline-start:var(--box-padding-start);-webkit-padding-end:var(--box-padding-end);padding-inline-end:var(--box-padding-end);padding-top:var(--box-padding-top);padding-bottom:var(--box-padding-bottom);display:flex;background-color:var(--cpsl-color-background-subtle);border:var(--box-border-width) solid var(--cpsl-color-input-border-placeholder);border-radius:var(--box-border-radius)}";
|
|
8
8
|
const CpslInfoBoxStyle0 = cpslInfoBoxCss;
|
|
9
9
|
|
|
10
10
|
const CpslInfoBox = class {
|
|
@@ -12,7 +12,7 @@ const CpslInfoBox = class {
|
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
13
|
}
|
|
14
14
|
render() {
|
|
15
|
-
return (index.h(index.Host, { key: '17a3490640f95a341c0942188979b2cb82f37da1' }, index.h("slot", { key: '
|
|
15
|
+
return (index.h(index.Host, { key: '17a3490640f95a341c0942188979b2cb82f37da1' }, index.h("div", { key: '51c7731b3e11119e3fcb96f5ef2f47ffd71ba097', class: "info-box-container" }, index.h("slot", { key: '82bfc871c4fb3856e553637514806435473f4728' }))));
|
|
16
16
|
}
|
|
17
17
|
};
|
|
18
18
|
CpslInfoBox.style = CpslInfoBoxStyle0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cpsl-info-box.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,
|
|
1
|
+
{"file":"cpsl-info-box.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,2qBAA2qB,CAAC;AACnsB,0BAAe,cAAc;;MCMhB,WAAW;;;;IACtB,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,oBAAoB,IAC7BA,oEAAa,CACT,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cpsl-info-box/cpsl-info-box.scss?tag=cpsl-info-box&encapsulation=shadow","src/components/cpsl-info-box/cpsl-info-box.tsx"],"sourcesContent":["@import '../../themes/capsule.globals';\n\n:host {\n --box-border-radius: var(--cpsl-border-radius-info-box);\n --box-padding-top: 16px;\n --box-padding-bottom: 16px;\n --box-padding-start: 16px;\n --box-padding-end: 16px;\n --box-border-width: 1px;\n}\n\n.info-box-container {\n @include border-radius(var(--input-border-radius));\n @include padding(var(--box-padding-top), var(--box-padding-end), var(--box-padding-bottom), var(--box-padding-start));\n\n display: flex;\n background-color: var(--cpsl-color-background-subtle);\n border: var(--box-border-width) solid var(--cpsl-color-input-border-placeholder);\n border-radius: var(--box-border-radius);\n}\n","import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'cpsl-info-box',\n styleUrl: 'cpsl-info-box.scss',\n shadow: true,\n})\nexport class CpslInfoBox {\n render() {\n return (\n <Host>\n <div class=\"info-box-container\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -12,7 +12,7 @@ const CpslRow = class {
|
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
13
|
}
|
|
14
14
|
render() {
|
|
15
|
-
return (index.h(index.Host, { key: '
|
|
15
|
+
return (index.h(index.Host, { key: '6b0ced877619502c78baeccaceaf68f1feed6ea7' }, index.h("slot", { key: 'd132ce91967ad16904886baa14149ac8990d314f' })));
|
|
16
16
|
}
|
|
17
17
|
};
|
|
18
18
|
CpslRow.style = CpslRowStyle0;
|
|
@@ -60,6 +60,9 @@
|
|
|
60
60
|
--box-padding-start: 16px;
|
|
61
61
|
--box-padding-end: 16px;
|
|
62
62
|
--box-border-width: 1px;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.info-box-container {
|
|
63
66
|
border-radius: var(--input-border-radius);
|
|
64
67
|
-webkit-padding-start: var(--box-padding-start);
|
|
65
68
|
padding-inline-start: var(--box-padding-start);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Host, h } from "@stencil/core";
|
|
2
2
|
export class CpslInfoBox {
|
|
3
3
|
render() {
|
|
4
|
-
return (h(Host, { key: '17a3490640f95a341c0942188979b2cb82f37da1' }, h("slot", { key: '
|
|
4
|
+
return (h(Host, { key: '17a3490640f95a341c0942188979b2cb82f37da1' }, h("div", { key: '51c7731b3e11119e3fcb96f5ef2f47ffd71ba097', class: "info-box-container" }, h("slot", { key: '82bfc871c4fb3856e553637514806435473f4728' }))));
|
|
5
5
|
}
|
|
6
6
|
static get is() { return "cpsl-info-box"; }
|
|
7
7
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cpsl-info-box.js","sourceRoot":"","sources":["../../../../src/components/cpsl-info-box/cpsl-info-box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,WAAW;IACtB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAa,
|
|
1
|
+
{"version":3,"file":"cpsl-info-box.js","sourceRoot":"","sources":["../../../../src/components/cpsl-info-box/cpsl-info-box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,WAAW;IACtB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,oBAAoB;gBAC7B,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'cpsl-info-box',\n styleUrl: 'cpsl-info-box.scss',\n shadow: true,\n})\nexport class CpslInfoBox {\n render() {\n return (\n <Host>\n <div class=\"info-box-container\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -99,7 +99,7 @@ export class CpslInput {
|
|
|
99
99
|
}
|
|
100
100
|
render() {
|
|
101
101
|
var _a;
|
|
102
|
-
return (h(Host, { key: '
|
|
102
|
+
return (h(Host, { key: '2627de83fa1973eac8002f4807c4f2319a7541cf', class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.focusedValue) || Boolean(this.value) } }, this.label && (h("label", { class: "label", htmlFor: this.inputId }, this.label)), h("div", { key: '9f2eaa8fe2a2fa67dcd61e69cd43698c33829d48', onClick: this.focusInput, class: { 'input-container': true, 'error-container': Boolean(this.errorText) } }, h("slot", { key: 'cc4d99747dcc55aa2dc27a58244bd0dbdc872332', name: "start" }), h("input", { key: '52ba9b2248af07ee072628fd0207d1b965d44829', class: "native-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 }), h("slot", { key: 'b15d92b44f321351e3a8465b7c7c3409305e0196', name: "end" })), (this.errorText || this.helperText) && (h("div", { class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("cpsl-icon", { icon: Boolean(this.errorText) ? 'alertCircle' : 'infoCircle' }), h("span", null, (_a = this.errorText) !== null && _a !== void 0 ? _a : this.helperText)))));
|
|
103
103
|
}
|
|
104
104
|
static get is() { return "cpsl-input"; }
|
|
105
105
|
static get encapsulation() { return "shadow"; }
|
|
@@ -37,7 +37,7 @@ export class CpslModal {
|
|
|
37
37
|
return this.el.shadowRoot.getElementById('modal-header-expanded');
|
|
38
38
|
}
|
|
39
39
|
render() {
|
|
40
|
-
return (h(Host, { key: '
|
|
40
|
+
return (h(Host, { key: 'aa5c26013878e80fe58a2826d4cae04db88dace3' }, h("div", { key: '5deda08b40a3e034e1c1b412eb7ab0c7780b4f53', class: { 'modal-container': true, 'no-footer': this.noFooter } }, h("div", { key: '6f5340b60ded651410a3eec83ecca3ee0e24f643', class: { 'modal-inner-container': true, 'no-footer': this.noFooter } }, h("div", { key: '632ecd039ac402971cd3f15efb30fc527402f0cd', id: "modal-header", class: "no-overflow" }, h("slot", { key: 'af0d35f477ff94d7f65b3bd81b845819ba8c8439', name: "header" })), h("div", { key: '6116bba4b65cebb91fd283106a58915216e5d828', id: "modal-header-expanded", class: { 'expanded': true, 'no-overflow': true } }, h("slot", { key: 'd7cd88d70a15e2a02bc590422913c481f0b61a2e', name: "footerExpandedHeader" })), h("div", { key: '72e1ede4c4754526c83f2723d322717d8888bf6d', id: "modal-body", class: "no-overflow" }, h("slot", { key: '66c63bb06b6b4ccce422855ecb483ab42ca6e27e', name: "body" }))), h("div", { key: 'fec82340b95072a6d3167fda064082005f760661', id: "modal-footer", class: "no-overflow" }, h("slot", { key: 'bcd91a6cf6ef753e4b0fbb163e93984a9afa15ca', name: "footer" })), h("div", { key: 'a39a058058adedb6494c307729823467d6c45df7', id: "modal-footer-expanded", class: { 'expanded': true, 'no-overflow': true } }, h("slot", { key: 'd5f0d390de50e0706358bd033655047c742298e2', name: "footerExpandedFooter" })))));
|
|
41
41
|
}
|
|
42
42
|
static get is() { return "cpsl-modal"; }
|
|
43
43
|
static get encapsulation() { return "shadow"; }
|
|
@@ -27,7 +27,7 @@ export class CpslOverlay {
|
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
29
|
render() {
|
|
30
|
-
return (h(Host, { key: '
|
|
30
|
+
return (h(Host, { key: '55a5b7f277d010d63f1e991d210b038c393fb387' }, h("slot", { key: '59957e5f35e8b007ba32177672870d7240ca501c' })));
|
|
31
31
|
}
|
|
32
32
|
static get is() { return "cpsl-overlay"; }
|
|
33
33
|
static get encapsulation() { return "shadow"; }
|
|
@@ -4,7 +4,7 @@ export class CpslPill {
|
|
|
4
4
|
this.text = undefined;
|
|
5
5
|
}
|
|
6
6
|
render() {
|
|
7
|
-
return (h(Host, { key: '
|
|
7
|
+
return (h(Host, { key: 'd82e8cf09017e22aab2c4e4d42295310116aad3c' }, h("div", { key: 'f7ec5045fdcf0d69873f5ddbfc46976a8c3bbacb', class: "pill-container" }, h("span", { key: 'd715965cf771800ad57f63509865d47a7344da95' }, this.text))));
|
|
8
8
|
}
|
|
9
9
|
static get is() { return "cpsl-pill"; }
|
|
10
10
|
static get encapsulation() { return "shadow"; }
|
|
@@ -32,7 +32,7 @@ export class CpslQrCode {
|
|
|
32
32
|
qrCode.append(container);
|
|
33
33
|
}
|
|
34
34
|
render() {
|
|
35
|
-
return (h(Host, { key: '
|
|
35
|
+
return (h(Host, { key: 'c26c87e8a22d8134a60f9efebd1e27169d59cb0c' }, h("div", { key: 'd9a8ede7f1ffbcd80d58b916d38f38fea7fc4f74', id: "qr-container", class: "qr-container" })));
|
|
36
36
|
}
|
|
37
37
|
static get is() { return "cpsl-qr-code"; }
|
|
38
38
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Host, h } from "@stencil/core";
|
|
2
2
|
export class CpslRow {
|
|
3
3
|
render() {
|
|
4
|
-
return (h(Host, { key: '
|
|
4
|
+
return (h(Host, { key: '6b0ced877619502c78baeccaceaf68f1feed6ea7' }, h("slot", { key: 'd132ce91967ad16904886baa14149ac8990d314f' })));
|
|
5
5
|
}
|
|
6
6
|
static get is() { return "cpsl-row"; }
|
|
7
7
|
static get encapsulation() { return "shadow"; }
|
|
@@ -84,7 +84,7 @@ export class CpslSlideButton {
|
|
|
84
84
|
return this.el.shadowRoot.getElementById('end-icon');
|
|
85
85
|
}
|
|
86
86
|
render() {
|
|
87
|
-
return (h(Host, { key: '
|
|
87
|
+
return (h(Host, { key: '3025e2306923953edd5857009828af027cd0d561' }, h("div", { key: '5557072bcccfc099af005fed9af45adf335a98dd', id: "slider-container", class: "slider-container" }, h("div", { key: '39e1b5d2123eda0a004c0f250c8afa66b53768f4', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '80486f55315077693d481e193eba1bf37acd5afd', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: 'c13596a1a117aa3e5674d5a91c0ec38ff9ac7a49', id: "slider", class: "slider" }, h("cpsl-icon", { key: 'd2d78f42e65efd180c9dd106738341cf0aee6f27', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), h("cpsl-icon", { key: '63f9ce569084f2541c69028aedc949b3ecccac0c', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), h("span", { key: '9bead9870b949f91734c4199d9c96f7b50a10128', id: "start-text", class: "start-text" }, this.startText), h("span", { key: '8dfa1e9e0866a74f72d27b2541a4ac9d56038d34', id: "end-text", class: "end-text" }, this.endText))));
|
|
88
88
|
}
|
|
89
89
|
static get is() { return "cpsl-slide-button"; }
|
|
90
90
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,13 +5,13 @@ export class CpslSpinner {
|
|
|
5
5
|
this.speed = 1;
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: 'c67c084c1bae79ba255ca736de4721d1f6ea928d', style: {
|
|
9
9
|
'height': `${this.size}px`,
|
|
10
10
|
'width': `${this.size}px`,
|
|
11
11
|
'animation': `spin ${this.speed}s linear infinite`,
|
|
12
12
|
'-webkit-animation': `spin ${this.speed}s linear infinite`,
|
|
13
13
|
'-moz-animation': `spin ${this.speed}s linear infinite`,
|
|
14
|
-
} }, h("svg", { key: '
|
|
14
|
+
} }, h("svg", { key: 'a14c9a8d895fb713fd1a8533bca04fa6e60017d7', height: this.size, width: this.size, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 54 54", fill: "none" }, h("path", { key: '5aaaf7cf5c649b717329266517e5ea1f39fccce8', 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" }), h("circle", { key: 'a1a60d4f565a1cffb99177d4159a793621e7b288', cx: "45", cy: "27", r: "5" }))));
|
|
15
15
|
}
|
|
16
16
|
static get is() { return "cpsl-spinner"; }
|
|
17
17
|
static get encapsulation() { return "shadow"; }
|
|
@@ -21,7 +21,7 @@ export class CpslTab {
|
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
render() {
|
|
24
|
-
return (h(Host, { key: '
|
|
24
|
+
return (h(Host, { key: 'd55a11bba84bea2f0d24c6190a84467aea4ac2d3', onClick: this.onTabClicked }, h("div", { key: '31e58097fd53e0286c6652eed32cb39b50e9ebf2', class: { 'tab-container': true } }, h("slot", { key: '01cdeb08c1f468de22ce7d01c6e5b8396231860e' }))));
|
|
25
25
|
}
|
|
26
26
|
static get is() { return "cpsl-tab"; }
|
|
27
27
|
static get encapsulation() { return "shadow"; }
|
|
@@ -39,7 +39,7 @@ export class CpslTabs {
|
|
|
39
39
|
const tabsPosition = this.el.getBoundingClientRect();
|
|
40
40
|
const tabsBorderWidth = +getComputedStyle(this.el).getPropertyValue('--border-width').slice(0, -2);
|
|
41
41
|
const selectedTabRect = this.selectedTabRect;
|
|
42
|
-
return (h(Host, { key: '
|
|
42
|
+
return (h(Host, { key: 'b64847167837c21748fce136be621c5cd3056383', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, h("div", { key: '97f898ee1c1a29c673a901d37e0c2aa20f73e06e', class: "tabs-container" }, h("slot", { key: '6a731c26802bc1b08c6b5fe92b2a6f1da438ee89' }), h("div", { key: 'c69d074579a90b804f038f5ace589a1c98ed45e1', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth * 2}px` } }))));
|
|
43
43
|
}
|
|
44
44
|
static get is() { return "cpsl-tabs"; }
|
|
45
45
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Host, h } from "@stencil/core";
|
|
2
2
|
export class CpslText {
|
|
3
3
|
render() {
|
|
4
|
-
return (h(Host, { key: '
|
|
4
|
+
return (h(Host, { key: '72726bc3a58e3089f02b70d494ead181eb34f2d3' }, h("slot", { key: '8f8b009bc13ea9bb7824b51c622b115c6b103a9c' })));
|
|
5
5
|
}
|
|
6
6
|
static get is() { return "cpsl-text"; }
|
|
7
7
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,7 +5,7 @@ export class CpslTileButton {
|
|
|
5
5
|
this.icon = undefined;
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: 'db1693ec8a607410ba6bb5fbe15b4acaec26ff84' }, h("button", { key: '6da2c97b58e7ee13c86a386461831ed93fa3fee9', class: "button-native" }, h("cpsl-icon", { key: '0dbe6348fedb418151384747bac7f902b31d6c9a', exportparts: "icon", src: this.src, icon: this.icon }), h("slot", { key: '8d15a91f86b060edefcf3ae359df2ceb2e1b4a76' }))));
|
|
9
9
|
}
|
|
10
10
|
static get is() { return "cpsl-tile-button"; }
|
|
11
11
|
static get encapsulation() { return "shadow"; }
|
|
@@ -859,7 +859,7 @@ const CpslCodeInput = class {
|
|
|
859
859
|
};
|
|
860
860
|
CpslCodeInput.style = CpslCodeInputStyle0;
|
|
861
861
|
|
|
862
|
-
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(
|
|
862
|
+
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-color:var(--divider-color);height:var(--divider-height)}";
|
|
863
863
|
const CpslDividerStyle0 = cpslDividerCss;
|
|
864
864
|
|
|
865
865
|
const CpslDivider = class {
|
|
@@ -996,7 +996,7 @@ const CpslInput = class {
|
|
|
996
996
|
}
|
|
997
997
|
render() {
|
|
998
998
|
var _a;
|
|
999
|
-
return (h(Host, { key: '
|
|
999
|
+
return (h(Host, { key: '2627de83fa1973eac8002f4807c4f2319a7541cf', class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.focusedValue) || Boolean(this.value) } }, this.label && (h("label", { class: "label", htmlFor: this.inputId }, this.label)), h("div", { key: '9f2eaa8fe2a2fa67dcd61e69cd43698c33829d48', onClick: this.focusInput, class: { 'input-container': true, 'error-container': Boolean(this.errorText) } }, h("slot", { key: 'cc4d99747dcc55aa2dc27a58244bd0dbdc872332', name: "start" }), h("input", { key: '52ba9b2248af07ee072628fd0207d1b965d44829', class: "native-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 }), h("slot", { key: 'b15d92b44f321351e3a8465b7c7c3409305e0196', name: "end" })), (this.errorText || this.helperText) && (h("div", { class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("cpsl-icon", { icon: Boolean(this.errorText) ? 'alertCircle' : 'infoCircle' }), h("span", null, (_a = this.errorText) !== null && _a !== void 0 ? _a : this.helperText)))));
|
|
1000
1000
|
}
|
|
1001
1001
|
get el() { return getElement(this); }
|
|
1002
1002
|
static get watchers() { return {
|
|
@@ -7087,7 +7087,7 @@ const CpslModal = class {
|
|
|
7087
7087
|
return this.el.shadowRoot.getElementById('modal-header-expanded');
|
|
7088
7088
|
}
|
|
7089
7089
|
render() {
|
|
7090
|
-
return (h(Host, { key: '
|
|
7090
|
+
return (h(Host, { key: 'aa5c26013878e80fe58a2826d4cae04db88dace3' }, h("div", { key: '5deda08b40a3e034e1c1b412eb7ab0c7780b4f53', class: { 'modal-container': true, 'no-footer': this.noFooter } }, h("div", { key: '6f5340b60ded651410a3eec83ecca3ee0e24f643', class: { 'modal-inner-container': true, 'no-footer': this.noFooter } }, h("div", { key: '632ecd039ac402971cd3f15efb30fc527402f0cd', id: "modal-header", class: "no-overflow" }, h("slot", { key: 'af0d35f477ff94d7f65b3bd81b845819ba8c8439', name: "header" })), h("div", { key: '6116bba4b65cebb91fd283106a58915216e5d828', id: "modal-header-expanded", class: { 'expanded': true, 'no-overflow': true } }, h("slot", { key: 'd7cd88d70a15e2a02bc590422913c481f0b61a2e', name: "footerExpandedHeader" })), h("div", { key: '72e1ede4c4754526c83f2723d322717d8888bf6d', id: "modal-body", class: "no-overflow" }, h("slot", { key: '66c63bb06b6b4ccce422855ecb483ab42ca6e27e', name: "body" }))), h("div", { key: 'fec82340b95072a6d3167fda064082005f760661', id: "modal-footer", class: "no-overflow" }, h("slot", { key: 'bcd91a6cf6ef753e4b0fbb163e93984a9afa15ca', name: "footer" })), h("div", { key: 'a39a058058adedb6494c307729823467d6c45df7', id: "modal-footer-expanded", class: { 'expanded': true, 'no-overflow': true } }, h("slot", { key: 'd5f0d390de50e0706358bd033655047c742298e2', name: "footerExpandedFooter" })))));
|
|
7091
7091
|
}
|
|
7092
7092
|
get el() { return getElement(this); }
|
|
7093
7093
|
static get watchers() { return {
|
|
@@ -7127,7 +7127,7 @@ const CpslOverlay = class {
|
|
|
7127
7127
|
}
|
|
7128
7128
|
}
|
|
7129
7129
|
render() {
|
|
7130
|
-
return (h(Host, { key: '
|
|
7130
|
+
return (h(Host, { key: '55a5b7f277d010d63f1e991d210b038c393fb387' }, h("slot", { key: '59957e5f35e8b007ba32177672870d7240ca501c' })));
|
|
7131
7131
|
}
|
|
7132
7132
|
get el() { return getElement(this); }
|
|
7133
7133
|
static get watchers() { return {
|
|
@@ -7145,7 +7145,7 @@ const CpslPill = class {
|
|
|
7145
7145
|
this.text = undefined;
|
|
7146
7146
|
}
|
|
7147
7147
|
render() {
|
|
7148
|
-
return (h(Host, { key: '
|
|
7148
|
+
return (h(Host, { key: 'd82e8cf09017e22aab2c4e4d42295310116aad3c' }, h("div", { key: 'f7ec5045fdcf0d69873f5ddbfc46976a8c3bbacb', class: "pill-container" }, h("span", { key: 'd715965cf771800ad57f63509865d47a7344da95' }, this.text))));
|
|
7149
7149
|
}
|
|
7150
7150
|
};
|
|
7151
7151
|
CpslPill.style = CpslPillStyle0;
|
|
@@ -7224,7 +7224,7 @@ const CpslQrCode = class {
|
|
|
7224
7224
|
qrCode.append(container);
|
|
7225
7225
|
}
|
|
7226
7226
|
render() {
|
|
7227
|
-
return (h(Host, { key: '
|
|
7227
|
+
return (h(Host, { key: 'c26c87e8a22d8134a60f9efebd1e27169d59cb0c' }, h("div", { key: 'd9a8ede7f1ffbcd80d58b916d38f38fea7fc4f74', id: "qr-container", class: "qr-container" })));
|
|
7228
7228
|
}
|
|
7229
7229
|
get el() { return getElement(this); }
|
|
7230
7230
|
};
|
|
@@ -7320,7 +7320,7 @@ const CpslSlideButton = class {
|
|
|
7320
7320
|
return this.el.shadowRoot.getElementById('end-icon');
|
|
7321
7321
|
}
|
|
7322
7322
|
render() {
|
|
7323
|
-
return (h(Host, { key: '
|
|
7323
|
+
return (h(Host, { key: '3025e2306923953edd5857009828af027cd0d561' }, h("div", { key: '5557072bcccfc099af005fed9af45adf335a98dd', id: "slider-container", class: "slider-container" }, h("div", { key: '39e1b5d2123eda0a004c0f250c8afa66b53768f4', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '80486f55315077693d481e193eba1bf37acd5afd', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: 'c13596a1a117aa3e5674d5a91c0ec38ff9ac7a49', id: "slider", class: "slider" }, h("cpsl-icon", { key: 'd2d78f42e65efd180c9dd106738341cf0aee6f27', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), h("cpsl-icon", { key: '63f9ce569084f2541c69028aedc949b3ecccac0c', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), h("span", { key: '9bead9870b949f91734c4199d9c96f7b50a10128', id: "start-text", class: "start-text" }, this.startText), h("span", { key: '8dfa1e9e0866a74f72d27b2541a4ac9d56038d34', id: "end-text", class: "end-text" }, this.endText))));
|
|
7324
7324
|
}
|
|
7325
7325
|
get el() { return getElement(this); }
|
|
7326
7326
|
};
|
|
@@ -7336,13 +7336,13 @@ const CpslSpinner = class {
|
|
|
7336
7336
|
this.speed = 1;
|
|
7337
7337
|
}
|
|
7338
7338
|
render() {
|
|
7339
|
-
return (h(Host, { key: '
|
|
7339
|
+
return (h(Host, { key: 'c67c084c1bae79ba255ca736de4721d1f6ea928d', style: {
|
|
7340
7340
|
'height': `${this.size}px`,
|
|
7341
7341
|
'width': `${this.size}px`,
|
|
7342
7342
|
'animation': `spin ${this.speed}s linear infinite`,
|
|
7343
7343
|
'-webkit-animation': `spin ${this.speed}s linear infinite`,
|
|
7344
7344
|
'-moz-animation': `spin ${this.speed}s linear infinite`,
|
|
7345
|
-
} }, h("svg", { key: '
|
|
7345
|
+
} }, h("svg", { key: 'a14c9a8d895fb713fd1a8533bca04fa6e60017d7', height: this.size, width: this.size, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 54 54", fill: "none" }, h("path", { key: '5aaaf7cf5c649b717329266517e5ea1f39fccce8', 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" }), h("circle", { key: 'a1a60d4f565a1cffb99177d4159a793621e7b288', cx: "45", cy: "27", r: "5" }))));
|
|
7346
7346
|
}
|
|
7347
7347
|
};
|
|
7348
7348
|
CpslSpinner.style = CpslSpinnerStyle0;
|
|
@@ -7374,7 +7374,7 @@ const CpslTab = class {
|
|
|
7374
7374
|
}
|
|
7375
7375
|
}
|
|
7376
7376
|
render() {
|
|
7377
|
-
return (h(Host, { key: '
|
|
7377
|
+
return (h(Host, { key: 'd55a11bba84bea2f0d24c6190a84467aea4ac2d3', onClick: this.onTabClicked }, h("div", { key: '31e58097fd53e0286c6652eed32cb39b50e9ebf2', class: { 'tab-container': true } }, h("slot", { key: '01cdeb08c1f468de22ce7d01c6e5b8396231860e' }))));
|
|
7378
7378
|
}
|
|
7379
7379
|
get el() { return getElement(this); }
|
|
7380
7380
|
};
|
|
@@ -7426,7 +7426,7 @@ const CpslTabs = class {
|
|
|
7426
7426
|
const tabsPosition = this.el.getBoundingClientRect();
|
|
7427
7427
|
const tabsBorderWidth = +getComputedStyle(this.el).getPropertyValue('--border-width').slice(0, -2);
|
|
7428
7428
|
const selectedTabRect = this.selectedTabRect;
|
|
7429
|
-
return (h(Host, { key: '
|
|
7429
|
+
return (h(Host, { key: 'b64847167837c21748fce136be621c5cd3056383', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, h("div", { key: '97f898ee1c1a29c673a901d37e0c2aa20f73e06e', class: "tabs-container" }, h("slot", { key: '6a731c26802bc1b08c6b5fe92b2a6f1da438ee89' }), h("div", { key: 'c69d074579a90b804f038f5ace589a1c98ed45e1', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth * 2}px` } }))));
|
|
7430
7430
|
}
|
|
7431
7431
|
get el() { return getElement(this); }
|
|
7432
7432
|
static get watchers() { return {
|
|
@@ -7450,7 +7450,7 @@ const CpslText = class {
|
|
|
7450
7450
|
registerInstance(this, hostRef);
|
|
7451
7451
|
}
|
|
7452
7452
|
render() {
|
|
7453
|
-
return (h(Host, { key: '
|
|
7453
|
+
return (h(Host, { key: '72726bc3a58e3089f02b70d494ead181eb34f2d3' }, h("slot", { key: '8f8b009bc13ea9bb7824b51c622b115c6b103a9c' })));
|
|
7454
7454
|
}
|
|
7455
7455
|
};
|
|
7456
7456
|
CpslText.style = CpslTextStyle0;
|
|
@@ -7465,7 +7465,7 @@ const CpslTileButton = class {
|
|
|
7465
7465
|
this.icon = undefined;
|
|
7466
7466
|
}
|
|
7467
7467
|
render() {
|
|
7468
|
-
return (h(Host, { key: '
|
|
7468
|
+
return (h(Host, { key: 'db1693ec8a607410ba6bb5fbe15b4acaec26ff84' }, h("button", { key: '6da2c97b58e7ee13c86a386461831ed93fa3fee9', class: "button-native" }, h("cpsl-icon", { key: '0dbe6348fedb418151384747bac7f902b31d6c9a', exportparts: "icon", src: this.src, icon: this.icon }), h("slot", { key: '8d15a91f86b060edefcf3ae359df2ceb2e1b4a76' }))));
|
|
7469
7469
|
}
|
|
7470
7470
|
};
|
|
7471
7471
|
CpslTileButton.style = CpslTileButtonStyle0;
|