@getpara/core-components 2.0.0-alpha.3 → 2.0.0-alpha.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/capsule.esm.js.map +1 -1
- package/dist/capsule/{p-a6214f0a.entry.js → p-34a09932.entry.js} +2 -2
- package/dist/capsule/p-34a09932.entry.js.map +1 -0
- package/dist/capsule/{p-48826e01.entry.js → p-5049e2a1.entry.js} +4 -4
- package/dist/capsule/p-5049e2a1.entry.js.map +1 -0
- package/dist/capsule/p-e424993a.entry.js +2 -0
- package/dist/capsule/p-e424993a.entry.js.map +1 -0
- package/dist/cjs/capsule.cjs.js +1 -1
- package/dist/cjs/cpsl-alert_34.cjs.entry.js +49 -13
- package/dist/cjs/cpsl-alert_34.cjs.entry.js.map +1 -1
- package/dist/cjs/cpsl-col.cjs.entry.js +4 -1
- package/dist/cjs/cpsl-col.cjs.entry.js.map +1 -1
- package/dist/cjs/cpsl-row.cjs.entry.js +6 -2
- package/dist/cjs/cpsl-row.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/assets/icons/index.js +2 -0
- package/dist/collection/assets/icons/index.js.map +1 -1
- package/dist/collection/assets/icons/stars-02.svg +10 -0
- package/dist/collection/components/cpsl-alert/cpsl-alert.js +1 -1
- package/dist/collection/components/cpsl-col/cpsl-col.js +73 -1
- package/dist/collection/components/cpsl-col/cpsl-col.js.map +1 -1
- package/dist/collection/components/cpsl-icon/cpsl-icon.css +8 -2
- package/dist/collection/components/cpsl-icon/cpsl-icon.js +39 -2
- package/dist/collection/components/cpsl-icon/cpsl-icon.js.map +1 -1
- package/dist/collection/components/cpsl-input/cpsl-input.css +3 -1
- package/dist/collection/components/cpsl-input/cpsl-input.js +22 -3
- package/dist/collection/components/cpsl-input/cpsl-input.js.map +1 -1
- package/dist/collection/components/cpsl-popover/cpsl-popover.js +19 -4
- package/dist/collection/components/cpsl-popover/cpsl-popover.js.map +1 -1
- package/dist/collection/components/cpsl-qr-code/cpsl-qr-code.js +1 -1
- package/dist/collection/components/cpsl-row/cpsl-row.css +4 -0
- package/dist/collection/components/cpsl-row/cpsl-row.js +98 -1
- package/dist/collection/components/cpsl-row/cpsl-row.js.map +1 -1
- package/dist/collection/components/cpsl-select/cpsl-select.js +10 -5
- package/dist/collection/components/cpsl-select/cpsl-select.js.map +1 -1
- package/dist/collection/components/cpsl-slide-button/cpsl-slide-button.js +2 -2
- package/dist/collection/components/cpsl-tile-button/cpsl-tile-button.js +1 -1
- package/dist/esm/capsule.js +1 -1
- package/dist/esm/cpsl-alert_34.entry.js +49 -13
- package/dist/esm/cpsl-alert_34.entry.js.map +1 -1
- package/dist/esm/cpsl-col.entry.js +4 -1
- package/dist/esm/cpsl-col.entry.js.map +1 -1
- package/dist/esm/cpsl-row.entry.js +6 -2
- package/dist/esm/cpsl-row.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/assets/icons/index.d.ts +1 -0
- package/dist/types/components/cpsl-col/cpsl-col.d.ts +4 -0
- package/dist/types/components/cpsl-icon/cpsl-icon.d.ts +8 -0
- package/dist/types/components/cpsl-input/cpsl-input.d.ts +4 -0
- package/dist/types/components/cpsl-row/cpsl-row.d.ts +5 -0
- package/dist/types/components.d.ts +38 -0
- package/package.json +3 -3
- package/dist/capsule/p-48826e01.entry.js.map +0 -1
- package/dist/capsule/p-a6214f0a.entry.js.map +0 -1
- package/dist/capsule/p-ab7b3141.entry.js +0 -2
- package/dist/capsule/p-ab7b3141.entry.js.map +0 -1
|
@@ -7872,6 +7872,18 @@ const Stars01Filled = `<svg width="24" height="24" viewBox="0 0 24 24" fill="cur
|
|
|
7872
7872
|
</svg>
|
|
7873
7873
|
`;
|
|
7874
7874
|
|
|
7875
|
+
const Stars02 = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
|
|
7876
|
+
<g clip-path="url(#clip0_2396_384)">
|
|
7877
|
+
<path d="M3.74999 18.3334V14.1667M3.74999 5.83341V1.66675M1.66666 3.75008H5.83332M1.66666 16.2501H5.83332M10.8333 2.50008L9.38817 6.25747C9.15317 6.86849 9.03566 7.174 8.85293 7.43099C8.69098 7.65875 8.49199 7.85774 8.26423 8.01969C8.00725 8.20242 7.70173 8.31992 7.09071 8.55493L3.33332 10.0001L7.09071 11.4452C7.70173 11.6802 8.00725 11.7977 8.26423 11.9805C8.49199 12.1424 8.69098 12.3414 8.85293 12.5692C9.03566 12.8262 9.15317 13.1317 9.38818 13.7427L10.8333 17.5001L12.2785 13.7427C12.5135 13.1317 12.631 12.8262 12.8137 12.5692C12.9757 12.3414 13.1747 12.1424 13.4024 11.9805C13.6594 11.7977 13.9649 11.6802 14.5759 11.4452L18.3333 10.0001L14.5759 8.55493C13.9649 8.31992 13.6594 8.20242 13.4024 8.01969C13.1747 7.85774 12.9757 7.65875 12.8137 7.43099C12.631 7.174 12.5135 6.86849 12.2785 6.25747L10.8333 2.50008Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
7878
|
+
</g>
|
|
7879
|
+
<defs>
|
|
7880
|
+
<clipPath id="clip0_2396_384">
|
|
7881
|
+
<rect width="20" height="20" fill="currentColor"/>
|
|
7882
|
+
</clipPath>
|
|
7883
|
+
</defs>
|
|
7884
|
+
</svg>
|
|
7885
|
+
`;
|
|
7886
|
+
|
|
7875
7887
|
const Stars = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
|
|
7876
7888
|
<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"/>
|
|
7877
7889
|
<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"/>
|
|
@@ -12146,6 +12158,7 @@ const Icons = {
|
|
|
12146
12158
|
spacingHeight: SpacingHeight,
|
|
12147
12159
|
star04Filled: Star04Filled,
|
|
12148
12160
|
stars01Filled: Stars01Filled,
|
|
12161
|
+
stars02: Stars02,
|
|
12149
12162
|
stars: Stars,
|
|
12150
12163
|
stopSquare: StopSquare,
|
|
12151
12164
|
stripeBrand: StripeBrand,
|
|
@@ -12645,7 +12658,7 @@ const CpslFileUpload = class {
|
|
|
12645
12658
|
let inputIds$2 = 0;
|
|
12646
12659
|
CpslFileUpload.style = CpslFileUploadStyle0;
|
|
12647
12660
|
|
|
12648
|
-
const cpslIconCss = ":host{display:block;--height:24px;--width:24px;--icon-color:currentColor;--icon-fill-color:currentColor;--icon-stroke-color:currentColor;width:var(--width);height:var(--height)}:host .foreground-0{fill:var(--cpsl-color-foreground-0);stop-color:var(--cpsl-color-foreground-0)}:host .accent-0{fill:var(--cpsl-color-accent-0, var(--cpsl-color-foreground-0));stop-color:var(--cpsl-color-accent-0, var(--cpsl-color-foreground-0))}:host div{display:flex;width:100%;height:100%;color:var(--icon-color)}:host svg{width:100
|
|
12661
|
+
const cpslIconCss = ":host{display:block;--filter:auto;--height:24px;--width:24px;--svg-height:calc(var(--height) - (2 * var(--inset)));--svg-width:calc(var(--width) - (2 * var(--inset)));--icon-color:currentColor;--icon-fill-color:currentColor;--icon-stroke-color:currentColor;width:var(--width);height:var(--height)}:host .foreground-0{fill:var(--cpsl-color-foreground-0);stop-color:var(--cpsl-color-foreground-0)}:host .accent-0{fill:var(--cpsl-color-accent-0, var(--cpsl-color-foreground-0));stop-color:var(--cpsl-color-accent-0, var(--cpsl-color-foreground-0))}:host div{display:flex;justify-content:center;align-items:center;width:100%;height:100%;color:var(--icon-color)}:host svg{width:var(--svg-width, \"100%\");height:var(--svg-height, \"100%\");filter:var(--filter)}: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:100%;height:100%;object-fit:contain}";
|
|
12649
12662
|
const CpslIconStyle0 = cpslIconCss;
|
|
12650
12663
|
|
|
12651
12664
|
const CpslIcon = class {
|
|
@@ -12653,10 +12666,12 @@ const CpslIcon = class {
|
|
|
12653
12666
|
registerInstance(this, hostRef);
|
|
12654
12667
|
this.src = undefined;
|
|
12655
12668
|
this.size = undefined;
|
|
12669
|
+
this.invert = undefined;
|
|
12670
|
+
this.inset = '0px';
|
|
12656
12671
|
this.icon = undefined;
|
|
12657
12672
|
}
|
|
12658
12673
|
render() {
|
|
12659
|
-
return (h(Host, { key: '
|
|
12674
|
+
return (h(Host, { key: '42f171468ddb966ecdf81dc4e6bac3004f5f0761', part: "icon", role: "img", style: Object.assign(Object.assign({ ['--inset']: this.inset }, (this.size ? { ['--height']: this.size, ['--width']: this.size } : {})), (this.invert ? { ['--filter']: 'invert(100%)' } : {})) }, !this.icon ? h("img", { src: this.src }) : h("div", { innerHTML: Icons[this.icon] })));
|
|
12660
12675
|
}
|
|
12661
12676
|
};
|
|
12662
12677
|
CpslIcon.style = CpslIconStyle0;
|
|
@@ -16469,7 +16484,7 @@ var inputmask = {exports: {}};
|
|
|
16469
16484
|
|
|
16470
16485
|
const Inputmask = /*@__PURE__*/getDefaultExportFromCjs(inputmask.exports);
|
|
16471
16486
|
|
|
16472
|
-
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);--input-font-weight:400;--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:8px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}:host(.contrast-text){--input-color:var(--cpsl-color-contrast)}: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)}.input-container.textarea{height:auto;min-height:var(--container-height)}.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);font-weight:var(--input-font-weight);color:var(--input-color);background:var(--input-background-color);resize:none;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;}.native-input::-moz-selection{color:var(--cpsl-color-text-inverted);background:var(--cpsl-color-background-64)}.native-input::selection{color:var(--cpsl-color-text-inverted);background:var(--cpsl-color-background-64)}.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) - 4px);--button-padding-top:4px;--button-padding-start:4px;--button-padding-end:4px;--button-padding-bottom:4px}: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)}";
|
|
16487
|
+
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);--input-font-weight:400;--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:8px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}:host(.contrast-text){--input-color:var(--cpsl-color-contrast)}: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:var(--container-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)}.input-container.textarea{height:auto;min-height:var(--container-height)}.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);font-weight:var(--input-font-weight);color:var(--input-color);background:var(--input-background-color);width:var(--input-width, auto);text-align:var(--input-text-align, left);resize:none;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;}.native-input::-moz-selection{color:var(--cpsl-color-text-inverted);background:var(--cpsl-color-background-64)}.native-input::selection{color:var(--cpsl-color-text-inverted);background:var(--cpsl-color-background-64)}.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) - 4px);--button-padding-top:4px;--button-padding-start:4px;--button-padding-end:4px;--button-padding-bottom:4px}: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)}";
|
|
16473
16488
|
const CpslInputStyle0 = cpslInputCss;
|
|
16474
16489
|
|
|
16475
16490
|
const CpslInput = class {
|
|
@@ -16549,6 +16564,7 @@ const CpslInput = class {
|
|
|
16549
16564
|
this.contrastText = false;
|
|
16550
16565
|
this.enterkeyhint = undefined;
|
|
16551
16566
|
this.errorText = undefined;
|
|
16567
|
+
this.fitContent = false;
|
|
16552
16568
|
this.mask = undefined;
|
|
16553
16569
|
this.isPhone = undefined;
|
|
16554
16570
|
this.helperText = undefined;
|
|
@@ -16671,8 +16687,8 @@ const CpslInput = class {
|
|
|
16671
16687
|
return this.el.querySelector('[slot="end"]');
|
|
16672
16688
|
}
|
|
16673
16689
|
render() {
|
|
16674
|
-
var _a, _b;
|
|
16675
|
-
return (h(Host, { key: '
|
|
16690
|
+
var _a, _b, _c, _d;
|
|
16691
|
+
return (h(Host, { key: '9b5abde0435d0acbb4f453e3c7b4c7d1da89a165', class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.focusedValue) || Boolean(this.value), 'contrast-text': this.contrastText } }, this.label && (h("label", { key: '1ef8472e4ab2a114a3ac961ed5fbcafe82041631', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '8945dd09731255aab8acb91f4e12f5285ec86930', class: { 'input-container': true, 'error-container': Boolean(this.errorText), 'textarea': this.as === 'textarea' } }, h("slot", { key: '2f36a7cb8086269c51a4924dc671245a31eddb4f', name: "start" }), h(this.as, { key: '9e244a91bc8909db5fcf54fd10ccf221df8846c2', part: "native-input", class: { 'native-input': true }, 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, size: this.fitContent ? ((_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 1) : undefined, spellcheck: this.spellcheck, type: this.type, value: (_c = this.value) !== null && _c !== void 0 ? _c : '', rows: this.rows, onInput: this.onInput, onChange: this.onChange, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.focusInput, onPaste: this.onPaste }), h("slot", { key: '3f3f289699ca56a6c9d0b5e01e702c6a301697dc', name: "end" })), (this.errorText || this.helperText) && (h("div", { key: 'f413751aca4b5059a6b3e6151182b19b09a85d89', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '5189ac80ac4356f267412a93564b077888a206cf' }, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText)))));
|
|
16676
16692
|
}
|
|
16677
16693
|
get el() { return getElement(this); }
|
|
16678
16694
|
static get watchers() { return {
|
|
@@ -16930,15 +16946,30 @@ const CpslPopover = class {
|
|
|
16930
16946
|
{
|
|
16931
16947
|
eventName: 'mousedown',
|
|
16932
16948
|
callback: e => {
|
|
16949
|
+
var _a;
|
|
16950
|
+
const targetId = (_a = e.target.id) !== null && _a !== void 0 ? _a : '';
|
|
16951
|
+
if (targetId === 'ignore-click') {
|
|
16952
|
+
return;
|
|
16953
|
+
}
|
|
16933
16954
|
if (this.preventBlur) {
|
|
16934
16955
|
e.preventDefault();
|
|
16935
16956
|
}
|
|
16936
|
-
this.
|
|
16957
|
+
if (!this.open) {
|
|
16958
|
+
this.present();
|
|
16959
|
+
}
|
|
16960
|
+
else if (e.target === this.triggerEl) {
|
|
16961
|
+
this.close();
|
|
16962
|
+
}
|
|
16937
16963
|
},
|
|
16938
16964
|
},
|
|
16939
16965
|
{
|
|
16940
16966
|
eventName: 'touchstart',
|
|
16941
16967
|
callback: e => {
|
|
16968
|
+
var _a;
|
|
16969
|
+
const targetId = (_a = e.target.id) !== null && _a !== void 0 ? _a : '';
|
|
16970
|
+
if (targetId === 'ignore-click') {
|
|
16971
|
+
return;
|
|
16972
|
+
}
|
|
16942
16973
|
if (this.preventBlur) {
|
|
16943
16974
|
e.preventDefault();
|
|
16944
16975
|
}
|
|
@@ -17095,7 +17126,7 @@ const CpslPopover = class {
|
|
|
17095
17126
|
}
|
|
17096
17127
|
render() {
|
|
17097
17128
|
var _a;
|
|
17098
|
-
return (h(Host, { key: '
|
|
17129
|
+
return (h(Host, { key: '37ea2f5b4c7b73aed811317d813ceb9bce8bc38f', class: {
|
|
17099
17130
|
'open': this.open,
|
|
17100
17131
|
'transform-h-left': this.transformOriginHorizontal === 'left',
|
|
17101
17132
|
'transform-h-center': this.transformOriginHorizontal === 'center',
|
|
@@ -17107,9 +17138,9 @@ const CpslPopover = class {
|
|
|
17107
17138
|
top: `${this.positionY}px`,
|
|
17108
17139
|
left: `${this.positionX}px`,
|
|
17109
17140
|
width: !this.open ? '0px' : this.autoWidth ? 'auto' : `${(_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.clientWidth}px`,
|
|
17110
|
-
} }, h("div", { key: '
|
|
17141
|
+
} }, h("div", { key: '900e9d9089b5cb97ddfb37c10f1ee6e340ca48f6', id: "container", class: { container: true, open: this.open }, style: {
|
|
17111
17142
|
visibility: this.hasSetInitialPosition ? 'visible' : 'hidden',
|
|
17112
|
-
} }, h("slot", { key: '
|
|
17143
|
+
} }, h("slot", { key: 'd734f622b563b747ee6bc4deadfa4a515e91b0d7' }))));
|
|
17113
17144
|
}
|
|
17114
17145
|
get el() { return getElement(this); }
|
|
17115
17146
|
static get watchers() { return {
|
|
@@ -21340,7 +21371,12 @@ const CpslSelect = class {
|
|
|
21340
21371
|
typeof window !== 'undefined' && window.removeEventListener('click', this.handleClickOutside);
|
|
21341
21372
|
}
|
|
21342
21373
|
};
|
|
21343
|
-
this.handleClick = () => {
|
|
21374
|
+
this.handleClick = (e) => {
|
|
21375
|
+
var _a;
|
|
21376
|
+
const targetId = (_a = e.target.id) !== null && _a !== void 0 ? _a : '';
|
|
21377
|
+
if (targetId === 'ignore-click') {
|
|
21378
|
+
return;
|
|
21379
|
+
}
|
|
21344
21380
|
if (!this.disabled) {
|
|
21345
21381
|
this.hasFocus = true;
|
|
21346
21382
|
typeof window !== 'undefined' && window.addEventListener('click', this.handleClickOutside);
|
|
@@ -21397,11 +21433,11 @@ const CpslSelect = class {
|
|
|
21397
21433
|
}
|
|
21398
21434
|
render() {
|
|
21399
21435
|
var _a, _b, _c, _d, _e;
|
|
21400
|
-
const selectedValueAsString =
|
|
21401
|
-
return (h(Host, { key: '
|
|
21436
|
+
const selectedValueAsString = Array.isArray(this.selectedValue) ? this.selectedValue.join(', ') : this.selectedValue;
|
|
21437
|
+
return (h(Host, { key: 'f7c2db799e3462ef83fd0e7b29a3fd88a2d69e38', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem } }, this.label && (h("label", { key: '8629dcd2d81bbf631962f84c551b2e2a3c96dd33', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: 'f01a1d57e48256e4b1898beeebb4c01275966aa6', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: 'eb8a31b3254990d3f4165275561b21fe9e9abaf9', name: "selected-item" }), h("div", { key: 'a78cec861e87ac9702477bddf10ec4c66cf37626', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '74fdd4ff8ad178376220d89890f507b304298be4', class: { 'selected-text': true, 'placeholder': !this.selectedValue }, part: "selected-text", color: this.selectedItemColor, variant: this.selectedItemVariant, weight: this.selectedItemWeight }, !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 : selectedValueAsString)))), h("cpsl-icon", { key: '7f0f942c54e7b72279fbff7cba99b1a84105b912', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }, icon: this.icon }), h("input", { key: '43e2fbcd9d13168ecdd9fadb2047591480cf2c42', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" }), h("cpsl-popover", { key: '926ef9d6f59215260143f133104e63a46ecedc1f', part: "popover", autoWidth: this.autoWidth, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '90520534785a584d539d5ef8e49ff394d2f4c3d7', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'e0cf6cf0e4d0c17981b78428ff3ceeb049cebba5', class: "search-container" }, h("cpsl-input", { key: 'e1d3bc0a68026b0cbbca0677a30b26934b6296be', onClick: e => e.stopPropagation(), placeholder: (_d = this.searchPlaceholder) !== null && _d !== void 0 ? _d : 'Search', value: "", onCpslInput: e => {
|
|
21402
21438
|
e.stopPropagation();
|
|
21403
21439
|
this.cpslSearchChange.emit(e.detail.value);
|
|
21404
|
-
} }))), h("div", { key: '
|
|
21440
|
+
} }))), h("div", { key: '4f12646017f6b9c95a717188d7329750e8bdf74e', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: '33fd8a222ea76686c6d00ed388decb5ab10b98d8', name: "items" }))))), (this.errorText || this.helperText) && (h("div", { key: 'f9e99bd7e2a4c4eb98ea540c2ba0ed9a1e0feb67', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'eae52c7b8dad9a6f702abb01f9f8205d7a96a82d' }, (_e = this.errorText) !== null && _e !== void 0 ? _e : this.helperText)))));
|
|
21405
21441
|
}
|
|
21406
21442
|
get el() { return getElement(this); }
|
|
21407
21443
|
static get watchers() { return {
|