@usecapsule/core-components 3.0.1-dev.2 → 3.0.1-dev.4
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/capsule/capsule.esm.js +1 -1
- package/dist/capsule/{p-dd596431.entry.js → p-a7db40a8.entry.js} +2 -2
- package/dist/capsule/p-a7db40a8.entry.js.map +1 -0
- package/dist/cjs/cpsl-alert_33.cjs.entry.js +4 -22
- package/dist/cjs/cpsl-alert_33.cjs.entry.js.map +1 -1
- package/dist/collection/components/cpsl-popover/cpsl-popover.js +3 -3
- package/dist/collection/components/cpsl-popover/cpsl-popover.js.map +1 -1
- package/dist/collection/components/cpsl-select/cpsl-select.js +1 -19
- package/dist/collection/components/cpsl-select/cpsl-select.js.map +1 -1
- package/dist/esm/cpsl-alert_33.entry.js +4 -22
- package/dist/esm/cpsl-alert_33.entry.js.map +1 -1
- package/dist/types/components/cpsl-select/cpsl-select.d.ts +0 -3
- package/package.json +1 -1
- package/dist/capsule/p-dd596431.entry.js.map +0 -1
|
@@ -15186,7 +15186,7 @@ const CpslPopover = class {
|
|
|
15186
15186
|
onOpenChange() {
|
|
15187
15187
|
if (this.open) {
|
|
15188
15188
|
window.addEventListener('click', this.handleClickOutside);
|
|
15189
|
-
window.addEventListener('scroll', () => this.setPosition());
|
|
15189
|
+
window.addEventListener('scroll', () => this.setPosition(), true);
|
|
15190
15190
|
}
|
|
15191
15191
|
else {
|
|
15192
15192
|
window.removeEventListener('click', this.handleClickOutside);
|
|
@@ -15202,7 +15202,7 @@ const CpslPopover = class {
|
|
|
15202
15202
|
}
|
|
15203
15203
|
render() {
|
|
15204
15204
|
var _a;
|
|
15205
|
-
return (index.h(index.Host, { key: '
|
|
15205
|
+
return (index.h(index.Host, { key: 'bb9a38fb37e6588041f6b09e064cbe85d0dd46b1', class: {
|
|
15206
15206
|
'open': this.open,
|
|
15207
15207
|
'transform-h-left': this.transformOriginHorizontal === 'left',
|
|
15208
15208
|
'transform-h-center': this.transformOriginHorizontal === 'center',
|
|
@@ -15210,7 +15210,7 @@ const CpslPopover = class {
|
|
|
15210
15210
|
'transform-v-top': this.transformOriginVertical === 'top',
|
|
15211
15211
|
'transform-v-center': this.transformOriginVertical === 'center',
|
|
15212
15212
|
'transform-v-bottom': this.transformOriginVertical === 'bottom',
|
|
15213
|
-
}, 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: '
|
|
15213
|
+
}, 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: '99478330639eed6be6f7e5a960ebb2f485692cff', id: "container", class: { container: true, open: this.open } }, index.h("slot", { key: '2d15adf8c986698ce02858dfdca49047777e2c33' }))));
|
|
15214
15214
|
}
|
|
15215
15215
|
get el() { return index.getElement(this); }
|
|
15216
15216
|
static get watchers() { return {
|
|
@@ -15330,18 +15330,6 @@ const CpslSelect = class {
|
|
|
15330
15330
|
this.cpslFocus = index.createEvent(this, "cpslFocus", 7);
|
|
15331
15331
|
this.cpslSelectValueChange = index.createEvent(this, "cpslSelectValueChange", 7);
|
|
15332
15332
|
this.inputId = `cpsl-select-${inputIds++}`;
|
|
15333
|
-
this.resetStyles = () => {
|
|
15334
|
-
document.documentElement.style.removeProperty('overflow');
|
|
15335
|
-
document.body.style.removeProperty('padding-right');
|
|
15336
|
-
};
|
|
15337
|
-
this.measureScrollbarWidth = () => {
|
|
15338
|
-
const scrollbox = document.createElement('div');
|
|
15339
|
-
scrollbox.style.overflow = 'scroll';
|
|
15340
|
-
document.body.appendChild(scrollbox);
|
|
15341
|
-
const scrollBarWidth = scrollbox.offsetWidth - scrollbox.clientWidth;
|
|
15342
|
-
document.body.removeChild(scrollbox);
|
|
15343
|
-
return scrollBarWidth;
|
|
15344
|
-
};
|
|
15345
15333
|
this.onBlur = (ev) => {
|
|
15346
15334
|
this.hasFocus = false;
|
|
15347
15335
|
this.popoverEl.closePopover();
|
|
@@ -15412,24 +15400,18 @@ const CpslSelect = class {
|
|
|
15412
15400
|
}
|
|
15413
15401
|
onPopoverOpen() {
|
|
15414
15402
|
this.popoverOpen = true;
|
|
15415
|
-
document.documentElement.style.overflow = 'hidden';
|
|
15416
|
-
document.body.style.paddingRight = `${this.measureScrollbarWidth()}px`;
|
|
15417
15403
|
}
|
|
15418
15404
|
onPopoverClose() {
|
|
15419
15405
|
this.popoverOpen = false;
|
|
15420
|
-
this.resetStyles();
|
|
15421
15406
|
}
|
|
15422
15407
|
componentDidLoad() {
|
|
15423
15408
|
this.popoverEl = this.el.shadowRoot.querySelector(`cpsl-popover`);
|
|
15424
15409
|
this.anchorEl = this.el.shadowRoot.getElementById('select-container');
|
|
15425
15410
|
this.selectItem();
|
|
15426
15411
|
}
|
|
15427
|
-
disconnectedCallback() {
|
|
15428
|
-
this.resetStyles();
|
|
15429
|
-
}
|
|
15430
15412
|
render() {
|
|
15431
15413
|
var _a, _b, _c, _d;
|
|
15432
|
-
return (index.h(index.Host, { key: '
|
|
15414
|
+
return (index.h(index.Host, { key: 'dfe6786c9be71ebd71fee236c9b569ef1ad30eac', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) } }, this.label && (index.h("label", { key: 'fbe2cfb2d93558f647442e17b29713f37375be5a', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? index.h("span", { class: "optional-label" }, "(optional)") : '')), index.h("div", { key: '9e5fdf3c056a7a6c13fe9ce45caf78e27482e779', id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && index.h("slot", { key: 'c721fcd057a142bad5f8f473c7b4daf090e7722a', name: "selected-item" }), index.h("div", { key: '58c94ace573965e8151ef4a9c0648385d6b1c4dc', class: "selected-container-content", id: "selected-container-content" }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (index.h("cpsl-text", { key: 'ceb4c60607b6c2cbc17a086fe702045196afbd44', 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: '05cf53f1ce3f8f34e47082c591f2d75d4aeea11b', class: { 'chevron': true, 'open': this.popoverOpen, 'has-value': Boolean(this.selectedValue) }, icon: "chevronUp" }), index.h("input", { key: 'a395add0f06b0d10f1e2e6d0ea81478f4a1c07d6', 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", { key: 'e7f991ed99ed332f5f42e666bfd2d25eecff3113', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, index.h("span", { key: 'f734a586f0dd7e94ccb2d7806fc9a6a5bdb5f50b' }, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText))), index.h("cpsl-popover", { key: 'c45f42267e3b4945823e27f5901b58dc5545a51e', autoWidth: false, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, index.h("div", { key: 'cd7bdc9a3e06a2c4aed9ebe12ec3cd070e323b12', class: "dropdown" }, index.h("div", { key: '0e1483542dd9d63ad548242a2bc2ecb2041f8ed5', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, index.h("slot", { key: 'e7697bc187fc433ccb2f5728f8944ff2162387d9', name: "items" }))))));
|
|
15433
15415
|
}
|
|
15434
15416
|
get el() { return index.getElement(this); }
|
|
15435
15417
|
static get watchers() { return {
|