@dropi/ui 0.1.53 → 0.1.54
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/hydrate/index.js +86 -94
- package/hydrate/index.mjs +86 -94
- package/package.json +1 -1
- package/readme.md +85 -11
package/hydrate/index.mjs
CHANGED
|
@@ -5374,7 +5374,7 @@ class DropiAccordion {
|
|
|
5374
5374
|
/** Allows multiple sections to be open at the same time. If false, only one section can be open. */
|
|
5375
5375
|
multiple = false;
|
|
5376
5376
|
render() {
|
|
5377
|
-
return (hAsync("div", { key: '
|
|
5377
|
+
return (hAsync("div", { key: 'c8c70f9c2210e1bc6de7d0933f082a0d1c008837', class: "accordion-container" }, hAsync("slot", { key: '9fe1055ed6f5a2fc5c3e8dde47b694ea0acdbcb9' })));
|
|
5378
5378
|
}
|
|
5379
5379
|
static get style() { return dropiAccordionCss(); }
|
|
5380
5380
|
static get cmpMeta() { return {
|
|
@@ -5432,7 +5432,7 @@ class DropiAccordionItem {
|
|
|
5432
5432
|
setTimeout(() => this.updateHeight(this.open), 0);
|
|
5433
5433
|
}
|
|
5434
5434
|
render() {
|
|
5435
|
-
return (hAsync("div", { key: '
|
|
5435
|
+
return (hAsync("div", { key: '98de1df9b82f0e4e5e72702b7eaca12c0ed92586', class: { 'accordion-item': true, 'accordion-item--open': this.open, 'accordion-item--disabled': this.disabled } }, hAsync("button", { key: 'bd5c3e6ea29feb33e5280908c98929369dc7377e', class: "accordion-header", onClick: () => this.handleToggle(), "aria-expanded": String(this.open), disabled: this.disabled }, hAsync("span", { key: 'ced161eb1187d50b7eb2002081cd3fc008c9a16f', class: "accordion-header-left" }, this.preIcon && hAsync("dropi-icon", { key: '09a157623f0978153b57e85a79d7beeca3faf9ab', name: this.preIcon, iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-600" }), hAsync("span", { key: '649617f263370d1314e3145c07a3a29ce5c807b5', class: "accordion-title" }, this.sectionTitle)), hAsync("span", { key: 'd99e3933a40ffa4b1da8091a8b6d767011f1bf6f', class: { 'accordion-chevron': true, 'accordion-chevron--open': this.open } }, hAsync("dropi-icon", { key: '3d12ae988429fea2612c0c32c12cd81a486ad255', name: "Dropdown-down", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-500" }))), hAsync("div", { key: 'cedff4803c6fa83ae9dc5cb3ce68f48150cdef67', class: "accordion-body", style: { maxHeight: this.contentHeight }, ref: (el) => this.contentRef = el }, hAsync("div", { key: 'a37dd42bf39cf08479d847286860e78a1d80a233', class: "accordion-content" }, hAsync("slot", { key: 'd797eac747716be1af2a6addbefe583be4a816b1' })))));
|
|
5436
5436
|
}
|
|
5437
5437
|
static get watchers() { return {
|
|
5438
5438
|
"open": [{
|
|
@@ -5725,7 +5725,7 @@ class DropiAlertModal {
|
|
|
5725
5725
|
const lottieKey = this.loading ? 'loading' : this.type;
|
|
5726
5726
|
const isLottieLoading = lottieKey === 'loading';
|
|
5727
5727
|
const lottieSrc = LOTTIE_MAP[lottieKey];
|
|
5728
|
-
return (hAsync("dropi-modal", { key: '
|
|
5728
|
+
return (hAsync("dropi-modal", { key: '9e44e3e2336cea618ad493257a9057f6ed05b3b9', visible: this.visible, showHeader: this.closable, showCloseIcon: this.closable, dismissable: false, closeOnEscape: false, showFooter: false, size: "s", onDropiHide: () => this.onModalHide() }, hAsync("div", { key: '2c83ef5ed1bce3821221404572e08ff83e5788a7', class: "body-alert" }, lottieSrc && (hAsync("div", { key: 'aef9b32ed8f6a9eed2d49b78a579efca7c30de35', class: `lottie-img${isLottieLoading ? ' lottie-img--loading' : ''}` }, hAsync("lottie-player", { key: lottieKey, src: lottieSrc, background: "transparent", speed: "1", loop: true, autoplay: true }))), hAsync("div", { key: '5c5161f34e04e783120cda34cbfda41da0061b40', class: "content-alert" }, hAsync("h2", { key: 'ea451c2f1d424a4ca9453eee500055929a4ee0cd' }, this.loading ? this.loadingTitle : this.tittle), hAsync("p", { key: '6fc476e3b79305a8542a9e3254a648df46e612c2' }, this.loading ? this.loadingMessage : this.message)), hAsync("div", { key: 'c6b62bd577696a2f474c05f6a91030f3caa17c9e', class: "custom-content" }, hAsync("slot", { key: '42957aad93193457111a074bad254c6209c5fb12' })), !this.loading && this.displayButtons && (hAsync("div", { key: 'f6bec3425de91611537bc418c7896b7dc510ace6', class: "actions" }, this.secondaryButton && hAsync("dropi-button", { key: 'e169fb4dbd9d6d5548095d59ddde524b6540b7a8', text: this.secondaryButton, severity: "secondary", onDropiClick: () => this.handleSecondary(), fullWidth: true }), hAsync("dropi-button", { key: 'f892a5d0fce7eae2d24fedc71a925c5c2cf767dd', text: this.primaryButton, severity: "primary", onDropiClick: () => this.handlePrimary(), fullWidth: true }))))));
|
|
5729
5729
|
}
|
|
5730
5730
|
static get watchers() { return {
|
|
5731
5731
|
"params": [{
|
|
@@ -5786,7 +5786,7 @@ class DropiAvatars {
|
|
|
5786
5786
|
render() {
|
|
5787
5787
|
const displayInitials = this.initials?.slice(0, 2).toUpperCase();
|
|
5788
5788
|
const showInitials = !this.image && displayInitials;
|
|
5789
|
-
return (hAsync("figure", { key: '
|
|
5789
|
+
return (hAsync("figure", { key: 'db9310b5c789b079fc0f9043a619bd22f9a60151', class: { 'avatar': true, [`avatar--${this.type}`]: true } }, showInitials ? (hAsync("div", { class: "avatar__initials" }, displayInitials)) : (hAsync("img", { src: this.image || FALLBACK, alt: this.alt, onError: (e) => this.handleError(e) }))));
|
|
5790
5790
|
}
|
|
5791
5791
|
static get style() { return dropiAvatarsCss(); }
|
|
5792
5792
|
static get cmpMeta() { return {
|
|
@@ -5835,7 +5835,7 @@ class DropiBadge {
|
|
|
5835
5835
|
return null;
|
|
5836
5836
|
}
|
|
5837
5837
|
render() {
|
|
5838
|
-
return (hAsync("div", { key: '
|
|
5838
|
+
return (hAsync("div", { key: 'b4cae2eac2f963a641ca23e27b33899469b2b370', class: `tag-state ${this.state}` }, this.renderIcon(), hAsync("p", { key: '64a2504a1844f2cb9397878ca305aa183b0609a5' }, this.stateText[this.state])));
|
|
5839
5839
|
}
|
|
5840
5840
|
static get style() { return dropiBadgeCss(); }
|
|
5841
5841
|
static get cmpMeta() { return {
|
|
@@ -5870,7 +5870,7 @@ class DropiBadgeLegacy {
|
|
|
5870
5870
|
count = 0;
|
|
5871
5871
|
render() {
|
|
5872
5872
|
const isCounter = this.type === 'counter';
|
|
5873
|
-
return (hAsync("div", { key: '
|
|
5873
|
+
return (hAsync("div", { key: '58bb5c6625539109f010cccdcaafc37ab6da38ba', class: {
|
|
5874
5874
|
'badge-legacy': true,
|
|
5875
5875
|
[`badge-legacy--${this.variant}`]: true,
|
|
5876
5876
|
[`badge-legacy--${this.type}`]: true
|
|
@@ -6017,7 +6017,7 @@ class DropiBreadcrumb {
|
|
|
6017
6017
|
}
|
|
6018
6018
|
render() {
|
|
6019
6019
|
const items = this.parsedItems;
|
|
6020
|
-
return (hAsync("nav", { key: '
|
|
6020
|
+
return (hAsync("nav", { key: 'c4546d7a0c7852e01f685176b5365f1e0082ad24', class: "breadcrumb", "aria-label": "Breadcrumb" }, hAsync("div", { key: '924ab634ae4e71f6bd39a67b4b3889cdca20234d', class: "crumb-list" }, hAsync("div", { key: 'e7b1b285bdd497a028a041ada1eb8b34f77384b0', class: "crumb-home" }, hAsync("a", { key: '9e288d5f5761daed20b35dbf056c7de9c2e7b8e3', href: this.homeRoute, class: "home-link", "aria-label": "Inicio", onClick: (e) => { e.preventDefault(); this.dropiNavigate.emit(this.homeRoute); } }, hAsync("dropi-icon", { key: '803ab6d710976b341f19ad7d49fde670acc2c466', name: this.homeIconName, iconWidth: "16px", color: "Gray-Gray-500" })), items.length > 0 && (hAsync("dropi-icon", { key: '44d1cad9efa9cbc6a52bc26a2229af6680cd8733', name: "Dropdown-Right", iconWidth: "16px", color: "Gray-Gray-500" }))), items.map((item, idx) => {
|
|
6021
6021
|
const isLast = idx === items.length - 1;
|
|
6022
6022
|
const href = item.url || item.routerLink || '#';
|
|
6023
6023
|
return (hAsync("div", { class: "crumb", key: idx }, (!isLast || this.lastItemClickable) ? (hAsync("a", { class: `crumb-link Body-S-Regular${item.disabled ? ' disabled' : ''}`, href: href, onClick: (e) => {
|
|
@@ -6133,7 +6133,7 @@ class DropiButton {
|
|
|
6133
6133
|
const hasText = (this.text ?? '') !== '';
|
|
6134
6134
|
const showPostIcon = (this.postIcon ?? '') !== '' || (this.type ?? 'default') === 'dropdown';
|
|
6135
6135
|
const dropdownIcon = (this.type ?? 'default') === 'dropdown' ? 'Dropdown-down' : (this.postIcon ?? '');
|
|
6136
|
-
return (hAsync("button", { key: '
|
|
6136
|
+
return (hAsync("button", { key: '21d2654de08dff8db6c2b1ba87594e1184a7aa35', class: {
|
|
6137
6137
|
btn: true,
|
|
6138
6138
|
'without-text': !hasText,
|
|
6139
6139
|
[this.severity ?? 'primary']: true,
|
|
@@ -6141,7 +6141,7 @@ class DropiButton {
|
|
|
6141
6141
|
[this.size ?? 'normal']: true,
|
|
6142
6142
|
[this.state ?? 'default']: true,
|
|
6143
6143
|
'full-width': this.fullWidth,
|
|
6144
|
-
}, type: this.nativeType, disabled: isDisabled, onClick: (e) => this.handleClick(e) }, this.preIcon && (hAsync("dropi-icon", { key: '
|
|
6144
|
+
}, type: this.nativeType, disabled: isDisabled, onClick: (e) => this.handleClick(e) }, this.preIcon && (hAsync("dropi-icon", { key: '6c6c01c923a37df20b614602b18cd2da949bcb91', name: this.preIcon, iconWidth: this.iconSize, iconHeight: this.iconSize, color: this.fontColor })), hasText && hAsync("span", { key: '82447aab8b87bc4a89105cd0209e6c5681222f28', class: "text" }, this.text), showPostIcon && (hAsync("dropi-icon", { key: '6bdefe7c1c819b213d24e0100c2303fb7840ea00', name: dropdownIcon, iconWidth: this.iconSize, iconHeight: this.iconSize, color: this.fontColor })), this.state === 'loading' && this.renderLoadingSpinner(), hAsync("slot", { key: '44483caf52d2ca617ad86c1574a54709f8e77ab5' })));
|
|
6145
6145
|
}
|
|
6146
6146
|
static get formAssociated() { return true; }
|
|
6147
6147
|
static get style() { return dropiButtonCss(); }
|
|
@@ -6211,12 +6211,12 @@ class DropiCardCheckbox {
|
|
|
6211
6211
|
this.dropiChange.emit(this.isChecked);
|
|
6212
6212
|
}
|
|
6213
6213
|
render() {
|
|
6214
|
-
return (hAsync("div", { key: '
|
|
6214
|
+
return (hAsync("div", { key: 'b9004c813a03956904cfed8484cac2d8290be86f', class: {
|
|
6215
6215
|
'container-card-check': true,
|
|
6216
6216
|
'default-card': this.type === 'default',
|
|
6217
6217
|
'is-checked': this.isChecked && this.type === 'with card',
|
|
6218
6218
|
'disabled': this.disabled,
|
|
6219
|
-
}, onClick: () => this.handleClick() }, hAsync("dropi-checkbox", { key: '
|
|
6219
|
+
}, onClick: () => this.handleClick() }, hAsync("dropi-checkbox", { key: '7ac16d56fb2f3a0e415274f1e767ccddf49dc35d', name: "_card-checkbox", checked: this.isChecked, disabled: this.disabled }), hAsync("div", { key: 'a7d782c96ef6a5fad7e98ea2b7c5e5db09dfefe4', class: "container-text" }, hAsync("div", { key: '4cb9ecb3ec80a1ce375cefb044aedd8a6818f1f1', class: "title-check" }, this.title), this.description && hAsync("div", { key: '2f763eba23e8e1c52392cf251d6492e46d9d8c7c', class: "description-text" }, this.description)), (this.extraInfo || this.extraInfoDescription) && (hAsync("div", { key: 'f853d59072a10b4f9e924c6e62132ea3b7c5feca', class: "extra-info" }, this.extraInfo && hAsync("div", { key: '3c198762cd1e70622419959e39c0be41d51b1273' }, this.extraInfo), this.extraInfoDescription && hAsync("h4", { key: 'dc98cf76aa221d1a6cd49002376be6b9c3dcff3a' }, this.extraInfoDescription)))));
|
|
6220
6220
|
}
|
|
6221
6221
|
static get style() { return dropiCardCheckboxCss(); }
|
|
6222
6222
|
static get cmpMeta() { return {
|
|
@@ -6299,17 +6299,17 @@ class DropiCardProduct {
|
|
|
6299
6299
|
return 'var(--Success-Success-500, #0abb87)';
|
|
6300
6300
|
}
|
|
6301
6301
|
render() {
|
|
6302
|
-
return (hAsync("div", { key: '
|
|
6302
|
+
return (hAsync("div", { key: '2fe4ce42e1c331a99fd1171c82e6e48bfb5dbff0', class: "dropi-card-product", onClick: () => this.dropiProductClick.emit() }, hAsync("div", { key: '3f94077ee059e347f3ff4fff808a3a3f3a0ac827', class: "product-image-container" }, hAsync("div", { key: '1d6e8181cc630ab03efc90e316c349dfe9765b46', class: "product-image" }, hAsync("img", { key: 'f6647c21ac24d378482c6e6fe5220d6d18ff694b', src: this.image || '', alt: this.productName, onError: (e) => {
|
|
6303
6303
|
e.target.src = './assets/utils/no-image.jpg';
|
|
6304
|
-
}, class: !this.image ? 'error-img' : '' }), this.showFavorite && (hAsync("button", { key: '
|
|
6304
|
+
}, class: !this.image ? 'error-img' : '' }), this.showFavorite && (hAsync("button", { key: '37c23af5e1345e2f2b2ac42dd38f88eb17254889', class: { 'favorite-button': true, 'favorite-active': this.isFavorite }, onClick: (e) => {
|
|
6305
6305
|
e.stopPropagation();
|
|
6306
6306
|
this.isFavorite = !this.isFavorite;
|
|
6307
6307
|
this.dropiFavoriteChange.emit(this.isFavorite);
|
|
6308
|
-
}, "aria-label": "Favorito" }, hAsync("dropi-icon", { key: '
|
|
6308
|
+
}, "aria-label": "Favorito" }, hAsync("dropi-icon", { key: 'c6d6c87dcb5ae0f9a0d416667a3d39c7e153b7a6', name: this.isFavorite ? 'Heart-solid' : 'Heart', iconWidth: "18px", iconHeight: "18px", color: this.isFavorite ? '#fff' : '#858ea6' }))))), hAsync("div", { key: '66dbcb028acb35e9a43502e9ff9a00fd2ebf8bf2', class: "product-info" }, this.supplierCategory && (hAsync("dropi-ilustration-icon", { key: 'fd3d94e953a6b91418decc09ed426755a85bac1b', class: "supplier-insignia", type: "insignia", stateInsignia: this.supplierCategory, tagProduct: true })), hAsync("div", { key: '45817e3bb0bfdaa0ec8cb4a23fdac1bb943e93dc', class: "product-header" }, this.category && (hAsync("span", { key: 'c721519a5339a2ac40d20c283bbe8797b78e4b27', class: "category" }, this.category)), hAsync("div", { key: '49f5013738dfffcdb83dfde628f5d1d21164c3d2', class: "stock-info" }, hAsync("span", { key: 'bd49d5069d07b3ae10ac9c85a4b84bbb573f926e', class: "stock-label" }, "Stock:"), hAsync("span", { key: 'd0eefb88240c13c9c56e7470e79cbacc9d86caf4', class: "stock-value", style: { color: this.getStockColor() } }, this.stock === 0 ? 'Agotado' : this.stock))), hAsync("h3", { key: 'a880d0df13af0b75d553daf18e876905b93e6ef1', class: "product-name" }, this.productName), this.supplier && (hAsync("div", { key: 'faa82e269979084e7510b6a17fb1f3caee8ad181', class: "supplier-info" }, hAsync("span", { key: 'b4b223620c58cb30945b1c6be50559614937eb5f', class: "supplier-label" }, "Proveedor:"), hAsync("span", { key: '989580f42383c3b6adb6484a493d1293a2a11904', class: "supplier-name", onClick: (e) => { e.stopPropagation(); this.dropiSupplierClick.emit(); } }, this.supplier))), hAsync("div", { key: '451c1ab830c7ab38c4e414e94f11f63ffcf86162', class: "price-container" }, hAsync("div", { key: '755f3f8aac6f7b1d458d28b74dec2734b42794a6', class: "price-item" }, hAsync("span", { key: 'fff0a718b4f22641adcd28bbcb7e81a0f21755e9', class: "price-label" }, "Precio proveedor"), hAsync("span", { key: '5bb6843a4a293195f0dbda5c3eccfc4f38c719b1', class: "price-value" }, this.currency, " ", this.formatPrice(this.salePrice))), hAsync("div", { key: '468b1d7596ec5d727846a087b5d89461c5fef858', class: "price-item" }, hAsync("span", { key: '91b15e4d58d27997b2dfdb9c73fd417a8f8ba5fb', class: "price-label" }, "Precio sugerido"), hAsync("span", { key: '378483760ffac07491f5b65b37d5e27d41423ec5', class: "price-value" }, this.currency, " ", this.formatPrice(this.suggestedPrice))))), hAsync("div", { key: '71467832049894083ea3454618a12d082cb15844', class: "separator" }), this.showAddButton && (hAsync("div", { key: 'f9f0450e3dfa2b91ae7caa468811cc739d7a280e', class: { 'action-button': true, 'action-button--disabled': !this.inStock }, onClick: (e) => {
|
|
6309
6309
|
e.stopPropagation();
|
|
6310
6310
|
if (this.inStock)
|
|
6311
6311
|
this.dropiAddProduct.emit();
|
|
6312
|
-
} }, hAsync("dropi-icon", { key: '
|
|
6312
|
+
} }, hAsync("dropi-icon", { key: '50a9fad974460c2728fb1fca74628d093cbb1875', name: "Shopping-cart-arrow-rigth", iconWidth: "20px", iconHeight: "20px", color: "#f49a3d" }), hAsync("span", { key: 'f5ac44dd20e01bc644e863c3cbf51e3493821e70', class: "button-text" }, "Enviar a cliente")))));
|
|
6313
6313
|
}
|
|
6314
6314
|
static get style() { return dropiCardProductCss(); }
|
|
6315
6315
|
static get cmpMeta() { return {
|
|
@@ -6362,9 +6362,9 @@ class DropiCardSection {
|
|
|
6362
6362
|
/** Emitted when dropdown icon is clicked */
|
|
6363
6363
|
dropiClick;
|
|
6364
6364
|
render() {
|
|
6365
|
-
return (hAsync("div", { key: '
|
|
6365
|
+
return (hAsync("div", { key: '06fe2a580fb23484419ea4b1c41a265facb722de', class: "card-section" }, hAsync("div", { key: '1020ea256b0311a200a721387b3ecb8d0f3809ab', class: "card-section__text" }, this.type === 'important'
|
|
6366
6366
|
? hAsync("h5", { class: "card-section__title card-section__title--important" }, this.title)
|
|
6367
|
-
: hAsync("h6", { class: "card-section__title" }, this.title), this.description && hAsync("p", { key: '
|
|
6367
|
+
: hAsync("h6", { class: "card-section__title" }, this.title), this.description && hAsync("p", { key: '52ea93b6b2736c4c6e3ebb953c2878db90d34b4c', class: "card-section__desc" }, this.description)), hAsync("div", { key: '7ec0ed96e43b45256fd5dec5ee24b0dfd6488403', class: "card-section__control" }, this.typeElement === 'switch' ? (hAsync("dropi-switch", { name: "_card-section-switch", isChecked: this.isChecked, onDropiChange: (e) => {
|
|
6368
6368
|
this.isChecked = e.detail;
|
|
6369
6369
|
this.dropiChange.emit(e.detail);
|
|
6370
6370
|
} })) : (hAsync("button", { class: "card-section__dropdown-btn", onClick: () => this.dropiClick.emit(), "aria-label": "Expandir" }, hAsync("dropi-icon", { name: "Dropdown-down", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-500" }))))));
|
|
@@ -6597,12 +6597,12 @@ class DropiCheckbox {
|
|
|
6597
6597
|
this.dropiChange.emit(this.checked);
|
|
6598
6598
|
}
|
|
6599
6599
|
render() {
|
|
6600
|
-
return (hAsync("div", { key: '
|
|
6600
|
+
return (hAsync("div", { key: '091a0802423ae37f0473938259313d97a460645e', class: "container-dropi-checkbox", onClick: () => this.changeState() }, hAsync("div", { key: 'bf5c681b5285a6469e7652422010b3559ac057db', class: {
|
|
6601
6601
|
check: true,
|
|
6602
6602
|
isCheck: this.checked,
|
|
6603
6603
|
noCheck: !this.checked,
|
|
6604
6604
|
disabled: this.disabled,
|
|
6605
|
-
} }, hAsync("svg", { key: '
|
|
6605
|
+
} }, hAsync("svg", { key: 'be7eecf60b8f45fa6ebaa7c43d6a2087c79f02d0', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none" }, hAsync("path", { key: '6eda9ca377ab8480479f3f2ad880895dd9b54b9d', d: "M20.5991 5.69251L9.08325 17.2075C9.00583 17.2852 8.91382 17.3469 8.8125 17.389C8.71118 17.4311 8.60255 17.4527 8.49283 17.4527C8.38312 17.4527 8.27449 17.4311 8.17317 17.389C8.07185 17.3469 7.97984 17.2852 7.90242 17.2075L3.44908 12.75C3.37166 12.6723 3.27965 12.6106 3.17833 12.5685C3.07701 12.5264 2.96838 12.5048 2.85867 12.5048C2.74896 12.5048 2.64032 12.5264 2.53901 12.5685C2.43769 12.6106 2.34568 12.6723 2.26825 12.75C2.19052 12.8274 2.12884 12.9194 2.08676 13.0208C2.04467 13.1221 2.02301 13.2307 2.02301 13.3404C2.02301 13.4501 2.04467 13.5588 2.08676 13.6601C2.12884 13.7614 2.19052 13.8534 2.26825 13.9308L6.72325 18.385C7.19321 18.8541 7.83008 19.1175 8.49408 19.1175C9.15809 19.1175 9.79496 18.8541 10.2649 18.385L21.7799 6.87251C21.8575 6.7951 21.9191 6.70314 21.9611 6.6019C22.0031 6.50065 22.0247 6.39212 22.0247 6.28251C22.0247 6.17289 22.0031 6.06436 21.9611 5.96312C21.9191 5.86188 21.8575 5.76992 21.7799 5.69251C21.7025 5.61478 21.6105 5.5531 21.5092 5.51101C21.4078 5.46893 21.2992 5.44727 21.1895 5.44727C21.0798 5.44727 20.9712 5.46893 20.8698 5.51101C20.7685 5.5531 20.6765 5.61478 20.5991 5.69251Z", fill: "#FFFFFF" })))));
|
|
6606
6606
|
}
|
|
6607
6607
|
static get formAssociated() { return true; }
|
|
6608
6608
|
static get watchers() { return {
|
|
@@ -6681,10 +6681,10 @@ class DropiCheckboxSelectionList {
|
|
|
6681
6681
|
}
|
|
6682
6682
|
render() {
|
|
6683
6683
|
const items = this.filtered;
|
|
6684
|
-
return (hAsync("div", { key: '
|
|
6684
|
+
return (hAsync("div", { key: '95774833547807d6001525158bf199883661b649', class: "csl" }, this.showFilter && (hAsync("div", { key: '13f6bfd33150cdf138e90b93fc8121dfcc311050', class: "csl__search" }, hAsync("dropi-icon", { key: '4edf5c21eeac0aa442e58845621b7715d8484c1b', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("input", { key: '40071d0c189c7fd1f1bf8090ebe1d64ce9605602', class: "csl__search-input", type: "text", placeholder: this.filterPlaceholder, value: this.filterText, onInput: (e) => {
|
|
6685
6685
|
this.filterText = e.target.value;
|
|
6686
6686
|
this.dropiSearch.emit(this.filterText);
|
|
6687
|
-
} }), this.filterText && (hAsync("button", { key: '
|
|
6687
|
+
} }), this.filterText && (hAsync("button", { key: 'a560cab7ce53e57e036696194054286aa1dd6fd9', class: "csl__clear", onClick: () => { this.filterText = ''; this.dropiSearch.emit(''); } }, hAsync("dropi-icon", { key: 'f1ae7e38fcb954761edb02bb32af139fb5eea610', name: "Close-small", iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-400" }))))), hAsync("div", { key: 'e93dfccc8215e96640ebe8c69f33f0bff5f655f2', class: "csl__list" }, items.length === 0 && this.showNotFound ? (hAsync("div", { class: "csl__empty" }, this.notFoundMessage)) : (items.map(opt => {
|
|
6688
6688
|
const checked = this.selected.includes(opt.id);
|
|
6689
6689
|
return (hAsync("div", { class: "csl__item", key: opt.id, onClick: () => this.toggle(opt.id) }, hAsync("dropi-checkbox", { name: "_csl-option", checked: checked }), opt.icon && hAsync("img", { class: "csl__icon", src: opt.icon, alt: opt.label }), hAsync("span", { class: "csl__label" }, opt.label)));
|
|
6690
6690
|
})))));
|
|
@@ -6741,7 +6741,7 @@ class DropiChips {
|
|
|
6741
6741
|
/** Emitted when the close icon is clicked */
|
|
6742
6742
|
dropiClose;
|
|
6743
6743
|
render() {
|
|
6744
|
-
return (hAsync("div", { key: '
|
|
6744
|
+
return (hAsync("div", { key: '394a3ff5219535e9f4e1d6c9fbb320c32f1ce2e7', class: { 'chip': true, [`chip--${this.customStyle}`]: true } }, this.type === 'avatar' && this.urlImg && (hAsync("img", { key: 'c7ea7ce319e2ab0a179f7b0b61ad9fe39be7c1ec', class: "chip__avatar", src: this.urlImg, alt: "" })), this.type === 'icon' && this.icon && (hAsync("dropi-icon", { key: '67e2edfbe37af83868a665cf65a85ecc27b7cfb5', class: "chip__pre-icon", name: this.icon, iconWidth: "14px", iconHeight: "14px", color: "currentColor" })), hAsync("span", { key: '1916b1796d69cf6742177b8f4013315323bdf16f', class: "chip__text" }, hAsync("slot", { key: '167e1b230b1c4406ba3f40ba7783966c6b523c96' })), this.showIcon && (hAsync("button", { key: '118d46db1615e9ed14485500b5a754407c361139', class: "chip__close", onClick: () => this.dropiClose.emit(), "aria-label": "Eliminar" }, hAsync("dropi-icon", { key: '1639e4ae068d0361512469d2915b392101b2b923', name: "Cross-circle", iconWidth: "14px", iconHeight: "14px", color: "currentColor" })))));
|
|
6745
6745
|
}
|
|
6746
6746
|
static get style() { return dropiChipsCss(); }
|
|
6747
6747
|
static get cmpMeta() { return {
|
|
@@ -6854,7 +6854,7 @@ class DropiCitySelector {
|
|
|
6854
6854
|
}
|
|
6855
6855
|
render() {
|
|
6856
6856
|
const groups = this.filtered;
|
|
6857
|
-
return (hAsync("div", { key: '
|
|
6857
|
+
return (hAsync("div", { key: '5b1e27677c34d0dc85dc9c8544e4b0ba9a66216b', class: { 'city-selector': true, 'city-selector--disabled': this.disabled } }, hAsync("button", { key: 'e359c1baff0a255cd396ee35836430486bc67cd3', type: "button", class: "selector-trigger", disabled: this.disabled, onClick: () => this.toggle(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, hAsync("div", { key: '082246999f826e8cfe1b2d09fd801a5d7db7e1b2', class: "chips-area" }, this.selected.length === 0 && (hAsync("span", { key: '90453c84cae3561412f795ec1ffc01923cd87040', class: "placeholder" }, this.placeholder)), this.selected.map(val => (hAsync("span", { class: "chip", key: String(val) }, this.getLabel(val), hAsync("button", { type: "button", class: "chip-remove", "aria-label": "Quitar", onClick: (e) => this.removeCity(val, e) }, hAsync("dropi-icon", { name: "Close-small", iconWidth: "10px", iconHeight: "10px", color: "Primary-Primary-500" })))))), hAsync("dropi-icon", { key: 'f99675449127fb19fdea950db057d8c14ca62644', name: this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2', iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-500" })), this.isOpen && (hAsync("div", { key: '2a14a55016c19128fde45359f4b29b6f04f9b035', class: "dropdown", role: "listbox" }, hAsync("div", { key: '1321152ed7b0d3f50b04c7f28b05f1523c41cce4', class: "search-wrap" }, hAsync("div", { key: '7c94a7506d44cd89b83e5782cce16319f266f82c', class: "search-field" }, hAsync("input", { key: '5f40db9a8df0adc09776b4adcfe03a4a6d1d1467', class: "search-input", type: "text", placeholder: "Buscar...", value: this.searchTerm, onInput: (e) => { this.searchTerm = e.target.value; }, autoComplete: "off" }), hAsync("span", { key: '3140903ef4355b970c8f348e4f55d43f852e247d', class: "search-icon" }, hAsync("dropi-icon", { key: 'b59235b0d7a685000033d2a294fbce246d0ba4c2', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), hAsync("div", { key: 'bfd40e336b402bd92ec212466cf89e1cffb0d4be', class: "options-list" }, groups.length === 0 && (hAsync("div", { key: '9fce9b4df1ffb122278480f0ab60255ea0c795ec', class: "no-results" }, "Sin resultados")), groups.map(group => (hAsync("div", { key: group.value, class: "group" }, hAsync("div", { class: "group-label" }, group.label), group.items.map(city => {
|
|
6858
6858
|
const isSelected = this.selected.includes(city.value);
|
|
6859
6859
|
return (hAsync("div", { key: String(city.value), class: { 'city-option': true, 'city-option--selected': isSelected }, onClick: (e) => this.toggleCity(city.value, e), role: "option", "aria-selected": isSelected }, hAsync("span", { class: { 'checkbox': true, 'checkbox--checked': isSelected } }, isSelected && (hAsync("dropi-icon", { name: "Check", iconWidth: "10px", iconHeight: "10px", color: "Neutral-White" }))), hAsync("span", { class: "city-label" }, city.label)));
|
|
6860
6860
|
})))))))));
|
|
@@ -7188,10 +7188,10 @@ class DropiColorPicker {
|
|
|
7188
7188
|
}
|
|
7189
7189
|
}
|
|
7190
7190
|
render() {
|
|
7191
|
-
return (hAsync("div", { key: '
|
|
7191
|
+
return (hAsync("div", { key: '18ea41f637e46cb88d57cb2bc513f5e6e3ef9617', class: "general-container" }, hAsync("div", { key: '653748e883bc4deaf05739ced8e516f857a7a26b', class: "main-input-container" }, hAsync("div", { key: 'b8a4e60b25d6017c3987fa4ea3420c78e3400db0', class: "overlay", onClick: () => this.showEditor() }), hAsync("div", { key: 'e22f4b3e95f099e2444a46ee560fefb9f6556b65', class: "line-color-preview" }, hAsync("div", { key: 'cf513dbb5ee9652a6d20aad0608508cae3e000af', class: "color-preview", style: { background: this.currentColor } })), hAsync("div", { key: '025b264ae8aca0fca79f662c58250eea43ccf0e7', class: "color-info" }, hAsync("input", { key: '60a379b53bd0cf0bb1f80d5e1bd5b4c4038686f9', type: "text", class: "color-input", value: this.currentColor, maxLength: 9, readOnly: true }))), hAsync("div", { key: '06e15b97ba156a9aa9dec9f60f2b24c924c0ac53', class: `color-picker-container position-${this.position} ${this.showEdit ? 'show' : ''}` }, hAsync("div", { key: 'ea9df13cdf62ae1378b600dc7689df61bec5fc9b', class: "main-color-canvas-container" }, hAsync("canvas", { key: '5d73426ccfcccca44102300588472fe5e54744f9', ref: (el) => this.colorCanvas = el, width: 256, height: 150, onMouseDown: (e) => this.onColorMouseDown(e) }), hAsync("div", { key: 'e710e7f8c1558ad20dcfb0f03c98969d9aee5e91', class: "color-selector-pointer", style: {
|
|
7192
7192
|
left: `${(this.saturation / 100) * 256}px`,
|
|
7193
7193
|
top: `${((100 - this.currentVal) / 100) * 150}px`
|
|
7194
|
-
} })), hAsync("div", { key: '
|
|
7194
|
+
} })), hAsync("div", { key: '239c7986572fade46b913629bbd374ec6f15e6fb', class: "slider-container" }, hAsync("div", { key: '35c4231f321c42fa95f362da5bf211daf1671c79', class: "slider-group" }, hAsync("div", { key: '20be2dc7eff210e31ab3215da10473a23db921f1', class: "hue-slider-container" }, hAsync("canvas", { key: '0795238e2a59747c4bfbd3437a2a2fd9396dc9e2', ref: (el) => this.hueCanvas = el, width: 256, height: 20, onMouseDown: (e) => this.onHueMouseDown(e) }), hAsync("div", { key: '17296210ecef2a958a46f23971a04da61d59402e', class: "slider-pointer", style: { left: `${(this.hue / 360) * 234}px` } }))), hAsync("div", { key: 'af7504663561d0e811ae7ef163cce80cfa256187', class: "slider-group" }, hAsync("div", { key: '7f3f01cfb0e4ca93403dad15787ab8acd7c1cd82', class: "opacity-slider-container" }, hAsync("canvas", { key: '9bac8eca65bfba529748eb9788fc749b87115ca6', ref: (el) => this.opacityCanvas = el, width: 256, height: 20, onMouseDown: (e) => this.onOpacityMouseDown(e) }), hAsync("div", { key: '34166bf45efd6f4148395ede39680164662f8a33', class: "slider-pointer", style: { left: `${(this.opacity / 100) * 234}px` } }))), hAsync("div", { key: 'b43c40db224a560adb19fd91a8790efe11719ff9', class: "color-info" }, hAsync("div", { key: 'aad6ef925f30835b5d8f51d23f872560bcb62360', class: "color-label" }, "HEX"), hAsync("input", { key: 'bdb5fd6ca689251a7c566f32bc6c308873117b2c', type: "text", class: "color-input", value: this.color, onInput: (e) => this.onHexInputChange(e), maxLength: 9 }))))));
|
|
7195
7195
|
}
|
|
7196
7196
|
static get watchers() { return {
|
|
7197
7197
|
"value": [{
|
|
@@ -7252,7 +7252,7 @@ class DropiCountryFlags {
|
|
|
7252
7252
|
style['width'] = this.width.includes('px') ? this.width : `${this.width}px`;
|
|
7253
7253
|
if (this.height)
|
|
7254
7254
|
style['height'] = this.height.includes('px') ? this.height : `${this.height}px`;
|
|
7255
|
-
return (hAsync("figure", { key: '
|
|
7255
|
+
return (hAsync("figure", { key: '451765b675d5b27dc0357a1a2b6dd338690361c8', class: `flag ${this.customStyle ?? 'flat'}` }, hAsync("img", { key: 'f58a64e7d78298d328be2ba625c852a5eddc392f', src: this.src, style: style, alt: `flag-${this.country}` })));
|
|
7256
7256
|
}
|
|
7257
7257
|
static get style() { return dropiCountryFlagsCss(); }
|
|
7258
7258
|
static get cmpMeta() { return {
|
|
@@ -7552,11 +7552,11 @@ class DropiCountrySelector {
|
|
|
7552
7552
|
this.dropiChange.emit(country);
|
|
7553
7553
|
}
|
|
7554
7554
|
render() {
|
|
7555
|
-
return (hAsync("div", { key: '
|
|
7555
|
+
return (hAsync("div", { key: '1e590f390f45a91df010db5a25139f5a5b234105', class: "custom-select" }, this.label && (hAsync("label", { key: '073b9c7fb9c09d0addf66bce1c132632ab726b70' }, this.label, this.showObligatory && hAsync("span", { key: '8471da6b6004c35e71d04c0d649a796391ffb703', class: "required" }, "*"))), hAsync("button", { key: '45fdbd8ae914084fd713708947ee6b2256b78b32', type: "button", ref: (el) => { this.buttonRef = el; }, class: {
|
|
7556
7556
|
'select-button': true,
|
|
7557
7557
|
'select-completed': !!this.selected,
|
|
7558
7558
|
'select-invalid': this.hasError,
|
|
7559
|
-
}, disabled: this.disabled, onClick: () => this.open() }, hAsync("div", { key: '
|
|
7559
|
+
}, disabled: this.disabled, onClick: () => this.open() }, hAsync("div", { key: '75100da9fe6ca3b3e1c60d446374a1ed90ab8419', class: "selected-content" }, this.selected ? (hAsync("span", { class: "selected-option" }, hAsync("img", { class: "flag-img", src: `https://flagsapi.com/${this.selected.code}/shiny/24.png`, alt: this.selected.name }), this.selected.name)) : (hAsync("span", { class: "placeholder-text" }, this.placeholder))), hAsync("dropi-icon", { key: '3d4ffee3933d05e02236f1283128cb30a876870f', name: this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2', iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-500" })), hAsync("ul", { key: '5ab2559993f7100c52749b57e15b42605ca503b2', class: `select-dropdown${this.isOpen ? ' expanded' : ' collapsed'}` }, hAsync("li", { key: 'da243d50aa04ab24f2ac6b20dd152031458cd474', class: "search-li" }, hAsync("div", { key: 'b27ca2961821252eed8b2917b47b5c03674f5af6', class: "search-field" }, hAsync("input", { key: '4438520038bcf88efabf67d9e6745b51b7f089d3', ref: (el) => { this.searchInputRef = el; }, type: "text", class: "country-search", placeholder: "Buscar pa\u00EDs...", value: this.searchTerm, onInput: (e) => { this.searchTerm = e.target.value; } }), hAsync("span", { key: 'd8753c452b5054e23213b94e83884f5297862abc', class: "search-icon" }, hAsync("dropi-icon", { key: '3fac8e38cf990990a91a8dfda4701796237e8c44', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), this.filtered.map(country => (hAsync("li", { key: country.code }, hAsync("button", { class: "option", type: "button", onClick: () => this.select(country) }, hAsync("img", { class: "flag-img", src: `https://flagsapi.com/${country.code}/shiny/24.png`, alt: country.name }), country.name))))), this.textHelper && (hAsync("div", { key: '68bd0e375e7f31e1927a8179070e832d4fe20c94', class: { 'select-helper': true, 'select-helper-error': this.hasError } }, this.hasError && hAsync("dropi-icon", { key: '6328385caf1f3518c9fa0da9f30469d12c0940ef', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), hAsync("span", { key: '704ee063a80566aed85849c2649c399796069e86' }, this.textHelper)))));
|
|
7560
7560
|
}
|
|
7561
7561
|
static get formAssociated() { return true; }
|
|
7562
7562
|
static get watchers() { return {
|
|
@@ -7909,16 +7909,16 @@ class DropiDatePicker {
|
|
|
7909
7909
|
}
|
|
7910
7910
|
render() {
|
|
7911
7911
|
const today = new Date().toISOString().slice(0, 10);
|
|
7912
|
-
return (hAsync("div", { key: '
|
|
7912
|
+
return (hAsync("div", { key: '6ae00de99b93a13faba81ac027c292b9624d0336', class: "dp-wrap" }, this.label && hAsync("label", { key: '9282bb57332ebaef9861702d80759d641ea21757', class: "dp-label" }, this.label), hAsync("button", { key: '1fe5d5fcd8ce1c0b151381d9c249c401d322f78a', class: {
|
|
7913
7913
|
'dp-trigger': true,
|
|
7914
7914
|
'dp-trigger--disabled': this.disabled,
|
|
7915
7915
|
'dp-trigger--invalid': this.isInvalid,
|
|
7916
7916
|
'dp-trigger--loading': this.loading
|
|
7917
|
-
}, onClick: () => this.open ? this.open = false : this.open_(), disabled: this.disabled || this.loading, type: "button" }, hAsync("dropi-icon", { key: '
|
|
7917
|
+
}, onClick: () => this.open ? this.open = false : this.open_(), disabled: this.disabled || this.loading, type: "button" }, hAsync("dropi-icon", { key: '560cf80eb7652543b9000e375b213a3dba91060b', name: "Calendar", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("span", { key: '3bdc45bd4706502af4050475e709c15beebce028', class: { 'dp-trigger__value': true, 'dp-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder)), this.open && (hAsync("div", { key: 'e21053dd38d62ab43c01f337fbbeb8b36e70680c', class: "dp-popup" }, hAsync("div", { key: 'd6c8fc40ec4bd11bcd5bf3d8b3706c4c62099bbf', class: "dp-calendar" }, hAsync("div", { key: 'cf8f21d301592077851a44eb588418302240598f', class: "dp-nav" }, hAsync("button", { key: '28702d76d499cec07cd69d7bd23f5eb0369d288f', class: "dp-nav__btn", onClick: () => this.prevNav(), type: "button" }, hAsync("dropi-icon", { key: '18b1c6fb2ea5f51b4a4b59592c7d89c5406c6c39', name: "dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" })), hAsync("button", { key: '755274772a90deae38d613da369863aefe95e297', class: "dp-nav__title", onClick: () => this.cycleView(), type: "button" }, this.viewMode === 'day'
|
|
7918
7918
|
? [hAsync("span", null, MONTHS_ES$1[this.viewMonth]), hAsync("span", null, this.viewYear)]
|
|
7919
|
-
: hAsync("span", null, this.navTitle)), hAsync("button", { key: '
|
|
7920
|
-
hAsync("div", { key: '
|
|
7921
|
-
hAsync("div", { key: '
|
|
7919
|
+
: hAsync("span", null, this.navTitle)), hAsync("button", { key: '6442690df1e434f9fb0128327f8f07c3cecbed4c', class: "dp-nav__btn", onClick: () => this.nextNav(), type: "button" }, hAsync("dropi-icon", { key: '00525ae2cbe5cc8a881d165141de10ce3d72e439', name: "dropdown-right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), this.viewMode === 'day' && this.renderDayView(today), this.viewMode === 'month' && this.renderMonthView(), this.viewMode === 'year' && this.renderYearView()), this.selectionMode === 'range' && [
|
|
7920
|
+
hAsync("div", { key: '688df97b843c3c3342fc301d6c6c74ec88921d68', class: "dp-divider" }),
|
|
7921
|
+
hAsync("div", { key: '2c75f7b004812ee1eb18bbc349f03ab55623cd9f', class: "dp-shortcuts" }, this.shortcuts.map((s, i) => (hAsync("button", { key: i, class: { 'shortcut-btn': true, 'shortcut-btn--active': this.activeShortcut === i }, onClick: () => this.selectShortcut(i), type: "button" }, s.label))))
|
|
7922
7922
|
]))));
|
|
7923
7923
|
}
|
|
7924
7924
|
static get formAssociated() { return true; }
|
|
@@ -8349,10 +8349,10 @@ class DropiDrawer {
|
|
|
8349
8349
|
else
|
|
8350
8350
|
panelStyle['height'] = this.height;
|
|
8351
8351
|
}
|
|
8352
|
-
return (hAsync("div", { key: '
|
|
8352
|
+
return (hAsync("div", { key: 'e173a207447ff88cba0f838844ae629a367a6c98', class: { 'drawer-host': true, 'drawer-host--open': this.open } }, hAsync("div", { key: '1a4b3990d1a4641abcdd53b535b84f99991d1a90', class: "drawer-backdrop", onClick: () => {
|
|
8353
8353
|
if (this.closeOnBackdrop)
|
|
8354
8354
|
this.close();
|
|
8355
|
-
} }), hAsync("div", { key: '
|
|
8355
|
+
} }), hAsync("div", { key: 'eb3042e7506a6d64f6461b5bb7f0a93048299d50', class: `drawer-panel drawer-panel--${this.position}${sizeClass ? ' ' + sizeClass : ''}`, style: panelStyle, role: "dialog", "aria-modal": "true" }, hAsync("div", { key: 'ce4468ae512bd70596313dbaa8a738666ff7ef5d', class: { 'drawer-header': true, 'drawer-header--headless': this.headless } }, hAsync("h3", { key: '30e6af93a4e697590a8dc79748ec4e52f31f42c7', class: "drawer-header__title" }, this.drawerTitle), hAsync("button", { key: '0a817e6236e51112812302ff320c15565071f3bc', class: "drawer-header__close", onClick: () => this.close(), "aria-label": "Cerrar" }, hAsync("dropi-icon", { key: 'c540300a8c5486f6957f0cb4c5e55a70daf17b39', name: "Close-small", iconWidth: "32px", iconHeight: "32px", color: "Gray-Gray-400" }))), hAsync("div", { key: '0b63274c3a8a810c06b1aec621209178499dae86', class: "drawer-body" }, hAsync("slot", { key: '26c6a31c6c8bd9ae409880d85748ed44f01941d0' })), hAsync("div", { key: 'be3dba11d475e95391e039e791f98d11c1625b5e', class: "drawer-footer" }, hAsync("slot", { key: 'e2e42a0543dd9a8fb6278711d948816dda1969a3', name: "footer" })))));
|
|
8356
8356
|
}
|
|
8357
8357
|
static get watchers() { return {
|
|
8358
8358
|
"open": [{
|
|
@@ -8434,7 +8434,7 @@ class DropiDropdown {
|
|
|
8434
8434
|
render() {
|
|
8435
8435
|
const containerClass = this.isInSelect ? 'container-dropi-dropdown-select' : 'container-dropi-dropdown';
|
|
8436
8436
|
const customHeight = this.height || '388px';
|
|
8437
|
-
return (hAsync("div", { key: '
|
|
8437
|
+
return (hAsync("div", { key: '274caba83e2f697257e3803b85517a31d4f0aea8', class: containerClass, style: { '--custom-height': customHeight } }, this.parsedOptions.map((opt, i) => {
|
|
8438
8438
|
const label = opt[this.valueModel] ?? String(opt);
|
|
8439
8439
|
const active = !!opt.checked || this.isSelected(opt);
|
|
8440
8440
|
return (hAsync("div", { class: "content-dropdown", key: i }, hAsync("div", { class: { 'container-check-dropdown': true, 'active-option': active }, onClick: () => this.toggleOption(opt) }, this.parameters.type === 'checkbox' && (hAsync("dropi-checkbox", { name: "_dropdown-option", checked: active })), this.parameters.iconCurrier && (hAsync("dropi-avatars", { image: opt[this.valueModel], type: "transport" })), this.parameters.icon && (hAsync("dropi-avatars", { image: opt.image, type: "transport" })), hAsync("span", { class: "Body-M-Regular" }, label))));
|
|
@@ -8567,7 +8567,7 @@ class DropiEmptyState {
|
|
|
8567
8567
|
}
|
|
8568
8568
|
}
|
|
8569
8569
|
render() {
|
|
8570
|
-
return (hAsync("div", { key: '
|
|
8570
|
+
return (hAsync("div", { key: '46fcf12a371b08151dfc230284baa3ac8e419352', class: "empty-state" }, hAsync("div", { key: 'fad7d4e048cf0ce9dab395f9191949a7c208295b', class: "empty-state-visual" }, this.imageUrl ? (hAsync("img", { class: "empty-state-img", src: this.imageUrl, alt: this.imageAlt })) : (hAsync("div", { class: "empty-state-img", ref: (el) => { this.illustrationRef = el; } }))), this.title && hAsync("h3", { key: '00e33a607397efab09aef662bf92f79bd37f9245', class: "empty-state-title" }, this.title), this.description && hAsync("p", { key: 'd1fda23fb22f0da491d82f5c18f910d0e3cfd4c1', class: "empty-state-description" }, this.description), hAsync("slot", { key: 'fbaae961ff6c1ffd8e0d8826a72e7ada230dd3e8' }), this.buttonText && (hAsync("div", { key: '107a1affbe36f8304e4c6d7fc5273cef8d0f88d9', class: "empty-state-actions" }, hAsync("dropi-button", { key: 'f5bdca1fe8a92d0acff1f2a2963fae5f457c7351', text: this.buttonText, preIcon: this.buttonIcon, severity: this.buttonSeverity, onClick: () => this.buttonClickEvent.emit() })))));
|
|
8571
8571
|
}
|
|
8572
8572
|
static get style() { return dropiEmptyStateCss(); }
|
|
8573
8573
|
static get cmpMeta() { return {
|
|
@@ -8610,7 +8610,7 @@ class DropiFavoriteButton {
|
|
|
8610
8610
|
this.toggleFavorite.emit(this.isFavorite);
|
|
8611
8611
|
}
|
|
8612
8612
|
render() {
|
|
8613
|
-
return (hAsync("button", { key: '
|
|
8613
|
+
return (hAsync("button", { key: '92a8bc70796961d81151fcac6550a3bbf66751bc', class: { 'fav-btn': true, 'fav-btn--active': this.isFavorite }, onClick: () => this.toggle(), onMouseEnter: () => this.hovered = true, onMouseLeave: () => this.hovered = false, "aria-label": this.isFavorite ? 'Quitar de favoritos' : 'Agregar a favoritos', "aria-pressed": String(this.isFavorite) }, hAsync("dropi-icon", { key: '60eb9d714ad708c0d081de9e54205091a29889a6', name: this.isFavorite || this.hovered ? 'Heart-solid' : 'Heart', iconWidth: "19px", iconHeight: "19px", color: this.isFavorite || this.hovered ? 'Primary-Primary-500' : 'Gray-Gray-800' })));
|
|
8614
8614
|
}
|
|
8615
8615
|
static get style() { return dropiFavoriteButtonCss(); }
|
|
8616
8616
|
static get cmpMeta() { return {
|
|
@@ -8858,7 +8858,7 @@ class DropiFileUpload {
|
|
|
8858
8858
|
const cardFiles = files.filter(f => f.typeView === 'card');
|
|
8859
8859
|
const showDropZone = files.length < (this.maxFiles ?? 1) && !this.isDropZoneHidden();
|
|
8860
8860
|
const isSmall = this.dragAndDropSize === 'small';
|
|
8861
|
-
return (hAsync("div", { key: '
|
|
8861
|
+
return (hAsync("div", { key: '53a6c0062929bef4c8223e0c4e52a0050165a800', class: "upload-container" }, (this.title || this.label) && (hAsync("div", { key: '7cbf5d99bf080c8150271922e843e75fd00345b2', class: "upload-header" }, this.title && hAsync("div", { key: '8739652541b7e9207cf9eecb4a5364bdb2681928', class: "text title" }, this.title), this.label && hAsync("div", { key: 'a5f93bc2a2a45c8097f9e057014863a62e2ea2db', class: "text label" }, this.label))), this.error && (hAsync("dropi-alert", { key: 'bcf90dfde5556dc69e832384e2eaa3b655ad3038', message: this.errorMessage, type: "default", state: "error", dismissable: true, showButton: false, onDropiClose: () => { this.error = false; } })), showDropZone && (hAsync("div", { key: '6a8f194bd7f84a72b0a76499fc627cf039a7a5cc', class: { 'file-upload': true, 'drag-over': this.dragging }, onDragOver: (e) => this.onDragOver(e), onDragEnter: (e) => this.onDragEnter(e), onDragLeave: () => this.onDragLeave(), onDrop: (e) => this.onDrop(e) }, hAsync("div", { key: 'e1b60b9cac11bab0dc0dc5909e27816cbfa9873b', class: `file-upload__zone${this.dragging ? ' drag-over' : ''}` }, !isSmall && (hAsync("svg", { key: 'd3d6613058ca61eed4ae3c14d0de036ba25e096c', width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '6e6dad9c5ace86f8bae848a596b85559a00afc00', d: "M0 20C0 8.95431 8.95431 0 20 0C31.0457 0 40 8.95431 40 20C40 31.0457 31.0457 40 20 40C8.95431 40 0 31.0457 0 20Z", fill: "#FEF8F1" }), hAsync("g", { key: '3cfcd89899ad365af2c1e2f948dd14e9418a6b7b', "clip-path": "url(#up)" }, hAsync("path", { key: 'f685ed115915f53fd0d06cac49f8a6597f605ebd', d: "M19.3379 13.7187L19.3332 24.0107C19.3332 24.1875 19.4035 24.357 19.5285 24.4821C19.6535 24.6071 19.8231 24.6773 19.9999 24.6773C20.1767 24.6773 20.3463 24.6071 20.4713 24.4821C20.5963 24.357 20.6666 24.1875 20.6666 24.0107L20.6712 13.73L22.6126 15.672C22.7376 15.797 22.9071 15.8672 23.0839 15.8672C23.2607 15.8672 23.4302 15.797 23.5552 15.672C23.6802 15.547 23.7504 15.3774 23.7504 15.2007C23.7504 15.0239 23.6802 14.8543 23.5552 14.7293L21.4145 12.586C21.2288 12.4001 21.0083 12.2527 20.7655 12.1521C20.5228 12.0515 20.2626 11.9998 19.9999 11.9998C19.7371 11.9998 19.477 12.0515 19.2342 12.1521C18.9915 12.2527 18.771 12.4001 18.5852 12.586L16.4445 14.7273C16.3196 14.8523 16.2494 15.0219 16.2494 15.1987C16.2494 15.3754 16.3196 15.545 16.4445 15.67C16.5696 15.795 16.7391 15.8652 16.9159 15.8652C17.0927 15.8652 17.2622 15.795 17.3872 15.67L19.3379 13.7187Z", fill: "#F49A3D" }), hAsync("path", { key: '49242cfde754e607ae1577c29e63c94c1bf1634d', d: "M26.6667 23.3329V25.9996C26.6667 26.1764 26.5964 26.346 26.4714 26.471C26.3464 26.596 26.1768 26.6663 26 26.6663H14C13.8232 26.6663 13.6536 26.596 13.5286 26.471C13.4036 26.346 13.3333 26.1764 13.3333 25.9996V23.3329C13.3333 23.1561 13.2631 22.9865 13.1381 22.8615C13.013 22.7365 12.8435 22.6663 12.6667 22.6663C12.4899 22.6663 12.3203 22.7365 12.1953 22.8615C12.0702 22.9865 12 23.1561 12 23.3329V25.9996C12 26.53 12.2107 27.0387 12.5858 27.4138C12.9609 27.7889 13.4696 27.9996 14 27.9996H26C26.5304 27.9996 27.0391 27.7889 27.4142 27.4138C27.7893 27.0387 28 26.53 28 25.9996V23.3329C28 23.1561 27.9298 22.9865 27.8047 22.8615C27.6797 22.7365 27.5101 22.6663 27.3333 22.6663C27.1565 22.6663 26.987 22.7365 26.8619 22.8615C26.7369 22.9865 26.6667 23.1561 26.6667 23.3329Z", fill: "#F49A3D" })), hAsync("defs", { key: 'f1ede9ee7ad2d7498553431c83005c485342ef3a' }, hAsync("clipPath", { key: '877741b31ad66e301291cca2a39b4d2fb0b05569', id: "up" }, hAsync("rect", { key: '337f7c89c3cbbdaeafd38413c85e4ce9c0961432', width: "16", height: "16", fill: "white", transform: "translate(12 12)" }))))), hAsync("div", { key: '277a7354341ce2a4d47d417ef8bdcd8c4914fa16', class: isSmall ? 'info size-small-upload' : 'info' }, hAsync("div", { key: 'ae2e22bd7d02c70eb20435c5044ec67707a76c27', class: "title" }, this.textDropZone), isSmall && (hAsync("dropi-button", { key: 'e4a465cb0a1c4df657b4f97d9358373266d5a184', text: this.textButton, size: "small", onClick: (e) => { e.stopPropagation(); this.openFilePicker(); } }))), !isSmall && (hAsync("div", { key: '91580967159ab227dacb03ffc289f414c02e5912', class: "info-desc" }, this.accept && hAsync("div", { key: '16ef9fbeb7dc572f8f5ebf1153fc8f1df73d35ca', class: "description" }, "Formatos admitidos: ", this.accept), hAsync("div", { key: 'a46265cd28533f4d8762efbb7010630b89a53156', class: "description" }, "Tama\u00F1o m\u00E1ximo: ", this.maxFileSizeMB, "MB"))), !isSmall && (hAsync("dropi-button", { key: '43ee9e62526ead6be2db1efdd93ed97b00adccb6', text: this.textButton, size: "small", onClick: (e) => { e.stopPropagation(); this.openFilePicker(); } })), hAsync("input", { key: 'c1e074ebeccda45a7a732f875c95606ed080c6cc', ref: (el) => this.inputRef = el, type: "file", accept: this.accept, multiple: this.multiple, class: "upload-hidden", onChange: (e) => this.onInputChange(e) })))), this.selectedFiles.length > 0 && (hAsync("div", { key: 'c0159af79236ecb940173fb32677d488f622f434', class: "files-container" }, gridFiles.length > 0 && (hAsync("div", { key: '4ab957bf55cdfed0ea56c56ecccb3738ee0eed72', class: "grid-list" }, gridFiles.map(f => this.renderGridItem(f)), gridFiles.length < this.maxFiles && (hAsync("div", { key: 'b9a171ce8a3d79362131e90d5b9ca3f72e5c4a5c', class: "add-img", onClick: () => this.addImage() }, hAsync("div", { key: 'c6a165d81b91f15a18c64b5cd22da22a5eeef6e0', class: "icon" }, hAsync("svg", { key: '6e89310ce178bc2b981aa9fdcd854568b682f55a', width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'c3f7d47b4bedd9431283a0d2706cf1c24b811b78', d: "M9.77774 6.4444H7.55551V4.22218C7.55551 4.07484 7.49698 3.93353 7.3928 3.82934C7.28861 3.72516 7.1473 3.66663 6.99996 3.66663C6.85262 3.66663 6.71131 3.72516 6.60712 3.82934C6.50294 3.93353 6.4444 4.07484 6.4444 4.22218V6.4444H4.22218C4.07484 6.4444 3.93353 6.50294 3.82934 6.60712C3.72516 6.71131 3.66663 6.85262 3.66663 6.99996C3.66663 7.1473 3.72516 7.28861 3.82934 7.3928C3.93353 7.49698 4.07484 7.55551 4.22218 7.55551H6.4444V9.77774C6.4444 9.92508 6.50294 10.0664 6.60712 10.1706C6.71131 10.2748 6.85262 10.3333 6.99996 10.3333C7.1473 10.3333 7.28861 10.2748 7.3928 10.1706C7.49698 10.0664 7.55551 9.92508 7.55551 9.77774V7.55551H9.77774C9.92508 7.55551 10.0664 7.49698 10.1706 7.3928C10.2748 7.28861 10.3333 7.1473 10.3333 6.99996C10.3333 6.85262 10.2748 6.71131 10.1706 6.60712C10.0664 6.50294 9.92508 6.4444 9.77774 6.4444Z", fill: "#32394D" }))), hAsync("div", { key: '0b335f0d575d63566a2a8e440029240889710246', class: "text" }, "Agregar"))))), cardFiles.length > 0 && (hAsync("div", { key: '5a6b3e6b24dbbd59199c9f602b2e1d5edae59e0e', class: "card-list" }, cardFiles.map(f => this.renderCardItem(f))))))));
|
|
8862
8862
|
}
|
|
8863
8863
|
static get style() { return dropiFileUploadCss(); }
|
|
8864
8864
|
static get cmpMeta() { return {
|
|
@@ -8952,7 +8952,7 @@ class DropiFileUploadProgressBar {
|
|
|
8952
8952
|
};
|
|
8953
8953
|
}
|
|
8954
8954
|
render() {
|
|
8955
|
-
return (hAsync("div", { key: '
|
|
8955
|
+
return (hAsync("div", { key: '9a1cff54d6ab96637e149accd7cb08d5c5e6e516', class: "container-progress-bar" }, hAsync("div", { key: '76330324e1429af78b58cee49a22df5af3ed44f1', class: "container-icon-info", style: { display: this.fileExtension !== 'pdf' ? 'flex' : 'none' } }, this.type !== 'image' && (hAsync("dropi-icon", { key: '44aeacefe3b1d18ac8f55ccd5693b27747b15e9b', name: "File-text", iconWidth: "24px", iconHeight: "24px", color: "Info-Info-600" })), this.type === 'image' && !this.urlImage && (hAsync("div", { key: '416fc3b7387f05439d98f08a91505ae9e352c56d', style: { width: '34px', height: '34px', borderRadius: '8px', background: 'var(--Gray-Gray-100)' } })), this.type === 'image' && this.urlImage && (hAsync("img", { key: '992ad464b90cb9503b004324c441aa0baaaedb0a', src: this.urlImage, class: "image-to-view", width: "34", height: "34", alt: "" }))), this.fileExtension === 'pdf' && (hAsync("div", { key: '33730ac6969b34483f0aeb433acbccd17513b6c0', class: "icon-pdf" }, hAsync("svg", { key: '52b10ba62661a375c42b27b67e2f97a3edf3b1e9', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, hAsync("g", { key: '18b96ab58cee059d63413ec9174ecb54a3720f25', "clip-path": "url(#clip0_6227_22223)" }, hAsync("path", { key: '344b8601ca32790c8d13b4227bc64f5438db6eae', d: "M16.6243 4.61667L13.716 1.70833C12.616 0.608333 11.1493 0 9.59102 0H5.83268C3.53268 0 1.66602 1.86667 1.66602 4.16667V15.8333C1.66602 18.1333 3.53268 20 5.83268 20H14.166C16.466 20 18.3327 18.1333 18.3327 15.8333V8.74167C18.3327 7.18333 17.7243 5.71667 16.6243 4.61667ZM15.4493 5.79167C15.716 6.05833 15.941 6.35 16.1243 6.66667H12.5077C12.0493 6.66667 11.6743 6.29167 11.6743 5.83333V2.21667C11.991 2.4 12.2827 2.625 12.5493 2.89167L15.4577 5.8L15.4493 5.79167ZM16.666 15.8333C16.666 17.2083 15.541 18.3333 14.166 18.3333H5.83268C4.45768 18.3333 3.33268 17.2083 3.33268 15.8333V4.16667C3.33268 2.79167 4.45768 1.66667 5.83268 1.66667H9.59102C9.72435 1.66667 9.86602 1.66667 9.99935 1.68333V5.83333C9.99935 7.20833 11.1243 8.33333 12.4993 8.33333H16.6493C16.666 8.46667 16.666 8.6 16.666 8.74167V15.8333ZM5.90768 10.8333H4.99935C4.54102 10.8333 4.16602 11.2083 4.16602 11.6667V15.3667C4.16602 15.6583 4.39935 15.8833 4.68268 15.8833C4.96602 15.8833 5.19935 15.65 5.19935 15.3667V14.35H5.89935C6.88268 14.35 7.68268 13.5583 7.68268 12.5917C7.68268 11.625 6.88268 10.8333 5.89935 10.8333H5.90768ZM5.90768 13.3083H5.21602V11.875H5.91602C6.31602 11.875 6.65768 12.2 6.65768 12.5917C6.65768 12.9833 6.31602 13.3083 5.91602 13.3083H5.90768ZM15.8493 11.3583C15.8493 11.65 15.616 11.875 15.3327 11.875H13.9243V12.825H14.9577C15.2493 12.825 15.4743 13.0583 15.4743 13.3417C15.4743 13.625 15.241 13.8583 14.9577 13.8583H13.9243V15.3583C13.9243 15.65 13.691 15.875 13.4077 15.875C13.1243 15.875 12.891 15.6417 12.891 15.3583V11.35C12.891 11.0583 13.1243 10.8333 13.4077 10.8333H15.3327C15.6243 10.8333 15.8493 11.0667 15.8493 11.35V11.3583ZM10.0743 10.8417H9.16602C8.70768 10.8417 8.33268 11.2167 8.33268 11.675V15.375C8.33268 15.6667 8.56602 15.8417 8.84935 15.8417C9.13268 15.8417 10.066 15.8417 10.066 15.8417C11.0493 15.8417 11.8493 15.05 11.8493 14.0833V12.6C11.8493 11.6333 11.0493 10.8417 10.066 10.8417H10.0743ZM10.816 14.0833C10.816 14.475 10.4743 14.8 10.0743 14.8H9.38268V11.8833H10.0827C10.4827 11.8833 10.8243 12.2083 10.8243 12.6V14.0833H10.816Z", fill: "#DE6061" })), hAsync("defs", { key: '9ae2724b7a4bc69e7d56d31672c59b8a59603c14' }, hAsync("clipPath", { key: '925d2de4afd87a7a92ede37730872e8f94d88e14', id: "clip0_6227_22223" }, hAsync("rect", { key: '59e3907da52ab8f253d095150366cd8c4ad0ef10', width: "20", height: "20", fill: "white" })))))), hAsync("div", { key: '728ef5d61364f355f0a578f2cf2671b4ef9ae521', class: "container-bar-title" }, hAsync("p", { key: '0ff7872cfa5bfa6965ac637d9aec9bd0b6ef33ea' }, this.textFile), hAsync("progress", { key: '6723a5b4d6cbaa66f86de3ccaf07070720d8268d', value: this.progress, max: "100" })), this.progress === 100 && this.isPreview && (hAsync("div", { key: '4866e4eab7b6a2a208dd898ccf41d185cc3b32d9', class: "view-icon", onClick: () => this.viewFile.emit() }, hAsync("svg", { key: '4a20733a809c89b7d298986d7546d91ca0b28e91', xmlns: "http://www.w3.org/2000/svg", width: "18", height: "14", viewBox: "0 0 18 14", fill: "none" }, hAsync("path", { key: '54099a7f02bc603ab33b2a42a5c70e3988ead535', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.07148 4.14758C7.64227 3.76618 8.31334 3.56262 8.99983 3.56262C9.92004 3.56372 10.8022 3.92976 11.4529 4.58045C12.1036 5.23114 12.4697 6.11334 12.4708 7.03355C12.4708 7.72004 12.2672 8.39111 11.8858 8.9619C11.5044 9.53269 10.9623 9.97757 10.3281 10.2403C9.69387 10.503 8.99598 10.5717 8.32268 10.4378C7.64939 10.3039 7.03092 9.9733 6.54551 9.48788C6.06009 9.00246 5.72951 8.384 5.59558 7.7107C5.46166 7.0374 5.53039 6.33951 5.7931 5.70528C6.05581 5.07105 6.50069 4.52897 7.07148 4.14758ZM7.84282 8.76514C8.18529 8.99398 8.58794 9.11612 8.99983 9.11612C9.55216 9.11612 10.0819 8.8967 10.4724 8.50615C10.863 8.11559 11.0824 7.58588 11.0824 7.03355C11.0824 6.62166 10.9602 6.21902 10.7314 5.87654C10.5026 5.53407 10.1773 5.26714 9.79679 5.10952C9.41625 4.95189 8.99752 4.91065 8.59354 4.99101C8.18956 5.07136 7.81849 5.26971 7.52723 5.56096C7.23598 5.85221 7.03764 6.22329 6.95728 6.62727C6.87693 7.03124 6.91817 7.44998 7.07579 7.83052C7.23342 8.21105 7.50034 8.53631 7.84282 8.76514Z", fill: "#475066" }), hAsync("path", { key: '50b4ec230be5bd6945865082bb341a808de5e2f5', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8.99996 0.546387C13.2984 0.546387 15.7475 3.48835 16.8241 5.24187C17.157 5.78022 17.3333 6.40064 17.3333 7.03357C17.3333 7.6665 17.157 8.28692 16.8241 8.82526C15.7475 10.5788 13.2984 13.5207 8.99996 13.5207C4.70155 13.5207 2.25246 10.5788 1.17577 8.82526C0.842931 8.28692 0.666626 7.6665 0.666626 7.03357C0.666626 6.40064 0.842931 5.78022 1.17577 5.24187C2.25246 3.48835 4.70155 0.546387 8.99996 0.546387ZM8.99996 12.1324C12.6229 12.1324 14.7159 9.60206 15.6406 8.09845C15.8383 7.77846 15.943 7.40973 15.943 7.03357C15.943 6.6574 15.8383 6.28867 15.6406 5.96868C14.7159 4.4623 12.6229 1.93476 8.99996 1.93476C5.377 1.93476 3.28402 4.46507 2.35936 5.96868C2.16161 6.28867 2.05687 6.6574 2.05687 7.03357C2.05687 7.40973 2.16161 7.77846 2.35936 8.09845C3.28402 9.60206 5.377 12.1324 8.99996 12.1324Z", fill: "#475066" })))), this.progress === 100 && !this.disabled && (hAsync("div", { key: '5b3d075f123d43f38eb147071082fb41104144a3', class: "container-icon-trash", onClick: () => this.deleteFile.emit() }, hAsync("svg", { key: '961615602fd1496823409ca31cee5c701bea16af', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "21", viewBox: "0 0 20 21", fill: "none" }, hAsync("path", { key: 'd4e9856f300a1a46afc1c98c774a875e75ede973', d: "M16.2501 4.94477H14.0973C13.9362 4.16103 13.5097 3.45682 12.8899 2.95082C12.27 2.44483 11.4947 2.168 10.6946 2.16699H9.30566C8.50552 2.168 7.73019 2.44483 7.11035 2.95082C6.49051 3.45682 6.06406 4.16103 5.90289 4.94477H3.75011C3.56593 4.94477 3.3893 5.01793 3.25906 5.14817C3.12883 5.2784 3.05566 5.45504 3.05566 5.63921C3.05566 5.82339 3.12883 6.00003 3.25906 6.13026C3.3893 6.26049 3.56593 6.33366 3.75011 6.33366H4.44455V15.3614C4.44566 16.282 4.81183 17.1645 5.46276 17.8155C6.11369 18.4664 6.99622 18.8326 7.91677 18.8337H12.0834C13.004 18.8326 13.8865 18.4664 14.5375 17.8155C15.1884 17.1645 15.5546 16.282 15.5557 15.3614V6.33366H16.2501C16.4343 6.33366 16.6109 6.26049 16.7412 6.13026C16.8714 6.00003 16.9446 5.82339 16.9446 5.63921C16.9446 5.45504 16.8714 5.2784 16.7412 5.14817C16.6109 5.01793 16.4343 4.94477 16.2501 4.94477ZM9.30566 3.55588H10.6946C11.1253 3.55641 11.5453 3.69017 11.8971 3.93883C12.2488 4.18749 12.515 4.53886 12.6591 4.94477H7.34108C7.48524 4.53886 7.75143 4.18749 8.10315 3.93883C8.45488 3.69017 8.87492 3.55641 9.30566 3.55588ZM14.1668 15.3614C14.1668 15.914 13.9473 16.4439 13.5566 16.8346C13.1659 17.2253 12.636 17.4448 12.0834 17.4448H7.91677C7.36424 17.4448 6.83434 17.2253 6.44364 16.8346C6.05294 16.4439 5.83344 15.914 5.83344 15.3614V6.33366H14.1668V15.3614Z", fill: "#DE6061" }), hAsync("path", { key: '66352c37fc6b1525965b0374984d91f60ad7ce9a', d: "M8.61128 14.6666C8.79545 14.6666 8.97209 14.5934 9.10232 14.4632C9.23256 14.3329 9.30572 14.1563 9.30572 13.9721V9.80545C9.30572 9.62127 9.23256 9.44464 9.10232 9.3144C8.97209 9.18417 8.79545 9.11101 8.61128 9.11101C8.4271 9.11101 8.25046 9.18417 8.12023 9.3144C7.99 9.44464 7.91683 9.62127 7.91683 9.80545V13.9721C7.91683 14.1563 7.99 14.3329 8.12023 14.4632C8.25046 14.5934 8.4271 14.6666 8.61128 14.6666Z", fill: "#DE6061" }), hAsync("path", { key: 'bbdf05a15788ec40df5e66d2ce33852ea50ecbe7', d: "M11.389 14.6666C11.5731 14.6666 11.7498 14.5934 11.88 14.4632C12.0102 14.3329 12.0834 14.1563 12.0834 13.9721V9.80545C12.0834 9.62127 12.0102 9.44464 11.88 9.3144C11.7498 9.18417 11.5731 9.11101 11.389 9.11101C11.2048 9.11101 11.0281 9.18417 10.8979 9.3144C10.7677 9.44464 10.6945 9.62127 10.6945 9.80545V13.9721C10.6945 14.1563 10.7677 14.3329 10.8979 14.4632C11.0281 14.5934 11.2048 14.6666 11.389 14.6666Z", fill: "#DE6061" }))))));
|
|
8956
8956
|
}
|
|
8957
8957
|
static get watchers() { return {
|
|
8958
8958
|
"progress": [{
|
|
@@ -9364,11 +9364,13 @@ class DropiIlustrationIcon {
|
|
|
9364
9364
|
tagProduct = false;
|
|
9365
9365
|
/** Base path for illustration assets. Override if assets are served from a different location. */
|
|
9366
9366
|
basePath = '/node_modules/@dropi/ui/assets/icons/ilustration';
|
|
9367
|
-
insigniaIcons
|
|
9368
|
-
|
|
9369
|
-
|
|
9370
|
-
|
|
9371
|
-
|
|
9367
|
+
get insigniaIcons() {
|
|
9368
|
+
return {
|
|
9369
|
+
verified: `${this.basePath}/verified-new.svg`,
|
|
9370
|
+
premium: `${this.basePath}/premium-new.svg`,
|
|
9371
|
+
exclusive: `${this.basePath}/exclusive.svg`,
|
|
9372
|
+
};
|
|
9373
|
+
}
|
|
9372
9374
|
getIconName(state) {
|
|
9373
9375
|
const map = {
|
|
9374
9376
|
success: 'Check-circle',
|
|
@@ -9379,7 +9381,7 @@ class DropiIlustrationIcon {
|
|
|
9379
9381
|
return map[state] || 'Comment-round_info';
|
|
9380
9382
|
}
|
|
9381
9383
|
render() {
|
|
9382
|
-
return (hAsync("div", { key: '
|
|
9384
|
+
return (hAsync("div", { key: '452266c0500ed2426ae0b0d7552a735c0022500b', class: "dropi-ilustration" }, this.type === 'dropi' && (hAsync("figure", { key: '4ac1e8e482b5b80df9dceaa93630308b52d5db0d', class: "dropi-ilustration__image" }, hAsync("img", { key: '019a5c80798fc898a08ce851ab69b381d784e3f9', src: `${this.basePath}/${(!this.state || String(this.state) === 'undefined' || String(this.state) === 'null') ? 'default' : this.state}.svg`, alt: this.state ?? 'default', onError: (e) => { e.target.src = `${this.basePath}/default.svg`; } }))), this.type === 'mb' && (hAsync("figure", { key: 'e7416f766fe3c0d633379bd9172ecfbb4b7f2a43', class: `dropi-ilustration__image-mb ${this.state}` }, ['success', 'error', 'info', 'warning'].includes(this.state) && (hAsync("dropi-icon", { key: 'c0fdd2564c0c0f821987cb13a519837a71afddbc', name: this.getIconName(this.state), iconWidth: "24px", iconHeight: "24px", color: "Neutral-White" })))), this.type === 'insignia' && (hAsync("figure", { key: '8f1f4ace45532d06dbc38d34b3e1e32317d542b7', class: this.tagProduct ? 'dropi-ilustration-insignia-tag' : 'dropi-ilustration-insignia' }, hAsync("img", { key: '0d114a0b12bb3d31c222a34b09a47bd6a42e1dba', src: this.insigniaIcons[this.stateInsignia], alt: this.stateInsignia, onError: (e) => { e.target.src = `${this.basePath}/default.svg`; } }), this.tagProduct && (hAsync("p", { key: 'd1ef34a4fd92ee7b97a5a224d9a21b9e54976989', class: `tag tag--${this.stateInsignia}` }, hAsync("span", { key: '72ea7cef3bbc86f6330abb9c4f34c89e62ac3417', class: "Caption-S" }, this.stateInsignia.charAt(0).toUpperCase() + this.stateInsignia.slice(1))))))));
|
|
9383
9385
|
}
|
|
9384
9386
|
static get style() { return dropiIlustrationIconCss(); }
|
|
9385
9387
|
static get cmpMeta() { return {
|
|
@@ -9436,7 +9438,7 @@ class DropiImageMiniature {
|
|
|
9436
9438
|
}
|
|
9437
9439
|
render() {
|
|
9438
9440
|
const imgs = this.parsedImages;
|
|
9439
|
-
return (hAsync("div", { key: '
|
|
9441
|
+
return (hAsync("div", { key: 'ad66f7432e761f48af9ca3db80f562091b040099', class: "miniature" }, this.label && hAsync("span", { key: '9711b8c5554bdd94eba58f8acbdb461b5bd9530f', class: "miniature__label" }, this.label), hAsync("div", { key: '45901b7593b09cef9b3089b325341d2c36658676', class: "miniature__grid" }, imgs.map((src, i) => (hAsync("div", { class: "miniature__item", style: { width: this.width, height: this.height }, key: i, onClick: () => this.dropiImageClick.emit({ images: imgs, index: i }) }, hAsync("img", { src: src, alt: `imagen ${i + 1}`, loading: "lazy", onError: (e) => this.handleError(e) }), hAsync("div", { class: "miniature__zoom" }, hAsync("dropi-icon", { name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Neutral-White" }))))))));
|
|
9440
9442
|
}
|
|
9441
9443
|
static get style() { return dropiImageMiniatureCss(); }
|
|
9442
9444
|
static get cmpMeta() { return {
|
|
@@ -9780,14 +9782,14 @@ class DropiInput {
|
|
|
9780
9782
|
render() {
|
|
9781
9783
|
const showObligatoryAsterisk = this.required && this.showObligatoryAsterisk && !this.disabled;
|
|
9782
9784
|
const showIconInline = !!this.icon;
|
|
9783
|
-
return (hAsync("div", { key: '
|
|
9785
|
+
return (hAsync("div", { key: 'a16b56b6be24372be1fc0a16e65d13bfea3dcf0f', class: { 'fixed-label-container': this.fixedLabel } }, this.fixedLabel && (hAsync("label", { key: '0030ccbc829d16aa17a954624933106752f972bc', class: "input-label Body-S-Regular", htmlFor: this.resolvedId }, this.label, showObligatoryAsterisk && hAsync("span", { key: 'f1476695b9778aa767e121f5d5ace0e36b4fb9a0', class: "asterisk" }, " *"))), hAsync("div", { key: '1e3dee560139338f206dd4c94fa52e1c248e6da6', class: "form-group" }, hAsync("div", { key: '7c1a2754de046eac9c39a005495fa391a7b7b02e', class: { 'input-container': true, 'input-container--has-icon': showIconInline } }, showIconInline && (hAsync("dropi-icon", { key: 'e2ba6416f090d563206e3d98e9f3ab76f197df20', class: "icon-input", name: this.icon, color: this.iconColor, iconWidth: "20px", iconHeight: "20px", style: { width: '20px', height: '20px' } })), this.passwordInput && (hAsync("dropi-icon", { key: 'bf2b58fa9cf0d3dbb470fb3bb4466545d4bc6a75', class: "icon-input-password", name: this.showPassword ? 'Eye' : 'Eye-crossed', iconWidth: "20px", iconHeight: "20px", style: { width: '20px', height: '20px' }, color: "Gray-Gray-500", onClick: () => this.togglePassword() })), hAsync("input", { key: '51a1de81d4200c79f46b61afef165fdad0ebb061', id: this.resolvedId, class: {
|
|
9784
9786
|
'form-control': true,
|
|
9785
9787
|
'form-control-valid': !this.isInvalid && this.touched && !!this.value,
|
|
9786
9788
|
'form-control-invalid': this.isInvalid,
|
|
9787
9789
|
'padding-icon': showIconInline,
|
|
9788
9790
|
'text-password': this.passwordInput && !this.showPassword,
|
|
9789
9791
|
'fixed-label-input': this.fixedLabel,
|
|
9790
|
-
}, type: this.inputType, value: this.value, placeholder: this.fixedLabel ? this.placeholder : ' ', disabled: this.disabled, required: this.required, maxLength: this.maxLength, inputMode: this.inputMode, autoComplete: this.autocomplete, "data-cy": undefined, onInput: e => this.handleInput(e), onKeyDown: e => this.handleKeyDown(e), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur() }), !this.fixedLabel && (hAsync("label", { key: '
|
|
9792
|
+
}, type: this.inputType, value: this.value, placeholder: this.fixedLabel ? this.placeholder : ' ', disabled: this.disabled, required: this.required, maxLength: this.maxLength, inputMode: this.inputMode, autoComplete: this.autocomplete, "data-cy": undefined, onInput: e => this.handleInput(e), onKeyDown: e => this.handleKeyDown(e), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur() }), !this.fixedLabel && (hAsync("label", { key: '38b78f85551b8c9f6dee1c85e48fa67149f58e29', class: "Body-S-Regular label-bottom", htmlFor: this.resolvedId }, this.label, showObligatoryAsterisk && hAsync("span", { key: 'd23e87d325e6c051c04a0eb0671a53d8cec05b41', class: "asterisk" }, " *"))), this.showHelper && (hAsync("div", { key: '84e228278687d583ffa056c4540da63356aeaa1f', class: "form-control-helper" }, this.isInvalid && hAsync("dropi-icon", { key: 'f26a6e681a262c2f348412e4bf9055e417e76261', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), hAsync("span", { key: '9e0376883c4727d84aec3f4c7da7d76196639740', class: {
|
|
9791
9793
|
'disabled-helper': this.disabled,
|
|
9792
9794
|
'invalid-color': this.isInvalid,
|
|
9793
9795
|
} }, this.textHelper)))))));
|
|
@@ -9952,7 +9954,7 @@ class DropiLogo {
|
|
|
9952
9954
|
e.target.src = FALLBACK_SVG;
|
|
9953
9955
|
}
|
|
9954
9956
|
render() {
|
|
9955
|
-
return (hAsync("figure", { key: '
|
|
9957
|
+
return (hAsync("figure", { key: '7e0647d080700fcac7fe488d72024b3ed1f40b08', class: { 'dropi-logo': true, [`dropi-logo--${this.size}`]: true } }, hAsync("img", { key: 'baa1d5c20397ee47a9f55ff6be7acae99b7c0f41', src: this.urlLogo || FALLBACK_SVG, alt: "Dropi logo", onError: (e) => this.handleError(e) })));
|
|
9956
9958
|
}
|
|
9957
9959
|
static get style() { return dropiLogoCss(); }
|
|
9958
9960
|
static get cmpMeta() { return {
|
|
@@ -10354,7 +10356,7 @@ class DropiModal {
|
|
|
10354
10356
|
}
|
|
10355
10357
|
}
|
|
10356
10358
|
render() {
|
|
10357
|
-
return (hAsync("div", { key: '
|
|
10359
|
+
return (hAsync("div", { key: '95847ba48baae69b93888cb59ecaa9d2130ae17a', class: `modal-root modal-root--${this.position}${this.isOpen ? ' modal-root--open' : ''}${this.isClosing ? ' modal-root--closing' : ''}` }, (this.modal ?? true) && hAsync("div", { key: '78acc3c2f1b7327b6fc1770a9536cdf0c2c57f99', class: "modal-mask", onClick: () => this.canDismiss && this.dismissable && this.dismiss() }), hAsync("div", { key: '63906a7ed0432879c3256a659ddd9773099244bc', class: `modal-panel size-${this.size || 'm'}`, role: "dialog", "aria-modal": "true", style: this.maxWidth ? { maxWidth: this.maxWidth, width: '100%' } : {} }, this.showHeader && (hAsync("div", { key: '7d960505ea8fd7804ac67ceb88b9195e6ad1998d', class: "modal-header" }, this.header && hAsync("span", { key: 'fed4b8a2e6c89fca39a8766d0e843db7c184be59', class: "modal-title" }, this.header), hAsync("slot", { key: 'b2c6c5cc1f019229c3ad5028e42b1fd887494abd', name: "header" }), this.showCloseIcon && (hAsync("button", { key: '24fc8ff422ea5c7e6a8c0737acbb29c1d7467f40', class: "modal-close", onClick: () => this.dismiss(), "aria-label": "Cerrar" }, "\u00D7")))), hAsync("div", { key: '472a7dfe704b0b8d129b00bc88204602ead66403', class: "modal-content" }, hAsync("slot", { key: '6b3e6fdefca0c6510d4fdbbccce53a5efa52e4c8' })), this.showFooter && hAsync("div", { key: '5bd3c15d4d1fb2ebffad79c9314d03d1d72dae29', class: "modal-footer" }, hAsync("slot", { key: '1980d019b142e2a00f55a3a755e9e08d0393c5e5', name: "footer" })))));
|
|
10358
10360
|
}
|
|
10359
10361
|
static get watchers() { return {
|
|
10360
10362
|
"visible": [{
|
|
@@ -10446,9 +10448,9 @@ class DropiNavbar {
|
|
|
10446
10448
|
}
|
|
10447
10449
|
render() {
|
|
10448
10450
|
const items = this.parsedData;
|
|
10449
|
-
return (hAsync("nav", { key: '
|
|
10451
|
+
return (hAsync("nav", { key: '83e2aa66dcaeabc1629c4c23ee87f0ed8799eae7', class: "navbar" }, hAsync("div", { key: '500612a656db49c3962dcb2b2fb62ced5e6f9f5e', class: "navbar__left" }, this.showMenuToggle && (hAsync("button", { key: 'a85325e0bfaf6ed1f739abf35460c0fd9fe12bdb', class: "navbar__menu-btn", onClick: () => this.dropiMenuToggle.emit(), "aria-label": "Men\u00FA" }, hAsync("dropi-icon", { key: 'd94b443c19e6212547dbe4d97fe907be862726f9', name: "Menu", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-700" }))), this.logoUrl && (hAsync("img", { key: '0da8e838faac7f31175935ea9b0cfe6fb68ad516', class: "navbar__logo", src: this.logoUrl, alt: this.logoAlt })), this.title && hAsync("span", { key: 'ae1d08c0cac208bf31e1978da68f89cc6eec13d2', class: "navbar__title" }, this.title)), items.length > 0 && (hAsync("ul", { key: '48dcc829cd503ce2a3f3929ccb03782b226a18ed', class: "navbar__items" }, items.map(item => (hAsync("li", null, hAsync("button", { class: { 'navbar__item': true, 'navbar__item--active': item.id === this.activeId }, onClick: () => this.clickLoadItem.emit(item), type: "button" }, item.icon && hAsync("dropi-icon", { name: item.icon, iconWidth: "16px", iconHeight: "16px", color: item.id === this.activeId ? 'Primary-Primary-500' : 'Gray-Gray-600' }), hAsync("span", null, item.name?.value || item.label), item.badge != null && String(item.badge) !== '0' && (hAsync("span", { class: "navbar__badge" }, item.badge)))))))), hAsync("div", { key: 'f6a7a4bfcf90829fdf78eade141c1a43a3ef213c', class: "navbar__right" }, hAsync("button", { key: '652f412206186a3e8325e8a41cefa78049da39a6', class: "navbar__icon-btn", onClick: () => this.dropiNotificationsClick.emit(), "aria-label": "Notificaciones" }, hAsync("dropi-icon", { key: 'ddf8877a77c15d8c0582866d56851f5ee9b9b5f1', name: "Bell", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-600" }), this.notifications > 0 && (hAsync("span", { key: '613f9d9c7a7b0c1125aee602be6672ce478cef26', class: "navbar__notif-badge" }, this.notifications > 99 ? '99+' : this.notifications))), hAsync("button", { key: 'af0e25263309dc90ae4f0047c25089b9486562d4', class: "navbar__user-btn", onClick: () => this.dropiUserClick.emit(), type: "button" }, this.userAvatar
|
|
10450
10452
|
? hAsync("img", { class: "navbar__avatar", src: this.userAvatar, alt: this.userName })
|
|
10451
|
-
: hAsync("div", { class: "navbar__avatar-placeholder" }, this.userName ? this.userName[0].toUpperCase() : '?'), this.userName && hAsync("span", { key: '
|
|
10453
|
+
: hAsync("div", { class: "navbar__avatar-placeholder" }, this.userName ? this.userName[0].toUpperCase() : '?'), this.userName && hAsync("span", { key: '54a6f1b97d2d8f11fe5556510638d4cbef2d638b', class: "navbar__user-name" }, this.userName), hAsync("dropi-icon", { key: '21dd9ed6cf46d719d8b49c65fba8f787f7a84629', name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })))));
|
|
10452
10454
|
}
|
|
10453
10455
|
static get style() { return dropiNavbarCss(); }
|
|
10454
10456
|
static get cmpMeta() { return {
|
|
@@ -10483,8 +10485,6 @@ class DropiOtpSendCode {
|
|
|
10483
10485
|
registerInstance(this, hostRef);
|
|
10484
10486
|
this.codeCompleted = createEvent(this, "codeCompleted");
|
|
10485
10487
|
this.codeAccepted = createEvent(this, "codeAccepted");
|
|
10486
|
-
this.dropiCodeCompleted = createEvent(this, "dropiCodeCompleted");
|
|
10487
|
-
this.dropiCodeAccepted = createEvent(this, "dropiCodeAccepted");
|
|
10488
10488
|
this.dropiResend = createEvent(this, "dropiResend");
|
|
10489
10489
|
if (hostRef.$hostElement$["s-ei"]) {
|
|
10490
10490
|
this.internals = hostRef.$hostElement$["s-ei"];
|
|
@@ -10523,10 +10523,6 @@ class DropiOtpSendCode {
|
|
|
10523
10523
|
codeCompleted;
|
|
10524
10524
|
/** Emitted when all digits are entered (alternative event). */
|
|
10525
10525
|
codeAccepted;
|
|
10526
|
-
/** Compatibility alias for codeCompleted */
|
|
10527
|
-
dropiCodeCompleted;
|
|
10528
|
-
/** Compatibility alias for codeAccepted */
|
|
10529
|
-
dropiCodeAccepted;
|
|
10530
10526
|
/** Emitted when resend is requested */
|
|
10531
10527
|
dropiResend;
|
|
10532
10528
|
componentWillLoad() {
|
|
@@ -10563,8 +10559,6 @@ class DropiOtpSendCode {
|
|
|
10563
10559
|
this.internals.setFormValue(finalCode);
|
|
10564
10560
|
this.codeCompleted.emit(finalCode);
|
|
10565
10561
|
this.codeAccepted.emit(finalCode);
|
|
10566
|
-
this.dropiCodeCompleted.emit(finalCode);
|
|
10567
|
-
this.dropiCodeAccepted.emit(finalCode);
|
|
10568
10562
|
}
|
|
10569
10563
|
else {
|
|
10570
10564
|
this.internals.setFormValue(newDigits.join(''));
|
|
@@ -10588,8 +10582,6 @@ class DropiOtpSendCode {
|
|
|
10588
10582
|
this.internals.setFormValue(finalCode);
|
|
10589
10583
|
this.codeCompleted.emit(finalCode);
|
|
10590
10584
|
this.codeAccepted.emit(finalCode);
|
|
10591
|
-
this.dropiCodeCompleted.emit(finalCode);
|
|
10592
|
-
this.dropiCodeAccepted.emit(finalCode);
|
|
10593
10585
|
}
|
|
10594
10586
|
else {
|
|
10595
10587
|
this.internals.setFormValue(newDigits.join(''));
|
|
@@ -10597,14 +10589,14 @@ class DropiOtpSendCode {
|
|
|
10597
10589
|
}
|
|
10598
10590
|
render() {
|
|
10599
10591
|
const engineLabel = this.engine === 'sms' ? 'SMS' : this.engine === '2fa' ? 'autenticador' : 'correo';
|
|
10600
|
-
return (hAsync("div", { key: '
|
|
10592
|
+
return (hAsync("div", { key: '68d01986b43ee262c6df66d1160df32313c76edf', class: "otp" }, this.showLabelContact && (hAsync("p", { key: '83138a2f4716552cce108c228b99c1e7fc532036', class: "otp__label" }, "Ingresa el c\u00F3digo enviado a tu ", engineLabel, this.labelContact && hAsync("strong", { key: '8de893e9ea835b3459b8be78414d337436f908de' }, " ", this.labelContact))), hAsync("div", { key: 'a50f5e2ae1733ec1df704578d6264b8e86a08f5b', class: "otp__inputs", onPaste: (e) => this.handlePaste(e) }, this.digits.map((_, i) => (hAsync("input", { key: i, ref: (el) => {
|
|
10601
10593
|
if (el)
|
|
10602
10594
|
this.inputs[i] = el;
|
|
10603
10595
|
}, class: {
|
|
10604
10596
|
'otp__digit': true,
|
|
10605
10597
|
'otp__digit--filled': this.digitStates[i] === 'filled',
|
|
10606
10598
|
'otp__digit--error': this.error,
|
|
10607
|
-
}, type: "text", inputMode: "numeric", maxLength: 1, value: this.digits[i] ?? '', onInput: (e) => this.handleInput(e, i), onKeyDown: (e) => this.handleKeyDown(e, i) })))), this.error && this.errorMessage && (hAsync("p", { key: '
|
|
10599
|
+
}, type: "text", inputMode: "numeric", maxLength: 1, value: this.digits[i] ?? '', onInput: (e) => this.handleInput(e, i), onKeyDown: (e) => this.handleKeyDown(e, i) })))), this.error && this.errorMessage && (hAsync("p", { key: '315b68b30120ab315f106eed441b9a61550d7833', class: "otp__error" }, this.errorMessage)), hAsync("div", { key: 'b07d47236824b631193b9a90c083ea5d170d135b', class: "otp__resend" }, this.canResend ? (hAsync("button", { class: "otp__resend-btn", onClick: () => { this.startCountdown(); this.dropiResend.emit(); } }, "Reenviar c\u00F3digo")) : (hAsync("span", { class: "otp__countdown" }, "Reenviar en ", this.countdown, "s")))));
|
|
10608
10600
|
}
|
|
10609
10601
|
static get formAssociated() { return true; }
|
|
10610
10602
|
static get watchers() { return {
|
|
@@ -10696,9 +10688,9 @@ class DropiPaginator {
|
|
|
10696
10688
|
const pages = this.pageNumbers;
|
|
10697
10689
|
const isFirst = this.currentPage <= 1;
|
|
10698
10690
|
const isLast = this.currentPage >= this.totalPages;
|
|
10699
|
-
return (hAsync("div", { key: '
|
|
10691
|
+
return (hAsync("div", { key: 'e72ebe722f06549a3000d89597b8835d93ed7be1', class: "paginator" }, hAsync("div", { key: '5e6fc47b3bc6fc4a94bf0770f405e1ea73eb411d', class: "paginator-pages" }, !isFirst && !this.noLabels && (hAsync("button", { key: '7ee39bcd8506638c6b392b48e63cd0f0a3f671f7', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(1), "aria-label": "Primera p\u00E1gina", disabled: this.disabled }, hAsync("dropi-icon", { key: '857739a713620c191f8106565a2d9e8ac51df3fe', name: "Arrow-double-small-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isFirst && (hAsync("button", { key: '8052d9499ed78c264390c875e73e7f18d5e2e888', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage - 1), "aria-label": "Anterior", disabled: this.disabled }, hAsync("dropi-icon", { key: '243eeba594d2029bc47bc651244d9b1664f7041c', name: "Dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }), !this.noLabels && hAsync("span", { key: '0beca41b97528db889db9265c0779cb842132e38', class: "paginator-label" }, "Anterior"))), pages.map((p, i) => p === '...'
|
|
10700
10692
|
? hAsync("span", { class: "paginator-ellipsis", key: `e${i}` }, "\u2026")
|
|
10701
|
-
: hAsync("button", { key: p, class: { 'paginator-btn': true, 'paginator-btn--active': p === this.currentPage }, onClick: () => this.goTo(p), "aria-current": p === this.currentPage ? 'page' : undefined, disabled: this.disabled }, p)), !isLast && (hAsync("button", { key: '
|
|
10693
|
+
: hAsync("button", { key: p, class: { 'paginator-btn': true, 'paginator-btn--active': p === this.currentPage }, onClick: () => this.goTo(p), "aria-current": p === this.currentPage ? 'page' : undefined, disabled: this.disabled }, p)), !isLast && (hAsync("button", { key: '5a318c012b3da12ed6cf7e3b9548b5e5c93a4abd', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage + 1), "aria-label": "Siguiente", disabled: this.disabled }, !this.noLabels && hAsync("span", { key: '1eb25a3ddf80cbf32e4beae87d66a516b7f1304d', class: "paginator-label" }, "Siguiente"), hAsync("dropi-icon", { key: '98f4c308b02777a28349e3d873c486ea24a66ea5', name: "Dropdown-Right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isLast && !this.noLabels && (hAsync("button", { key: 'dabccdd09218037c302a051bdca26aefebb4e015', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.totalPages), "aria-label": "\u00DAltima p\u00E1gina", disabled: this.disabled }, hAsync("dropi-icon", { key: '7a6872706fba9456b57c6d55778c456de1cf179d', name: "Arrow-double-small-right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))))));
|
|
10702
10694
|
}
|
|
10703
10695
|
static get style() { return dropiPaginatorCss(); }
|
|
10704
10696
|
static get cmpMeta() { return {
|
|
@@ -10918,10 +10910,10 @@ class DropiPhoneInput {
|
|
|
10918
10910
|
render() {
|
|
10919
10911
|
const country = this.selectedCountry;
|
|
10920
10912
|
const isInvalid = this.isValidPhone === false;
|
|
10921
|
-
return (hAsync("div", { key: '
|
|
10913
|
+
return (hAsync("div", { key: '8baf494cc8b0c7925414a5c6b518bed906c6c9af', class: "phone-wrap" }, hAsync("div", { key: '8676178ee71fc85eaab623dea92760f0ae661c77', class: "phone-input-container" }, hAsync("div", { key: 'b4037828a850187c7c01df69c46704ca38ab9399', class: "custom-select" }, hAsync("button", { key: '796f0d20cffc0c821012245fe49a9c04b2d07f85', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
|
|
10922
10914
|
if (!this.disabledInput)
|
|
10923
10915
|
this.open = !this.open;
|
|
10924
|
-
} }, hAsync("span", { key: '
|
|
10916
|
+
} }, hAsync("span", { key: '67d2755de630b936763fa2610a0e7ba4650476c4', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, hAsync("img", { key: '576ea15412ad8106e9674bb53dd9b71f86654b48', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), hAsync("dropi-icon", { key: '1db0802eb57a6359b2482bc8f24b39957c6cca09', name: this.open ? 'Dropdown-up' : 'Dropdown-down', iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-500" })), hAsync("ul", { key: 'cf7a36e39eda8d049c0f9576f52e24e0c88173f3', class: { 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open } }, COUNTRIES.map(option => (hAsync("li", null, hAsync("button", { type: "button", class: "option", onMouseDown: (e) => { e.preventDefault(); this.selectCountry(option); } }, hAsync("img", { src: `https://flagsapi.com/${option.flag}/flat/24.png`, alt: option.flag }), option.code)))))), hAsync("input", { key: '813f274452998d7d329adac1b21c796b61a26a9b', id: "phone-input", type: "tel", inputmode: "numeric", class: { 'form-control': true, 'is-invalid': isInvalid }, placeholder: this.phoneNumberPlaceholder, value: this.ngModelPhone, disabled: this.disabledInput, maxLength: country.maxLength, onInput: (e) => this.handleInput(e) }))));
|
|
10925
10917
|
}
|
|
10926
10918
|
static get formAssociated() { return true; }
|
|
10927
10919
|
static get watchers() { return {
|
|
@@ -10980,7 +10972,7 @@ class DropiProgressBar {
|
|
|
10980
10972
|
width: `${Math.min(100, Math.max(0, this.value))}%`,
|
|
10981
10973
|
backgroundColor: this.color || `var(--${this.getSeverityVariable()}, #50A5F1)`,
|
|
10982
10974
|
};
|
|
10983
|
-
return (hAsync("div", { key: '
|
|
10975
|
+
return (hAsync("div", { key: 'ff6b55a3f0aaf2eb6f5310d06acf9cfa0f3a2b12', class: "progress-container" }, this.showValue && (hAsync("div", { key: 'f34f6818580f08c0308a4d75ac4c6cfef6d992a6', class: "progress-header" }, hAsync("span", { key: 'daa2e09a6698da3dc3ad207ff6a6cd1882de66cc', class: "progress-value" }, this.value, "%"))), hAsync("div", { key: 'dbe1cf7f8330446dd2a2e7b8c3b049b7c0f816eb', class: "progress-track", style: { height: this.height, backgroundColor: this.trackColor } }, hAsync("div", { key: 'ce7a0598e201918aa4e925a97c7426c048fd00b9', class: "progress-fill", style: fillStyle }))));
|
|
10984
10976
|
}
|
|
10985
10977
|
getSeverityVariable() {
|
|
10986
10978
|
switch (this.severity) {
|
|
@@ -11059,7 +11051,7 @@ class DropiRadioButton {
|
|
|
11059
11051
|
this.dropiChange.emit(e);
|
|
11060
11052
|
}
|
|
11061
11053
|
render() {
|
|
11062
|
-
return (hAsync("div", { key: '
|
|
11054
|
+
return (hAsync("div", { key: 'f5a4cfda3991106a02821a499452294509fea514', class: "dropi-radio-button" }, hAsync("label", { key: '8f28e2d4a0da03bd1b0ef2d8a92b1ed9b2b66c26', htmlFor: this.inputId }, hAsync("input", { key: 'ddd006fafd64e071a1431dd3fb827f06a9c8d92d', id: this.inputId, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
|
|
11063
11055
|
}
|
|
11064
11056
|
static get formAssociated() { return true; }
|
|
11065
11057
|
static get watchers() { return {
|
|
@@ -11130,10 +11122,10 @@ class DropiRadioSelectionList {
|
|
|
11130
11122
|
return this.parsedOptions.filter(o => o.name?.toLowerCase().includes(q));
|
|
11131
11123
|
}
|
|
11132
11124
|
render() {
|
|
11133
|
-
return (hAsync("div", { key: '
|
|
11125
|
+
return (hAsync("div", { key: '296bdc955d13b8163ca954f6d399543343e7e121', class: "rsl" }, this.showFilter && (hAsync("div", { key: '4cdd3764411f389d2b6ce1145f5b6759bb20fc7b', class: "rsl__search" }, hAsync("dropi-icon", { key: '81af80a3dddb6176625b6ba575b084501741cd81', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("input", { key: 'aa0e762f4403431225375f95c792af8596529588', class: "rsl__search-input", type: "text", placeholder: this.filterPlaceholder, value: this.filterText, onInput: (e) => {
|
|
11134
11126
|
this.filterText = e.target.value;
|
|
11135
11127
|
this.dropiSearch.emit({ searchValue: this.filterText, filteredOptions: this.filtered });
|
|
11136
|
-
} }))), hAsync("div", { key: '
|
|
11128
|
+
} }))), hAsync("div", { key: 'd153875a1c09957b74648f61f70320968ea6cd40', class: "rsl__list" }, this.filtered.map(opt => {
|
|
11137
11129
|
const isSelected = opt.id === this.selectedOption;
|
|
11138
11130
|
return (hAsync("div", { class: { 'rsl__item': true, 'rsl__item--selected': isSelected }, key: opt.id, onClick: () => { this.selectedOption = opt.id; this.dropiChange.emit(opt.id); } }, hAsync("div", { class: { 'rsl__radio': true, 'rsl__radio--checked': isSelected } }, isSelected && hAsync("div", { class: "rsl__radio-dot" })), hAsync("div", { class: "rsl__content" }, hAsync("span", { class: "rsl__name" }, opt.name), (isSelected || this.alwaysShowDescription) && opt.description && (hAsync("span", { class: "rsl__desc" }, opt.description)))));
|
|
11139
11131
|
}))));
|
|
@@ -11198,7 +11190,7 @@ class DropiReadMore {
|
|
|
11198
11190
|
}
|
|
11199
11191
|
render() {
|
|
11200
11192
|
const showToggle = this.needsTruncation && (this.expanded ? this.showSeeLess : true);
|
|
11201
|
-
return (hAsync("div", { key: '
|
|
11193
|
+
return (hAsync("div", { key: '125c5f1d75c1e06f02d9898f375626bb75a67cd8', class: "read-more" }, hAsync("p", { key: '4a4450a3468e7fe7297fdae98d370f8cd77b8553', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (hAsync("button", { key: 'cfe58b2781b908d9a0a802b4bd68cedf8dea827e', class: "read-more__toggle", style: this.buttonStyle ? this.buttonStyle : undefined, onClick: () => this.expanded = !this.expanded }, this.expanded ? ' Ver menos' : '... Ver más')))));
|
|
11202
11194
|
}
|
|
11203
11195
|
static get style() { return dropiReadMoreCss(); }
|
|
11204
11196
|
static get cmpMeta() { return {
|
|
@@ -11329,10 +11321,10 @@ class DropiSearch {
|
|
|
11329
11321
|
}
|
|
11330
11322
|
render() {
|
|
11331
11323
|
const showDropdown = this.open && this.parsedOptions.length > 0;
|
|
11332
|
-
return (hAsync("div", { key: '
|
|
11324
|
+
return (hAsync("div", { key: '594b15b4b31044f4a02376dc773ea36da893d773', class: "search-wrap" }, this.label && hAsync("label", { key: '297a989441ad892715b09421f9a53618851c1b52', class: "search-label" }, this.label), hAsync("div", { key: '6bbaf4ea5c1bc6ff831626117fccde647e68ba19', class: `search-input-row search-input-row--${this.type}` }, this.showIcon && hAsync("dropi-icon", { key: 'e94c3a3895a14e950a018023d5d7a281a230abae', class: "search-icon", name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("input", { key: '820bf2f4c9ecaf9907aceaaa08bd3fa309606e90', class: "search-input", type: this.typeInput, placeholder: this.placeholder, value: this.textInput, maxLength: this.maxLength, onInput: (e) => this.handleInput(e), onKeyDown: (e) => this.handleKeyDown(e), onFocus: () => {
|
|
11333
11325
|
if (this.parsedOptions.length)
|
|
11334
11326
|
this.open = true;
|
|
11335
|
-
}, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (hAsync("button", { key: '
|
|
11327
|
+
}, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (hAsync("button", { key: 'e2fd7c3d5fee45a83f030589f58d4fee9f3af69c', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, hAsync("dropi-icon", { key: 'a530b0adb83d76b205cd2b22792f14229950836e', name: "Close-small", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), showDropdown && (hAsync("div", { key: '8c062d43dccb41c84b2a599ed6d1a5e049a75b65', class: `search-dropdown search-dropdown--${this.position}`, style: { '--dropdown-height': `${this.heightOverlay}px` } }, this.filtered.length === 0 ? (hAsync("div", { class: "search-no-results" }, "Sin resultados")) : (this.filtered.map((opt, i) => (hAsync("div", { class: { 'search-option': true, 'search-option--selected': this.isSelected(opt) }, key: i, onMouseDown: (e) => { e.preventDefault(); this.selectOption(opt); } }, this.multipleSelectModel && hAsync("dropi-checkbox", { name: "_search-option", checked: this.isSelected(opt) }), hAsync("span", { class: "search-option__label" }, opt[this.dataName])))))))));
|
|
11336
11328
|
}
|
|
11337
11329
|
static get watchers() { return {
|
|
11338
11330
|
"dataToSearch": [{
|
|
@@ -11773,7 +11765,7 @@ class DropiSelect {
|
|
|
11773
11765
|
]), !this.isGrouped && this.filteredOptions.map(opt => this.renderOption(opt)), this.filteredOptions.length === 0 && (hAsync("li", { class: "no-results" }, "Sin resultados"))));
|
|
11774
11766
|
}
|
|
11775
11767
|
render() {
|
|
11776
|
-
return (hAsync("div", { key: '
|
|
11768
|
+
return (hAsync("div", { key: 'b11bfc98a7d37846afaad6b171f564b5cb72620a', class: "custom-select" }, !this.dropdownType && this.label && (hAsync("label", { key: 'bda1ed87b6ed257c1f8148464199f241d3f5d5f9', class: { 'disabled-label': this.disabled } }, this.label, this.showObligatory && !this.disabled && hAsync("span", { key: '81e9fd26856228c8ec59271bae8f3788f22fc2ee', class: "asterisk" }, " *"))), hAsync("div", { key: 'a8feb6ffde967418ad5655e24b3b2ac260541508', class: "dropdown-container" }, this.dropdownType && this.label && (hAsync("div", { key: '43c9e38a90c6f072f540f6e6af3315e26ce2b2e0', class: "left-label" }, this.label)), this.renderTrigger()), this.textHelper && !this.hasError && (hAsync("div", { key: '73c290608f1feeca8a78d391c63ff76cbdfc41a7', class: "select-helper" }, hAsync("span", { key: 'b64e35c437f9791e790e4d2155deae02cdeb684f' }, this.textHelper))), this.hasError && this.errorText && (hAsync("div", { key: '4e7126e5f6f64a6134928e9aa1901e2d795a9246', class: "select-helper-error" }, hAsync("dropi-icon", { key: '36019fb1921f710113fb10e99eb16fa46a6306dc', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), hAsync("span", { key: '99783b102c6d345404ef8d9dfb0325c682c8f87b' }, this.errorText))), this.renderDropdown()));
|
|
11777
11769
|
}
|
|
11778
11770
|
static get formAssociated() { return true; }
|
|
11779
11771
|
static get watchers() { return {
|
|
@@ -11882,7 +11874,7 @@ class DropiSidebar {
|
|
|
11882
11874
|
this.dropiIndexChange.emit(itemClicked);
|
|
11883
11875
|
}
|
|
11884
11876
|
render() {
|
|
11885
|
-
return (hAsync("div", { key: '
|
|
11877
|
+
return (hAsync("div", { key: '3e45416a116488871747c54c14cbb73ecf1d9a4d', class: "main-sidebar-container" }, this.parsedProperties.map(item => {
|
|
11886
11878
|
return [
|
|
11887
11879
|
/* Item Principal */
|
|
11888
11880
|
hAsync("div", { class: {
|
|
@@ -11958,7 +11950,7 @@ class DropiSimpleStepper {
|
|
|
11958
11950
|
render() {
|
|
11959
11951
|
const labels = this.parsedLabels;
|
|
11960
11952
|
const steps = Array.from({ length: this.stepsCount }, (_, i) => i + 1);
|
|
11961
|
-
return (hAsync("div", { key: '
|
|
11953
|
+
return (hAsync("div", { key: 'f67f6e9404bf67700c46b987923836d5251ae1c4', class: "stepper" }, steps.map((step, i) => {
|
|
11962
11954
|
const isCompleted = step < this.currentStep;
|
|
11963
11955
|
const isActive = step === this.currentStep;
|
|
11964
11956
|
const isLast = i === steps.length - 1;
|
|
@@ -12101,7 +12093,7 @@ class DropiSteps {
|
|
|
12101
12093
|
render() {
|
|
12102
12094
|
const labels = this.parsedLabels;
|
|
12103
12095
|
const steps = Array.from({ length: this.stepsCount }, (_, i) => i + 1);
|
|
12104
|
-
return (hAsync("div", { key: '
|
|
12096
|
+
return (hAsync("div", { key: '35c28210675370e76f16e2525fdf785b6205ec78', class: "stepper" }, steps.map((step) => {
|
|
12105
12097
|
const state = this.stepState(step);
|
|
12106
12098
|
const label = labels[step - 1];
|
|
12107
12099
|
const isFirst = step === 1;
|
|
@@ -12174,7 +12166,7 @@ class DropiSwitch {
|
|
|
12174
12166
|
this.dropiChange.emit(this.isChecked);
|
|
12175
12167
|
}
|
|
12176
12168
|
render() {
|
|
12177
|
-
return (hAsync("label", { key: '
|
|
12169
|
+
return (hAsync("label", { key: 'fe429645c1b3032a273c3dd45e450cc3cdfaa4ae', class: "toggle-switch" }, hAsync("input", { key: '8e73bdbe0b14b8e889804f5d35616c0cfa52b025', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: (e) => this.onToggleChange(e) }), hAsync("span", { key: '245aae98ce063331246fda2c729134112a199114', class: "slider" })));
|
|
12178
12170
|
}
|
|
12179
12171
|
static get formAssociated() { return true; }
|
|
12180
12172
|
static get watchers() { return {
|
|
@@ -12587,7 +12579,7 @@ class DropiTabs {
|
|
|
12587
12579
|
this.dropiIndexChange.emit(tab);
|
|
12588
12580
|
}
|
|
12589
12581
|
render() {
|
|
12590
|
-
return (hAsync("div", { key: '
|
|
12582
|
+
return (hAsync("div", { key: '5e8facb7611d02c9b7fad97f676a50ce419c6852', class: "tabs-container", role: "tablist" }, this.parsedTabs.map(tab => {
|
|
12591
12583
|
const isActive = tab.id === this.activeTab;
|
|
12592
12584
|
return (hAsync("div", { role: "tab", "aria-selected": String(isActive), class: { 'tab-item': true, 'tab-item--active': isActive && !tab.disabled, 'tab-item--disabled': !!tab.disabled }, onClick: () => this.handleClick(tab) }, hAsync("span", { class: "tab-label-row" }, hAsync("span", { class: "tab-label" }, tab.label), tab.counter !== undefined && tab.counter !== null && (hAsync("span", { class: { 'tab-counter': true, 'tab-counter--active': isActive } }, tab.counter))), this.showIcon && (tab.completed
|
|
12593
12585
|
? hAsync("dropi-icon", { name: "Check-circle", iconWidth: "12px", iconHeight: "12px", color: "Success-Success-500" })
|
|
@@ -12686,7 +12678,7 @@ class DropiTag {
|
|
|
12686
12678
|
return typeof this.text === 'string' && this.text.trim().length > 0;
|
|
12687
12679
|
}
|
|
12688
12680
|
render() {
|
|
12689
|
-
return (hAsync("div", { key: '
|
|
12681
|
+
return (hAsync("div", { key: '6a50111c0057b7ef3380dde9f639e9409b7fbea9', class: "container-chips" }, hAsync("div", { key: 'f2f78c3682aa2e8bef5f3f1b43a1729cae8ae293', class: {
|
|
12690
12682
|
tags: true,
|
|
12691
12683
|
'icon-only': this.showIcon && !this.hasContent,
|
|
12692
12684
|
'dot-variant': this.variant === 'dot',
|
|
@@ -12695,7 +12687,7 @@ class DropiTag {
|
|
|
12695
12687
|
backgroundColor: (this.variant === 'dot' || this.variant === 'text') ? 'transparent' : this.bgColor,
|
|
12696
12688
|
color: this.textColor,
|
|
12697
12689
|
fontWeight: this.fontWeight
|
|
12698
|
-
} }, this.variant === 'dot' && (hAsync("div", { key: '
|
|
12690
|
+
} }, this.variant === 'dot' && (hAsync("div", { key: '5364569230575b79b1160e06cc29046220bdf198', class: "dot-indicator", style: { backgroundColor: this.dotColor } })), this.showIcon && this.icon && (hAsync("dropi-icon", { key: '8ea74f9ad58e7892405e3e748289b71456945de6', class: "file-icon", name: this.icon, iconWidth: "16px", iconHeight: "16px", color: this.variant === 'dot' ? 'Gray-Gray-500' : this.iconColor })), this.hasContent && hAsync("span", { key: '99409549735fd48cf0a40e411f1f236716e53939' }, this.text))));
|
|
12699
12691
|
}
|
|
12700
12692
|
static get watchers() { return {
|
|
12701
12693
|
"type": [{
|
|
@@ -12739,7 +12731,7 @@ class DropiTagTypeProduct {
|
|
|
12739
12731
|
/** Label text. Default: VARIABLE */
|
|
12740
12732
|
label = 'VARIABLE';
|
|
12741
12733
|
render() {
|
|
12742
|
-
return hAsync("div", { key: '
|
|
12734
|
+
return hAsync("div", { key: 'ae1cd50cd3e82180704ae4f5406b4dc13ffbd12c', class: "type-variation" }, this.label);
|
|
12743
12735
|
}
|
|
12744
12736
|
static get style() { return dropiTagTypeProductCss(); }
|
|
12745
12737
|
static get cmpMeta() { return {
|
|
@@ -12869,12 +12861,12 @@ class DropiTextArea {
|
|
|
12869
12861
|
render() {
|
|
12870
12862
|
const showAsterisk = this.required && this.showObligatoryAsterisk && !this.disabled;
|
|
12871
12863
|
const showHelper = this.textHelper || this.isInvalid;
|
|
12872
|
-
return (hAsync("div", { key: '
|
|
12864
|
+
return (hAsync("div", { key: '0b5292b24d3e4f2b56d69e985ede73be0f9a1338', class: "textarea-wrapper" }, this.label && (hAsync("label", { key: '19a45a83b92bed4b98da68389f5eee6affce9eb2', htmlFor: this.resolvedId, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : 'var(--Gray-Gray-600)' } }, this.label, showAsterisk && hAsync("span", { key: 'e67602dbd7095504c4c1bf574d03a01a5238b561', class: "asterisk" }, " *"))), hAsync("div", { key: '1d858e327147e87ca9df03d38e7bb90e0464fe31', class: "textarea-container" }, hAsync("textarea", { key: 'c50cab6f4126a99628bd0aa6f2843fec43b27edf', id: this.resolvedId, class: {
|
|
12873
12865
|
'form-control': true,
|
|
12874
12866
|
'Body-M-Regular': true,
|
|
12875
12867
|
'form-control-valid': !this.isInvalid && this.touched && !!this.value,
|
|
12876
12868
|
'form-control-invalid': this.isInvalid,
|
|
12877
|
-
}, rows: this.rows, placeholder: this.placeholder, maxLength: this.maxLength, minLength: this.minLength, disabled: this.disabled, required: this.required, style: { resize: this.resize }, onInput: (e) => this.handleInput(e), onFocus: () => this.dropiFocus.emit(), onBlur: () => this.handleBlur() }, this.value), this.maxLength > 0 && (hAsync("div", { key: '
|
|
12869
|
+
}, rows: this.rows, placeholder: this.placeholder, maxLength: this.maxLength, minLength: this.minLength, disabled: this.disabled, required: this.required, style: { resize: this.resize }, onInput: (e) => this.handleInput(e), onFocus: () => this.dropiFocus.emit(), onBlur: () => this.handleBlur() }, this.value), this.maxLength > 0 && (hAsync("div", { key: 'f62af4910cccf74bbbc7bad4064228545fba5d88', class: "char-counter" }, this.charCount, "/", this.maxLength))), showHelper && (hAsync("div", { key: 'ca4ac5b41128f27dee5363aca453dc1f085d9e61', class: "form-control-helper" }, this.isInvalid && (hAsync("dropi-icon", { key: 'a9c83edecd20dd318dd6ba7e4cc0d41ad748278a', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" })), hAsync("span", { key: '09efa2feba4a232e453cc99f64d98eac9fd76632', class: { 'invalid-color': this.isInvalid }, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : undefined } }, this.textHelper)))));
|
|
12878
12870
|
}
|
|
12879
12871
|
static get formAssociated() { return true; }
|
|
12880
12872
|
static get watchers() { return {
|
|
@@ -12938,7 +12930,7 @@ class DropiTimeLine {
|
|
|
12938
12930
|
}
|
|
12939
12931
|
render() {
|
|
12940
12932
|
const steps = this.parsedSteps;
|
|
12941
|
-
return (hAsync("div", { key: '
|
|
12933
|
+
return (hAsync("div", { key: '22a2f8ff7a33e892096c3aaf381e23b110ec6b0a', class: "timeline" }, steps.map((step, i) => {
|
|
12942
12934
|
const isLast = i === steps.length - 1;
|
|
12943
12935
|
return (hAsync("div", { class: { 'tl-step': true, [`tl-step--${step.status}`]: true }, key: step.id || i }, hAsync("div", { class: "tl-step__marker" }, hAsync("div", { class: "tl-step__icon" }, step.icon ? (hAsync("dropi-icon", { name: step.icon, iconWidth: "16px", iconHeight: "16px", color: step.status === 'done' ? 'Neutral-White' : step.status === 'active' ? 'Primary-Primary-500' : 'Gray-Gray-400' })) : (hAsync("span", { class: "tl-step__dot" }))), !isLast && hAsync("div", { class: "tl-step__line" })), hAsync("div", { class: "tl-step__content" }, hAsync("span", { class: "tl-step__label" }, step.label), step.subtitle && hAsync("span", { class: "tl-step__subtitle" }, step.subtitle))));
|
|
12944
12936
|
})));
|
|
@@ -13007,7 +12999,7 @@ class DropiToast {
|
|
|
13007
12999
|
info: 'question',
|
|
13008
13000
|
};
|
|
13009
13001
|
render() {
|
|
13010
|
-
return (hAsync("div", { key: '
|
|
13002
|
+
return (hAsync("div", { key: 'e7d23323039ed09e5317fc24f86a4e51af14b249', class: `dropi-toast-container dropi-toast-container--${this.position}` }, (this.items ?? []).map(item => (hAsync("div", { key: item.msg.id, class: { 'dropi-toast-wrapper': true, 'dropi-toast-wrapper--leaving': item.leaving } }, hAsync("div", { class: `dropi-toast-item dropi-toast-item--${item.msg.severity}` }, hAsync("div", { class: "dropi-toast-content" }, hAsync("div", { class: "dropi-toast-lottie" }, hAsync("lottie-player", { key: item.msg.severity, src: LOTTIE_MAP[this.severityToLottieKey[item.msg.severity]], background: "transparent", speed: "1", loop: true, autoplay: true })), hAsync("div", { class: "dropi-toast-info" }, hAsync("p", { class: "dropi-toast-title" }, item.msg.summary), item.msg.detail && hAsync("p", { class: "dropi-toast-detail" }, item.msg.detail))), item.msg.closable && (hAsync("button", { class: "dropi-toast-close", onClick: () => this.remove(item.msg.id) }, hAsync("dropi-icon", { name: "Close-small", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-400" })))))))));
|
|
13011
13003
|
}
|
|
13012
13004
|
static get style() { return dropiToastCss(); }
|
|
13013
13005
|
static get cmpMeta() { return {
|
|
@@ -13041,7 +13033,7 @@ class DropiTooltip {
|
|
|
13041
13033
|
/** Whether the tooltip has an outline style (matches Angular `outlined`) */
|
|
13042
13034
|
outlined = false;
|
|
13043
13035
|
render() {
|
|
13044
|
-
return (hAsync("div", { key: '
|
|
13036
|
+
return (hAsync("div", { key: '0b14943b628c231fbb530620e7829f70e6099c7a', class: { 'tooltip-simple': true, 'tooltip-simple--outlined': this.outlined } }, hAsync("slot", { key: 'bf0245c6fab0ba938834d2d3e84ccaa9cb14f5c8' }), this.text && (hAsync("div", { key: 'e1e33acf8628f79b36c5cc66c7076a03ce8167f7', class: "tooltip-simple-bubble" }, this.text))));
|
|
13045
13037
|
}
|
|
13046
13038
|
static get style() { return dropiTooltipCss$1(); }
|
|
13047
13039
|
static get cmpMeta() { return {
|
|
@@ -13182,12 +13174,12 @@ class DropiTooltipV2 {
|
|
|
13182
13174
|
const bubbleStyle = { maxWidth: this.maxWidth };
|
|
13183
13175
|
if (this.minWidth)
|
|
13184
13176
|
bubbleStyle.minWidth = this.minWidth;
|
|
13185
|
-
return (hAsync("div", { key: '
|
|
13177
|
+
return (hAsync("div", { key: 'e2ce31df52e00568920e754904b1f5910ff4c8ba', class: "tooltip-wrapper", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onClick: this.handleClick, onFocusin: this.handleFocusin, onFocusout: this.handleFocusout }, this.showIcon && (hAsync("dropi-icon", { key: 'aa3213451bcfb60561043b0c3854bb20c3a4703a', name: this.iconName, iconWidth: `${this.iconSize}px`, iconHeight: `${this.iconSize}px`, color: this.iconColor })), hAsync("slot", { key: '5ce4929e6f96d4c605d149a970aba1746e82078a' }), this.displayContent && (hAsync("div", { key: '66a1193abf25ce4161ec35f1ca0c344ec418cce8', class: {
|
|
13186
13178
|
'tooltip-bubble': true,
|
|
13187
13179
|
[`tooltip-bubble--${this.position}`]: true,
|
|
13188
13180
|
[`tooltip-bubble--arrow-${this.arrowPosition}`]: true,
|
|
13189
13181
|
'tooltip-bubble--visible': this.visible,
|
|
13190
|
-
}, style: bubbleStyle, role: "tooltip" }, this.showX && (hAsync("button", { key: '
|
|
13182
|
+
}, style: bubbleStyle, role: "tooltip" }, this.showX && (hAsync("button", { key: '168741ebb1986f7235aee5be58695ae7cfacfe7b', class: "tooltip-close", onClick: this.handleClose, "aria-label": "Cerrar" }, hAsync("dropi-icon", { key: 'c9154dada59cced1056f24689591f0fead22328f', name: "Close-small", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-500" }))), this.title && !this.text && hAsync("strong", { key: 'cd432eb19d7616f50d27613b55c191d59f70732e', class: "tooltip-title" }, this.title), this.label && !this.text && hAsync("span", { key: 'c443cab1372947d0219a7384f491184fb1a7c5b3', class: "tooltip-label" }, this.label), this.text && hAsync("span", { key: 'ea5dafb67ec9533052a66cf045b288cbefdf9d69' }, this.text), hAsync("span", { key: '977257d29af4688c8a264685a1687c048faac9e5', class: `tooltip-arrow tooltip-arrow--${this.position}` })))));
|
|
13191
13183
|
}
|
|
13192
13184
|
static get style() { return dropiTooltipCss(); }
|
|
13193
13185
|
static get cmpMeta() { return {
|
|
@@ -13261,7 +13253,7 @@ class DropiVerticalSteps {
|
|
|
13261
13253
|
}
|
|
13262
13254
|
render() {
|
|
13263
13255
|
const steps = this.parsedSteps;
|
|
13264
|
-
return (hAsync("div", { key: '
|
|
13256
|
+
return (hAsync("div", { key: '9b0e19a21eaa78b51d82994747604623f9431d56', class: "vertical-steps" }, steps.map((step, i) => {
|
|
13265
13257
|
const state = this.resolveState(i, step);
|
|
13266
13258
|
const isLast = i === steps.length - 1;
|
|
13267
13259
|
const isClickable = this.clickable && state === 'completed';
|
|
@@ -13314,7 +13306,7 @@ class DropiYoutubeLazyVideo {
|
|
|
13314
13306
|
return `https://www.youtube.com/embed/${this.videoId}?autoplay=1&rel=0&modestbranding=1`;
|
|
13315
13307
|
}
|
|
13316
13308
|
render() {
|
|
13317
|
-
return (hAsync("div", { key: '
|
|
13309
|
+
return (hAsync("div", { key: '0732bc87e7be10e422e80751a17527132301eb99', class: `video-wrapper${this.isPlaying ? ' playing' : ''}` }, !this.isPlaying && (hAsync("div", { key: '540c46b66da3f67ec45614e0891827b7cc0be4e5', class: "thumbnail", onClick: () => { this.isPlaying = true; } }, hAsync("img", { key: '843241c72688ca88ccd5d9391b542501575ea476', src: this.thumbnail, alt: `Video thumbnail ${this.videoId}` }), hAsync("button", { key: 'b068f79fb6b2140e1419e9d72a24f6e66eaab69d', class: "play-button", "aria-label": "Reproducir video" }, hAsync("dropi-icon", { key: 'b3b6d8b99583fd0a3c2c0d766beeda2459b8b13a', name: "Play", iconWidth: "17px", iconHeight: "21px", color: "Neutral-White" })))), this.isPlaying && (hAsync("iframe", { key: '42172a0c7bb386da9123b411af4ab5ebeb9e205c', src: this.videoUrl, title: this.videoTitle, frameborder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, loading: "lazy" }))));
|
|
13318
13310
|
}
|
|
13319
13311
|
static get style() { return dropiYoutubeLazyVideoCss(); }
|
|
13320
13312
|
static get cmpMeta() { return {
|