@dropi/ui 0.1.45 → 0.1.48

package/dist/collection/components/dropi-languages-selector/dropi-languages-selector.js

@@ -70,7 +70,7 @@ export class DropiLanguagesSelector {
                     "references": {
                         "LanguageOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-languages-selector/dropi-languages-selector.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-languages-selector/dropi-languages-selector.tsx",
                             "id": "src/components/dropi-languages-selector/dropi-languages-selector.tsx::LanguageOption"
                         }
                     }
@@ -96,7 +96,7 @@ export class DropiLanguagesSelector {
                     "references": {
                         "LanguageOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-languages-selector/dropi-languages-selector.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-languages-selector/dropi-languages-selector.tsx",
                             "id": "src/components/dropi-languages-selector/dropi-languages-selector.tsx::LanguageOption"
                         }
                     }
@@ -139,7 +139,7 @@ export class DropiLanguagesSelector {
                     "references": {
                         "LanguageOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-languages-selector/dropi-languages-selector.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-languages-selector/dropi-languages-selector.tsx",
                             "id": "src/components/dropi-languages-selector/dropi-languages-selector.tsx::LanguageOption"
                         }
                     }

package/dist/collection/components/dropi-logo/dropi-logo.js

@@ -25,7 +25,7 @@ export class DropiLogo {
         e.target.src = FALLBACK_SVG;
     }
     render() {
-        return (h("figure", { key: '2a5ed49bd2ac8592db5b06256ff4e911e26ee6fd', class: { 'dropi-logo': true, [`dropi-logo--${this.size}`]: true } }, h("img", { key: 'f0f63e2e5ceb30c24eac3f7f5a3446858b632f90', src: this.urlLogo || FALLBACK_SVG, alt: "Dropi logo", onError: (e) => this.handleError(e) })));
+        return (h("figure", { key: '4d8da6d53c501a88bc3a6f358e5ee9d31a3dc401', class: { 'dropi-logo': true, [`dropi-logo--${this.size}`]: true } }, h("img", { key: 'eca9fac83cbffcdec34b7b9a89aaa36b36aa7001', src: this.urlLogo || FALLBACK_SVG, alt: "Dropi logo", onError: (e) => this.handleError(e) })));
     }
     static get is() { return "dropi-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-lottie-loader/dropi-lottie-loader.js

@@ -7,7 +7,7 @@ export class DropiLottieLoader {
     /** Show or hide the loader */
     visible = true;
     /** Path to the Lottie JSON animation file */
-    loadingAnimation = '/assets/lottie-files/loading.json';
+    loadingAnimation = '/node_modules/@dropi/ui/assets/lottie-files/loading.json';
     /** Title shown below the animation */
     title = 'Cargando...';
     /** Descriptive message below the title */
@@ -69,7 +69,7 @@ export class DropiLottieLoader {
                 "setter": false,
                 "reflect": false,
                 "attribute": "loading-animation",
-                "defaultValue": "'/assets/lottie-files/loading.json'"
+                "defaultValue": "'/node_modules/@dropi/ui/assets/lottie-files/loading.json'"
             },
             "title": {
                 "type": "string",

package/dist/collection/components/dropi-modal/dropi-modal.js

@@ -393,7 +393,7 @@ export class DropiModal {
                     "references": {
                         "ModalPosition": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-modal/dropi-modal.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-modal/dropi-modal.tsx",
                             "id": "src/components/dropi-modal/dropi-modal.tsx::ModalPosition"
                         }
                     }
@@ -419,7 +419,7 @@ export class DropiModal {
                     "references": {
                         "ModalSize": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-modal/dropi-modal.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-modal/dropi-modal.tsx",
                             "id": "src/components/dropi-modal/dropi-modal.tsx::ModalSize"
                         }
                     }

package/dist/collection/components/dropi-navbar/dropi-navbar.js

@@ -36,9 +36,9 @@ export class DropiNavbar {
     }
     render() {
         const items = this.parsedData;
-        return (h("nav", { key: '83ec218a7545739c65d8f1f61197b429b0e7d407', class: "navbar" }, h("div", { key: 'e40038630c33a280f3c231b3dd26643f1c853ea3', class: "navbar__left" }, this.showMenuToggle && (h("button", { key: '0ecbae684b9324c48cd01a6081fd1951b3ba7cf8', class: "navbar__menu-btn", onClick: () => this.dropiMenuToggle.emit(), "aria-label": "Men\u00FA" }, h("dropi-icon", { key: '9edea72a4508a984be2e6785f3f0fa6abe0625c4', name: "Menu", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-700" }))), this.logoUrl && (h("img", { key: 'b8cd9896736d505dad05b8df5f10928d40f250dd', class: "navbar__logo", src: this.logoUrl, alt: this.logoAlt })), this.title && h("span", { key: '4e5dae851fe28f1bc913d7a5d4d42a2413342635', class: "navbar__title" }, this.title)), items.length > 0 && (h("ul", { key: 'b951cc880b8aaf718b85403e3420d73ac976aa60', class: "navbar__items" }, items.map(item => (h("li", null, h("button", { class: { 'navbar__item': true, 'navbar__item--active': item.id === this.activeId }, onClick: () => this.clickLoadItem.emit(item), type: "button" }, item.icon && h("dropi-icon", { name: item.icon, iconWidth: "16px", iconHeight: "16px", color: item.id === this.activeId ? 'Primary-Primary-500' : 'Gray-Gray-600' }), h("span", null, item.name?.value || item.label), item.badge != null && String(item.badge) !== '0' && (h("span", { class: "navbar__badge" }, item.badge)))))))), h("div", { key: '8fe68f93af722982bac11890b106a35a292b3d98', class: "navbar__right" }, h("button", { key: 'a4d0ff928dca2502384cd21e0bc852cacc895a30', class: "navbar__icon-btn", onClick: () => this.dropiNotificationsClick.emit(), "aria-label": "Notificaciones" }, h("dropi-icon", { key: '41007746a151c27059d41db7c4672a2b551882d1', name: "Bell", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-600" }), this.notifications > 0 && (h("span", { key: 'a0e5c6c9f8e2aaf3e67cc22bdff2ae65472b7cb5', class: "navbar__notif-badge" }, this.notifications > 99 ? '99+' : this.notifications))), h("button", { key: 'e1996f9e1fa922cd03a4e9c5721f5be838a941d3', class: "navbar__user-btn", onClick: () => this.dropiUserClick.emit(), type: "button" }, this.userAvatar
+        return (h("nav", { key: '89379c4c29539aa933b59f34b379929950c1bad6', class: "navbar" }, h("div", { key: '4e78453b654c5b93c4c534955a8cc523138cdfd9', class: "navbar__left" }, this.showMenuToggle && (h("button", { key: '6aee8f1a706b73786c0def18f42394331313a4ef', class: "navbar__menu-btn", onClick: () => this.dropiMenuToggle.emit(), "aria-label": "Men\u00FA" }, h("dropi-icon", { key: 'f5b57eb49cf5e8c5feb1a6d5284096a54b294768', name: "Menu", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-700" }))), this.logoUrl && (h("img", { key: '92167bb904e69964fae2806ccb0c157bb16eb081', class: "navbar__logo", src: this.logoUrl, alt: this.logoAlt })), this.title && h("span", { key: 'fef8b99cd9a2c2d9d1ac0cba0361f0bdd69ecf09', class: "navbar__title" }, this.title)), items.length > 0 && (h("ul", { key: 'c8a1130c8f0a8ac5eabb00b1108af34eeba611fe', class: "navbar__items" }, items.map(item => (h("li", null, h("button", { class: { 'navbar__item': true, 'navbar__item--active': item.id === this.activeId }, onClick: () => this.clickLoadItem.emit(item), type: "button" }, item.icon && h("dropi-icon", { name: item.icon, iconWidth: "16px", iconHeight: "16px", color: item.id === this.activeId ? 'Primary-Primary-500' : 'Gray-Gray-600' }), h("span", null, item.name?.value || item.label), item.badge != null && String(item.badge) !== '0' && (h("span", { class: "navbar__badge" }, item.badge)))))))), h("div", { key: '390eb829076e112fb52da015903d5330666c533e', class: "navbar__right" }, h("button", { key: '0f8bdd5f78a310418c88b1a74cd7ac87a4308c1c', class: "navbar__icon-btn", onClick: () => this.dropiNotificationsClick.emit(), "aria-label": "Notificaciones" }, h("dropi-icon", { key: '6eb38a4cf19eb417bb8b18a96b5e6133c70ff35e', name: "Bell", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-600" }), this.notifications > 0 && (h("span", { key: 'a2fbfe367a46b50cbbd4e1b9a9b859d10c18c604', class: "navbar__notif-badge" }, this.notifications > 99 ? '99+' : this.notifications))), h("button", { key: 'dc9cbb054b2bd8088992d8feb33f0807e75b26e6', class: "navbar__user-btn", onClick: () => this.dropiUserClick.emit(), type: "button" }, this.userAvatar
             ? h("img", { class: "navbar__avatar", src: this.userAvatar, alt: this.userName })
-            : h("div", { class: "navbar__avatar-placeholder" }, this.userName ? this.userName[0].toUpperCase() : '?'), this.userName && h("span", { key: 'd539c8f456564aa8d3a29e9d2e2ed6250241f411', class: "navbar__user-name" }, this.userName), h("dropi-icon", { key: 'd32cba548201f28a051142e889f6de207a4e67d2', name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })))));
+            : h("div", { class: "navbar__avatar-placeholder" }, this.userName ? this.userName[0].toUpperCase() : '?'), this.userName && h("span", { key: 'e1a6193fc9bd18f542204a38d1c0775e86ee3cd2', class: "navbar__user-name" }, this.userName), h("dropi-icon", { key: 'b870d026d52b11041ae0db711c4c3fdb02578b60', name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })))));
     }
     static get is() { return "dropi-navbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-otp-send-code/dropi-otp-send-code.js

@@ -7,7 +7,7 @@ const RESEND_SECONDS = 30;
 export class DropiOtpSendCode {
     internals;
     /** Name for native form submission */
-    name = '';
+    name;
     /** Delivery method label */
     engine = 'email';
     /** Contact info (email/phone to show in label) */
@@ -100,14 +100,14 @@ export class DropiOtpSendCode {
     }
     render() {
         const engineLabel = this.engine === 'sms' ? 'SMS' : this.engine === '2fa' ? 'autenticador' : 'correo';
-        return (h("div", { key: 'ee2e6766c4b220a1a12b8734747138cf2351a0d8', class: "otp" }, this.showLabelContact && (h("p", { key: '87f34e3b13c0e16e584cc03ea8c5a35e462784b1', class: "otp__label" }, "Ingresa el c\u00F3digo enviado a tu ", engineLabel, this.labelContact && h("strong", { key: '6c9d0c73340ff8dab1730b5d6c9cc0431f3ff21c' }, " ", this.labelContact))), h("div", { key: 'd82904db02da1da5f863bb86cef65b0da166ff0c', class: "otp__inputs", onPaste: (e) => this.handlePaste(e) }, this.digits.map((_, i) => (h("input", { key: i, ref: (el) => {
+        return (h("div", { key: '4fdb8eb4d4932b6509798a50ee474c56fb001fa8', class: "otp" }, this.showLabelContact && (h("p", { key: '2f95e7f0138ce067e3da3c0822d8277e7fccc357', class: "otp__label" }, "Ingresa el c\u00F3digo enviado a tu ", engineLabel, this.labelContact && h("strong", { key: '23508736c6cfdf095f2b9192ff3d566e98e715c7' }, " ", this.labelContact))), h("div", { key: '8c01d71b208ae557f9ffba7b76d60c049bdde9ce', class: "otp__inputs", onPaste: (e) => this.handlePaste(e) }, this.digits.map((_, i) => (h("input", { key: i, ref: (el) => {
                 if (el)
                     this.inputs[i] = el;
             }, class: {
                 'otp__digit': true,
                 'otp__digit--filled': this.digitStates[i] === 'filled',
                 'otp__digit--error': this.error,
-            }, 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 && (h("p", { key: '7629619d5b2c4e8f38e2c2bc93ab134242b8e079', class: "otp__error" }, this.errorMessage)), h("div", { key: 'ea5472d4c55f1cdc30304e9e9bcaacf303ba4501', class: "otp__resend" }, this.canResend ? (h("button", { class: "otp__resend-btn", onClick: () => { this.startCountdown(); this.dropiResend.emit(); } }, "Reenviar c\u00F3digo")) : (h("span", { class: "otp__countdown" }, "Reenviar en ", this.countdown, "s")))));
+            }, 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 && (h("p", { key: '8215ecbdc651a3c79a8841c5620bd7e8c5c8228e', class: "otp__error" }, this.errorMessage)), h("div", { key: 'c1a81e44295abb3b373936a5c276aea4497cf2e9', class: "otp__resend" }, this.canResend ? (h("button", { class: "otp__resend-btn", onClick: () => { this.startCountdown(); this.dropiResend.emit(); } }, "Reenviar c\u00F3digo")) : (h("span", { class: "otp__countdown" }, "Reenviar en ", this.countdown, "s")))));
     }
     static get is() { return "dropi-otp-send-code"; }
     static get encapsulation() { return "shadow"; }
@@ -132,7 +132,7 @@ export class DropiOtpSendCode {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -141,8 +141,7 @@ export class DropiOtpSendCode {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
-                "attribute": "name",
-                "defaultValue": "''"
+                "attribute": "name"
             },
             "engine": {
                 "type": "string",

package/dist/collection/components/dropi-paginator/dropi-paginator.js

@@ -54,9 +54,9 @@ export class DropiPaginator {
         const pages = this.pageNumbers;
         const isFirst = this.currentPage <= 1;
         const isLast = this.currentPage >= this.totalPages;
-        return (h("div", { key: 'af6614df5a241ef536b6723d30bde12c8a6f474f', class: "paginator" }, h("div", { key: '8b5405baa717a36042fc03ca2e68370799c01ff7', class: "paginator-pages" }, !isFirst && !this.noLabels && (h("button", { key: 'c340304b29d658ef9eaa8105a91540660c829048', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(1), "aria-label": "Primera p\u00E1gina", disabled: this.disabled }, h("dropi-icon", { key: '3adfc1508cbcedbb91f99e467db2270c40a4ac83', name: "Arrow-double-small-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isFirst && (h("button", { key: '5936642c4b9e5b72546229996fbc72fe973e6f5f', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage - 1), "aria-label": "Anterior", disabled: this.disabled }, h("dropi-icon", { key: 'c9f7eb1c0c27a738ee31e859617964fc75e514cc', name: "Dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }), !this.noLabels && h("span", { key: '5d448a9a6536c90c56fafd700e7c5998a85d6fdf', class: "paginator-label" }, "Anterior"))), pages.map((p, i) => p === '...'
+        return (h("div", { key: '6b39ba2ff5168182a36c59e521e46e12a32ebe85', class: "paginator" }, h("div", { key: '9bc76ef25f10290b575ce047bb5f093e6698a670', class: "paginator-pages" }, !isFirst && !this.noLabels && (h("button", { key: '25def90ed595b4c56cd1481ecf1cc2ed2cc1aeb9', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(1), "aria-label": "Primera p\u00E1gina", disabled: this.disabled }, h("dropi-icon", { key: '505c131c240d7af5b5860802a69be6b8971b0ab3', name: "Arrow-double-small-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isFirst && (h("button", { key: '090d9b536a0b80d12ac1a48bf9519b34d4b6bc9a', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage - 1), "aria-label": "Anterior", disabled: this.disabled }, h("dropi-icon", { key: 'aec79c1b98329c1302478d8fe738586a8587dca0', name: "Dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }), !this.noLabels && h("span", { key: 'bc9416a0cfee88e4739c11a3ddbc0c4a244cc21d', class: "paginator-label" }, "Anterior"))), pages.map((p, i) => p === '...'
             ? h("span", { class: "paginator-ellipsis", key: `e${i}` }, "\u2026")
-            : h("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 && (h("button", { key: '1a43d8dde37cdbc40527eb1c66bc5001a64cf59f', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage + 1), "aria-label": "Siguiente", disabled: this.disabled }, !this.noLabels && h("span", { key: 'f76ccd791d02b25d78c509341b73e1c1bca0b986', class: "paginator-label" }, "Siguiente"), h("dropi-icon", { key: '822a3a7e4ac651e00c469b565e300a7efcc5614b', name: "Dropdown-Right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isLast && !this.noLabels && (h("button", { key: '2b4f7435f9083ab9c4d9ce81be5c259eda830e4a', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.totalPages), "aria-label": "\u00DAltima p\u00E1gina", disabled: this.disabled }, h("dropi-icon", { key: '63ab5568c44ed3cbda917842defe4dc4254bb3f1', name: "Arrow-double-small-right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))))));
+            : h("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 && (h("button", { key: 'fb1f077bd49fdceb052c3d1613d58078f2202ba9', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage + 1), "aria-label": "Siguiente", disabled: this.disabled }, !this.noLabels && h("span", { key: 'fe05545abd3c8d72a897c5a68e76347bbe39625b', class: "paginator-label" }, "Siguiente"), h("dropi-icon", { key: '17063d4d03213cbf38b1ff2c79187ec07ba0c8b3', name: "Dropdown-Right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isLast && !this.noLabels && (h("button", { key: 'b4d0df3505ad5a1c5c0899a7a13aa9f8b79db511', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.totalPages), "aria-label": "\u00DAltima p\u00E1gina", disabled: this.disabled }, h("dropi-icon", { key: 'd0db6c56e6a8dcbf441038b4391b004083a6f708', name: "Arrow-double-small-right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))))));
     }
     static get is() { return "dropi-paginator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-phone-input/dropi-phone-input.js

@@ -102,7 +102,7 @@ export class DropiPhoneInput {
     el;
     internals;
     /** Name for native form submission */
-    name = '';
+    name;
     /** Initial country dial code (e.g. "57") — matches Angular 'CodArea' setter */
     codArea = '57';
     /** Phone number value — matches Angular 'ngModelPhone' */
@@ -183,10 +183,10 @@ export class DropiPhoneInput {
     render() {
         const country = this.selectedCountry;
         const isInvalid = this.isValidPhone === false;
-        return (h("div", { key: '1634a703f734cd5db7b5d7acf83f403ea07962a3', class: "phone-wrap" }, h("div", { key: 'a9ed4a17b4a01893fc22d051241dcd494fa2e66d', class: "phone-input-container" }, h("div", { key: '6a50121fbb8939eac54035a314c340137aae63d5', class: "custom-select" }, h("button", { key: '0157b468dab13e23f83b9528ec235bc61be91733', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
+        return (h("div", { key: 'c15336990cd554166dcfec74bbf577074a7fe870', class: "phone-wrap" }, h("div", { key: '7136d327befe46db5b9fd79075526d4a327532ff', class: "phone-input-container" }, h("div", { key: '2348818f20cc26941dd06730d75c95497eb73468', class: "custom-select" }, h("button", { key: '37a0289468cc49b914d31a056d94c1caafc4431d', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
                 if (!this.disabledInput)
                     this.open = !this.open;
-            } }, h("span", { key: 'b174ec714c415964d09f4661f58a1a62e8c80653', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, h("img", { key: 'f4c62db877a54bd395b756926918b8ff16511a2a', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), h("dropi-icon", { key: '809f64bed4cccd911110c9e8e52752554b0d8a86', name: this.open ? 'Dropdown-up' : 'Dropdown-down', iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-500" })), h("ul", { key: 'b4dea28807780b086ba15161cee3e417efb2f2a1', class: { 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open } }, COUNTRIES.map(option => (h("li", null, h("button", { type: "button", class: "option", onMouseDown: (e) => { e.preventDefault(); this.selectCountry(option); } }, h("img", { src: `https://flagsapi.com/${option.flag}/flat/24.png`, alt: option.flag }), option.code)))))), h("input", { key: '4e1113fedf25b9c91d2aff815d6c862a7d47d072', 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) }))));
+            } }, h("span", { key: '59368b25a2afa0a3e7fbb930483239680a867651', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, h("img", { key: 'd472729d11380a54182927000703c224104f9213', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), h("dropi-icon", { key: '9c73aea42e3f30793505277032c892b3947a90be', name: this.open ? 'Dropdown-up' : 'Dropdown-down', iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-500" })), h("ul", { key: 'b3238ad80a85356fbd95a482c3ffa0cf3ecb810f', class: { 'select-dropdown': true, 'expanded-select': this.open, 'collapsed-select': !this.open } }, COUNTRIES.map(option => (h("li", null, h("button", { type: "button", class: "option", onMouseDown: (e) => { e.preventDefault(); this.selectCountry(option); } }, h("img", { src: `https://flagsapi.com/${option.flag}/flat/24.png`, alt: option.flag }), option.code)))))), h("input", { key: '3f0c3ef4f01b13f9f033b5205fe5ab019a923781', 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) }))));
     }
     static get is() { return "dropi-phone-input"; }
     static get encapsulation() { return "shadow"; }
@@ -211,7 +211,7 @@ export class DropiPhoneInput {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -220,8 +220,7 @@ export class DropiPhoneInput {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
-                "attribute": "name",
-                "defaultValue": "''"
+                "attribute": "name"
             },
             "codArea": {
                 "type": "string",

package/dist/collection/components/dropi-progress-bar/dropi-progress-bar.js

@@ -17,7 +17,7 @@ export class DropiProgressBar {
             width: `${Math.min(100, Math.max(0, this.value))}%`,
             backgroundColor: this.color || `var(--${this.getSeverityVariable()}, #50A5F1)`,
         };
-        return (h("div", { key: 'f68b88240ebc188f1f0378424b8d1617c2e7440e', class: "progress-container" }, this.showValue && (h("div", { key: 'f8116e4eb824031d4bd1ac9d694e2bd3bca1ed6d', class: "progress-header" }, h("span", { key: '892813f8e0a028ce286c00edd0489d489dd271c4', class: "progress-value" }, this.value, "%"))), h("div", { key: '2e740487a59df1ec7def96565a9ee64d53b773b8', class: "progress-track", style: { height: this.height, backgroundColor: this.trackColor } }, h("div", { key: '4f6fd1c436563cacac31e385d84c4a21945f6e10', class: "progress-fill", style: fillStyle }))));
+        return (h("div", { key: '7093e06299ccb8365d07fa1bc20838254b08957e', class: "progress-container" }, this.showValue && (h("div", { key: 'f32dcb2d2c4dcfcdba5661dc7b66c1f36d4bb66c', class: "progress-header" }, h("span", { key: '5d556cff4beb0af77c28fd934757512a3470b83d', class: "progress-value" }, this.value, "%"))), h("div", { key: '35666669d0206354d2d3e797bf553b767bfb63d5', class: "progress-track", style: { height: this.height, backgroundColor: this.trackColor } }, h("div", { key: '037d4d7cacc0834b8d79d1fee8c6e9ba3edfc3f5', class: "progress-fill", style: fillStyle }))));
     }
     getSeverityVariable() {
         switch (this.severity) {

package/dist/collection/components/dropi-radio-button/dropi-radio-button.js

@@ -8,9 +8,9 @@ export class DropiRadioButton {
     /** Label text displayed next to the radio */
     label = '';
     /** Input name (for grouping radio buttons) */
-    name = 'name';
+    name;
     /** Input id */
-    id = 'radioButton';
+    inputId;
     /** Whether this radio is selected */
     checked = false;
     /**
@@ -35,7 +35,7 @@ export class DropiRadioButton {
         this.dropiChange.emit(e);
     }
     render() {
-        return (h("div", { key: 'e4b54d9bda299b9150ebf9791925e0e7c3b9fb38', class: "dropi-radio-button" }, h("label", { key: '0a4c6443668477a2cb6b2d5a3d8bc1744a0fcffd', htmlFor: this.id }, h("input", { key: '6ba6b5af4bc061664dee0b6554c769613080dbb8', id: this.id, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
+        return (h("div", { key: 'e42d178a92a815c22b197aec5d962a19f60a4f6f', class: "dropi-radio-button" }, h("label", { key: '0beae39fb6860265332c1ed12d38bc97c78b22c1', htmlFor: this.inputId }, h("input", { key: '4ddb55ecb50c030ed7d4a8795246a9d57f95f0da', id: this.inputId, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
     }
     static get is() { return "dropi-radio-button"; }
     static get encapsulation() { return "shadow"; }
@@ -80,7 +80,7 @@ export class DropiRadioButton {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -89,10 +89,9 @@ export class DropiRadioButton {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
-                "attribute": "name",
-                "defaultValue": "'name'"
+                "attribute": "name"
             },
-            "id": {
+            "inputId": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -100,7 +99,7 @@ export class DropiRadioButton {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -109,8 +108,7 @@ export class DropiRadioButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "id",
-                "defaultValue": "'radioButton'"
+                "attribute": "input-id"
             },
             "checked": {
                 "type": "boolean",

package/dist/collection/components/dropi-radio-selection-list/dropi-radio-selection-list.js

@@ -66,7 +66,7 @@ export class DropiRadioSelectionList {
                     "references": {
                         "RadioOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx",
                             "id": "src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx::RadioOption"
                         }
                     }
@@ -243,7 +243,7 @@ export class DropiRadioSelectionList {
                     "references": {
                         "RadioOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx",
                             "id": "src/components/dropi-radio-selection-list/dropi-radio-selection-list.tsx::RadioOption"
                         }
                     }

package/dist/collection/components/dropi-read-more/dropi-read-more.js

@@ -28,7 +28,7 @@ export class DropiReadMore {
     }
     render() {
         const showToggle = this.needsTruncation && (this.expanded ? this.showSeeLess : true);
-        return (h("div", { key: '6accf9aa0a6f7377c7de6e8cbcb9e2a7ee99573a', class: "read-more" }, h("p", { key: '96e5493df8b065008f9bc45cea1ba768eabfc0a2', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (h("button", { key: '195d962715c5c618701c3e86df618289915e3a9b', class: "read-more__toggle", style: this.buttonStyle ? this.buttonStyle : undefined, onClick: () => this.expanded = !this.expanded }, this.expanded ? ' Ver menos' : '... Ver más')))));
+        return (h("div", { key: '27f1da08ef634213771942cf956edb42f543cbbd', class: "read-more" }, h("p", { key: '0f8090c4776296e1d7c9073fe5445b5f1d195464', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (h("button", { key: 'b2cc2616cd93dbc4b6025854ab9e4250d699f8fe', class: "read-more__toggle", style: this.buttonStyle ? this.buttonStyle : undefined, onClick: () => this.expanded = !this.expanded }, this.expanded ? ' Ver menos' : '... Ver más')))));
     }
     static get is() { return "dropi-read-more"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropi-search/dropi-search.js

@@ -102,7 +102,7 @@ export class DropiSearch {
         return (h("div", { key: '594b15b4b31044f4a02376dc773ea36da893d773', class: "search-wrap" }, this.label && h("label", { key: '297a989441ad892715b09421f9a53618851c1b52', class: "search-label" }, this.label), h("div", { key: '6bbaf4ea5c1bc6ff831626117fccde647e68ba19', class: `search-input-row search-input-row--${this.type}` }, this.showIcon && h("dropi-icon", { key: 'e94c3a3895a14e950a018023d5d7a281a230abae', class: "search-icon", name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), h("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: () => {
                 if (this.parsedOptions.length)
                     this.open = true;
-            }, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (h("button", { key: 'e2fd7c3d5fee45a83f030589f58d4fee9f3af69c', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, h("dropi-icon", { key: 'a530b0adb83d76b205cd2b22792f14229950836e', name: "Close-small", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), showDropdown && (h("div", { key: '8c062d43dccb41c84b2a599ed6d1a5e049a75b65', class: `search-dropdown search-dropdown--${this.position}`, style: { '--dropdown-height': `${this.heightOverlay}px` } }, this.filtered.length === 0 ? (h("div", { class: "search-no-results" }, "Sin resultados")) : (this.filtered.map((opt, i) => (h("div", { class: { 'search-option': true, 'search-option--selected': this.isSelected(opt) }, key: i, onMouseDown: (e) => { e.preventDefault(); this.selectOption(opt); } }, this.multipleSelectModel && h("dropi-checkbox", { checked: this.isSelected(opt) }), h("span", { class: "search-option__label" }, opt[this.dataName])))))))));
+            }, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (h("button", { key: 'e2fd7c3d5fee45a83f030589f58d4fee9f3af69c', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, h("dropi-icon", { key: 'a530b0adb83d76b205cd2b22792f14229950836e', name: "Close-small", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), showDropdown && (h("div", { key: '8c062d43dccb41c84b2a599ed6d1a5e049a75b65', class: `search-dropdown search-dropdown--${this.position}`, style: { '--dropdown-height': `${this.heightOverlay}px` } }, this.filtered.length === 0 ? (h("div", { class: "search-no-results" }, "Sin resultados")) : (this.filtered.map((opt, i) => (h("div", { class: { 'search-option': true, 'search-option--selected': this.isSelected(opt) }, key: i, onMouseDown: (e) => { e.preventDefault(); this.selectOption(opt); } }, this.multipleSelectModel && h("dropi-checkbox", { name: "_search-option", checked: this.isSelected(opt) }), h("span", { class: "search-option__label" }, opt[this.dataName])))))))));
     }
     static get is() { return "dropi-search"; }
     static get encapsulation() { return "shadow"; }
@@ -266,7 +266,7 @@ export class DropiSearch {
                     "references": {
                         "SearchOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-search/dropi-search.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-search/dropi-search.tsx",
                             "id": "src/components/dropi-search/dropi-search.tsx::SearchOption"
                         }
                     }
@@ -392,7 +392,7 @@ export class DropiSearch {
                     "references": {
                         "SearchOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-search/dropi-search.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-search/dropi-search.tsx",
                             "id": "src/components/dropi-search/dropi-search.tsx::SearchOption"
                         }
                     }
@@ -510,7 +510,7 @@ export class DropiSearch {
                     "references": {
                         "SearchOption": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-search/dropi-search.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-search/dropi-search.tsx",
                             "id": "src/components/dropi-search/dropi-search.tsx::SearchOption"
                         }
                     }

package/dist/collection/components/dropi-select/dropi-select.js

@@ -31,7 +31,7 @@ export class DropiSelect {
     placeholder = 'Select';
     /** Array of SelectOption or SelectOptionGroup */
     options = [];
-    name = '';
+    name;
     disabled = false;
     hasError = false;
     errorText = '';
@@ -387,7 +387,7 @@ export class DropiSelect {
         ]), !this.isGrouped && this.filteredOptions.map(opt => this.renderOption(opt)), this.filteredOptions.length === 0 && (h("li", { class: "no-results" }, "Sin resultados"))));
     }
     render() {
-        return (h("div", { key: 'f09113a288d45bb5519503bb78c41e236913c1eb', class: "custom-select" }, !this.dropdownType && this.label && (h("label", { key: 'c0b59763dc3529d7f9bb5597a2bea0d38070a07b', class: { 'disabled-label': this.disabled } }, this.label, this.showObligatory && !this.disabled && h("span", { key: '6c8a47bdfc216231ba72420298b3bc8deeeae435', class: "asterisk" }, " *"))), h("div", { key: '8ec45010af1252effe34bb69d3f40ea277459511', class: "dropdown-container" }, this.dropdownType && this.label && (h("div", { key: 'b3f7f9adacd57b091baac662fc7be6fcd847c3a4', class: "left-label" }, this.label)), this.renderTrigger()), this.textHelper && !this.hasError && (h("div", { key: 'a4cce833b50b2bc62cb7142da420f81c0647e97e', class: "select-helper" }, h("span", { key: 'f69375abc2f66b5b1278895b8f313adabfa0f938' }, this.textHelper))), this.hasError && this.errorText && (h("div", { key: '6681bdbb705633d393adab09a889f3f1fb6fbe8a', class: "select-helper-error" }, h("dropi-icon", { key: '09521eeef2cf2a58cb74bea5bfae8a6d58d17682', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), h("span", { key: '807820bb0a474079627bf12c20f4a034896785cd' }, this.errorText))), this.renderDropdown()));
+        return (h("div", { key: 'cd22a44efb11820180aec0cc36aa0e7949712e78', class: "custom-select" }, !this.dropdownType && this.label && (h("label", { key: 'f2b2c09818cf292828d6d6ce6d3e5c9e86508495', class: { 'disabled-label': this.disabled } }, this.label, this.showObligatory && !this.disabled && h("span", { key: 'e84b30735dff4ccb40f8931835bf51e3bab6ff11', class: "asterisk" }, " *"))), h("div", { key: '048a25a502b2f7550d298d22439c46589ada08fe', class: "dropdown-container" }, this.dropdownType && this.label && (h("div", { key: '849b92a26294622e602fe2ff6bf2db89e22be4f4', class: "left-label" }, this.label)), this.renderTrigger()), this.textHelper && !this.hasError && (h("div", { key: '8b9ac9ea4b494fb830237362f5b9db6b606df765', class: "select-helper" }, h("span", { key: '74fa19eee858b116f81d41ae1a3deb00beaf103e' }, this.textHelper))), this.hasError && this.errorText && (h("div", { key: '34a015639d80fb8df598f67129f84c34b737ecf4', class: "select-helper-error" }, h("dropi-icon", { key: 'ebcbcadc5c72d35f0a35bc975dda0995b2a493a1', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), h("span", { key: 'f473e766279e0c784251251d6c59fbd92107a7e8' }, this.errorText))), this.renderDropdown()));
     }
     static get is() { return "dropi-select"; }
     static get encapsulation() { return "shadow"; }
@@ -483,7 +483,7 @@ export class DropiSelect {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -492,8 +492,7 @@ export class DropiSelect {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
-                "attribute": "name",
-                "defaultValue": "''"
+                "attribute": "name"
             },
             "disabled": {
                 "type": "boolean",

package/dist/collection/components/dropi-sidebar/dropi-sidebar.js

@@ -86,7 +86,7 @@ export class DropiSidebar {
                     "references": {
                         "SidebarProperties": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-sidebar/dropi-sidebar.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-sidebar/dropi-sidebar.tsx",
                             "id": "src/components/dropi-sidebar/dropi-sidebar.tsx::SidebarProperties"
                         }
                     }
@@ -127,7 +127,7 @@ export class DropiSidebar {
                     "references": {
                         "SidebarProperties": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-sidebar/dropi-sidebar.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-sidebar/dropi-sidebar.tsx",
                             "id": "src/components/dropi-sidebar/dropi-sidebar.tsx::SidebarProperties"
                         }
                     }

package/dist/collection/components/dropi-simple-stepper/dropi-simple-stepper.js

@@ -86,7 +86,7 @@ export class DropiSimpleStepper {
                     "references": {
                         "StepperType": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-simple-stepper/dropi-simple-stepper.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-simple-stepper/dropi-simple-stepper.tsx",
                             "id": "src/components/dropi-simple-stepper/dropi-simple-stepper.tsx::StepperType"
                         }
                     }
@@ -152,7 +152,7 @@ export class DropiSimpleStepper {
                     "references": {
                         "FlowMode": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-simple-stepper/dropi-simple-stepper.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-simple-stepper/dropi-simple-stepper.tsx",
                             "id": "src/components/dropi-simple-stepper/dropi-simple-stepper.tsx::FlowMode"
                         }
                     }

package/dist/collection/components/dropi-skeleton/dropi-skeleton.js

@@ -70,7 +70,7 @@ export class DropiSkeleton {
                     "references": {
                         "SkeletonVariant": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-skeleton/dropi-skeleton.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-skeleton/dropi-skeleton.tsx",
                             "id": "src/components/dropi-skeleton/dropi-skeleton.tsx::SkeletonVariant"
                         }
                     }

package/dist/collection/components/dropi-steps/dropi-steps.js

@@ -125,7 +125,7 @@ export class DropiSteps {
                     "references": {
                         "StepLabel": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-steps/dropi-steps.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-steps/dropi-steps.tsx",
                             "id": "src/components/dropi-steps/dropi-steps.tsx::StepLabel"
                         }
                     }
@@ -151,7 +151,7 @@ export class DropiSteps {
                     "references": {
                         "StepState": {
                             "location": "local",
-                            "path": "/Users/mac-ti/Documents/dropi/dropi-ui/src/components/dropi-steps/dropi-steps.tsx",
+                            "path": "/Users/20kdropi/Documents/Dropi/ui-dropi/src/components/dropi-steps/dropi-steps.tsx",
                             "id": "src/components/dropi-steps/dropi-steps.tsx::StepState"
                         }
                     }

package/dist/collection/components/dropi-switch/dropi-switch.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
 export class DropiSwitch {
     internals;
     /** Name for native form submission */
-    name = '';
+    name;
     /** Whether the switch is on */
     isChecked = false;
     /** Whether the switch is disabled */
@@ -25,7 +25,7 @@ export class DropiSwitch {
         this.dropiChange.emit(this.isChecked);
     }
     render() {
-        return (h("label", { key: 'b3321fd96a1487210a920f5494708dc2eb05f10c', class: "toggle-switch" }, h("input", { key: 'ee7cfecf443a1c839ce145ade18cc3ff15924816', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: (e) => this.onToggleChange(e) }), h("span", { key: 'c0800bd9a7f52cf666b3e475265da223b852be9a', class: "slider" })));
+        return (h("label", { key: 'bfe479e64d61f2ffcd76db084c4504842bbb6421', class: "toggle-switch" }, h("input", { key: 'add18063655620fd12d43e0c02b48775b81e9ffa', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: (e) => this.onToggleChange(e) }), h("span", { key: '8b6c30839589d9354cf309905e9d0863e8354578', class: "slider" })));
     }
     static get is() { return "dropi-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -50,7 +50,7 @@ export class DropiSwitch {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -59,8 +59,7 @@ export class DropiSwitch {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
-                "attribute": "name",
-                "defaultValue": "''"
+                "attribute": "name"
             },
             "isChecked": {
                 "type": "boolean",