@dropi/ui 0.1.52 → 0.1.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/dropi-accordion-item.cjs.entry.js +2 -2
- package/dist/cjs/dropi-accordion.cjs.entry.js +2 -2
- package/dist/cjs/dropi-alert-legacy.cjs.entry.js +2 -2
- package/dist/cjs/dropi-alert-modal.cjs.entry.js +4 -14
- package/dist/cjs/dropi-alert.cjs.entry.js +2 -2
- package/dist/cjs/dropi-avatars.cjs.entry.js +2 -2
- package/dist/cjs/dropi-badge-legacy.cjs.entry.js +2 -2
- package/dist/cjs/dropi-badge.cjs.entry.js +2 -2
- package/dist/cjs/dropi-banner-external.cjs.entry.js +2 -2
- package/dist/cjs/dropi-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/dropi-button.cjs.entry.js +2 -2
- package/dist/cjs/dropi-card-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/dropi-card-product.cjs.entry.js +2 -2
- package/dist/cjs/dropi-card-section.cjs.entry.js +2 -2
- package/dist/cjs/dropi-carousel.cjs.entry.js +2 -2
- package/dist/cjs/dropi-checkbox-selection-list.cjs.entry.js +2 -2
- package/dist/cjs/dropi-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/dropi-chips.cjs.entry.js +2 -2
- package/dist/cjs/dropi-city-selector.cjs.entry.js +2 -2
- package/dist/cjs/dropi-color-picker.cjs.entry.js +2 -2
- package/dist/cjs/dropi-country-flags.cjs.entry.js +2 -2
- package/dist/cjs/dropi-country-selector.cjs.entry.js +2 -2
- package/dist/cjs/dropi-date-picker-range.cjs.entry.js +2 -2
- package/dist/cjs/dropi-date-picker.cjs.entry.js +2 -2
- package/dist/cjs/dropi-drawer.cjs.entry.js +2 -2
- package/dist/cjs/dropi-dropdown.cjs.entry.js +2 -2
- package/dist/cjs/dropi-empty-state.cjs.entry.js +2 -2
- package/dist/cjs/dropi-favorite-button.cjs.entry.js +2 -2
- package/dist/cjs/dropi-file-upload-progress-bar.cjs.entry.js +2 -2
- package/dist/cjs/dropi-file-upload.cjs.entry.js +2 -2
- package/dist/cjs/dropi-icon.cjs.entry.js +2 -2
- package/dist/cjs/dropi-ilustration-icon.cjs.entry.js +2 -2
- package/dist/cjs/dropi-image-miniature.cjs.entry.js +2 -2
- package/dist/cjs/dropi-image-overlay.cjs.entry.js +2 -2
- package/dist/cjs/dropi-input_3.cjs.entry.js +4 -4
- package/dist/cjs/dropi-languages-selector.cjs.entry.js +2 -2
- package/dist/cjs/dropi-logo.cjs.entry.js +2 -2
- package/dist/cjs/dropi-lottie-loader.cjs.entry.js +2 -2
- package/dist/cjs/dropi-media-player.cjs.entry.js +2 -2
- package/dist/cjs/dropi-modal.cjs.entry.js +2 -2
- package/dist/cjs/dropi-navbar.cjs.entry.js +2 -2
- package/dist/cjs/dropi-otp-send-code.cjs.entry.js +2 -2
- package/dist/cjs/dropi-phone-input.cjs.entry.js +2 -2
- package/dist/cjs/dropi-progress-bar.cjs.entry.js +2 -2
- package/dist/cjs/dropi-radio-button.cjs.entry.js +2 -2
- package/dist/cjs/dropi-radio-selection-list.cjs.entry.js +2 -2
- package/dist/cjs/dropi-read-more.cjs.entry.js +2 -2
- package/dist/cjs/dropi-search.cjs.entry.js +2 -2
- package/dist/cjs/dropi-select.cjs.entry.js +2 -2
- package/dist/cjs/dropi-sidebar.cjs.entry.js +2 -2
- package/dist/cjs/dropi-simple-stepper.cjs.entry.js +2 -2
- package/dist/cjs/dropi-skeleton.cjs.entry.js +2 -2
- package/dist/cjs/dropi-steps.cjs.entry.js +13 -3
- package/dist/cjs/dropi-switch.cjs.entry.js +2 -2
- package/dist/cjs/dropi-table.cjs.entry.js +2 -2
- package/dist/cjs/dropi-tabs.cjs.entry.js +2 -2
- package/dist/cjs/dropi-tag-type-product.cjs.entry.js +2 -2
- package/dist/cjs/dropi-text-area.cjs.entry.js +2 -2
- package/dist/cjs/dropi-time-line.cjs.entry.js +2 -2
- package/dist/cjs/dropi-toast.cjs.entry.js +9 -11
- package/dist/cjs/dropi-tooltip-v2.cjs.entry.js +2 -2
- package/dist/cjs/dropi-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/dropi-ui.cjs.js +2 -2
- package/dist/cjs/dropi-vertical-steps.cjs.entry.js +2 -2
- package/dist/cjs/dropi-youtube-lazy-video.cjs.entry.js +2 -2
- package/dist/cjs/index-eMp8lMK1.js +2809 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/lottie-map.generated-BVDAlLPd.js +14 -0
- package/dist/collection/components/dropi-accordion/dropi-accordion-item.css +22 -7
- package/dist/collection/components/dropi-accordion/dropi-accordion.css +2 -1
- package/dist/collection/components/dropi-alert/dropi-alert.css +2 -1
- package/dist/collection/components/dropi-alert-legacy/dropi-alert-legacy.css +1 -0
- package/dist/collection/components/dropi-alert-modal/dropi-alert-modal.css +1 -0
- package/dist/collection/components/dropi-avatars/dropi-avatars.css +1 -0
- package/dist/collection/components/dropi-badge/dropi-badge.css +1 -0
- package/dist/collection/components/dropi-badge-legacy/dropi-badge-legacy.css +1 -0
- package/dist/collection/components/dropi-banner-external/dropi-banner-external.css +1 -0
- package/dist/collection/components/dropi-breadcrumb/dropi-breadcrumb.css +1 -0
- package/dist/collection/components/dropi-button/dropi-button.css +2 -0
- package/dist/collection/components/dropi-card-checkbox/dropi-card-checkbox.css +1 -0
- package/dist/collection/components/dropi-card-product/dropi-card-product.css +9 -8
- package/dist/collection/components/dropi-card-section/dropi-card-section.css +2 -1
- package/dist/collection/components/dropi-carousel/dropi-carousel.css +1 -0
- package/dist/collection/components/dropi-checkbox/dropi-checkbox.css +1 -0
- package/dist/collection/components/dropi-checkbox-selection-list/dropi-checkbox-selection-list.css +2 -1
- package/dist/collection/components/dropi-chips/dropi-chips.css +2 -1
- package/dist/collection/components/dropi-city-selector/dropi-city-selector.css +4 -3
- package/dist/collection/components/dropi-color-picker/dropi-color-picker.css +1 -0
- package/dist/collection/components/dropi-country-flags/dropi-country-flags.css +1 -0
- package/dist/collection/components/dropi-country-selector/dropi-country-selector.css +5 -4
- package/dist/collection/components/dropi-date-picker/dropi-date-picker.css +7 -6
- package/dist/collection/components/dropi-date-picker-range/dropi-date-picker-range.css +7 -6
- package/dist/collection/components/dropi-drawer/dropi-drawer.css +2 -1
- package/dist/collection/components/dropi-dropdown/dropi-dropdown.css +1 -0
- package/dist/collection/components/dropi-empty-state/dropi-empty-state.css +1 -0
- package/dist/collection/components/dropi-favorite-button/dropi-favorite-button.css +1 -0
- package/dist/collection/components/dropi-file-upload/dropi-file-upload.css +1 -0
- package/dist/collection/components/dropi-file-upload-progress-bar/dropi-file-upload-progress-bar.css +1 -0
- package/dist/collection/components/dropi-icon/dropi-icon.css +1 -0
- package/dist/collection/components/dropi-ilustration-icon/dropi-ilustration-icon.css +1 -0
- package/dist/collection/components/dropi-image-miniature/dropi-image-miniature.css +2 -1
- package/dist/collection/components/dropi-image-overlay/dropi-image-overlay.css +2 -1
- package/dist/collection/components/dropi-input/dropi-input.css +2 -1
- package/dist/collection/components/dropi-languages-selector/dropi-languages-selector.css +2 -1
- package/dist/collection/components/dropi-logo/dropi-logo.css +1 -0
- package/dist/collection/components/dropi-lottie-loader/dropi-lottie-loader.css +1 -0
- package/dist/collection/components/dropi-media-player/dropi-media-player.css +4 -3
- package/dist/collection/components/dropi-modal/dropi-modal.css +2 -1
- package/dist/collection/components/dropi-navbar/dropi-navbar.css +3 -2
- package/dist/collection/components/dropi-otp-send-code/dropi-otp-send-code.css +2 -1
- package/dist/collection/components/dropi-paginator/dropi-paginator.css +3 -2
- package/dist/collection/components/dropi-phone-input/dropi-phone-input.css +5 -4
- package/dist/collection/components/dropi-progress-bar/dropi-progress-bar.css +1 -0
- package/dist/collection/components/dropi-radio-button/dropi-radio-button.css +1 -0
- package/dist/collection/components/dropi-radio-selection-list/dropi-radio-selection-list.css +2 -1
- package/dist/collection/components/dropi-read-more/dropi-read-more.css +3 -2
- package/dist/collection/components/dropi-search/dropi-search.css +2 -1
- package/dist/collection/components/dropi-select/dropi-select.css +4 -3
- package/dist/collection/components/dropi-sidebar/dropi-sidebar.css +1 -0
- package/dist/collection/components/dropi-simple-stepper/dropi-simple-stepper.css +1 -0
- package/dist/collection/components/dropi-skeleton/dropi-skeleton.css +1 -0
- package/dist/collection/components/dropi-steps/dropi-steps.css +52 -35
- package/dist/collection/components/dropi-steps/dropi-steps.js +11 -1
- package/dist/collection/components/dropi-switch/dropi-switch.css +1 -0
- package/dist/collection/components/dropi-table/dropi-table.css +2 -1
- package/dist/collection/components/dropi-tabs/dropi-tabs.css +2 -1
- package/dist/collection/components/dropi-tag/dropi-tag.css +1 -0
- package/dist/collection/components/dropi-tag-type-product/dropi-tag-type-product.css +1 -0
- package/dist/collection/components/dropi-text-area/dropi-text-area.css +2 -1
- package/dist/collection/components/dropi-time-line/dropi-time-line.css +1 -0
- package/dist/collection/components/dropi-toast/dropi-toast.css +40 -49
- package/dist/collection/components/dropi-toast/dropi-toast.js +7 -10
- package/dist/collection/components/dropi-tooltip/dropi-tooltip.css +1 -0
- package/dist/collection/components/dropi-tooltip-v2/dropi-tooltip.css +1 -0
- package/dist/collection/components/dropi-vertical-steps/dropi-vertical-steps.css +1 -0
- package/dist/collection/components/dropi-youtube-lazy-video/dropi-youtube-lazy-video.css +1 -0
- package/dist/components/dropi-accordion-item.js +1 -1
- package/dist/components/dropi-accordion.js +1 -1
- package/dist/components/dropi-alert-legacy.js +1 -1
- package/dist/components/dropi-alert-modal.js +1 -1
- package/dist/components/dropi-alert.js +1 -1
- package/dist/components/dropi-avatars.js +1 -1
- package/dist/components/dropi-badge-legacy.js +1 -1
- package/dist/components/dropi-badge.js +1 -1
- package/dist/components/dropi-banner-external.js +1 -1
- package/dist/components/dropi-breadcrumb.js +1 -1
- package/dist/components/dropi-button.js +1 -1
- package/dist/components/dropi-card-checkbox.js +1 -1
- package/dist/components/dropi-card-product.js +1 -1
- package/dist/components/dropi-card-section.js +1 -1
- package/dist/components/dropi-carousel.js +1 -1
- package/dist/components/dropi-checkbox-selection-list.js +1 -1
- package/dist/components/dropi-checkbox.js +1 -1
- package/dist/components/dropi-chips.js +1 -1
- package/dist/components/dropi-city-selector.js +1 -1
- package/dist/components/dropi-color-picker.js +1 -1
- package/dist/components/dropi-country-flags.js +1 -1
- package/dist/components/dropi-country-selector.js +1 -1
- package/dist/components/dropi-date-picker-range.js +1 -1
- package/dist/components/dropi-date-picker.js +1 -1
- package/dist/components/dropi-drawer.js +1 -1
- package/dist/components/dropi-dropdown.js +1 -1
- package/dist/components/dropi-empty-state.js +1 -1
- package/dist/components/dropi-favorite-button.js +1 -1
- package/dist/components/dropi-file-upload-progress-bar.js +1 -1
- package/dist/components/dropi-file-upload.js +1 -1
- package/dist/components/dropi-icon.js +1 -1
- package/dist/components/dropi-ilustration-icon.js +1 -1
- package/dist/components/dropi-image-miniature.js +1 -1
- package/dist/components/dropi-image-overlay.js +1 -1
- package/dist/components/dropi-input.js +1 -1
- package/dist/components/dropi-languages-selector.js +1 -1
- package/dist/components/dropi-logo.js +1 -1
- package/dist/components/dropi-lottie-loader.js +1 -1
- package/dist/components/dropi-media-player.js +1 -1
- package/dist/components/dropi-modal.js +1 -1
- package/dist/components/dropi-navbar.js +1 -1
- package/dist/components/dropi-otp-send-code.js +1 -1
- package/dist/components/dropi-paginator.js +1 -1
- package/dist/components/dropi-phone-input.js +1 -1
- package/dist/components/dropi-progress-bar.js +1 -1
- package/dist/components/dropi-radio-button.js +1 -1
- package/dist/components/dropi-radio-selection-list.js +1 -1
- package/dist/components/dropi-read-more.js +1 -1
- package/dist/components/dropi-search.js +1 -1
- package/dist/components/dropi-select.js +1 -1
- package/dist/components/dropi-sidebar.js +1 -1
- package/dist/components/dropi-simple-stepper.js +1 -1
- package/dist/components/dropi-skeleton.js +1 -1
- package/dist/components/dropi-steps.js +1 -1
- package/dist/components/dropi-switch.js +1 -1
- package/dist/components/dropi-table.js +1 -1
- package/dist/components/dropi-tabs.js +1 -1
- package/dist/components/dropi-tag-type-product.js +1 -1
- package/dist/components/dropi-tag.js +1 -1
- package/dist/components/dropi-text-area.js +1 -1
- package/dist/components/dropi-time-line.js +1 -1
- package/dist/components/dropi-toast.js +1 -1
- package/dist/components/dropi-tooltip-v2.js +1 -1
- package/dist/components/dropi-tooltip.js +1 -1
- package/dist/components/dropi-vertical-steps.js +1 -1
- package/dist/components/dropi-youtube-lazy-video.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/p-3AT7ASH9.js +1 -0
- package/dist/components/p-B-1G8T4u.js +1 -0
- package/dist/components/p-BEs9gbju.js +1 -0
- package/dist/components/p-BGS_Fnts.js +1 -0
- package/dist/components/p-BKTe33ng.js +1 -0
- package/dist/components/p-BhQK2SnE.js +1 -0
- package/dist/components/p-BjWB6xTy.js +1 -0
- package/dist/components/p-BtbO4Qj2.js +1 -0
- package/dist/components/p-ByEQybUd.js +1 -0
- package/dist/components/p-BzFB0tnJ.js +1 -0
- package/dist/components/p-Bzgg_L80.js +1 -0
- package/dist/components/p-CY_Pmg81.js +1 -0
- package/dist/components/p-Ccl4kD95.js +1 -0
- package/dist/components/p-ChU-v5Jl.js +1 -0
- package/dist/components/p-CmLj_aqH.js +1 -0
- package/dist/components/p-Cq3-SLWU.js +1 -0
- package/dist/components/p-CrSepiFP.js +1 -0
- package/dist/components/p-D-KVcD87.js +1 -0
- package/dist/components/p-DgOazwmC.js +1 -0
- package/dist/components/p-EW_Hn93v.js +1 -0
- package/dist/components/p-StcKvTC_.js +1 -0
- package/dist/components/p-WAEYEj9V.js +1 -0
- package/dist/components/p-_ScZTnhj.js +1 -0
- package/dist/components/p-egLr0oVg.js +1 -0
- package/dist/components/p-fPJmM1qh.js +1 -0
- package/dist/components/p-u5UtrV7_.js +1 -0
- package/dist/docs.json +2 -2
- package/dist/dropi-ui/dropi-accordion-item.entry.js +3 -3
- package/dist/dropi-ui/dropi-accordion-item.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-accordion.entry.js +3 -3
- package/dist/dropi-ui/dropi-accordion.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-alert-legacy.entry.js +2 -2
- package/dist/dropi-ui/dropi-alert-legacy.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-alert-modal.entry.js +4 -14
- package/dist/dropi-ui/dropi-alert-modal.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-alert.entry.js +2 -2
- package/dist/dropi-ui/dropi-alert.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-avatars.entry.js +3 -3
- package/dist/dropi-ui/dropi-avatars.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-badge-legacy.entry.js +3 -3
- package/dist/dropi-ui/dropi-badge-legacy.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-badge.entry.js +3 -3
- package/dist/dropi-ui/dropi-badge.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-banner-external.entry.js +2 -2
- package/dist/dropi-ui/dropi-banner-external.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-breadcrumb.entry.js +3 -3
- package/dist/dropi-ui/dropi-breadcrumb.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-button.entry.js +4 -4
- package/dist/dropi-ui/dropi-button.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-card-checkbox.entry.js +4 -4
- package/dist/dropi-ui/dropi-card-checkbox.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-card-product.entry.js +6 -6
- package/dist/dropi-ui/dropi-card-product.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-card-section.entry.js +4 -4
- package/dist/dropi-ui/dropi-card-section.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-carousel.entry.js +2 -2
- package/dist/dropi-ui/dropi-carousel.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-checkbox-selection-list.entry.js +4 -4
- package/dist/dropi-ui/dropi-checkbox-selection-list.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-checkbox.entry.js +4 -4
- package/dist/dropi-ui/dropi-checkbox.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-chips.entry.js +3 -3
- package/dist/dropi-ui/dropi-chips.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-city-selector.entry.js +3 -3
- package/dist/dropi-ui/dropi-city-selector.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-color-picker.entry.js +4 -4
- package/dist/dropi-ui/dropi-color-picker.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-country-flags.entry.js +3 -3
- package/dist/dropi-ui/dropi-country-flags.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-country-selector.entry.js +4 -4
- package/dist/dropi-ui/dropi-country-selector.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-date-picker-range.entry.js +2 -2
- package/dist/dropi-ui/dropi-date-picker-range.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-date-picker.entry.js +43 -5
- package/dist/dropi-ui/dropi-date-picker.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-drawer.entry.js +4 -4
- package/dist/dropi-ui/dropi-drawer.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-dropdown.entry.js +3 -3
- package/dist/dropi-ui/dropi-dropdown.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-empty-state.entry.js +3 -3
- package/dist/dropi-ui/dropi-empty-state.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-favorite-button.entry.js +3 -3
- package/dist/dropi-ui/dropi-favorite-button.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-file-upload-progress-bar.entry.js +3 -3
- package/dist/dropi-ui/dropi-file-upload-progress-bar.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-file-upload.entry.js +3 -3
- package/dist/dropi-ui/dropi-file-upload.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-icon.entry.js +2 -2
- package/dist/dropi-ui/dropi-icon.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-ilustration-icon.entry.js +8 -10
- package/dist/dropi-ui/dropi-ilustration-icon.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-image-miniature.entry.js +3 -3
- package/dist/dropi-ui/dropi-image-miniature.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-image-overlay.entry.js +2 -2
- package/dist/dropi-ui/dropi-image-overlay.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-input.entry.js +4 -4
- package/dist/dropi-ui/dropi-input.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-languages-selector.entry.js +2 -2
- package/dist/dropi-ui/dropi-languages-selector.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-logo.entry.js +3 -3
- package/dist/dropi-ui/dropi-logo.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-lottie-loader.entry.js +2 -2
- package/dist/dropi-ui/dropi-lottie-loader.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-media-player.entry.js +2 -2
- package/dist/dropi-ui/dropi-media-player.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-modal.entry.js +3 -3
- package/dist/dropi-ui/dropi-modal.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-navbar.entry.js +4 -4
- package/dist/dropi-ui/dropi-navbar.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-otp-send-code.entry.js +14 -4
- package/dist/dropi-ui/dropi-otp-send-code.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-paginator.entry.js +4 -4
- package/dist/dropi-ui/dropi-paginator.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-phone-input.entry.js +4 -4
- package/dist/dropi-ui/dropi-phone-input.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-progress-bar.entry.js +3 -3
- package/dist/dropi-ui/dropi-progress-bar.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-radio-button.entry.js +3 -3
- package/dist/dropi-ui/dropi-radio-button.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-radio-selection-list.entry.js +4 -4
- package/dist/dropi-ui/dropi-radio-selection-list.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-read-more.entry.js +3 -3
- package/dist/dropi-ui/dropi-read-more.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-search.entry.js +4 -4
- package/dist/dropi-ui/dropi-search.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-select.entry.js +3 -3
- package/dist/dropi-ui/dropi-select.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-sidebar.entry.js +3 -3
- package/dist/dropi-ui/dropi-sidebar.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-simple-stepper.entry.js +3 -3
- package/dist/dropi-ui/dropi-simple-stepper.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-skeleton.entry.js +2 -2
- package/dist/dropi-ui/dropi-skeleton.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-steps.entry.js +14 -4
- package/dist/dropi-ui/dropi-steps.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-switch.entry.js +3 -3
- package/dist/dropi-ui/dropi-switch.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-table.entry.js +2 -2
- package/dist/dropi-ui/dropi-table.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-tabs.entry.js +3 -3
- package/dist/dropi-ui/dropi-tabs.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-tag-type-product.entry.js +3 -3
- package/dist/dropi-ui/dropi-tag-type-product.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-tag.entry.js +4 -4
- package/dist/dropi-ui/dropi-tag.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-text-area.entry.js +4 -4
- package/dist/dropi-ui/dropi-text-area.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-time-line.entry.js +3 -3
- package/dist/dropi-ui/dropi-time-line.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-toast.entry.js +9 -11
- package/dist/dropi-ui/dropi-toast.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-tooltip-v2.entry.js +4 -4
- package/dist/dropi-ui/dropi-tooltip-v2.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-tooltip.entry.js +3 -3
- package/dist/dropi-ui/dropi-tooltip.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-ui.css +1 -1
- package/dist/dropi-ui/dropi-ui.esm.js +50 -1
- package/dist/dropi-ui/dropi-vertical-steps.entry.js +3 -3
- package/dist/dropi-ui/dropi-vertical-steps.entry.js.map +1 -1
- package/dist/dropi-ui/dropi-youtube-lazy-video.entry.js +3 -3
- package/dist/dropi-ui/dropi-youtube-lazy-video.entry.js.map +1 -1
- package/dist/dropi-ui/index-BKkSRXlb.js +4625 -0
- package/dist/dropi-ui/index-BKkSRXlb.js.map +1 -0
- package/dist/dropi-ui/index-DrzVsORR.js +4625 -0
- package/dist/dropi-ui/index-DrzVsORR.js.map +1 -0
- package/dist/dropi-ui/lottie-map.generated-BEs9gbju.js +15 -0
- package/dist/dropi-ui/lottie-map.generated-BEs9gbju.js.map +1 -0
- package/dist/dropi-ui/p-01027049.entry.js +1 -0
- package/dist/dropi-ui/p-02172dc2.entry.js +1 -0
- package/dist/dropi-ui/p-021f55e5.entry.js +1 -0
- package/dist/dropi-ui/p-0393dfc9.entry.js +1 -0
- package/dist/dropi-ui/p-090817e4.entry.js +1 -0
- package/dist/dropi-ui/p-0ee1edcd.entry.js +1 -0
- package/dist/dropi-ui/p-0f20c87c.entry.js +1 -0
- package/dist/dropi-ui/p-0fefc0c8.entry.js +1 -0
- package/dist/dropi-ui/p-113516f7.entry.js +1 -0
- package/dist/dropi-ui/p-13e1c3a4.entry.js +1 -0
- package/dist/dropi-ui/p-14124aee.entry.js +1 -0
- package/dist/dropi-ui/p-1633c2df.entry.js +1 -0
- package/dist/dropi-ui/p-16d0400d.entry.js +1 -0
- package/dist/dropi-ui/p-184442f6.entry.js +1 -0
- package/dist/dropi-ui/p-1901806b.entry.js +1 -0
- package/dist/dropi-ui/p-1a222047.entry.js +1 -0
- package/dist/dropi-ui/p-2076bc28.entry.js +1 -0
- package/dist/dropi-ui/p-24e17d9c.entry.js +1 -0
- package/dist/dropi-ui/p-27d5b554.entry.js +1 -0
- package/dist/dropi-ui/p-29a3389a.entry.js +1 -0
- package/dist/dropi-ui/p-2ad5dbd2.entry.js +1 -0
- package/dist/dropi-ui/p-2ed8b556.entry.js +1 -0
- package/dist/dropi-ui/p-3277ea55.entry.js +1 -0
- package/dist/dropi-ui/p-32f144b2.entry.js +1 -0
- package/dist/dropi-ui/p-356ab2c5.entry.js +1 -0
- package/dist/dropi-ui/p-3843cba5.entry.js +1 -0
- package/dist/dropi-ui/p-3b47c86f.entry.js +1 -0
- package/dist/dropi-ui/p-3b7060e1.entry.js +1 -0
- package/dist/dropi-ui/p-3f75523b.entry.js +1 -0
- package/dist/dropi-ui/p-40376329.entry.js +1 -0
- package/dist/dropi-ui/p-4158d4b7.entry.js +1 -0
- package/dist/dropi-ui/p-42854929.entry.js +1 -0
- package/dist/dropi-ui/p-436f196f.entry.js +1 -0
- package/dist/dropi-ui/p-440e6f67.entry.js +1 -0
- package/dist/dropi-ui/p-4432c17d.entry.js +1 -0
- package/dist/dropi-ui/p-46a1d393.entry.js +1 -0
- package/dist/dropi-ui/p-492b8a1f.entry.js +1 -0
- package/dist/dropi-ui/p-496893e8.entry.js +1 -0
- package/dist/dropi-ui/p-49fb5900.entry.js +1 -0
- package/dist/dropi-ui/p-4a39e574.entry.js +1 -0
- package/dist/dropi-ui/p-4f0f060c.entry.js +1 -0
- package/dist/dropi-ui/p-52e6a495.entry.js +1 -0
- package/dist/dropi-ui/p-5415ed33.entry.js +1 -0
- package/dist/dropi-ui/p-542d0b9c.entry.js +1 -0
- package/dist/dropi-ui/p-54d243db.entry.js +1 -0
- package/dist/dropi-ui/p-58093c18.entry.js +1 -0
- package/dist/dropi-ui/p-5bd0bb86.entry.js +1 -0
- package/dist/dropi-ui/p-5db953ba.entry.js +1 -0
- package/dist/dropi-ui/p-6018f6a1.entry.js +1 -0
- package/dist/dropi-ui/p-66595a21.entry.js +1 -0
- package/dist/dropi-ui/p-6def424b.entry.js +1 -0
- package/dist/dropi-ui/p-6ea74d84.entry.js +1 -0
- package/dist/dropi-ui/p-6efa35f2.entry.js +1 -0
- package/dist/dropi-ui/p-70295204.entry.js +1 -0
- package/dist/dropi-ui/p-76651c16.entry.js +1 -0
- package/dist/dropi-ui/p-769929eb.entry.js +1 -0
- package/dist/dropi-ui/p-7ac0c653.entry.js +1 -0
- package/dist/dropi-ui/p-7cb27020.entry.js +1 -0
- package/dist/dropi-ui/p-7d61faf2.entry.js +1 -0
- package/dist/dropi-ui/p-7f538bbf.entry.js +1 -0
- package/dist/dropi-ui/p-7fd2db00.entry.js +1 -0
- package/dist/dropi-ui/p-8089116b.entry.js +1 -0
- package/dist/dropi-ui/p-80ebe1e0.entry.js +1 -0
- package/dist/dropi-ui/p-8465f52d.entry.js +1 -0
- package/dist/dropi-ui/p-8782862b.entry.js +1 -0
- package/dist/dropi-ui/p-879f79cf.entry.js +1 -0
- package/dist/dropi-ui/p-8ac5a31d.entry.js +1 -0
- package/dist/dropi-ui/p-8eb0ebff.entry.js +1 -0
- package/dist/dropi-ui/p-8feee3fd.entry.js +1 -0
- package/dist/dropi-ui/p-910af7cf.entry.js +1 -0
- package/dist/dropi-ui/p-93cd9afe.entry.js +1 -0
- package/dist/dropi-ui/p-94ec77fc.entry.js +1 -0
- package/dist/dropi-ui/p-97aa4446.entry.js +1 -0
- package/dist/dropi-ui/p-97b9fed2.entry.js +1 -0
- package/dist/dropi-ui/p-98156424.entry.js +1 -0
- package/dist/dropi-ui/p-992134d3.entry.js +1 -0
- package/dist/dropi-ui/p-998b016a.entry.js +1 -0
- package/dist/dropi-ui/p-99f48203.entry.js +1 -0
- package/dist/dropi-ui/p-9b6fe588.entry.js +1 -0
- package/dist/dropi-ui/p-BEs9gbju.js +1 -0
- package/dist/dropi-ui/p-CWoV_bQo.js +2 -0
- package/dist/dropi-ui/p-a0135272.entry.js +1 -0
- package/dist/dropi-ui/p-a2b4ba6d.entry.js +1 -0
- package/dist/dropi-ui/p-a50e6592.entry.js +1 -0
- package/dist/dropi-ui/p-a5b3548c.entry.js +1 -0
- package/dist/dropi-ui/p-a5e4bd7a.entry.js +1 -0
- package/dist/dropi-ui/p-a6a73485.entry.js +1 -0
- package/dist/dropi-ui/p-a82ecdd5.entry.js +1 -0
- package/dist/dropi-ui/p-a91d8b2c.entry.js +1 -0
- package/dist/dropi-ui/p-a9682999.entry.js +1 -0
- package/dist/dropi-ui/p-aa63edd4.entry.js +1 -0
- package/dist/dropi-ui/p-aaeccf21.entry.js +1 -0
- package/dist/dropi-ui/p-ab9ec519.entry.js +1 -0
- package/dist/dropi-ui/p-ad1e0e62.entry.js +1 -0
- package/dist/dropi-ui/p-ae423d39.entry.js +1 -0
- package/dist/dropi-ui/p-aeaa39f6.entry.js +1 -0
- package/dist/dropi-ui/p-b0930601.entry.js +1 -0
- package/dist/dropi-ui/p-b2000dcb.entry.js +1 -0
- package/dist/dropi-ui/p-b2739793.entry.js +1 -0
- package/dist/dropi-ui/p-b4227dd5.entry.js +1 -0
- package/dist/dropi-ui/p-b4bcfc25.entry.js +1 -0
- package/dist/dropi-ui/p-b7f9592b.entry.js +1 -0
- package/dist/dropi-ui/p-b941ee31.entry.js +1 -0
- package/dist/dropi-ui/p-b94b7199.entry.js +1 -0
- package/dist/dropi-ui/p-ba87a663.entry.js +1 -0
- package/dist/dropi-ui/p-baaf86d8.entry.js +1 -0
- package/dist/dropi-ui/p-bc5447d7.entry.js +1 -0
- package/dist/dropi-ui/p-bd2c7bbc.entry.js +1 -0
- package/dist/dropi-ui/p-beb4b2d7.entry.js +1 -0
- package/dist/dropi-ui/p-bf7f2bf6.entry.js +1 -0
- package/dist/dropi-ui/p-bfaac1cc.entry.js +1 -0
- package/dist/dropi-ui/p-c31dbf7d.entry.js +1 -0
- package/dist/dropi-ui/p-c424a77c.entry.js +1 -0
- package/dist/dropi-ui/p-c5c3b146.entry.js +1 -0
- package/dist/dropi-ui/p-c6fd796c.entry.js +1 -0
- package/dist/dropi-ui/p-c7260931.entry.js +1 -0
- package/dist/dropi-ui/p-ca5dbffd.entry.js +1 -0
- package/dist/dropi-ui/p-cb48cb42.entry.js +1 -0
- package/dist/dropi-ui/p-cc53f78b.entry.js +1 -0
- package/dist/dropi-ui/p-cd30d613.entry.js +1 -0
- package/dist/dropi-ui/p-d0e3de92.entry.js +1 -0
- package/dist/dropi-ui/p-d136695a.entry.js +1 -0
- package/dist/dropi-ui/p-d286adf0.entry.js +1 -0
- package/dist/dropi-ui/p-d46058e1.entry.js +1 -0
- package/dist/dropi-ui/p-d65aeab2.entry.js +1 -0
- package/dist/dropi-ui/p-d8c02ec8.entry.js +1 -0
- package/dist/dropi-ui/p-d93f31c2.entry.js +1 -0
- package/dist/dropi-ui/p-debe6fa2.entry.js +1 -0
- package/dist/dropi-ui/p-df89c528.entry.js +1 -0
- package/dist/dropi-ui/p-e07c21c8.entry.js +1 -0
- package/dist/dropi-ui/p-e3224f3e.entry.js +1 -0
- package/dist/dropi-ui/p-e67161f6.entry.js +1 -0
- package/dist/dropi-ui/p-e6f708e9.entry.js +1 -0
- package/dist/dropi-ui/p-e824d439.entry.js +1 -0
- package/dist/dropi-ui/p-e842be74.entry.js +1 -0
- package/dist/dropi-ui/p-ea15ac20.entry.js +1 -0
- package/dist/dropi-ui/p-eb98ac81.entry.js +1 -0
- package/dist/dropi-ui/p-f0362230.entry.js +1 -0
- package/dist/dropi-ui/p-f18f8a8e.entry.js +1 -0
- package/dist/dropi-ui/p-f46d7df1.entry.js +1 -0
- package/dist/dropi-ui/p-f61e0ed7.entry.js +1 -0
- package/dist/dropi-ui/p-f699688a.entry.js +1 -0
- package/dist/dropi-ui/p-f73d5969.entry.js +1 -0
- package/dist/dropi-ui/p-fd0448a7.entry.js +1 -0
- package/dist/dropi-ui/p-fff4eb31.entry.js +1 -0
- package/dist/esm/dropi-accordion-item.entry.js +2 -2
- package/dist/esm/dropi-accordion.entry.js +2 -2
- package/dist/esm/dropi-alert-legacy.entry.js +2 -2
- package/dist/esm/dropi-alert-modal.entry.js +3 -13
- package/dist/esm/dropi-alert.entry.js +2 -2
- package/dist/esm/dropi-avatars.entry.js +2 -2
- package/dist/esm/dropi-badge-legacy.entry.js +2 -2
- package/dist/esm/dropi-badge.entry.js +2 -2
- package/dist/esm/dropi-banner-external.entry.js +2 -2
- package/dist/esm/dropi-breadcrumb.entry.js +2 -2
- package/dist/esm/dropi-button.entry.js +2 -2
- package/dist/esm/dropi-card-checkbox.entry.js +2 -2
- package/dist/esm/dropi-card-product.entry.js +2 -2
- package/dist/esm/dropi-card-section.entry.js +2 -2
- package/dist/esm/dropi-carousel.entry.js +2 -2
- package/dist/esm/dropi-checkbox-selection-list.entry.js +2 -2
- package/dist/esm/dropi-checkbox.entry.js +2 -2
- package/dist/esm/dropi-chips.entry.js +2 -2
- package/dist/esm/dropi-city-selector.entry.js +2 -2
- package/dist/esm/dropi-color-picker.entry.js +2 -2
- package/dist/esm/dropi-country-flags.entry.js +2 -2
- package/dist/esm/dropi-country-selector.entry.js +2 -2
- package/dist/esm/dropi-date-picker-range.entry.js +2 -2
- package/dist/esm/dropi-date-picker.entry.js +2 -2
- package/dist/esm/dropi-drawer.entry.js +2 -2
- package/dist/esm/dropi-dropdown.entry.js +2 -2
- package/dist/esm/dropi-empty-state.entry.js +2 -2
- package/dist/esm/dropi-favorite-button.entry.js +2 -2
- package/dist/esm/dropi-file-upload-progress-bar.entry.js +2 -2
- package/dist/esm/dropi-file-upload.entry.js +2 -2
- package/dist/esm/dropi-icon.entry.js +2 -2
- package/dist/esm/dropi-ilustration-icon.entry.js +2 -2
- package/dist/esm/dropi-image-miniature.entry.js +2 -2
- package/dist/esm/dropi-image-overlay.entry.js +2 -2
- package/dist/esm/dropi-input_3.entry.js +4 -4
- package/dist/esm/dropi-languages-selector.entry.js +2 -2
- package/dist/esm/dropi-logo.entry.js +2 -2
- package/dist/esm/dropi-lottie-loader.entry.js +2 -2
- package/dist/esm/dropi-media-player.entry.js +2 -2
- package/dist/esm/dropi-modal.entry.js +2 -2
- package/dist/esm/dropi-navbar.entry.js +2 -2
- package/dist/esm/dropi-otp-send-code.entry.js +2 -2
- package/dist/esm/dropi-phone-input.entry.js +2 -2
- package/dist/esm/dropi-progress-bar.entry.js +2 -2
- package/dist/esm/dropi-radio-button.entry.js +2 -2
- package/dist/esm/dropi-radio-selection-list.entry.js +2 -2
- package/dist/esm/dropi-read-more.entry.js +2 -2
- package/dist/esm/dropi-search.entry.js +2 -2
- package/dist/esm/dropi-select.entry.js +2 -2
- package/dist/esm/dropi-sidebar.entry.js +2 -2
- package/dist/esm/dropi-simple-stepper.entry.js +2 -2
- package/dist/esm/dropi-skeleton.entry.js +2 -2
- package/dist/esm/dropi-steps.entry.js +13 -3
- package/dist/esm/dropi-switch.entry.js +2 -2
- package/dist/esm/dropi-table.entry.js +2 -2
- package/dist/esm/dropi-tabs.entry.js +2 -2
- package/dist/esm/dropi-tag-type-product.entry.js +2 -2
- package/dist/esm/dropi-text-area.entry.js +2 -2
- package/dist/esm/dropi-time-line.entry.js +2 -2
- package/dist/esm/dropi-toast.entry.js +9 -11
- package/dist/esm/dropi-tooltip-v2.entry.js +2 -2
- package/dist/esm/dropi-tooltip.entry.js +2 -2
- package/dist/esm/dropi-ui.js +3 -3
- package/dist/esm/dropi-vertical-steps.entry.js +2 -2
- package/dist/esm/dropi-youtube-lazy-video.entry.js +2 -2
- package/dist/esm/index-CWoV_bQo.js +2798 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/lottie-map.generated-BEs9gbju.js +12 -0
- package/dist/types/components/dropi-ilustration-icon/dropi-ilustration-icon.d.ts +1 -1
- package/dist/types/components/dropi-otp-send-code/dropi-otp-send-code.d.ts +4 -0
- package/dist/types/components/dropi-toast/dropi-toast.d.ts +1 -2
- package/dist/types/components.d.ts +10 -0
- package/hydrate/index.js +177 -162
- package/hydrate/index.mjs +177 -162
- package/package.json +2 -2
- package/scripts/setup.js +2 -17
- package/scripts/strip-use-client.mjs +20 -0
package/hydrate/index.mjs
CHANGED
|
@@ -5361,7 +5361,7 @@ var setScopedSSR = (opts) => {
|
|
|
5361
5361
|
var needsScopedSSR = () => scopedSSR;
|
|
5362
5362
|
var scopedSSR = false;
|
|
5363
5363
|
|
|
5364
|
-
const dropiAccordionCss = () => `:host{display:block;width:100%;margin-bottom:-1px}*,*::before,*::after{box-sizing:border-box}.accordion{border-top:1px solid var(--Gray-Gray-100,#e6eaf2);border-bottom:1px solid var(--Gray-Gray-100,#e6eaf2);overflow:hidden}.accordion-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--Size-4,16px) var(--Size-5,20px);background:transparent;border:none;cursor:pointer;gap:12px;text-align:left}.accordion-header:disabled{cursor:not-allowed;opacity:0.5}.accordion--open .accordion-header{border-bottom:1px solid var(--Gray-Gray-100,#e6eaf2)}.accordion-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.accordion-title{font-size:var(--font-size-m, 16px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-600, #475066);line-height:1.4}.accordion-chevron{display:flex;align-items:center;flex-shrink:0;transition:transform 0.22s ease}.accordion-chevron--open{transform:rotate(180deg)}.accordion-body{max-height:0;overflow:hidden;transition:max-height 0.28s ease}.accordion-content{padding:0 var(--Size-5,20px) var(--Size-4,16px);color:var(--Gray-Gray-600,#475066);font-size:var(--font-size-s,12px);line-height:1.6}`;
|
|
5364
|
+
const dropiAccordionCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif);width:100%;margin-bottom:-1px}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.accordion{border-top:1px solid var(--Gray-Gray-100,#e6eaf2);border-bottom:1px solid var(--Gray-Gray-100,#e6eaf2);overflow:hidden}.accordion-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--Size-4,16px) var(--Size-5,20px);background:transparent;border:none;cursor:pointer;gap:12px;text-align:left}.accordion-header:disabled{cursor:not-allowed;opacity:0.5}.accordion--open .accordion-header{border-bottom:1px solid var(--Gray-Gray-100,#e6eaf2)}.accordion-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.accordion-title{font-size:var(--font-size-m, 16px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-600, #475066);line-height:1.4}.accordion-chevron{display:flex;align-items:center;flex-shrink:0;transition:transform 0.22s ease}.accordion-chevron--open{transform:rotate(180deg)}.accordion-body{max-height:0;overflow:hidden;transition:max-height 0.28s ease}.accordion-content{padding:0 var(--Size-5,20px) var(--Size-4,16px);color:var(--Gray-Gray-600,#475066);font-size:var(--font-size-s,12px);line-height:1.6}`;
|
|
5365
5365
|
|
|
5366
5366
|
/**
|
|
5367
5367
|
* @component dropi-accordion
|
|
@@ -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: '13c47160cdbedc1e1d0cd4996facee8f539a5ae8', class: "accordion-container" }, hAsync("slot", { key: '6d333a462b616b28f0f6ea2f39d109d8d3ad472d' })));
|
|
5378
5378
|
}
|
|
5379
5379
|
static get style() { return dropiAccordionCss(); }
|
|
5380
5380
|
static get cmpMeta() { return {
|
|
@@ -5389,7 +5389,7 @@ class DropiAccordion {
|
|
|
5389
5389
|
}; }
|
|
5390
5390
|
}
|
|
5391
5391
|
|
|
5392
|
-
const dropiAccordionItemCss = () => `:host{display:block;border-bottom:1px solid var(--Gray-Gray-100)}.accordion-header{width:100%;display:flex;justify-content:space-between;align-items:center;
|
|
5392
|
+
const dropiAccordionItemCss = () => `:host{display:block;border-bottom:1px solid var(--Gray-Gray-100);border-radius:0}.accordion-header{width:100%;display:flex;justify-content:space-between;align-items:center;background:transparent;border:none;cursor:pointer;text-align:left;transition:background 0.3s}.accordion-header:hover{background:var(--Gray-Gray-50)}.accordion-header-left{display:flex;align-items:center;gap:var(--Size-2)}.accordion-title{padding:var(--Size-5) var(--Size-4);margin:0;font-family:var(--font-family-01);font-size:var(--font-size-m);font-style:normal;font-weight:var(--font-weight-bold);color:var(--Gray-Gray-600);line-height:var(--lineheight-simple)}.accordion-chevron{padding:var(--Size-3);color:var(--Gray-Gray-500);transition:transform 0.3s ease}.accordion-chevron--open{transform:rotate(180deg)}.accordion-body{overflow:hidden;transition:max-height 0.3s ease-in-out, opacity 0.3s ease-in-out}.accordion-content{padding:var(--Size-4);background:var(--Neutral-White)}`;
|
|
5393
5393
|
|
|
5394
5394
|
/**
|
|
5395
5395
|
* @component dropi-accordion-item
|
|
@@ -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: 'fe0990ea59f9484547404661e68f2dbe545a664c', class: { 'accordion-item': true, 'accordion-item--open': this.open, 'accordion-item--disabled': this.disabled } }, hAsync("button", { key: 'b54e7094354e716c9cd8d6096e514f96489c7f83', class: "accordion-header", onClick: () => this.handleToggle(), "aria-expanded": String(this.open), disabled: this.disabled }, hAsync("span", { key: 'f4899647c2a6ec1b38b205f32646f1e5193a0969', class: "accordion-header-left" }, this.preIcon && hAsync("dropi-icon", { key: '70d2358ee43a880d9f6abbdab7c745b9227bdd90', name: this.preIcon, iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-600" }), hAsync("span", { key: '57e11bb9b1e6533a4861a66e8e97da16051f5efd', class: "accordion-title" }, this.sectionTitle)), hAsync("span", { key: 'e4ab4e3d7b4463d9885696e634795673efaa5071', class: { 'accordion-chevron': true, 'accordion-chevron--open': this.open } }, hAsync("dropi-icon", { key: 'e7fa15870a92d2791e8a1e4c9dde172b81bb7ae8', name: "Dropdown-down", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-500" }))), hAsync("div", { key: '7c59aa23ac8b628951dc79428b966e0d7ea5c770', class: "accordion-body", style: { maxHeight: this.contentHeight }, ref: (el) => this.contentRef = el }, hAsync("div", { key: 'a6eef2a694cb0e0b761353e7770e0e375da3c0a7', class: "accordion-content" }, hAsync("slot", { key: '36e38e144c874c8b8bea9446c9606f5e026fe60e' })))));
|
|
5436
5436
|
}
|
|
5437
5437
|
static get watchers() { return {
|
|
5438
5438
|
"open": [{
|
|
@@ -5457,7 +5457,7 @@ class DropiAccordionItem {
|
|
|
5457
5457
|
}; }
|
|
5458
5458
|
}
|
|
5459
5459
|
|
|
5460
|
-
const dropiAlertCss = () => `:host{display:block;width:100
|
|
5460
|
+
const dropiAlertCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.alert{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-3, 12px);border-radius:var(--Border-2, 8px);border:1px solid transparent;width:100%}.alert--success{background:var(--Success-Success-50, #e7f8f3);border-color:var(--Success-Success-500, #0abb87)}.alert--error{background:var(--Error-Error-50, #fef0f0);border-color:var(--Error-Error-500, #f46a6b)}.alert--warning{background:var(--Warning-Warning-50, #fef8ed);border-color:var(--Warning-Warning-500, #f1b44c)}.alert--info{background:var(--Info-Info-50, #eef6fe);border-color:var(--Info-Info-500, #50a5f1)}.alert--flag{padding:var(--Size-1, 4px) var(--Size-2, 8px);border-radius:var(--Border-1, 4px);border:none !important;justify-content:center}.alert--flag .alert__body{justify-content:center;text-align:center}.alert--flag .alert__message{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular)}.alert__icon{display:flex;align-items:center;flex-shrink:0;padding-top:1px}.alert__body{flex:1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--Size-1, 4px)}.alert__message{font-size:var(--font-size-s);color:var(--Gray-600, #475066);font-weight:var(--font-weight-medium);line-height:1.5}.alert__link{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Primary-Primary-500, #f49a3d);text-decoration:underline;cursor:pointer}.alert__actions{display:flex;align-items:center;gap:var(--Size-2, 8px);flex-shrink:0}.alert__btn{height:28px;padding:0 var(--Size-3, 12px);border-radius:var(--Border-2, 8px);border:1px solid var(--Primary-Primary-500, #f49a3d);background:transparent;color:var(--Primary-Primary-500, #f49a3d);font-size:var(--font-size-xs, 10px);font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);cursor:pointer;transition:background 0.15s, color 0.15s}.alert__btn:hover{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff)}.alert__close{display:flex;align-items:center;justify-content:center;background:none;border:none;padding:0;cursor:pointer;opacity:0.6;transition:opacity 0.15s}.alert__close:hover{opacity:1}`;
|
|
5461
5461
|
|
|
5462
5462
|
const STATE_ICONS = {
|
|
5463
5463
|
success: 'Check-circle',
|
|
@@ -5542,7 +5542,7 @@ class DropiAlert {
|
|
|
5542
5542
|
}; }
|
|
5543
5543
|
}
|
|
5544
5544
|
|
|
5545
|
-
const dropiAlertLegacyCss = () => `:host{display:block;margin:10px 0}.alert-legacy{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:var(--Border-2);font-size:var(--font-size-s)}.alert-legacy--success{background:var(--Success-Success-50);color:var(--Success-Success-700);border:1px solid var(--Success-Success-200)}.alert-legacy--error{background:var(--Error-Error-50);color:var(--Error-Error-700);border:1px solid var(--Error-Error-200)}.alert-legacy--warning{background:var(--Warning-Warning-50);color:var(--Warning-Warning-700);border:1px solid var(--Warning-Warning-200)}.alert-legacy--info{background:var(--Info-Info-50);color:var(--Info-Info-700);border:1px solid var(--Info-Info-200)}.alert-legacy__close{background:transparent;border:none;font-size:20px;cursor:pointer;color:currentColor;opacity:0.6}.alert-legacy__close:hover{opacity:1}`;
|
|
5545
|
+
const dropiAlertLegacyCss = () => `:host{display:block;margin:10px 0;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.alert-legacy{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:var(--Border-2);font-size:var(--font-size-s)}.alert-legacy--success{background:var(--Success-Success-50);color:var(--Success-Success-700);border:1px solid var(--Success-Success-200)}.alert-legacy--error{background:var(--Error-Error-50);color:var(--Error-Error-700);border:1px solid var(--Error-Error-200)}.alert-legacy--warning{background:var(--Warning-Warning-50);color:var(--Warning-Warning-700);border:1px solid var(--Warning-Warning-200)}.alert-legacy--info{background:var(--Info-Info-50);color:var(--Info-Info-700);border:1px solid var(--Info-Info-200)}.alert-legacy__close{background:transparent;border:none;font-size:20px;cursor:pointer;color:currentColor;opacity:0.6}.alert-legacy__close:hover{opacity:1}`;
|
|
5546
5546
|
|
|
5547
5547
|
/**
|
|
5548
5548
|
* @component dropi-alert-legacy
|
|
@@ -5604,7 +5604,7 @@ const LOTTIE_MAP = {
|
|
|
5604
5604
|
'loading': `{"v":"5.9.0","fr":60,"ip":0,"op":171,"w":1080,"h":1080,"nm":"Cabeza","ddd":0,"assets":[{"id":"comp_0","nm":"Cara","fr":60,"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Oido","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-1,"ix":10},"p":{"a":0,"k":[109.935,535.516,0],"ix":2,"l":2},"a":{"a":0,"k":[53.714,165.607,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":37,"s":[0,0,100],"e":[45.001,47.999,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.167,0.167,0.167],"y":[0,0,0]},"t":57,"s":[45.001,47.999,100],"e":[45.001,47.999,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":111,"s":[45.001,47.999,100],"e":[0,0,100]},{"t":131}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-22.187,0],[0,28.534],[22.185,0],[0,-28.534]],"o":[[22.185,0],[0,-28.534],[-22.187,0],[0,28.534]],"v":[[0.001,51.667],[40.168,0.003],[0.001,-51.666],[-40.168,0.003]],"c":true},"ix":2},"nm":"Trazado 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.999998743394,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[56.608,162.254],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Grupo 14","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":10,"op":1734,"st":-66,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Cara","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":27,"s":[27],"e":[-1]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.167],"y":[0]},"t":45,"s":[-1],"e":[-1]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":121,"s":[-1],"e":[27]},{"t":139}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0.626,"y":1},"o":{"x":0.333,"y":0},"t":27,"s":[213.675,679.853,0],"e":[162.482,531.35,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.626,"y":0.626},"o":{"x":0.207,"y":0.207},"t":45,"s":[162.482,531.35,0],"e":[162.482,531.35,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.207,"y":0},"t":121,"s":[162.482,531.35,0],"e":[213.675,679.853,0],"to":[0,0,0],"ti":[0,0,0]},{"t":139}],"ix":2,"l":2},"a":{"a":0,"k":[173.996,162.257,0],"ix":1,"l":2},"s":{"a":0,"k":[45.634,47.333,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[80.27,102.121],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.999998743394,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[60.448,165.224],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[7.778,-6.667],[0.556,-0.278],[0,0],[8.611,-5.278],[0,0],[0,0],[-4.444,6.944],[0,0],[-3.056,1.389],[0,0]],"o":[[0,0],[-7.778,6.667],[-0.556,0.278],[0,0],[-8.611,5.278],[0,0],[0,0],[4.444,-6.944],[0,0],[3.056,-1.389],[0,0]],"v":[[232.328,260.485],[213.717,278.541],[190.106,297.43],[210.106,300.763],[192.883,316.874],[167.606,327.152],[227.606,324.652],[236.494,312.152],[241.217,298.819],[251.217,296.319],[261.772,291.319]],"c":true},"ix":2},"nm":"Trazado 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.999998743394,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Forma 1","np":3,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.667,"y":1},"o":{"x":0.333,"y":0},"t":71,"s":[{"i":[[-30.809,3.373],[5.194,-2.674],[11.483,-2.311],[12.434,-11.8],[3.859,-7.178],[-0.557,1.68]],"o":[[16.031,-1.752],[-2.526,1.304],[-23.244,4.669],[-5.922,5.621],[-0.827,1.551],[10.788,-32.702]],"v":[[-6.041,-84.799],[3.701,-71.605],[-11.936,-67.867],[-55.927,-45.331],[-70.712,-25.755],[-73.229,-26.924]],"c":true}],"e":[{"i":[[-30.809,3.373],[5.194,-2.674],[11.483,-2.311],[12.434,-11.8],[3.859,-7.178],[-0.557,1.68]],"o":[[16.031,-1.752],[-2.526,1.304],[-23.244,4.669],[-5.922,5.621],[-0.827,1.551],[10.788,-32.702]],"v":[[-0.563,-69.651],[9.179,-56.458],[-6.458,-52.719],[-50.449,-30.184],[-65.234,-10.607],[-67.751,-11.777]],"c":true}]},{"i":{"x":0.667,"y":1},"o":{"x":0.333,"y":0},"t":81,"s":[{"i":[[-30.809,3.373],[5.194,-2.674],[11.483,-2.311],[12.434,-11.8],[3.859,-7.178],[-0.557,1.68]],"o":[[16.031,-1.752],[-2.526,1.304],[-23.244,4.669],[-5.922,5.621],[-0.827,1.551],[10.788,-32.702]],"v":[[-0.563,-69.651],[9.179,-56.458],[-6.458,-52.719],[-50.449,-30.184],[-65.234,-10.607],[-67.751,-11.777]],"c":true}],"e":[{"i":[[-30.809,3.373],[5.194,-2.674],[11.483,-2.311],[12.434,-11.8],[3.859,-7.178],[-0.557,1.68]],"o":[[16.031,-1.752],[-2.526,1.304],[-23.244,4.669],[-5.922,5.621],[-0.827,1.551],[10.788,-32.702]],"v":[[-6.041,-84.799],[3.701,-71.605],[-11.936,-67.867],[-55.927,-45.331],[-70.712,-25.755],[-73.229,-26.924]],"c":true}]},{"t":92}],"ix":2},"nm":"Trazado 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":1,"k":[{"i":{"x":0.667,"y":1},"o":{"x":0.333,"y":0},"t":71,"s":[{"i":[[-0.008,-9.329],[0.597,-2.736],[12.058,6.212],[1.444,6.718],[-2.425,7.163],[-6.919,1.695],[-3.446,-2.025]],"o":[[0,3.404],[-2.391,11.029],[-6.336,-3.261],[-1.597,-7.393],[2.279,-6.746],[3.874,-0.95],[8.754,5.148]],"v":[[20.249,22.29],[19.323,31.66],[-5.977,48.358],[-17.395,31.294],[-16.247,8.901],[-2.316,-6.087],[9.225,-4.288]],"c":true}],"e":[{"i":[[-1.008,-0.428],[2.622,-0.42],[6.121,0.128],[2.955,0.386],[-1.958,0.711],[-7.124,0.017],[-3.995,0.134]],"o":[[2.811,1.196],[-4.457,0.714],[-7.124,-0.148],[-4.079,-0.533],[3.057,-1.11],[4.543,-0.011],[4.252,-0.143]],"v":[[19.971,22.846],[15.434,24.716],[1.8,26.414],[-13.09,26.294],[-14.303,24.735],[0.739,22.525],[10.613,22.24]],"c":true}]},{"i":{"x":0.667,"y":1},"o":{"x":0.167,"y":0},"t":81,"s":[{"i":[[-1.008,-0.428],[2.622,-0.42],[6.121,0.128],[2.955,0.386],[-1.958,0.711],[-7.124,0.017],[-3.995,0.134]],"o":[[2.811,1.196],[-4.457,0.714],[-7.124,-0.148],[-4.079,-0.533],[3.057,-1.11],[4.543,-0.011],[4.252,-0.143]],"v":[[19.971,22.846],[15.434,24.716],[1.8,26.414],[-13.09,26.294],[-14.303,24.735],[0.739,22.525],[10.613,22.24]],"c":true}],"e":[{"i":[[-0.008,-9.329],[0.597,-2.736],[12.058,6.212],[1.444,6.718],[-2.425,7.163],[-6.919,1.695],[-3.446,-2.025]],"o":[[0,3.404],[-2.391,11.029],[-6.336,-3.261],[-1.597,-7.393],[2.279,-6.746],[3.874,-0.95],[8.754,5.148]],"v":[[20.249,22.29],[19.323,31.66],[-5.977,48.358],[-17.395,31.294],[-16.247,8.901],[-2.316,-6.087],[9.225,-4.288]],"c":true}]},{"t":92}],"ix":2},"nm":"Trazado 2","mn":"ADBE Vector Shape - Group","hd":false},{"ind":2,"ty":"sh","ix":3,"ks":{"a":0,"k":{"i":[[-1.765,6.749],[-5.049,1.599],[-2.51,-1.904],[-0.008,-8.786],[0.431,-2.575],[8.796,5.849],[1.058,6.325]],"o":[[1.666,-6.353],[2.828,-0.891],[6.39,4.853],[0,3.199],[-1.747,10.384],[-4.624,-3.071],[-1.164,-6.965]],"v":[[98.043,9.652],[108.215,-4.46],[116.639,-2.768],[124.688,22.261],[124.012,31.082],[105.545,46.805],[97.207,30.742]],"c":true},"ix":2},"nm":"Trazado 3","mn":"ADBE Vector Shape - Group","hd":false},{"ind":3,"ty":"sh","ix":4,"ks":{"a":0,"k":{"i":[[3.828,-12.992],[0,0],[0,-24.995],[29.218,0],[9.418,17.847],[0,0],[-23.146,0],[-1.876,0.24],[-8.184,17.588],[-40.761,0],[-2.002,0.03],[7.527,77.052],[56.327,0],[9.879,-1.761],[9.497,-4.119],[0,0],[4.745,-3.139],[0,0],[3.73,-3.197],[0,0],[3.833,-3.597],[0,0]],"o":[[0,0],[16.967,10.772],[0,35.727],[-18.66,0],[0,0],[7.199,25.265],[1.941,0],[17.266,-2.3],[25.418,24.546],[2.006,0],[68.455,-1.374],[-8.005,-82.162],[-10.963,0],[-11.117,2],[0,0],[-5.05,2.684],[0,0],[-4.299,2.688],[0,0],[-4.144,3.263],[0,0],[-8.389,9.797]],"v":[[-89.584,-26.191],[-89.584,-26.17],[-61.019,31.261],[-113.921,95.948],[-158.396,66.281],[-158.396,66.305],[-108.398,109.73],[-102.666,109.372],[-62.466,77.119],[41.824,116.151],[47.769,116.092],[150.868,11.951],[29.821,-100.342],[-1.563,-97.627],[-32.537,-88.402],[-80.288,-116.152],[-94.988,-107.406],[-48.13,-80.217],[-60.164,-71.407],[-107.092,-98.653],[-119.061,-88.355],[-71.095,-60.506]],"c":true},"ix":2},"nm":"Trazado 4","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"mm","mm":1,"nm":"Combinar trazados 1","mn":"ADBE Vector Filter - Merge","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.999998743394,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[175.101,136.583],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Grupo 18","np":6,"cix":2,"bm":0,"ix":3,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1734,"st":-66,"bm":0}]}],"layers":[{"ddd":0,"ind":1,"ty":3,"nm":"Nulo 2","sr":1,"ks":{"o":{"a":0,"k":0,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[540,540,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":0,"k":[167,167,100],"ix":6,"l":2}},"ao":0,"ip":0,"op":171,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":0,"nm":"Cara","parent":6,"refId":"comp_0","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[2067.444,3.25,0],"ix":2,"l":2},"a":{"a":0,"k":[1235.5,535.5,0],"ix":1,"l":2},"s":{"a":0,"k":[222.222,208.333,100],"ix":6,"l":2}},"ao":0,"hasMask":true,"masksProperties":[{"inv":false,"mode":"a","pt":{"a":0,"k":{"i":[[43.45,0],[0,-45.418],[-37.006,-0.082],[-3.685,44.687]],"o":[[-43.45,0],[0,45.418],[55.361,0.123],[3.733,-45.264]],"v":[[162.476,455.019],[83.718,534.701],[158.922,610.358],[241.149,537.256]],"c":true},"ix":1},"o":{"a":0,"k":100,"ix":3},"x":{"a":0,"k":0,"ix":4},"nm":"Máscara 1"}],"w":2471,"h":1071,"ip":17,"op":171,"st":17,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Antena","parent":4,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":1,"ix":10},"p":{"a":0,"k":[-71.987,-62.349,0],"ix":2,"l":2},"a":{"a":0,"k":[-469.25,-132.25,0],"ix":1,"l":2},"s":{"a":0,"k":[45,45,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[33.5,33.5],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.949019607843,0.607843137255,0.235294117647,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":1,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-469.25,-132.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":171,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Palo antena","parent":7,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-1,"ix":10},"p":{"a":0,"k":[-467.03,-134.284,0],"ix":2,"l":2},"a":{"a":0,"k":[-72,-30,0],"ix":1,"l":2},"s":{"a":0,"k":[402.402,402.402,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":44,"s":[{"i":[[0,0],[0,0],[-0.195,-5.38],[0,0],[0,0],[-0.102,4.653]],"o":[[0,0],[0,0],[0.195,5.38],[0,0],[0,0],[0.102,-4.653]],"v":[[-69.25,-62.625],[-75.375,-62.625],[-77.361,-45.794],[-75.75,-30.25],[-69.25,-30.25],[-71.168,-45.914]],"c":true}],"e":[{"i":[[0,0],[0,0],[-0.104,-4.462],[0,0],[0,0],[-0.034,5.578]],"o":[[0,0],[0,0],[0.104,4.462],[0,0],[0,0],[0.034,-5.578]],"v":[[-69.25,-62.625],[-75.375,-62.625],[-74.461,-45.291],[-75.75,-30.25],[-69.25,-30.25],[-67.58,-45.736]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":66,"s":[{"i":[[0,0],[0,0],[-0.104,-4.462],[0,0],[0,0],[-0.034,5.578]],"o":[[0,0],[0,0],[0.104,4.462],[0,0],[0,0],[0.034,-5.578]],"v":[[-69.25,-62.625],[-75.375,-62.625],[-74.461,-45.291],[-75.75,-30.25],[-69.25,-30.25],[-67.58,-45.736]],"c":true}],"e":[{"i":[[0,0],[0,0],[-0.195,-5.38],[0,0],[0,0],[-0.102,4.653]],"o":[[0,0],[0,0],[0.195,5.38],[0,0],[0,0],[0.102,-4.653]],"v":[[-69.25,-62.625],[-75.375,-62.625],[-77.361,-45.794],[-75.75,-30.25],[-69.25,-30.25],[-71.168,-45.914]],"c":true}]},{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":85,"s":[{"i":[[0,0],[0,0],[-0.195,-5.38],[0,0],[0,0],[-0.102,4.653]],"o":[[0,0],[0,0],[0.195,5.38],[0,0],[0,0],[0.102,-4.653]],"v":[[-69.25,-62.625],[-75.375,-62.625],[-77.361,-45.794],[-75.75,-30.25],[-69.25,-30.25],[-71.168,-45.914]],"c":true}],"e":[{"i":[[0,0],[0,0],[-0.195,-5.38],[0,0],[0,0],[-0.102,4.653]],"o":[[0,0],[0,0],[0.195,5.38],[0,0],[0,0],[0.102,-4.653]],"v":[[-69.25,-62.625],[-75.375,-62.625],[-75.861,-45.838],[-75.75,-30.25],[-69.25,-30.25],[-69.543,-45.953]],"c":true}]},{"t":98}],"ix":2},"nm":"Trazado 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.949019607843,0.607843137255,0.235294117647,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":1,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Forma 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":171,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Cabeza 2","parent":6,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":-1,"ix":10},"p":{"a":0,"k":[-316.407,-8.321,0],"ix":2,"l":2},"a":{"a":0,"k":[540,675,0],"ix":1,"l":2},"s":{"a":0,"k":[33.543,33.543,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[73.095,-37.857],[31.676,-29.901],[23.329,-36.226],[5.263,-9.538],[8.629,-21.799],[0,-67.098],[-124.943,-78.459],[-106.498,-5.727],[-75.895,14.479],[0,236.16],[291.64,0]],"o":[[0,0],[-31.676,29.901],[-5.812,9.087],[-11.346,20.233],[-23.244,59.011],[0,168.605],[79.545,50.023],[69.931,1.384],[216.734,-50.397],[0,-289.087],[-88.167,0]],"v":[[-244.296,-433.234],[-362.056,-348.258],[-445.488,-250.459],[-462.197,-222.576],[-492.252,-159.389],[-528.2,30.914],[-322.826,407.354],[-39.186,492.517],[153.749,476.446],[528.2,30.914],[0.036,-492.517]],"c":true},"ix":2},"nm":"Trazado 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.949019607843,0.607843137255,0.235294117647,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[540,675],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Grupo 5","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":-215,"op":3057.5,"st":-170,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Cabeza","parent":1,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0],"e":[744]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":43,"s":[744],"e":[710]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":63,"s":[710],"e":[727]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":80,"s":[727],"e":[721]},{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":95,"s":[721],"e":[721]},{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.167],"y":[0]},"t":126,"s":[721],"e":[715]},{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.167],"y":[0]},"t":133,"s":[715],"e":[1080]},{"t":203}],"ix":10},"p":{"a":1,"k":[{"i":{"x":0.466,"y":1},"o":{"x":0.226,"y":0},"t":0,"s":[-1073,-3,0],"e":[22,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.333,"y":0},"t":43,"s":[22,-3,0],"e":[-9,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.333,"y":0},"t":63,"s":[-9,-3,0],"e":[-2,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.667,"y":1},"o":{"x":0.333,"y":0},"t":80,"s":[-2,-3,0],"e":[-4.5,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.667,"y":0.667},"o":{"x":0.333,"y":0.333},"t":95,"s":[-4.5,-3,0],"e":[-4.5,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":1,"y":1},"o":{"x":0.333,"y":0.333},"t":126,"s":[-4.5,-3,0],"e":[-4.5,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.743,"y":1},"o":{"x":0.419,"y":0},"t":133,"s":[-4.5,-3,0],"e":[1073.5,-3,0],"to":[0,0,0],"ti":[0,0,0]},{"t":203}],"ix":2,"l":2},"a":{"a":0,"k":[-317,-3,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":0,"s":[45,48,100],"e":[45,48,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":27,"s":[45,48,100],"e":[45,45,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":43,"s":[45,45,100],"e":[45,45,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":126,"s":[45,45,100],"e":[45,45,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":133,"s":[45,45,100],"e":[45,48,100]},{"t":203}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":3,"ty":"el","s":{"a":0,"k":[342,342],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.949019607843,0.607843137255,0.235294117647,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":1,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-317,-3],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[102.326,94.773],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Elipse 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":171,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"Mov","parent":6,"sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":46,"s":[45],"e":[-22]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":66,"s":[-22],"e":[2]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":83,"s":[2],"e":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.167],"y":[0]},"t":98,"s":[0],"e":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":117,"s":[0],"e":[2]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":124,"s":[2],"e":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":135,"s":[0],"e":[45]},{"t":154}],"ix":10},"p":{"a":0,"k":[-469.25,-59.25,0],"ix":2,"l":2},"a":{"a":0,"k":[-469.25,-132.25,0],"ix":1,"l":2},"s":{"a":0,"k":[55.224,55.224,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[33.5,33.5],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.949019607843,0.607843137255,0.235294117647,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":1,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-469.25,-132.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transformar"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":171,"st":0,"bm":0}],"markers":[]}`
|
|
5605
5605
|
};
|
|
5606
5606
|
|
|
5607
|
-
const dropiAlertModalCss = () => `:host{display:contents}.body-alert{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-3);width:100%;flex:1;overflow:visible;padding-bottom:var(--Size-2)}.lottie-img{width:120px;height:120px;overflow:hidden;flex-shrink:0;align-self:center;margin-top:-8px;margin-bottom:var(--Size-2)}.lottie-img lottie-player{display:block;width:120px;height:120px}.lottie-img--loading{width:100%;height:120px;overflow:hidden;display:flex;align-items:center;justify-content:center}.lottie-img--loading lottie-player{width:300px;height:auto;flex-shrink:0}.content-alert{text-align:center;width:100%;display:flex;flex-direction:column;align-items:center}.content-alert h2{color:var(--Gray-Gray-800);font-size:19px;font-weight:var(--font-weight-semibold);margin:0}.content-alert p{color:var(--Gray-Gray-500);font-size:var(--font-size-s);margin-bottom:var(--Size-2);overflow-wrap:anywhere;max-height:100px;overflow:auto}.custom-content{width:100%;text-align:left;margin-top:var(--Size-2);display:flex;flex-direction:column;gap:var(--Size-3)}.actions{display:flex;gap:var(--Size-3);width:100%}.actions dropi-button{flex:1;display:flex;justify-content:center}@media (max-width: 768px){.actions{flex-direction:column}.actions dropi-button{width:100%}}`;
|
|
5607
|
+
const dropiAlertModalCss = () => `:host{display:contents;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.body-alert{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-3);width:100%;flex:1;overflow:visible;padding-bottom:var(--Size-2)}.lottie-img{width:120px;height:120px;overflow:hidden;flex-shrink:0;align-self:center;margin-top:-8px;margin-bottom:var(--Size-2)}.lottie-img lottie-player{display:block;width:120px;height:120px}.lottie-img--loading{width:100%;height:120px;overflow:hidden;display:flex;align-items:center;justify-content:center}.lottie-img--loading lottie-player{width:300px;height:auto;flex-shrink:0}.content-alert{text-align:center;width:100%;display:flex;flex-direction:column;align-items:center}.content-alert h2{color:var(--Gray-Gray-800);font-size:19px;font-weight:var(--font-weight-semibold);margin:0}.content-alert p{color:var(--Gray-Gray-500);font-size:var(--font-size-s);margin-bottom:var(--Size-2);overflow-wrap:anywhere;max-height:100px;overflow:auto}.custom-content{width:100%;text-align:left;margin-top:var(--Size-2);display:flex;flex-direction:column;gap:var(--Size-3)}.actions{display:flex;gap:var(--Size-3);width:100%}.actions dropi-button{flex:1;display:flex;justify-content:center}@media (max-width: 768px){.actions{flex-direction:column}.actions dropi-button{width:100%}}`;
|
|
5608
5608
|
|
|
5609
5609
|
/**
|
|
5610
5610
|
* @component dropi-alert-modal
|
|
@@ -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: '3ec522c38b68f8c8f945d4b2b3483083029e75f5', visible: this.visible, showHeader: this.closable, showCloseIcon: this.closable, dismissable: false, closeOnEscape: false, showFooter: false, size: "s", onDropiHide: () => this.onModalHide() }, hAsync("div", { key: '09a72cb6f1a85d37d6177da3eabc7d052ea050a8', class: "body-alert" }, lottieSrc && (hAsync("div", { key: '684b18fb8d6f0236ea723ab9f17d947be0e6bfd3', 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: 'edd1768074d30f39c2f19e9a70e498248075b22c', class: "content-alert" }, hAsync("h2", { key: '5f6b281b169385b7ede465dbed71781e8a094832' }, this.loading ? this.loadingTitle : this.tittle), hAsync("p", { key: '79c95d2ceb421a2fca91c85e748d82900f2247b7' }, this.loading ? this.loadingMessage : this.message)), hAsync("div", { key: 'c06a3edb85f996c78debe786e6e1d2fe8924f028', class: "custom-content" }, hAsync("slot", { key: '877c46b2b99e3f1f31a39358e614162cdedb12cb' })), !this.loading && this.displayButtons && (hAsync("div", { key: '268846cf16c755f371b27efc66413f90b8742345', class: "actions" }, this.secondaryButton && hAsync("dropi-button", { key: '026d2871b0e4aa29c4ff16124370348292648d13', text: this.secondaryButton, severity: "secondary", onDropiClick: () => this.handleSecondary(), fullWidth: true }), hAsync("dropi-button", { key: '0f0423ffdb55994363a695603b4f4b2880d494f4', text: this.primaryButton, severity: "primary", onDropiClick: () => this.handlePrimary(), fullWidth: true }))))));
|
|
5729
5729
|
}
|
|
5730
5730
|
static get watchers() { return {
|
|
5731
5731
|
"params": [{
|
|
@@ -5761,7 +5761,7 @@ class DropiAlertModal {
|
|
|
5761
5761
|
}; }
|
|
5762
5762
|
}
|
|
5763
5763
|
|
|
5764
|
-
const dropiAvatarsCss = () => `:host{display:inline-block}.avatar{margin:0;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.avatar--users,.avatar--transport,.avatar--payment{width:35px;height:35px}.avatar--supplier{width:70px;height:70px}.avatar--counter{width:33px;height:33px}.avatar__initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;background-color:var(--Primary-Primary-100, #fde9d0);color:var(--Primary-Primary-600, #d4872e);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);text-transform:uppercase;letter-spacing:0.5px}`;
|
|
5764
|
+
const dropiAvatarsCss = () => `:host{display:inline-block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.avatar{margin:0;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.avatar--users,.avatar--transport,.avatar--payment{width:35px;height:35px}.avatar--supplier{width:70px;height:70px}.avatar--counter{width:33px;height:33px}.avatar__initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;background-color:var(--Primary-Primary-100, #fde9d0);color:var(--Primary-Primary-600, #d4872e);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);text-transform:uppercase;letter-spacing:0.5px}`;
|
|
5765
5765
|
|
|
5766
5766
|
const FALLBACK = `data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PGNpcmNsZSBjeD0iMTgiIGN5PSIxOCIgcj0iMTgiIGZpbGw9IiNlNmVhZjIiLz48Y2lyY2xlIGN4PSIxOCIgY3k9IjE0IiByPSI2IiBmaWxsPSIjODU4ZWE2Ii8+PHBhdGggZD0iTTYgMzJjMC04IDI0LTggMjQgMCIgZmlsbD0iIzg1OGVhNiIvPjwvc3ZnPg==`;
|
|
5767
5767
|
/**
|
|
@@ -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: 'b02b4521a3b0e1cf53b4b936434518a041c751ee', 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 {
|
|
@@ -5804,7 +5804,7 @@ class DropiAvatars {
|
|
|
5804
5804
|
}; }
|
|
5805
5805
|
}
|
|
5806
5806
|
|
|
5807
|
-
const dropiBadgeCss = () => `:host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}.tag-state{border-radius:12px;padding:2px 10px;display:flex;align-items:center;gap:4px}.tag-state svg{width:13px}.tag-state p{font-size:13px;font-weight:var(--font-weight-medium);line-height:20px;margin:0;padding:0}.tag-state.active{background:var(--Success-Success-50, #e7f8f3);color:var(--Success-Success-500, #0abb87)}.tag-state.pending{color:var(--Orange-orange-500, #f49a3d);background:var(--Orange-orange-50, #fef5ec)}.tag-state.canceled,.tag-state.frozen{color:var(--Gray-Gray-500, #69738c);background:var(--Gray-Gray-50, #f7f8fa)}`;
|
|
5807
|
+
const dropiBadgeCss = () => `:host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.tag-state{border-radius:12px;padding:2px 10px;display:flex;align-items:center;gap:4px}.tag-state svg{width:13px}.tag-state p{font-size:13px;font-weight:var(--font-weight-medium);line-height:20px;margin:0;padding:0}.tag-state.active{background:var(--Success-Success-50, #e7f8f3);color:var(--Success-Success-500, #0abb87)}.tag-state.pending{color:var(--Orange-orange-500, #f49a3d);background:var(--Orange-orange-50, #fef5ec)}.tag-state.canceled,.tag-state.frozen{color:var(--Gray-Gray-500, #69738c);background:var(--Gray-Gray-50, #f7f8fa)}`;
|
|
5808
5808
|
|
|
5809
5809
|
/**
|
|
5810
5810
|
* @component dropi-badge
|
|
@@ -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: '1997371df473a02014e7d3f2989dc14dcd1d6b62', class: `tag-state ${this.state}` }, this.renderIcon(), hAsync("p", { key: 'ecdf5584218b05f4b9b2ec3cfc5a846b3d587e36' }, this.stateText[this.state])));
|
|
5839
5839
|
}
|
|
5840
5840
|
static get style() { return dropiBadgeCss(); }
|
|
5841
5841
|
static get cmpMeta() { return {
|
|
@@ -5850,7 +5850,7 @@ class DropiBadge {
|
|
|
5850
5850
|
}; }
|
|
5851
5851
|
}
|
|
5852
5852
|
|
|
5853
|
-
const dropiBadgeLegacyCss = () => `:host{display:inline-block}.badge-legacy{display:flex;align-items:center;justify-content:center;padding:2px 6px;border-radius:10px;font-size:11px;font-weight:600}.badge-legacy--primary{background:var(--Primary-Primary-50);color:var(--Primary-Primary-500)}.badge-legacy--secondary{background:var(--Gray-Gray-100);color:var(--Gray-Gray-600)}.badge-legacy--tertiary{background:var(--Success-Success-50);color:var(--Success-Success-500)}`;
|
|
5853
|
+
const dropiBadgeLegacyCss = () => `:host{display:inline-block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.badge-legacy{display:flex;align-items:center;justify-content:center;padding:2px 6px;border-radius:10px;font-size:11px;font-weight:600}.badge-legacy--primary{background:var(--Primary-Primary-50);color:var(--Primary-Primary-500)}.badge-legacy--secondary{background:var(--Gray-Gray-100);color:var(--Gray-Gray-600)}.badge-legacy--tertiary{background:var(--Success-Success-50);color:var(--Success-Success-500)}`;
|
|
5854
5854
|
|
|
5855
5855
|
/**
|
|
5856
5856
|
* @component dropi-badge-legacy
|
|
@@ -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: '0385e946a75b70b5417c0d220c1fd8f4e1ee8d6f', class: {
|
|
5874
5874
|
'badge-legacy': true,
|
|
5875
5875
|
[`badge-legacy--${this.variant}`]: true,
|
|
5876
5876
|
[`badge-legacy--${this.type}`]: true
|
|
@@ -5892,7 +5892,7 @@ class DropiBadgeLegacy {
|
|
|
5892
5892
|
}; }
|
|
5893
5893
|
}
|
|
5894
5894
|
|
|
5895
|
-
const dropiBannerExternalCss = () => `:host{display:block;width:100
|
|
5895
|
+
const dropiBannerExternalCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.dropi-banner-external{display:block;width:100%;position:relative;margin-bottom:16px;border-radius:var(--Border-2, 8px)}.dropi-banner-external a{display:block;text-decoration:none}.click-wrapper{cursor:pointer}.inner{position:relative;display:block}.inner img{display:block;width:100%;height:auto;border-radius:var(--Border-2, 8px);max-width:1220px;margin:auto}.close-btn{position:absolute;top:4px;right:4px;background:rgba(255, 255, 255, 0.8);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:background 0.15s ease}.close-btn:hover{background:rgba(255, 255, 255, 1)}`;
|
|
5896
5896
|
|
|
5897
5897
|
/**
|
|
5898
5898
|
* @component dropi-banner-external
|
|
@@ -5978,7 +5978,7 @@ class DropiBannerExternal {
|
|
|
5978
5978
|
}; }
|
|
5979
5979
|
}
|
|
5980
5980
|
|
|
5981
|
-
const dropiBreadcrumbCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.breadcrumb{margin:0}.crumb-list{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.crumb-home{display:flex;padding-right:4px;align-items:center;gap:4px}.home-link{display:inline-flex;align-items:center;color:var(--Gray-Gray-500, #69738c);text-decoration:none;transition:color 0.2s ease}.home-link:hover{color:var(--Gray-Gray-700, #32394d)}.crumb{display:flex;padding:0 4px;align-items:center;gap:8px}.crumb-link{color:var(--Gray-Gray-500, #69738c);text-align:center;cursor:pointer;text-decoration:none;transition:color 0.2s ease;font-size:var(--font-size-s, 12px)}.crumb-link:hover{color:var(--Gray-Gray-700, #32394d);text-decoration:underline}.crumb-link.disabled{pointer-events:none;color:var(--Gray-Gray-300, #a1a8b8);cursor:not-allowed;text-decoration:none}.current{color:var(--Gray-Gray-700, #32394d);cursor:default;font-size:var(--font-size-s, 12px)}`;
|
|
5981
|
+
const dropiBreadcrumbCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.breadcrumb{margin:0}.crumb-list{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.crumb-home{display:flex;padding-right:4px;align-items:center;gap:4px}.home-link{display:inline-flex;align-items:center;color:var(--Gray-Gray-500, #69738c);text-decoration:none;transition:color 0.2s ease}.home-link:hover{color:var(--Gray-Gray-700, #32394d)}.crumb{display:flex;padding:0 4px;align-items:center;gap:8px}.crumb-link{color:var(--Gray-Gray-500, #69738c);text-align:center;cursor:pointer;text-decoration:none;transition:color 0.2s ease;font-size:var(--font-size-s, 12px)}.crumb-link:hover{color:var(--Gray-Gray-700, #32394d);text-decoration:underline}.crumb-link.disabled{pointer-events:none;color:var(--Gray-Gray-300, #a1a8b8);cursor:not-allowed;text-decoration:none}.current{color:var(--Gray-Gray-700, #32394d);cursor:default;font-size:var(--font-size-s, 12px)}`;
|
|
5982
5982
|
|
|
5983
5983
|
/**
|
|
5984
5984
|
* @component dropi-breadcrumb
|
|
@@ -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: '7e83c4f056971f8e16e2daf7d04e6a59b6755bba', class: "breadcrumb", "aria-label": "Breadcrumb" }, hAsync("div", { key: 'a9bd9428935da4fc49235fdbd068f4e8d402b9e9', class: "crumb-list" }, hAsync("div", { key: '85fd0ed077fbc6819b7cda28c7241f4dc69c554c', class: "crumb-home" }, hAsync("a", { key: '6b4ccdbb336077e0642b11f0c17950caa76804b6', href: this.homeRoute, class: "home-link", "aria-label": "Inicio", onClick: (e) => { e.preventDefault(); this.dropiNavigate.emit(this.homeRoute); } }, hAsync("dropi-icon", { key: '78325ca71257433a3d60b828a06622245067f961', name: this.homeIconName, iconWidth: "16px", color: "Gray-Gray-500" })), items.length > 0 && (hAsync("dropi-icon", { key: '67af7cc3f0ff0b3bf0e7e647332084791bedaeae', 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) => {
|
|
@@ -6043,7 +6043,7 @@ class DropiBreadcrumb {
|
|
|
6043
6043
|
}; }
|
|
6044
6044
|
}
|
|
6045
6045
|
|
|
6046
|
-
const dropiButtonCss = () => `:host{display:inline-block;border:0}:host([full-width]){display:flex;width:100%}:host([full-width]) .btn{width:100%}*,*::before,*::after{box-sizing:border-box}.btn{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);border-radius:var(--Border-2, 8px);font-weight:var(--font-weight-bold);min-width:33px;line-height:110%;cursor:pointer;white-space:nowrap;transition:background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease}.btn:active{transition:transform 0.01s ease-out;transform:scale(0.98)}.btn:hover:not(:active){transform:scale(1.01)}.btn.without-text{gap:0}.btn.large{padding:var(--Size-4, 16px);font-size:var(--Size-4, 16px);height:48px}.btn.normal{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);height:40px}.btn.small{padding:var(--Size-2, 8px);font-size:var(--font-size-s, 12px);height:29px}.btn.disabled,.btn.loading{cursor:not-allowed;pointer-events:none}.btn.primary.default{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff)}.btn.primary.default:hover{background:var(--Primary-Primary-600, #e58017)}.btn.primary.success{background:var(--Success-Success-500, #0abb87);color:var(--Neutral-White, #ffffff)}.btn.primary.success:hover{background:var(--Success-Success-600, #09aa7b)}.btn.primary.info{background:var(--Info-Info-500, #50a5f1);color:var(--Neutral-White, #ffffff)}.btn.primary.info:hover{background:var(--Info-Info-600, #4996db)}.btn.primary.error{background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #ffffff)}.btn.primary.error:hover{background:var(--Error-Error-600, #de6061)}.btn.primary.warning{background:var(--Warning-Warning-500, #f1b44c);color:var(--Neutral-White, #ffffff)}.btn.primary.warning:hover{background:var(--Warning-Warning-600, #dba445)}.btn.primary.legacy{background:var(--Secondary-Secondary-500, #008dbf);color:var(--Neutral-White, #ffffff)}.btn.primary.legacy:hover{background:var(--Secondary-Secondary-600, #007199)}.btn.primary.disabled.default{background:var(--Primary-Primary-300, #f2bc85);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.success{background:var(--Success-Success-300, #5bd1af);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.info{background:var(--Info-Info-300, #8ac3f6);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.error{background:var(--Error-Error-300, #f89b9c);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.warning{background:var(--Warning-Warning-300, #f6cd87);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.legacy{background:var(--Secondary-Secondary-300, #62bad9);color:var(--Neutral-White, #ffffff)}.btn.secondary{background:var(--Neutral-White, #ffffff);border:1px solid}.btn.secondary.default{border-color:var(--Primary-Primary-500, #f49a3d);color:var(--Primary-Primary-500, #f49a3d)}.btn.secondary.default:hover{color:var(--Primary-Primary-600, #e58017);border-color:var(--Primary-Primary-600, #e58017)}.btn.secondary.success{border-color:var(--Success-Success-500, #0abb87);color:var(--Success-Success-500, #0abb87)}.btn.secondary.success:hover{color:var(--Success-Success-600, #09aa7b);border-color:var(--Success-Success-600, #09aa7b)}.btn.secondary.info{border-color:var(--Info-Info-500, #50a5f1);color:var(--Info-Info-500, #50a5f1)}.btn.secondary.info:hover{color:var(--Info-Info-600, #4996db);border-color:var(--Info-Info-600, #4996db)}.btn.secondary.error{border-color:var(--Error-Error-500, #f46a6b);color:var(--Error-Error-500, #f46a6b)}.btn.secondary.error:hover{color:var(--Error-Error-600, #de6061);border-color:var(--Error-Error-600, #de6061)}.btn.secondary.warning{border-color:var(--Warning-Warning-500, #f1b44c);color:var(--Warning-Warning-500, #f1b44c)}.btn.secondary.warning:hover{color:var(--Warning-Warning-600, #dba445);border-color:var(--Warning-Warning-600, #dba445)}.btn.secondary.legacy{border-color:var(--Secondary-Secondary-500, #008dbf);color:var(--Secondary-Secondary-500, #008dbf)}.btn.secondary.legacy:hover{color:var(--Secondary-Secondary-600, #007199);border-color:var(--Secondary-Secondary-600, #007199)}.btn.secondary.disabled.default{border-color:var(--Primary-Primary-300, #f2bc85);color:var(--Primary-Primary-300, #f2bc85)}.btn.secondary.disabled.success{border-color:var(--Success-Success-300, #5bd1af);color:var(--Success-Success-300, #5bd1af)}.btn.secondary.disabled.info{border-color:var(--Info-Info-300, #8ac3f6);color:var(--Info-Info-300, #8ac3f6)}.btn.secondary.disabled.error{border-color:var(--Error-Error-300, #f89b9c);color:var(--Error-Error-300, #f89b9c)}.btn.secondary.disabled.warning{border-color:var(--Warning-Warning-300, #f6cd87);color:var(--Warning-Warning-300, #f6cd87)}.btn.secondary.disabled.legacy{border-color:var(--Secondary-Secondary-300, #62bad9);color:var(--Secondary-Secondary-300, #62bad9)}.btn.tertiary{background:none;border:none}.btn.tertiary.default,.btn.tertiary.legacy{border:none !important;box-shadow:none !important;color:var(--Gray-Gray-500, #69738c)}.btn.tertiary.default:hover,.btn.tertiary.legacy:hover{background:var(--Gray-Gray-50, #f5f6f8);box-shadow:none !important;color:var(--Gray-Gray-600, #475066)}.btn.tertiary.success{color:var(--Success-Success-500, #0abb87)}.btn.tertiary.success:hover{background:var(--Success-Success-50, #e7f8f3)}.btn.tertiary.info{color:var(--Info-Info-500, #50a5f1)}.btn.tertiary.info:hover{background:var(--Info-Info-50, #eef6fe)}.btn.tertiary.error{color:var(--Error-Error-500, #f46a6b)}.btn.tertiary.error:hover{background:var(--Error-Error-50, #fef0f0)}.btn.tertiary.warning{color:var(--Warning-Warning-500, #f1b44c)}.btn.tertiary.warning:hover{background:var(--Warning-Warning-50, #fef8ed)}.btn.tertiary.dropdown{color:var(--Gray-Gray-500, #69738c);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);background:transparent}.btn.tertiary.disabled.default,.btn.tertiary.disabled.legacy{border:none !important;color:var(--Gray-Gray-400, #858ea6)}.btn.tertiary.disabled.success{color:var(--Success-Success-300, #5bd1af)}.btn.tertiary.disabled.info{color:var(--Info-Info-300, #8ac3f6)}.btn.tertiary.disabled.error{color:var(--Error-Error-300, #f89b9c)}.btn.tertiary.disabled.warning{color:var(--Warning-Warning-300, #f6cd87)}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
|
|
6046
|
+
const dropiButtonCss = () => `:host{display:inline-block;border:0}:host([full-width]){display:flex;width:100%}:host([full-width]) .btn{width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.btn{all:unset;font-family:var(--font-family-01, 'Inter', sans-serif);box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);border-radius:var(--Border-2, 8px);font-weight:var(--font-weight-bold);min-width:33px;line-height:110%;cursor:pointer;white-space:nowrap;transition:background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease}.btn:active{transition:transform 0.01s ease-out;transform:scale(0.98)}.btn:hover:not(:active){transform:scale(1.01)}.btn.without-text{gap:0}.btn.large{padding:var(--Size-4, 16px);font-size:var(--Size-4, 16px);height:48px}.btn.normal{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);height:40px}.btn.small{padding:var(--Size-2, 8px);font-size:var(--font-size-s, 12px);height:29px}.btn.disabled,.btn.loading{cursor:not-allowed;pointer-events:none}.btn.primary.default{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff)}.btn.primary.default:hover{background:var(--Primary-Primary-600, #e58017)}.btn.primary.success{background:var(--Success-Success-500, #0abb87);color:var(--Neutral-White, #ffffff)}.btn.primary.success:hover{background:var(--Success-Success-600, #09aa7b)}.btn.primary.info{background:var(--Info-Info-500, #50a5f1);color:var(--Neutral-White, #ffffff)}.btn.primary.info:hover{background:var(--Info-Info-600, #4996db)}.btn.primary.error{background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #ffffff)}.btn.primary.error:hover{background:var(--Error-Error-600, #de6061)}.btn.primary.warning{background:var(--Warning-Warning-500, #f1b44c);color:var(--Neutral-White, #ffffff)}.btn.primary.warning:hover{background:var(--Warning-Warning-600, #dba445)}.btn.primary.legacy{background:var(--Secondary-Secondary-500, #008dbf);color:var(--Neutral-White, #ffffff)}.btn.primary.legacy:hover{background:var(--Secondary-Secondary-600, #007199)}.btn.primary.disabled.default{background:var(--Primary-Primary-300, #f2bc85);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.success{background:var(--Success-Success-300, #5bd1af);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.info{background:var(--Info-Info-300, #8ac3f6);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.error{background:var(--Error-Error-300, #f89b9c);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.warning{background:var(--Warning-Warning-300, #f6cd87);color:var(--Neutral-White, #ffffff)}.btn.primary.disabled.legacy{background:var(--Secondary-Secondary-300, #62bad9);color:var(--Neutral-White, #ffffff)}.btn.secondary{background:var(--Neutral-White, #ffffff);border:1px solid}.btn.secondary.default{border-color:var(--Primary-Primary-500, #f49a3d);color:var(--Primary-Primary-500, #f49a3d)}.btn.secondary.default:hover{color:var(--Primary-Primary-600, #e58017);border-color:var(--Primary-Primary-600, #e58017)}.btn.secondary.success{border-color:var(--Success-Success-500, #0abb87);color:var(--Success-Success-500, #0abb87)}.btn.secondary.success:hover{color:var(--Success-Success-600, #09aa7b);border-color:var(--Success-Success-600, #09aa7b)}.btn.secondary.info{border-color:var(--Info-Info-500, #50a5f1);color:var(--Info-Info-500, #50a5f1)}.btn.secondary.info:hover{color:var(--Info-Info-600, #4996db);border-color:var(--Info-Info-600, #4996db)}.btn.secondary.error{border-color:var(--Error-Error-500, #f46a6b);color:var(--Error-Error-500, #f46a6b)}.btn.secondary.error:hover{color:var(--Error-Error-600, #de6061);border-color:var(--Error-Error-600, #de6061)}.btn.secondary.warning{border-color:var(--Warning-Warning-500, #f1b44c);color:var(--Warning-Warning-500, #f1b44c)}.btn.secondary.warning:hover{color:var(--Warning-Warning-600, #dba445);border-color:var(--Warning-Warning-600, #dba445)}.btn.secondary.legacy{border-color:var(--Secondary-Secondary-500, #008dbf);color:var(--Secondary-Secondary-500, #008dbf)}.btn.secondary.legacy:hover{color:var(--Secondary-Secondary-600, #007199);border-color:var(--Secondary-Secondary-600, #007199)}.btn.secondary.disabled.default{border-color:var(--Primary-Primary-300, #f2bc85);color:var(--Primary-Primary-300, #f2bc85)}.btn.secondary.disabled.success{border-color:var(--Success-Success-300, #5bd1af);color:var(--Success-Success-300, #5bd1af)}.btn.secondary.disabled.info{border-color:var(--Info-Info-300, #8ac3f6);color:var(--Info-Info-300, #8ac3f6)}.btn.secondary.disabled.error{border-color:var(--Error-Error-300, #f89b9c);color:var(--Error-Error-300, #f89b9c)}.btn.secondary.disabled.warning{border-color:var(--Warning-Warning-300, #f6cd87);color:var(--Warning-Warning-300, #f6cd87)}.btn.secondary.disabled.legacy{border-color:var(--Secondary-Secondary-300, #62bad9);color:var(--Secondary-Secondary-300, #62bad9)}.btn.tertiary{background:none;border:none}.btn.tertiary.default,.btn.tertiary.legacy{border:none !important;box-shadow:none !important;color:var(--Gray-Gray-500, #69738c)}.btn.tertiary.default:hover,.btn.tertiary.legacy:hover{background:var(--Gray-Gray-50, #f5f6f8);box-shadow:none !important;color:var(--Gray-Gray-600, #475066)}.btn.tertiary.success{color:var(--Success-Success-500, #0abb87)}.btn.tertiary.success:hover{background:var(--Success-Success-50, #e7f8f3)}.btn.tertiary.info{color:var(--Info-Info-500, #50a5f1)}.btn.tertiary.info:hover{background:var(--Info-Info-50, #eef6fe)}.btn.tertiary.error{color:var(--Error-Error-500, #f46a6b)}.btn.tertiary.error:hover{background:var(--Error-Error-50, #fef0f0)}.btn.tertiary.warning{color:var(--Warning-Warning-500, #f1b44c)}.btn.tertiary.warning:hover{background:var(--Warning-Warning-50, #fef8ed)}.btn.tertiary.dropdown{color:var(--Gray-Gray-500, #69738c);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);background:transparent}.btn.tertiary.disabled.default,.btn.tertiary.disabled.legacy{border:none !important;color:var(--Gray-Gray-400, #858ea6)}.btn.tertiary.disabled.success{color:var(--Success-Success-300, #5bd1af)}.btn.tertiary.disabled.info{color:var(--Info-Info-300, #8ac3f6)}.btn.tertiary.disabled.error{color:var(--Error-Error-300, #f89b9c)}.btn.tertiary.disabled.warning{color:var(--Warning-Warning-300, #f6cd87)}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
|
|
6047
6047
|
|
|
6048
6048
|
/**
|
|
6049
6049
|
* @component dropi-button
|
|
@@ -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: '7bf781bc530f7370e550996359ff50dc7d8b300c', 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: '73cc799d7961e45abad88183a1d9240fbb46a741', name: this.preIcon, iconWidth: this.iconSize, iconHeight: this.iconSize, color: this.fontColor })), hasText && hAsync("span", { key: '469f4fc187b52836ea7bfe35b2e68074812a3841', class: "text" }, this.text), showPostIcon && (hAsync("dropi-icon", { key: '16ed0f58aa5b8d40f2a7b64dbb74ed9d6e0bf0e5', name: dropdownIcon, iconWidth: this.iconSize, iconHeight: this.iconSize, color: this.fontColor })), this.state === 'loading' && this.renderLoadingSpinner(), hAsync("slot", { key: '1842cf726b9b9e64fe1ae18951375dd98c5afbb4' })));
|
|
6145
6145
|
}
|
|
6146
6146
|
static get formAssociated() { return true; }
|
|
6147
6147
|
static get style() { return dropiButtonCss(); }
|
|
@@ -6166,7 +6166,7 @@ class DropiButton {
|
|
|
6166
6166
|
}; }
|
|
6167
6167
|
}
|
|
6168
6168
|
|
|
6169
|
-
const dropiCardCheckboxCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.container-card-check{padding:var(--Size-4, 16px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Size-2, 8px);width:100%;display:flex;align-items:center;gap:var(--Size-3, 12px);cursor:pointer;height:66px;overflow:hidden;transition:background 0.15s ease, border-color 0.15s ease}.container-card-check.disabled{border-radius:var(--Border-2, 8px);border:1px solid var(--Gray-Gray-100, #e6eaf2);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:default}.container-card-check.disabled .title-check,.container-card-check.disabled .description-text,.container-card-check.disabled .extra-info{color:var(--Gray-Gray-400, #858ea6)}.container-text{width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:start;overflow:hidden}.title-check{color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-m, 14px);font-weight:var(--font-weight-regular, 400);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.description-text{color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);margin-top:var(--Size-1, 4px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.extra-info{display:flex;justify-content:space-between;align-items:center;flex-direction:column;gap:4px;flex-shrink:0;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066)}.extra-info h4{margin:0;font-weight:var(--font-weight-semibold);color:inherit;line-height:inherit}.default-card{border:none}.is-checked{background:var(--Primary-Primary-50, #fff8f0);border:1px solid var(--Primary-Primary-500, #f49a3d)}`;
|
|
6169
|
+
const dropiCardCheckboxCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.container-card-check{padding:var(--Size-4, 16px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Size-2, 8px);width:100%;display:flex;align-items:center;gap:var(--Size-3, 12px);cursor:pointer;height:66px;overflow:hidden;transition:background 0.15s ease, border-color 0.15s ease}.container-card-check.disabled{border-radius:var(--Border-2, 8px);border:1px solid var(--Gray-Gray-100, #e6eaf2);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:default}.container-card-check.disabled .title-check,.container-card-check.disabled .description-text,.container-card-check.disabled .extra-info{color:var(--Gray-Gray-400, #858ea6)}.container-text{width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:start;overflow:hidden}.title-check{color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-m, 14px);font-weight:var(--font-weight-regular, 400);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.description-text{color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);margin-top:var(--Size-1, 4px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.extra-info{display:flex;justify-content:space-between;align-items:center;flex-direction:column;gap:4px;flex-shrink:0;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066)}.extra-info h4{margin:0;font-weight:var(--font-weight-semibold);color:inherit;line-height:inherit}.default-card{border:none}.is-checked{background:var(--Primary-Primary-50, #fff8f0);border:1px solid var(--Primary-Primary-500, #f49a3d)}`;
|
|
6170
6170
|
|
|
6171
6171
|
/**
|
|
6172
6172
|
* @component dropi-card-checkbox
|
|
@@ -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: '1094a5c825a573d5afad0e6a1f37383ab04432e4', 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: 'cedad80fcc9a1012ee9baea7ed1f86e6312e91a9', name: "_card-checkbox", checked: this.isChecked, disabled: this.disabled }), hAsync("div", { key: '3c2f7526cd15fd1f074ebaac932d43cf41dcca5f', class: "container-text" }, hAsync("div", { key: '0b13cc456daba3e2e1b26ffd9cc45a34a8f9dbdb', class: "title-check" }, this.title), this.description && hAsync("div", { key: 'd2c934074ea3c1068de01ab5ca0204f019ed739c', class: "description-text" }, this.description)), (this.extraInfo || this.extraInfoDescription) && (hAsync("div", { key: 'c260e65c9325095abc54ac46b5e90eb88aaeaa78', class: "extra-info" }, this.extraInfo && hAsync("div", { key: '9aa3bd72190d18f82b3ba15e82599038e653ca32' }, this.extraInfo), this.extraInfoDescription && hAsync("h4", { key: 'bbb8da2241faf41805a1c6621e5cc9939251cf28' }, this.extraInfoDescription)))));
|
|
6220
6220
|
}
|
|
6221
6221
|
static get style() { return dropiCardCheckboxCss(); }
|
|
6222
6222
|
static get cmpMeta() { return {
|
|
@@ -6237,7 +6237,7 @@ class DropiCardCheckbox {
|
|
|
6237
6237
|
}; }
|
|
6238
6238
|
}
|
|
6239
6239
|
|
|
6240
|
-
const dropiCardProductCss = () => `:host{display:block;font-family:'Inter', sans-serif}*,*::before,*::after{box-sizing:border-box}.dropi-card-product{position:relative;background:#ffffff;border-radius:8px;overflow:hidden;transition:all 0.2s ease-in-out;cursor:pointer;display:flex;flex-direction:column;height:100%;box-sizing:border-box;width:100%;max-width:450px;box-shadow:none}.product-image-container{padding:4px;flex-shrink:0}.product-image{position:relative;width:100%;aspect-ratio:1;border-radius:8px;border:1px solid #c3c9d9;overflow:hidden;display:flex;align-items:center;justify-content:center;background-color:#f8f9fa}.product-image img{width:100%;height:100%;object-fit:cover;border-radius:8px}.product-image img.error-img{object-fit:contain}.favorite-button{position:absolute;bottom:5px;right:6px;border-radius:8px;padding:12px;cursor:pointer;transition:all 0.2s ease-in-out;z-index:2;display:flex;align-items:center;justify-content:center;width:42px;height:40px;background:#ffffff;border:1px solid #858ea6}.favorite-button.favorite-active{background:var(--Primary-Primary-500, #f49a3d);border:1px solid var(--Primary-Primary-500, #f49a3d)}.product-info{position:relative;padding:8px;display:flex;flex-direction:column;gap:4px;flex:1;justify-content:space-between}.supplier-insignia{position:absolute;top:-24px;left:0px}.product-header{display:flex;justify-content:space-between;align-items:center;width:100%;height:26px}.category{color:#69738c;font-family:'Inter', sans-serif;font-size:12px;font-weight:400;line-height:1.5;flex:1}.stock-info{display:flex;align-items:center;gap:2px;font-family:'Inter', sans-serif;font-size:12px;font-weight:400;line-height:1.5}.stock-label{color:#69738c}.stock-value{font-weight:500}.product-name{color:#32394d;font-family:'Inter', sans-serif;font-size:16px;font-weight:500;line-height:1.5;margin:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.supplier-info{font-family:'Inter', sans-serif;font-size:12px;line-height:1.2}.supplier-label{color:#69738c;font-weight:400}.supplier-name{color:#50a5f1;font-weight:400;margin-left:4px;cursor:pointer}.price-container{display:flex;gap:8px;margin-top:4px}.price-item{flex:1;display:flex;flex-direction:column}.price-label{color:#69738c;font-family:'Inter', sans-serif;font-size:12px;font-weight:400;line-height:1.5;height:18px;min-width:max-content}.price-value{color:#32394d;font-family:'Inter', sans-serif;font-size:14px;font-weight:700;line-height:1.1;margin-top:2px}.separator{height:1px;background:#e6eaf2;margin:0;flex-shrink:0}.action-button{background:#ffffff;border:none;border-top:1px solid #e6eaf2;padding:12px;cursor:pointer;transition:all 0.2s ease-in-out;display:flex;align-items:center;justify-content:center;gap:8px;height:40px;flex-shrink:0}.action-button--disabled{opacity:0.3;cursor:not-allowed}.button-text{font-family:'Inter', sans-serif;font-size:14px;font-weight:700;line-height:1.1;color:#f49a3d;text-align:center;white-space:nowrap}`;
|
|
6240
|
+
const dropiCardProductCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.dropi-card-product{position:relative;background:#ffffff;border-radius:8px;overflow:hidden;transition:all 0.2s ease-in-out;cursor:pointer;display:flex;flex-direction:column;height:100%;box-sizing:border-box;width:100%;max-width:450px;box-shadow:none}.product-image-container{padding:4px;flex-shrink:0}.product-image{position:relative;width:100%;aspect-ratio:1;border-radius:8px;border:1px solid #c3c9d9;overflow:hidden;display:flex;align-items:center;justify-content:center;background-color:#f8f9fa}.product-image img{width:100%;height:100%;object-fit:cover;border-radius:8px}.product-image img.error-img{object-fit:contain}.favorite-button{position:absolute;bottom:5px;right:6px;border-radius:8px;padding:12px;cursor:pointer;transition:all 0.2s ease-in-out;z-index:2;display:flex;align-items:center;justify-content:center;width:42px;height:40px;background:#ffffff;border:1px solid #858ea6}.favorite-button.favorite-active{background:var(--Primary-Primary-500, #f49a3d);border:1px solid var(--Primary-Primary-500, #f49a3d)}.product-info{position:relative;padding:8px;display:flex;flex-direction:column;gap:4px;flex:1;justify-content:space-between}.supplier-insignia{position:absolute;top:-24px;left:0px}.product-header{display:flex;justify-content:space-between;align-items:center;width:100%;height:26px}.category{color:#69738c;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;font-weight:400;line-height:1.5;flex:1}.stock-info{display:flex;align-items:center;gap:2px;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;font-weight:400;line-height:1.5}.stock-label{color:#69738c}.stock-value{font-weight:500}.product-name{color:#32394d;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:16px;font-weight:500;line-height:1.5;margin:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.supplier-info{font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;line-height:1.2}.supplier-label{color:#69738c;font-weight:400}.supplier-name{color:#50a5f1;font-weight:400;margin-left:4px;cursor:pointer}.price-container{display:flex;gap:8px;margin-top:4px}.price-item{flex:1;display:flex;flex-direction:column}.price-label{color:#69738c;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:12px;font-weight:400;line-height:1.5;height:18px;min-width:max-content}.price-value{color:#32394d;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:14px;font-weight:700;line-height:1.1;margin-top:2px}.separator{height:1px;background:#e6eaf2;margin:0;flex-shrink:0}.action-button{background:#ffffff;border:none;border-top:1px solid #e6eaf2;padding:12px;cursor:pointer;transition:all 0.2s ease-in-out;display:flex;align-items:center;justify-content:center;gap:8px;height:40px;flex-shrink:0}.action-button--disabled{opacity:0.3;cursor:not-allowed}.button-text{font-family:var(--font-family-01, 'Inter', sans-serif);font-size:14px;font-weight:700;line-height:1.1;color:#f49a3d;text-align:center;white-space:nowrap}`;
|
|
6241
6241
|
|
|
6242
6242
|
/**
|
|
6243
6243
|
* @component dropi-card-product
|
|
@@ -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: '4cde39eac4d19dc5c05123f0ada102ae9d7a4e0a', class: "dropi-card-product", onClick: () => this.dropiProductClick.emit() }, hAsync("div", { key: '23a94279b1c1d083bd478a61051e1e3dc992273c', class: "product-image-container" }, hAsync("div", { key: '2c2a26632ad0e318933258ceabca932d2a892533', class: "product-image" }, hAsync("img", { key: '0d86b32d61a7eeb63d7b1a0fa3f3ba18eade3cd3', 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: 'c3cb96813a56f924ffadc8f0665af4b9a068db85', 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: '3d5e182189a8d1dfcf8fb4bb1fb16ff9470a180c', name: this.isFavorite ? 'Heart-solid' : 'Heart', iconWidth: "18px", iconHeight: "18px", color: this.isFavorite ? '#fff' : '#858ea6' }))))), hAsync("div", { key: 'ec75da0e4f638c265ea4e07fab1177e5cfa8d167', class: "product-info" }, this.supplierCategory && (hAsync("dropi-ilustration-icon", { key: '4613849b8bc6e7b719c705fb90c2a5da0fb76b41', class: "supplier-insignia", type: "insignia", stateInsignia: this.supplierCategory, tagProduct: true })), hAsync("div", { key: '31dcc84a4add42a667f3f33d973f65db89503a2b', class: "product-header" }, this.category && (hAsync("span", { key: 'f27b3aec9a1380b4ff473cd9df0cffcadd87a7c1', class: "category" }, this.category)), hAsync("div", { key: 'a55285c407ad8dfcf8acceaf57bf9478c8dc1c30', class: "stock-info" }, hAsync("span", { key: 'b08d87a0264dfa2a96662243a07088768955b918', class: "stock-label" }, "Stock:"), hAsync("span", { key: '593bc922e3421e0102288668a0416bd8705de3f3', class: "stock-value", style: { color: this.getStockColor() } }, this.stock === 0 ? 'Agotado' : this.stock))), hAsync("h3", { key: '54c314d2e97ae8b29bd48a17152128fb903f6174', class: "product-name" }, this.productName), this.supplier && (hAsync("div", { key: 'ebbc569613abe847cb1969b0ed17228df6d96aef', class: "supplier-info" }, hAsync("span", { key: 'e107f295a701551961d6fe7c45e39cae99ef1be0', class: "supplier-label" }, "Proveedor:"), hAsync("span", { key: '01a51cd79cafaeae7ce8f2541bd03e3806f645c8', class: "supplier-name", onClick: (e) => { e.stopPropagation(); this.dropiSupplierClick.emit(); } }, this.supplier))), hAsync("div", { key: '20b59588bf442abcdda3a33a4f1bf8a4f6b2a6e6', class: "price-container" }, hAsync("div", { key: 'adb88e81332eaef3826bc04ac0d4de8461368877', class: "price-item" }, hAsync("span", { key: 'dfeb4ad9eb8fa6c7c922437017949ba639cc0a37', class: "price-label" }, "Precio proveedor"), hAsync("span", { key: 'c75bdc0f488c0ef455615781c77f344abc51208f', class: "price-value" }, this.currency, " ", this.formatPrice(this.salePrice))), hAsync("div", { key: '7994889f9be9f2a3e078f727fed72e3183cd8acc', class: "price-item" }, hAsync("span", { key: 'cc4767b3c85c7f37e890297c51029da592a99770', class: "price-label" }, "Precio sugerido"), hAsync("span", { key: 'bc45584e6017eb23cd30e394ced1778c3d3b8957', class: "price-value" }, this.currency, " ", this.formatPrice(this.suggestedPrice))))), hAsync("div", { key: '446dca22f4fd6db15bd3cc5296e8d7910c16674f', class: "separator" }), this.showAddButton && (hAsync("div", { key: 'a030ce62999b2440f63129941c967eb5c3ee169b', 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: '67d1f1629f83008b11103f6a76b744c71935ca23', name: "Shopping-cart-arrow-rigth", iconWidth: "20px", iconHeight: "20px", color: "#f49a3d" }), hAsync("span", { key: '477ace88e7984066888841c9158100fbd8fbe078', class: "button-text" }, "Enviar a cliente")))));
|
|
6313
6313
|
}
|
|
6314
6314
|
static get style() { return dropiCardProductCss(); }
|
|
6315
6315
|
static get cmpMeta() { return {
|
|
@@ -6335,7 +6335,7 @@ class DropiCardProduct {
|
|
|
6335
6335
|
}; }
|
|
6336
6336
|
}
|
|
6337
6337
|
|
|
6338
|
-
const dropiCardSectionCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.card-section{display:flex;align-items:center;justify-content:space-between;gap:var(--Size-4, 16px);padding:var(--Size-3, 12px) var(--Size-4, 16px);background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-100, #e6eaf2);border-radius:var(--Border-2, 8px)}.card-section__text{flex:1}.card-section__title{margin:0 0 4px;font-family:
|
|
6338
|
+
const dropiCardSectionCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.card-section{display:flex;align-items:center;justify-content:space-between;gap:var(--Size-4, 16px);padding:var(--Size-3, 12px) var(--Size-4, 16px);background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-100, #e6eaf2);border-radius:var(--Border-2, 8px)}.card-section__text{flex:1}.card-section__title{margin:0 0 4px;font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-800, #1f2433)}h5.card-section__title{font-size:var(--font-size-m, 14px)}h6.card-section__title{font-size:var(--font-size-s, 12px)}.card-section__desc{margin:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}.card-section__control{flex-shrink:0}.card-section__dropdown-btn{display:flex;align-items:center;background:none;border:none;padding:0;cursor:pointer}`;
|
|
6339
6339
|
|
|
6340
6340
|
/**
|
|
6341
6341
|
* @component dropi-card-section
|
|
@@ -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: 'f843d5104a344402775c8afc165f10d178d2d5bf', class: "card-section" }, hAsync("div", { key: '0b7476a359efc4619362a958a4a06300d1162d96', 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: '200ca69a23c9dd7ccbeaa8dc44d313fb1befa32f', class: "card-section__desc" }, this.description)), hAsync("div", { key: 'a984b49a2fec8c527ceba4873a476dbd7ae1b20f', 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" }))))));
|
|
@@ -6386,7 +6386,7 @@ class DropiCardSection {
|
|
|
6386
6386
|
}; }
|
|
6387
6387
|
}
|
|
6388
6388
|
|
|
6389
|
-
const dropiCarouselCss = () => `:host{display:block;width:100
|
|
6389
|
+
const dropiCarouselCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.dropi-carousel-container{display:flex;flex-direction:column;position:relative;width:100%;max-width:100%;overflow:hidden;padding:0 var(--Size-4)}.dropi-carousel-content{display:flex;align-items:center;position:relative;padding:1rem 0;width:100%}.dropi-carousel-items-content{overflow:hidden;flex:1;padding:0;width:100%;max-width:100%}.dropi-carousel-items-container{display:flex;padding-bottom:var(--Size-3);will-change:transform}.dropi-carousel-item{flex:0 0 auto;padding:0 0.5rem;box-sizing:border-box}.dropi-carousel-item>*{width:100%;box-sizing:border-box;display:block}.dropi-carousel-nav{display:flex;width:40px;height:40px;justify-content:center;align-items:center;cursor:pointer;transition:all 0.2s;flex-shrink:0;z-index:1;border-radius:var(--Border-5);background:var(--Neutral-White, #fff);box-shadow:var(--Shadow-medium);border:none;appearance:none;padding:0}.dropi-carousel-nav:hover{background:var(--Gray-Gray-50)}.dropi-carousel-nav:disabled{opacity:0.4;cursor:not-allowed;box-shadow:none}.dropi-carousel-prev{margin-right:1rem}.dropi-carousel-next{margin-left:1rem}.dropi-carousel-indicators{display:flex;justify-content:center;gap:0.5rem;list-style:none;padding:1rem 0 0 0;margin:0}.dropi-carousel-indicators li{cursor:pointer}.dropi-carousel-indicators li button{width:1rem;height:1rem;border-radius:50%;border:1px solid var(--Gray-Gray-100, #eceef4);background:var(--Neutral-White, #fff);cursor:pointer;transition:all 0.2s;padding:0}.dropi-carousel-indicators li.active button{background:var(--Primary-Primary-500);border-color:var(--Primary-Primary-500)}.dropi-carousel-indicators li:hover button{background:var(--Gray-Gray-200)}.vertical .dropi-carousel-content{flex-direction:column}.vertical .dropi-carousel-items-container{flex-direction:column}.vertical .dropi-carousel-prev{margin:0 0 1rem 0}.vertical .dropi-carousel-next{margin:1rem 0 0 0}@media (max-width: 768px){.dropi-carousel-container{padding:0}.dropi-carousel-item{padding:0 0.25rem}}`;
|
|
6390
6390
|
|
|
6391
6391
|
class DropiCarousel {
|
|
6392
6392
|
constructor(hostRef) {
|
|
@@ -6556,7 +6556,7 @@ class DropiCarousel {
|
|
|
6556
6556
|
}; }
|
|
6557
6557
|
}
|
|
6558
6558
|
|
|
6559
|
-
const dropiCheckboxCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.container-dropi-checkbox{display:inline-block}.check{width:20px;height:20px;border-radius:var(--Border-1, 4px);cursor:pointer;transition:background-color 0.3s ease-in-out, border-style 0.3s ease-in-out}.noCheck{border-style:solid;border-width:2px;border-color:var(--Gray-Gray-200, #c3c9d9);display:flex;justify-content:center;align-items:center}.noCheck svg{visibility:hidden}.isCheck{display:flex;background-color:var(--Primary-Primary-500, #f49a3d);justify-content:center;align-items:center}.disabled{background-color:var(--Gray-Gray-50, #f7f8fa);border-color:var(--Gray-Gray-100, #e6eaf2);cursor:not-allowed}`;
|
|
6559
|
+
const dropiCheckboxCss = () => `:host{display:inline-block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.container-dropi-checkbox{display:inline-block}.check{width:20px;height:20px;border-radius:var(--Border-1, 4px);cursor:pointer;transition:background-color 0.3s ease-in-out, border-style 0.3s ease-in-out}.noCheck{border-style:solid;border-width:2px;border-color:var(--Gray-Gray-200, #c3c9d9);display:flex;justify-content:center;align-items:center}.noCheck svg{visibility:hidden}.isCheck{display:flex;background-color:var(--Primary-Primary-500, #f49a3d);justify-content:center;align-items:center}.disabled{background-color:var(--Gray-Gray-50, #f7f8fa);border-color:var(--Gray-Gray-100, #e6eaf2);cursor:not-allowed}`;
|
|
6560
6560
|
|
|
6561
6561
|
/**
|
|
6562
6562
|
* @component dropi-checkbox
|
|
@@ -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: 'febf6eb0bb7392639bca5a473dd17c2e7d732cff', class: "container-dropi-checkbox", onClick: () => this.changeState() }, hAsync("div", { key: '64cd57277c43c5ae4dfd775a0df13cd7462b8c58', 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: '97608b9897d464c572edff3dcf5fec4fadad371d', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none" }, hAsync("path", { key: 'e983025baa94876d0a01b6c28f789c0ee1e91c36', 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 {
|
|
@@ -6625,7 +6625,7 @@ class DropiCheckbox {
|
|
|
6625
6625
|
}; }
|
|
6626
6626
|
}
|
|
6627
6627
|
|
|
6628
|
-
const dropiCheckboxSelectionListCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.csl__search{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);margin-bottom:var(--Size-2, 8px)}.csl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:
|
|
6628
|
+
const dropiCheckboxSelectionListCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.csl__search{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);margin-bottom:var(--Size-2, 8px)}.csl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:transparent}.csl__clear{display:flex;background:none;border:none;padding:0;cursor:pointer}.csl__list{display:flex;flex-direction:column}.csl__item{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;border-radius:var(--Border-1, 4px);transition:background 0.15s}.csl__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.csl__icon{width:24px;height:24px;border-radius:50%;object-fit:cover;flex-shrink:0}.csl__label{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);flex:1}.csl__empty{padding:var(--Size-4, 16px);text-align:center;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-400, #858ea6)}`;
|
|
6629
6629
|
|
|
6630
6630
|
/**
|
|
6631
6631
|
* @component dropi-checkbox-selection-list
|
|
@@ -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: '20ab881c475eb5df0318f1669eb59af22e5c8055', class: "csl" }, this.showFilter && (hAsync("div", { key: '75c33cae60b61b8ed91fcef89d9a1cc08e9bd4d2', class: "csl__search" }, hAsync("dropi-icon", { key: '6a30bc308753a24c1349090975d3b3d4c856a0fd', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("input", { key: 'b76b01227062acda7ad87ac46ecae64eef633a75', 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: '96bcf9cf9edc6de2e30729dff75b84d56eda1134', class: "csl__clear", onClick: () => { this.filterText = ''; this.dropiSearch.emit(''); } }, hAsync("dropi-icon", { key: '1564c8dbc0ee07784ef692c89f7f888905d070a0', name: "Close-small", iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-400" }))))), hAsync("div", { key: 'e6bc1fd3eaea49298c0d099d7b98e1eef32d3b38', 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
|
})))));
|
|
@@ -6716,7 +6716,7 @@ class DropiCheckboxSelectionList {
|
|
|
6716
6716
|
}; }
|
|
6717
6717
|
}
|
|
6718
6718
|
|
|
6719
|
-
const dropiChipsCss = () => `:host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}.chip{display:inline-flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);height:24px;padding:0 var(--Size-2, 8px);border-radius:var(--Border-2, 8px);font-size:var(--font-size-xs, 10px);font-family:
|
|
6719
|
+
const dropiChipsCss = () => `:host{display:inline-flex;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.chip{display:inline-flex;align-items:center;justify-content:center;gap:var(--Size-1, 4px);height:24px;padding:0 var(--Size-2, 8px);border-radius:var(--Border-2, 8px);font-size:var(--font-size-xs, 10px);font-family:var(--font-family-01, 'Inter', sans-serif);width:fit-content;max-width:200px}.chip--filters{background:var(--Primary-Primary-50, #fff5eb);border:1px solid var(--Primary-Primary-200, #fbd4a3);color:var(--Primary-Primary-600, #d4872e)}.chip--fill{background:var(--Gray-Gray-100, #e6eaf2);border:1px solid transparent;color:var(--Gray-Gray-700, #32394d)}.chip__avatar{width:16px;height:16px;border-radius:50%;object-fit:cover;flex-shrink:0}.chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.chip__close{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:none;border:none;padding:0;cursor:pointer;color:inherit;opacity:0.7;transition:opacity 0.15s}.chip__close:hover{opacity:1}`;
|
|
6720
6720
|
|
|
6721
6721
|
/**
|
|
6722
6722
|
* @component dropi-chips
|
|
@@ -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: '20ecd2dad1f10bbc26028eb866e45af66090ba4e', class: { 'chip': true, [`chip--${this.customStyle}`]: true } }, this.type === 'avatar' && this.urlImg && (hAsync("img", { key: '6446517eb4075c1f2a4a964fd9c66c554682f706', class: "chip__avatar", src: this.urlImg, alt: "" })), this.type === 'icon' && this.icon && (hAsync("dropi-icon", { key: '9404886b51dae0a225e45c5d6d7bd0fff7e3d630', class: "chip__pre-icon", name: this.icon, iconWidth: "14px", iconHeight: "14px", color: "currentColor" })), hAsync("span", { key: '363167e5eb3a4522617bf941d2c7e638c9aeef45', class: "chip__text" }, hAsync("slot", { key: 'a00a38943eee521719f9af41bc742ee4a025c4a2' })), this.showIcon && (hAsync("button", { key: '2d4d5b571cee579d7466c720668f8ef6ab7e1a74', class: "chip__close", onClick: () => this.dropiClose.emit(), "aria-label": "Eliminar" }, hAsync("dropi-icon", { key: '48a22f01f30a08331d4b67ca3a5ddba012ac4642', name: "Cross-circle", iconWidth: "14px", iconHeight: "14px", color: "currentColor" })))));
|
|
6745
6745
|
}
|
|
6746
6746
|
static get style() { return dropiChipsCss(); }
|
|
6747
6747
|
static get cmpMeta() { return {
|
|
@@ -6760,7 +6760,7 @@ class DropiChips {
|
|
|
6760
6760
|
}; }
|
|
6761
6761
|
}
|
|
6762
6762
|
|
|
6763
|
-
const dropiCitySelectorCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.city-selector{position:relative;width:100%}.selector-trigger{width:100%;min-height:
|
|
6763
|
+
const dropiCitySelectorCss = () => `:host{display:block;width:100%;position:relative;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.city-selector{position:relative;width:100%}.selector-trigger{width:100%;min-height:40px;padding:6px 12px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;text-align:left;font-family:var(--font-family-01, 'Inter', sans-serif);transition:border-color 0.15s}.selector-trigger:hover:not(:disabled){border-color:var(--Gray-Gray-300, #a3abbf)}.selector-trigger:focus{outline:none;border-color:var(--Info-Info-500, #50a5f1)}.city-selector--disabled .selector-trigger{background:var(--Gray-Gray-50, #f7f8fa);border-color:var(--Gray-Gray-100, #e6eaf2);cursor:not-allowed;opacity:0.6}.chips-area{display:flex;flex-wrap:wrap;gap:4px;flex:1;min-height:26px;align-items:center}.placeholder{color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 14px)}.chip{display:inline-flex;align-items:center;gap:4px;background:var(--Primary-Primary-50, #fff8f0);border:1px solid var(--Primary-Primary-200, #fcd5a8);border-radius:var(--Border-1, 4px);padding:2px 6px;font-size:var(--font-size-xs, 12px);color:var(--Primary-Primary-700, #b85c00)}.chip-remove{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);box-shadow:0 8px 24px rgba(0, 0, 0, 0.10);z-index:var(--dropi-z-index-overlay, 11000);overflow:hidden}.search-wrap{padding:10px 12px;border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.search-field{position:relative;display:flex;align-items:center}.search-input{width:100%;height:36px;padding:0 36px 0 12px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:var(--Gray-Gray-50, #f7f8fa);outline:none;transition:border-color 0.15s}.search-input:focus{border-color:var(--Info-Info-500, #50a5f1);background:var(--Neutral-White, #ffffff)}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-icon{position:absolute;right:10px;display:flex;align-items:center;pointer-events:none}.options-list{max-height:280px;overflow-y:auto;background:var(--Neutral-White, #ffffff)}.options-list::-webkit-scrollbar{width:6px}.options-list::-webkit-scrollbar-track{background:transparent}.options-list::-webkit-scrollbar-thumb{background:var(--Gray-Gray-200, #c3c9d9);border-radius:4px}.group-label{padding:14px 16px 8px;font-size:var(--font-size-m, 16px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-800, #1f2433);background:var(--Neutral-White, #ffffff)}.city-option{padding:10px 16px;display:flex;align-items:center;gap:12px;cursor:pointer;font-size:var(--font-size-s, 14px);color:var(--Gray-Gray-700, #32394d);background:var(--Neutral-White, #ffffff);transition:background 0.1s;user-select:none}.city-option:hover{background:var(--Gray-Gray-50, #f7f8fa)}.city-option--selected .city-label{color:var(--Gray-Gray-800, #1f2433);font-weight:var(--font-weight-medium, 500)}.checkbox{width:22px;height:22px;border:1.5px solid var(--Gray-Gray-300, #c3c9d9);border-radius:var(--Border-1, 6px);background:var(--Neutral-White, #ffffff);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:border-color 0.15s, background 0.15s}.checkbox--checked{border-color:var(--Primary-Primary-500, #f49a3d);background:var(--Primary-Primary-500, #f49a3d)}.city-label{flex:1}.no-results{padding:20px 16px;text-align:center;color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 14px)}`;
|
|
6764
6764
|
|
|
6765
6765
|
/**
|
|
6766
6766
|
* @component dropi-city-selector
|
|
@@ -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: 'dbc6ed4bbc32ec2087eab966b24bdbbb9a4a66eb', class: { 'city-selector': true, 'city-selector--disabled': this.disabled } }, hAsync("button", { key: 'a22d629d62c969fe8c18e01f14e753cc8df36538', type: "button", class: "selector-trigger", disabled: this.disabled, onClick: () => this.toggle(), "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, hAsync("div", { key: 'f0880bed53053ec941846ff964ef27aa8df370e1', class: "chips-area" }, this.selected.length === 0 && (hAsync("span", { key: 'daf4a6adecbfd8418c0d85d96e4c223b4d1ed1a7', 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: '7db007e00be1d77d34393a086127974183dcfa2d', name: this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2', iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-500" })), this.isOpen && (hAsync("div", { key: '450be45761446a87956401939a5ce42c9e90de70', class: "dropdown", role: "listbox" }, hAsync("div", { key: '0fb6675ea75a648d86c183dde5ec5b4f8bef488d', class: "search-wrap" }, hAsync("div", { key: '80d6c6fae071018a3f5bbd6d51a5086b2f635063', class: "search-field" }, hAsync("input", { key: 'fc5e2a7120df05932a01bcc276bdb46c273337a6', class: "search-input", type: "text", placeholder: "Buscar...", value: this.searchTerm, onInput: (e) => { this.searchTerm = e.target.value; }, autoComplete: "off" }), hAsync("span", { key: 'cb8e16a2b61b587f8c94d5707f2a4aea392a8dc0', class: "search-icon" }, hAsync("dropi-icon", { key: 'babd7dcf26ba3396ca51584d9b15ceb92f59ad0a', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), hAsync("div", { key: '9bad1b60bd85f2699a3512416d04e9d4a678af81', class: "options-list" }, groups.length === 0 && (hAsync("div", { key: '6ee1f41bb90abe906946cc73e86b4ad85cc42a20', 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
|
})))))))));
|
|
@@ -6887,7 +6887,7 @@ class DropiCitySelector {
|
|
|
6887
6887
|
}; }
|
|
6888
6888
|
}
|
|
6889
6889
|
|
|
6890
|
-
const dropiColorPickerCss = () => `:host{display:block}.general-container{position:relative;width:fit-content}.main-input-container{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:var(--Size-3);position:relative;width:fit-content}.main-input-container .overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;cursor:pointer}.line-color-preview{width:40px;height:40px;border-radius:50%;border:1px solid var(--Gray-Gray-200);display:flex;justify-content:center;align-items:center;padding:5px}.line-color-preview .color-preview{width:100%;height:100%;border-radius:50%;border:1px solid var(--Gray-Gray-200)}.position-right{top:0;left:250px}.position-left{top:0;right:200px}.position-top{bottom:55px}.position-bottom{top:55px}.position-bottom::before{transform:rotate(90deg);left:50%;top:-15px}.position-right::before{left:-6px;top:10px}.position-top::before{transform:rotate(270deg);left:50%;bottom:-15px}.position-left::before{transform:rotate(180deg);right:-9px}.color-picker-container::before{content:'';position:absolute;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid var(--Neutral-White);z-index:1}.color-picker-container{width:280px;padding:var(--Size-4);background:var(--Neutral-White);border-radius:var(--Size-2);box-shadow:var(--Shadow-large);position:absolute;z-index:100;transform-origin:top left;opacity:0;transition:transform 0.2s ease-out, opacity 0.2s ease-out;pointer-events:none}.color-picker-container .main-color-canvas-container{position:relative;margin-bottom:var(--Size-4);border:1px solid var(--Gray-Gray-200);border-radius:var(--Size-1);display:flex;justify-self:center;align-items:center}.color-picker-container .main-color-canvas-container canvas{display:block;border-radius:var(--Size-1)}.color-picker-container .main-color-canvas-container .color-selector-pointer{position:absolute;width:var(--Size-3);height:var(--Size-3);border:2px solid var(--Neutral-White);border-radius:50%;transform:translate(-6px, -6px);pointer-events:none}.color-picker-container .slider-container{display:flex;flex-direction:column;gap:var(--Size-3)}.color-picker-container .slider-container .slider-group{display:flex;flex-direction:column;gap:var(--Size-1)}.color-picker-container .slider-container .slider-group label{font-size:var(--font-size-xs);color:var(--Gray-Gray-500);font-weight:var(--font-weight-bold)}.color-picker-container .slider-container .slider-group .hue-slider-container,.color-picker-container .slider-container .slider-group .opacity-slider-container{position:relative;height:var(--Size-3);border-radius:var(--Size-4);overflow:hidden}.color-picker-container .slider-container .slider-group .hue-slider-container canvas,.color-picker-container .slider-container .slider-group .opacity-slider-container canvas{display:block;width:100%;height:100%}.color-picker-container .slider-container .slider-group .hue-slider-container .slider-pointer,.color-picker-container .slider-container .slider-group .opacity-slider-container .slider-pointer{position:absolute;top:0;height:var(--Size-3);width:var(--Size-3);background:transparent;border:2px solid var(--Neutral-White);border-radius:50%;pointer-events:none}.color-picker-container.show{transform:scale(1);opacity:1;pointer-events:auto}.color-info .color-label{font-size:var(--font-size-xs);color:var(--Gray-Gray-500);font-weight:var(--font-weight-bold);text-transform:uppercase;margin-bottom:var(--Size-2)}.color-info .color-input{border:1px solid var(--Gray-Gray-200, #ddd);border-radius:var(--Size-1);padding:6px 8px;font-size:var(--font-size-s);width:100%;font-family:monospace;text-transform:uppercase;background-color:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-800, #1f2433);outline:none}`;
|
|
6890
|
+
const dropiColorPickerCss = () => `:host{display:block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.general-container{position:relative;width:fit-content}.main-input-container{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:var(--Size-3);position:relative;width:fit-content}.main-input-container .overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;cursor:pointer}.line-color-preview{width:40px;height:40px;border-radius:50%;border:1px solid var(--Gray-Gray-200);display:flex;justify-content:center;align-items:center;padding:5px}.line-color-preview .color-preview{width:100%;height:100%;border-radius:50%;border:1px solid var(--Gray-Gray-200)}.position-right{top:0;left:250px}.position-left{top:0;right:200px}.position-top{bottom:55px}.position-bottom{top:55px}.position-bottom::before{transform:rotate(90deg);left:50%;top:-15px}.position-right::before{left:-6px;top:10px}.position-top::before{transform:rotate(270deg);left:50%;bottom:-15px}.position-left::before{transform:rotate(180deg);right:-9px}.color-picker-container::before{content:'';position:absolute;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid var(--Neutral-White);z-index:1}.color-picker-container{width:280px;padding:var(--Size-4);background:var(--Neutral-White);border-radius:var(--Size-2);box-shadow:var(--Shadow-large);position:absolute;z-index:100;transform-origin:top left;opacity:0;transition:transform 0.2s ease-out, opacity 0.2s ease-out;pointer-events:none}.color-picker-container .main-color-canvas-container{position:relative;margin-bottom:var(--Size-4);border:1px solid var(--Gray-Gray-200);border-radius:var(--Size-1);display:flex;justify-self:center;align-items:center}.color-picker-container .main-color-canvas-container canvas{display:block;border-radius:var(--Size-1)}.color-picker-container .main-color-canvas-container .color-selector-pointer{position:absolute;width:var(--Size-3);height:var(--Size-3);border:2px solid var(--Neutral-White);border-radius:50%;transform:translate(-6px, -6px);pointer-events:none}.color-picker-container .slider-container{display:flex;flex-direction:column;gap:var(--Size-3)}.color-picker-container .slider-container .slider-group{display:flex;flex-direction:column;gap:var(--Size-1)}.color-picker-container .slider-container .slider-group label{font-size:var(--font-size-xs);color:var(--Gray-Gray-500);font-weight:var(--font-weight-bold)}.color-picker-container .slider-container .slider-group .hue-slider-container,.color-picker-container .slider-container .slider-group .opacity-slider-container{position:relative;height:var(--Size-3);border-radius:var(--Size-4);overflow:hidden}.color-picker-container .slider-container .slider-group .hue-slider-container canvas,.color-picker-container .slider-container .slider-group .opacity-slider-container canvas{display:block;width:100%;height:100%}.color-picker-container .slider-container .slider-group .hue-slider-container .slider-pointer,.color-picker-container .slider-container .slider-group .opacity-slider-container .slider-pointer{position:absolute;top:0;height:var(--Size-3);width:var(--Size-3);background:transparent;border:2px solid var(--Neutral-White);border-radius:50%;pointer-events:none}.color-picker-container.show{transform:scale(1);opacity:1;pointer-events:auto}.color-info .color-label{font-size:var(--font-size-xs);color:var(--Gray-Gray-500);font-weight:var(--font-weight-bold);text-transform:uppercase;margin-bottom:var(--Size-2)}.color-info .color-input{border:1px solid var(--Gray-Gray-200, #ddd);border-radius:var(--Size-1);padding:6px 8px;font-size:var(--font-size-s);width:100%;font-family:monospace;text-transform:uppercase;background-color:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-800, #1f2433);outline:none}`;
|
|
6891
6891
|
|
|
6892
6892
|
class DropiColorPicker {
|
|
6893
6893
|
constructor(hostRef) {
|
|
@@ -7188,10 +7188,10 @@ class DropiColorPicker {
|
|
|
7188
7188
|
}
|
|
7189
7189
|
}
|
|
7190
7190
|
render() {
|
|
7191
|
-
return (hAsync("div", { key: '
|
|
7191
|
+
return (hAsync("div", { key: 'd9c5e76dd6171e16a7b156425ed23fb278bf98c4', class: "general-container" }, hAsync("div", { key: 'd12811b5fceee6fb0966c9c96de558babac9f76f', class: "main-input-container" }, hAsync("div", { key: '501f61305d92c06e02d206ac7a43f05b8534bbde', class: "overlay", onClick: () => this.showEditor() }), hAsync("div", { key: 'fb6b530e3a470e8a0c253b09277c4e0c7d044e22', class: "line-color-preview" }, hAsync("div", { key: '54f99921536b51a86fcda44e8dac7217a4c7dee5', class: "color-preview", style: { background: this.currentColor } })), hAsync("div", { key: 'cb2e0ddf93642e77e56de752a65c9ba76cb552a0', class: "color-info" }, hAsync("input", { key: 'f47de54253b46b4569ecab01429563670c7e72c7', type: "text", class: "color-input", value: this.currentColor, maxLength: 9, readOnly: true }))), hAsync("div", { key: '5a075b8c12598ba8dd275b6a16eef32add9ac699', class: `color-picker-container position-${this.position} ${this.showEdit ? 'show' : ''}` }, hAsync("div", { key: '69e0ca2f0619cc4179ab0aaee1c104cef14ce36e', class: "main-color-canvas-container" }, hAsync("canvas", { key: 'b1214cca9b1c1b19c28e7c88d7283558e843f596', ref: (el) => this.colorCanvas = el, width: 256, height: 150, onMouseDown: (e) => this.onColorMouseDown(e) }), hAsync("div", { key: 'c4421be7d1b404b75a8369a7308bc230495acf3e', 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: 'a5d31a247005eb772bddc2f8dd2cb9a243c6481a', class: "slider-container" }, hAsync("div", { key: 'efd453992fc5742c5b6d2637822d3e6f27b4d69c', class: "slider-group" }, hAsync("div", { key: 'ecdd733f52e90dba2bb80cbc156b0f73535c1d9f', class: "hue-slider-container" }, hAsync("canvas", { key: 'a4ec35a0626bec8d07754065adda64ab22607d08', ref: (el) => this.hueCanvas = el, width: 256, height: 20, onMouseDown: (e) => this.onHueMouseDown(e) }), hAsync("div", { key: '374888568e3dc396400e416f81a1e2757f8d9300', class: "slider-pointer", style: { left: `${(this.hue / 360) * 234}px` } }))), hAsync("div", { key: '7936ff2caf23fbb52ec249f9524824385d9fd994', class: "slider-group" }, hAsync("div", { key: 'bfc6261574131051f5a93656d625a4bfd0d3a5a3', class: "opacity-slider-container" }, hAsync("canvas", { key: '998d1156a5179a920ba459441f0ff7678c383262', ref: (el) => this.opacityCanvas = el, width: 256, height: 20, onMouseDown: (e) => this.onOpacityMouseDown(e) }), hAsync("div", { key: 'e7e273b17d35e5f3c6da8fc64ac457d170353ad9', class: "slider-pointer", style: { left: `${(this.opacity / 100) * 234}px` } }))), hAsync("div", { key: 'f2c0146365f245843514d48313bb77aa07f48927', class: "color-info" }, hAsync("div", { key: '94d56458a0e17f20407fb324910b4fb40661856a', class: "color-label" }, "HEX"), hAsync("input", { key: 'f6b4cbc676861caa8fb393d11e7f2b107e689a7d', 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": [{
|
|
@@ -7218,7 +7218,7 @@ class DropiColorPicker {
|
|
|
7218
7218
|
}; }
|
|
7219
7219
|
}
|
|
7220
7220
|
|
|
7221
|
-
const dropiCountryFlagsCss = () => `:host{display:inline-flex}.flag{max-width:40px;max-height:40px;margin:0;display:flex;align-items:center;justify-content:center}.flag img{width:100%;height:100%;object-fit:cover}.circle{border-radius:50%;overflow:hidden}.rectangle{border-radius:4px;overflow:hidden;max-width:32px !important;max-height:24px !important}`;
|
|
7221
|
+
const dropiCountryFlagsCss = () => `:host{display:inline-flex;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.flag{max-width:40px;max-height:40px;margin:0;display:flex;align-items:center;justify-content:center}.flag img{width:100%;height:100%;object-fit:cover}.circle{border-radius:50%;overflow:hidden}.rectangle{border-radius:4px;overflow:hidden;max-width:32px !important;max-height:24px !important}`;
|
|
7222
7222
|
|
|
7223
7223
|
/**
|
|
7224
7224
|
* @component dropi-country-flags
|
|
@@ -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: '1b50bb5d6883388a3e545d068642d404bac3f314', class: `flag ${this.customStyle ?? 'flat'}` }, hAsync("img", { key: '2c8d08bd972eb1f99188d17719d4e9be0f9bbcd5', src: this.src, style: style, alt: `flag-${this.country}` })));
|
|
7256
7256
|
}
|
|
7257
7257
|
static get style() { return dropiCountryFlagsCss(); }
|
|
7258
7258
|
static get cmpMeta() { return {
|
|
@@ -7270,7 +7270,7 @@ class DropiCountryFlags {
|
|
|
7270
7270
|
}; }
|
|
7271
7271
|
}
|
|
7272
7272
|
|
|
7273
|
-
const dropiCountrySelectorCss = () => `:host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}label{display:block;font-size:var(--font-size-xs, 11px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:6px}.required{color:var(--Error-Error-500, #ef4444);margin-left:2px}.select-button{width:100%;height:
|
|
7273
|
+
const dropiCountrySelectorCss = () => `:host{display:block;width:100%;text-align:left;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}label{display:block;font-size:var(--font-size-xs, 11px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:6px}.required{color:var(--Error-Error-500, #ef4444);margin-left:2px}.select-button{width:100%;height:40px;padding:0 12px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;transition:border-color 0.15s ease}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #3b82f6)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-button.select-completed{color:var(--Gray-Gray-700, #32394d)}.select-button.select-invalid{border-color:var(--Error-Error-500, #ef4444)}.selected-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1}.selected-option{display:flex;align-items:center;gap:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 14px)}.placeholder-text{color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 14px)}.flag-img{border-radius:var(--Border-1, 4px);width:24px;height:24px;object-fit:cover;flex-shrink:0}.select-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);z-index:var(--dropi-z-index-overlay, 11000);list-style:none;padding:0;margin:0;box-shadow:0 8px 24px rgba(0, 0, 0, 0.10);overflow:hidden;transition:max-height 0.2s ease, opacity 0.2s ease}.select-dropdown.expanded{max-height:300px;opacity:1;overflow-y:auto}.select-dropdown.collapsed{max-height:0;opacity:0;pointer-events:none;border-color:transparent;box-shadow:none}.select-dropdown::-webkit-scrollbar{width:6px}.select-dropdown::-webkit-scrollbar-track{background:transparent}.select-dropdown::-webkit-scrollbar-thumb{background:var(--Gray-Gray-200, #c3c9d9);border-radius:4px}.select-dropdown::-webkit-scrollbar-thumb:hover{background:var(--Gray-Gray-300, #a3abbf)}.search-li{padding:10px 12px;position:sticky;top:0;background:var(--Neutral-White, #ffffff);z-index:1;border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.search-field{position:relative;display:flex;align-items:center}.country-search{width:100%;height:36px;padding:0 36px 0 12px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);outline:none;font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:var(--Gray-Gray-50, #f7f8fa);transition:border-color 0.15s, background 0.15s}.country-search:focus{border-color:var(--Info-Info-500, #50a5f1);background:var(--Neutral-White, #ffffff)}.country-search::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-icon{position:absolute;right:10px;display:flex;align-items:center;pointer-events:none}.option{width:100%;min-height:44px;padding:10px 16px;border:none;background:transparent;text-align:left;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);cursor:pointer;display:flex;align-items:center;gap:10px;transition:background 0.1s ease;white-space:nowrap}.option:hover{background:var(--Gray-Gray-50, #f7f8fa)}`;
|
|
7274
7274
|
|
|
7275
7275
|
const PORTAL_CSS = `
|
|
7276
7276
|
.select-dropdown {
|
|
@@ -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: '2301c76f8096b996d676479583fe7febee746e48', class: "custom-select" }, this.label && (hAsync("label", { key: '7564e69536b9f2040d7ceac30f5e66518ff36a1f' }, this.label, this.showObligatory && hAsync("span", { key: 'c98915803a584c46ad5bcfc650ae52f92c091931', class: "required" }, "*"))), hAsync("button", { key: '6a902ae3b5d2b2b24023eda7708c0f7b418195c9', 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: 'bebdf6607a7249032df869b8fd094bcb00b890d7', 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: 'dd5f0d64c4ac8ad055deb4dde05146fcc1402943', name: this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2', iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-500" })), hAsync("ul", { key: '6976c04e703088beb3126a03c8dbd19aa08b3335', class: `select-dropdown${this.isOpen ? ' expanded' : ' collapsed'}` }, hAsync("li", { key: '2db4bcb251972595fa03c39f7dae51e49a1b7cd2', class: "search-li" }, hAsync("div", { key: '0daa1befc77355e8648ff76baabb6a76409e5e24', class: "search-field" }, hAsync("input", { key: '5d3c5afd92be90fadd6637247aecbed3666dcf9e', 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: 'eef0eae53f59020f75ede2c5d28513c23daf1014', class: "search-icon" }, hAsync("dropi-icon", { key: '29dc956de07c22b7f41581d1f4dad94e0049fe06', 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: 'eea28425b7ed7eaed34fd6ebf9c3dfc2ca171bfb', class: { 'select-helper': true, 'select-helper-error': this.hasError } }, this.hasError && hAsync("dropi-icon", { key: '00ec44693c5cbd8806211d529f4c3cc8628f40ed', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), hAsync("span", { key: 'b2b930a92889c3927275891a6b8a45fb341b55dd' }, this.textHelper)))));
|
|
7560
7560
|
}
|
|
7561
7561
|
static get formAssociated() { return true; }
|
|
7562
7562
|
static get watchers() { return {
|
|
@@ -7592,7 +7592,7 @@ class DropiCountrySelector {
|
|
|
7592
7592
|
}; }
|
|
7593
7593
|
}
|
|
7594
7594
|
|
|
7595
|
-
const dropiDatePickerCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.dp-label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:8px}.dp-trigger{width:100%;height:40px;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:0 var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);cursor:pointer;font-family:
|
|
7595
|
+
const dropiDatePickerCss = () => `:host{display:block;width:100%;position:relative}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.dp-label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:8px}.dp-trigger{width:100%;height:40px;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:0 var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);cursor:pointer;font-family:var(--font-family-01, 'Inter', sans-serif);transition:border-color 0.2s}.dp-trigger:hover:not(:disabled){border-color:var(--Info-Info-500, #50a5f1)}.dp-trigger--disabled{background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed;opacity:0.6}.dp-trigger__value{flex:1;text-align:left;font-size:var(--font-size-xs, 12px);color:var(--Gray-Gray-700, #32394d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dp-trigger__placeholder{color:var(--Gray-Gray-400, #858ea6)}.dp-popup{position:absolute;top:calc(100% + 8px);left:0;display:flex;flex-direction:row;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-3, 12px);box-shadow:0 4px 16px rgba(0,0,0,0.08);z-index:300;overflow:hidden}.dp-calendar{padding:var(--Size-4, 16px);width:300px;flex-shrink:0}.dp-divider{width:1px;background:var(--Gray-Gray-100, #e6eaf2);flex-shrink:0}.dp-shortcuts{padding:var(--Size-4, 16px) var(--Size-3, 12px);display:flex;flex-direction:column;gap:2px;min-width:140px}.shortcut-btn{background:transparent;border:1px solid transparent;padding:6px 10px;font-size:13px;font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);cursor:pointer;text-align:left;border-radius:6px;transition:background 0.1s ease;font-weight:var(--font-weight-regular);white-space:nowrap}.shortcut-btn:hover{background:var(--Gray-Gray-50, #f5f6f8)}.shortcut-btn--active{border-color:var(--Gray-Gray-200, #c3c9d9);font-weight:var(--font-weight-semibold);background:var(--Gray-Gray-50, #f5f6f8)}.dp-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--Size-4, 16px);padding-bottom:var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.dp-nav__btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;width:32px;height:32px;transition:background 0.15s}.dp-nav__btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-nav__title{background:none;border:none;font-size:var(--font-size-s, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d);display:flex;gap:8px;cursor:pointer;padding:4px 8px;border-radius:var(--Border-1, 4px);transition:background 0.15s;font-family:var(--font-family-01, 'Inter', sans-serif)}.dp-nav__title:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-grid{display:grid;grid-template-columns:repeat(7, 1fr);row-gap:8px;column-gap:4px}.dp-day-header{font-size:var(--font-size-s, 14px);color:var(--Gray-Gray-700, #32394d);text-align:center;padding:8px 0;font-weight:var(--font-weight-bold, 700)}.dp-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);border:none;cursor:pointer;background:transparent;color:var(--Gray-Gray-600, #475066);width:100%;position:relative;z-index:1;padding:0}.dp-cell::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;transition:all 0.2s;z-index:-1;background:transparent}.dp-cell::before{content:"";position:absolute;top:0;bottom:0;z-index:-2;border-radius:0;background:transparent}.dp-cell:hover:not(:disabled)::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--other-month{color:var(--Gray-Gray-300, #a0a9c0)}.dp-cell--today{font-weight:var(--font-weight-bold, 700)}.dp-cell--today::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--selected{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--selected::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--range-start,.dp-cell--range-end{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--range-start::after,.dp-cell--range-end::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--in-range{color:var(--Orange-orange-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.dp-cell--in-range::before{left:-2px;right:-2px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start::before{left:50%;right:-2px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-end::before{left:-2px;right:50%;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start.dp-cell--range-end::before{background:transparent}.dp-cell--disabled{opacity:0.35;cursor:not-allowed}.dp-month-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:8px}.dp-month-cell{padding:10px 4px;font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-700, #32394d);background:transparent;border:1px solid transparent;border-radius:var(--Border-2, 8px);cursor:pointer;text-align:center;transition:background 0.15s, border-color 0.15s}.dp-month-cell:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-month-cell--selected{border-color:var(--Info-Info-500, #50a5f1);font-weight:var(--font-weight-semibold, 600)}.dp-month-cell--current{background:var(--Gray-Gray-100, #e6eaf2)}.dp-year-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:8px}.dp-year-cell{padding:10px 4px;font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-700, #32394d);background:transparent;border:1px solid transparent;border-radius:var(--Border-2, 8px);cursor:pointer;text-align:center;transition:background 0.15s, border-color 0.15s}.dp-year-cell:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-year-cell--selected{border-color:var(--Info-Info-500, #50a5f1);font-weight:var(--font-weight-semibold, 600)}.dp-year-cell--current{background:var(--Gray-Gray-100, #e6eaf2)}`;
|
|
7596
7596
|
|
|
7597
7597
|
const MONTHS_ES$1 = [
|
|
7598
7598
|
'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
|
|
@@ -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: 'b414572c157c2968d844437de8c5572f3b899923', class: "dp-wrap" }, this.label && hAsync("label", { key: 'b0bff43ccf2947751fe448d666bfd05756f2b807', class: "dp-label" }, this.label), hAsync("button", { key: '14ca371e16f0be6aac456dcfb62904f722a60ff0', 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: '506fe8ecdf4e47e543dffd9a7e6a678f6e42d82a', name: "Calendar", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("span", { key: '56d45d8b7c30593446be399642d4daca9be551ad', class: { 'dp-trigger__value': true, 'dp-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder)), this.open && (hAsync("div", { key: 'bcd80c7c70cae7ede3f804f3abbf6662c6db4a7f', class: "dp-popup" }, hAsync("div", { key: '12fec7a08f95903cb8c3b33dd3c8f184863ed102', class: "dp-calendar" }, hAsync("div", { key: '51d00fdfb988ee8922996cbed3b474ff3d7b80ca', class: "dp-nav" }, hAsync("button", { key: '6b8df10edc439c6247cdd0664c0bbb778ba9b32b', class: "dp-nav__btn", onClick: () => this.prevNav(), type: "button" }, hAsync("dropi-icon", { key: '9a06b27208f2eee04bff10dc1ded80df98c96262', name: "dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" })), hAsync("button", { key: '6893879e168d2420e7adcc6f2793a4e1df6955fa', 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: 'd583d53324559f39dcca420a1f2c90f9e8385531', class: "dp-nav__btn", onClick: () => this.nextNav(), type: "button" }, hAsync("dropi-icon", { key: 'bcf58b1ff0f8d54a3ce603ec28493761e5c47f0c', 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: 'c7042c65904360f8f925d49514f98fcd97c40777', class: "dp-divider" }),
|
|
7921
|
+
hAsync("div", { key: 'de98884be898bf658633e655731b3a9c4d6d503d', 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; }
|
|
@@ -7964,7 +7964,7 @@ class DropiDatePicker {
|
|
|
7964
7964
|
}; }
|
|
7965
7965
|
}
|
|
7966
7966
|
|
|
7967
|
-
const dropiDatePickerRangeCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.dpr-label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:8px}.dpr-trigger{width:100%;height:40px;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:0 var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);cursor:pointer;font-family:
|
|
7967
|
+
const dropiDatePickerRangeCss = () => `:host{display:block;width:100%;position:relative}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.dpr-label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:8px}.dpr-trigger{width:100%;height:40px;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:0 var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);cursor:pointer;font-family:var(--font-family-01, 'Inter', sans-serif);transition:border-color 0.2s}.dpr-trigger:hover:not(:disabled){border-color:var(--Info-Info-500, #50a5f1)}.dpr-trigger--disabled{background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed;opacity:0.6}.dpr-trigger__value{flex:1;text-align:left;font-size:var(--font-size-xs, 12px);color:var(--Gray-Gray-700, #32394d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dpr-trigger__placeholder{color:var(--Gray-Gray-400, #858ea6)}.dpr-popup{position:absolute;top:calc(100% + 8px);left:0;display:flex;flex-direction:row;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-3, 12px);box-shadow:0 4px 16px rgba(0,0,0,0.08);z-index:300;overflow:hidden}.dpr-calendar{padding:var(--Size-4, 16px);width:300px;flex-shrink:0}.dpr-divider{width:1px;background:var(--Gray-Gray-100, #e6eaf2);flex-shrink:0}.dpr-shortcuts{padding:var(--Size-4, 16px) var(--Size-3, 12px);display:flex;flex-direction:column;gap:2px;min-width:140px}.shortcut-btn{background:transparent;border:1px solid transparent;padding:6px 10px;font-size:13px;font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);cursor:pointer;text-align:left;border-radius:6px;transition:background 0.1s ease;font-weight:var(--font-weight-regular);white-space:nowrap}.shortcut-btn:hover{background:var(--Gray-Gray-50, #f5f6f8)}.shortcut-btn--active{border-color:var(--Gray-Gray-200, #c3c9d9);font-weight:var(--font-weight-semibold);background:var(--Gray-Gray-50, #f5f6f8)}.warning-box{margin-top:8px;padding:4px 8px;border:1px solid var(--Warning-Warning-400);border-radius:4px;background:var(--Warning-Warning-50)}.warning-message{color:#495057;font-size:var(--font-size-xxs);line-height:16px}.dp-month-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:8px}.dp-month-cell{padding:10px 4px;font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-700, #32394d);background:transparent;border:1px solid transparent;border-radius:var(--Border-2, 8px);cursor:pointer;text-align:center;transition:background 0.15s, border-color 0.15s}.dp-month-cell:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-month-cell--selected{border-color:var(--Info-Info-500, #50a5f1);font-weight:var(--font-weight-semibold, 600)}.dp-month-cell--current{background:var(--Gray-Gray-100, #e6eaf2)}.dp-year-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:8px}.dp-year-cell{padding:10px 4px;font-size:var(--font-size-s, 14px);font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-700, #32394d);background:transparent;border:1px solid transparent;border-radius:var(--Border-2, 8px);cursor:pointer;text-align:center;transition:background 0.15s, border-color 0.15s}.dp-year-cell:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-year-cell--selected{border-color:var(--Info-Info-500, #50a5f1);font-weight:var(--font-weight-semibold, 600)}.dp-year-cell--current{background:var(--Gray-Gray-100, #e6eaf2)}.dp-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--Size-4, 16px);padding-bottom:var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.dp-nav__btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;width:32px;height:32px;transition:background 0.15s}.dp-nav__btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-nav__title{background:none;border:none;font-size:var(--font-size-s, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d);display:flex;gap:8px;cursor:pointer;padding:4px 8px;border-radius:var(--Border-1, 4px);font-family:var(--font-family-01, 'Inter', sans-serif);transition:background 0.15s}.dp-nav__title:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-grid{display:grid;grid-template-columns:repeat(7, 1fr);row-gap:6px;column-gap:2px}.dp-day-header{font-size:var(--font-size-s, 14px);color:var(--Gray-Gray-700, #32394d);text-align:center;padding:6px 0;font-weight:var(--font-weight-bold, 700)}.dp-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);border:none;cursor:pointer;background:transparent;color:var(--Gray-Gray-600, #475066);width:100%;position:relative;z-index:1;padding:0}.dp-cell::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;transition:background 0.15s;z-index:-1;background:transparent}.dp-cell::before{content:"";position:absolute;top:0;bottom:0;z-index:-2;background:transparent}.dp-cell:hover:not(:disabled)::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--other-month{color:var(--Gray-Gray-300, #a0a9c0)}.dp-cell--today{font-weight:var(--font-weight-bold, 700)}.dp-cell--today::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--selected{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--selected::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--range-start,.dp-cell--range-end{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--range-start::after,.dp-cell--range-end::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--in-range{color:var(--Orange-orange-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.dp-cell--in-range::before{left:-1px;right:-1px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start::before{left:50%;right:-1px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-end::before{left:-1px;right:50%;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start.dp-cell--range-end::before{background:transparent}.dp-cell--disabled{opacity:0.35;cursor:not-allowed}@keyframes shimmer{0%{background-position:-468px 0}100%{background-position:468px 0}}.skeleton{height:40px;width:100%;border-radius:8px;animation:shimmer 1s linear infinite;background:linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);background-size:800px 104px}`;
|
|
7968
7968
|
|
|
7969
7969
|
const MONTHS_ES = [
|
|
7970
7970
|
'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
|
|
@@ -8286,7 +8286,7 @@ class DropiDatePickerRange {
|
|
|
8286
8286
|
}; }
|
|
8287
8287
|
}
|
|
8288
8288
|
|
|
8289
|
-
const dropiDrawerCss = () => `:host{display:contents;font-family:'Inter', sans-serif}*,*::before,*::after{box-sizing:border-box}.drawer-host{position:fixed;inset:0;z-index:var(--dropi-z-index-drawer, 9999);pointer-events:none;visibility:hidden}.drawer-host--open{pointer-events:all;visibility:visible}.drawer-backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.5);opacity:0;transition:opacity 0.25s}.drawer-host--open .drawer-backdrop{opacity:1}.drawer-panel{position:absolute;background:var(--Neutral-White, #ffffff);display:flex;flex-direction:column;transition:transform 0.25s ease;overflow:hidden;max-width:100%;min-width:auto}.drawer-panel--right{top:0;right:0;bottom:0;transform:translateX(100%);box-shadow:-4px 0 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--right{transform:translateX(0)}.drawer-panel--left{top:0;left:0;bottom:0;transform:translateX(-100%);box-shadow:4px 0 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--left{transform:translateX(0)}.drawer-panel--bottom{bottom:0;left:0;right:0;transform:translateY(100%);border-radius:var(--Border-2, 8px) var(--Border-2, 8px) 0 0;box-shadow:0 -4px 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--bottom{transform:translateY(0)}.drawer-panel--top{top:0;left:0;right:0;transform:translateY(-100%);border-radius:0 0 var(--Border-2, 8px) var(--Border-2, 8px);box-shadow:0 4px 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--top{transform:translateY(0)}.drawer-panel--size-m{width:550px}.drawer-panel--size-l{width:1137px}.drawer-panel--size-xl{width:1280px}.drawer-panel--size-xxl{width:1330px}.drawer-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #eceef4);flex-shrink:0}.drawer-header--headless{display:none}.drawer-header__title{color:var(--Gray-700, #32394d);font-family:Inter, sans-serif;font-size:24px;font-style:normal;font-weight:700;line-height:110%;margin:0}.drawer-header__close{width:var(--Size-6, 32px);height:var(--Size-6, 32px);background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--Gray-400, #858ea6);border-radius:var(--Border-1, 4px);transition:background 0.15s;flex-shrink:0}.drawer-header__close:hover{background:var(--Gray-Gray-50, #f7f8fa)}.drawer-body{flex:1;overflow-y:auto;padding:var(--Size-4, 16px);display:flex;flex-direction:column}.drawer-footer{display:none}`;
|
|
8289
|
+
const dropiDrawerCss = () => `:host{display:contents;font-family:var(--font-family-01, 'Inter', sans-serif);font-family:var(--font-family-01, 'Inter', sans-serif)}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.drawer-host{position:fixed;inset:0;z-index:var(--dropi-z-index-drawer, 9999);pointer-events:none;visibility:hidden}.drawer-host--open{pointer-events:all;visibility:visible}.drawer-backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.5);opacity:0;transition:opacity 0.25s}.drawer-host--open .drawer-backdrop{opacity:1}.drawer-panel{position:absolute;background:var(--Neutral-White, #ffffff);display:flex;flex-direction:column;transition:transform 0.25s ease;overflow:hidden;max-width:100%;min-width:auto}.drawer-panel--right{top:0;right:0;bottom:0;transform:translateX(100%);box-shadow:-4px 0 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--right{transform:translateX(0)}.drawer-panel--left{top:0;left:0;bottom:0;transform:translateX(-100%);box-shadow:4px 0 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--left{transform:translateX(0)}.drawer-panel--bottom{bottom:0;left:0;right:0;transform:translateY(100%);border-radius:var(--Border-2, 8px) var(--Border-2, 8px) 0 0;box-shadow:0 -4px 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--bottom{transform:translateY(0)}.drawer-panel--top{top:0;left:0;right:0;transform:translateY(-100%);border-radius:0 0 var(--Border-2, 8px) var(--Border-2, 8px);box-shadow:0 4px 24px rgba(0, 0, 0, 0.12)}.drawer-host--open .drawer-panel--top{transform:translateY(0)}.drawer-panel--size-m{width:550px}.drawer-panel--size-l{width:1137px}.drawer-panel--size-xl{width:1280px}.drawer-panel--size-xxl{width:1330px}.drawer-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #eceef4);flex-shrink:0}.drawer-header--headless{display:none}.drawer-header__title{color:var(--Gray-700, #32394d);font-family:Inter, sans-serif;font-size:24px;font-style:normal;font-weight:700;line-height:110%;margin:0}.drawer-header__close{width:var(--Size-6, 32px);height:var(--Size-6, 32px);background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--Gray-400, #858ea6);border-radius:var(--Border-1, 4px);transition:background 0.15s;flex-shrink:0}.drawer-header__close:hover{background:var(--Gray-Gray-50, #f7f8fa)}.drawer-body{flex:1;overflow-y:auto;padding:var(--Size-4, 16px);display:flex;flex-direction:column}.drawer-footer{display:none}`;
|
|
8290
8290
|
|
|
8291
8291
|
/**
|
|
8292
8292
|
* @component dropi-drawer
|
|
@@ -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: '4f3e4424c575892b5ce1a48806fd0afa7e072630', class: { 'drawer-host': true, 'drawer-host--open': this.open } }, hAsync("div", { key: '773c4638fb2636c6679594240c3155271e7d570e', class: "drawer-backdrop", onClick: () => {
|
|
8353
8353
|
if (this.closeOnBackdrop)
|
|
8354
8354
|
this.close();
|
|
8355
|
-
} }), hAsync("div", { key: '
|
|
8355
|
+
} }), hAsync("div", { key: '469c184d14cfa01e80e4c969c24972d97b7f3024', class: `drawer-panel drawer-panel--${this.position}${sizeClass ? ' ' + sizeClass : ''}`, style: panelStyle, role: "dialog", "aria-modal": "true" }, hAsync("div", { key: 'ee71f327050597ac7eed9df2baf8a44c11f387cb', class: { 'drawer-header': true, 'drawer-header--headless': this.headless } }, hAsync("h3", { key: '1224b4b5677845a55017489337dc3a7ecc24ce8c', class: "drawer-header__title" }, this.drawerTitle), hAsync("button", { key: '19b8a22f8bb8aaeddce29a78ad45d6d35cedb032', class: "drawer-header__close", onClick: () => this.close(), "aria-label": "Cerrar" }, hAsync("dropi-icon", { key: '8510c972fd1e0116862aaaa3a2e8d6cfb546e7b6', name: "Close-small", iconWidth: "32px", iconHeight: "32px", color: "Gray-Gray-400" }))), hAsync("div", { key: '1a40daddcff9f546b24ebf380d741da620810d27', class: "drawer-body" }, hAsync("slot", { key: 'dd230f11d1bd9b4b4ea37fc1f75e3ebc8d457203' })), hAsync("div", { key: '64b1018b957d0a159d3265c33ac82490724c7c31', class: "drawer-footer" }, hAsync("slot", { key: '5651bf1970b07c3487573395c0f404156ae8b78d', name: "footer" })))));
|
|
8356
8356
|
}
|
|
8357
8357
|
static get watchers() { return {
|
|
8358
8358
|
"open": [{
|
|
@@ -8383,7 +8383,7 @@ class DropiDrawer {
|
|
|
8383
8383
|
}; }
|
|
8384
8384
|
}
|
|
8385
8385
|
|
|
8386
|
-
const dropiDropdownCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.dropdown{display:flex;flex-direction:column;overflow-y:auto;max-height:var(--dropdown-height, 300px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff)}.dropdown__item{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;transition:background 0.15s;user-select:none}.dropdown__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dropdown__item--active{background:var(--Primary-Primary-50, #fff5eb)}.dropdown__avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;flex-shrink:0}.dropdown__label{flex:1;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}`;
|
|
8386
|
+
const dropiDropdownCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.dropdown{display:flex;flex-direction:column;overflow-y:auto;max-height:var(--dropdown-height, 300px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff)}.dropdown__item{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;transition:background 0.15s;user-select:none}.dropdown__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dropdown__item--active{background:var(--Primary-Primary-50, #fff5eb)}.dropdown__avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;flex-shrink:0}.dropdown__label{flex:1;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}`;
|
|
8387
8387
|
|
|
8388
8388
|
/**
|
|
8389
8389
|
* @component dropi-dropdown
|
|
@@ -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: 'a248d63162b0f4f1ab783fcea22c78eb114a97fa', 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))));
|
|
@@ -8538,7 +8538,7 @@ const ILLUSTRATION_MAP = {
|
|
|
8538
8538
|
`
|
|
8539
8539
|
};
|
|
8540
8540
|
|
|
8541
|
-
const dropiEmptyStateCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--Size-3, 12px);padding:var(--Size-6, 32px) var(--Size-5, 20px);text-align:center}.empty-state-img{max-width:200px;width:100%;height:auto;object-fit:contain;filter:brightness(0) saturate(100%) invert(73%) sepia(9%) saturate(503%) hue-rotate(187deg) brightness(91%) contrast(88%)}.empty-state-svg{width:80px;height:80px}.empty-state-placeholder{display:flex;align-items:center;justify-content:center}.empty-state-title{margin:0;font-size:var(--font-size-l, 18px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d);line-height:1.3}.empty-state-description{margin:0;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c);line-height:1.6;max-width:400px}.empty-state-actions{display:flex;align-items:center;gap:var(--Size-3, 12px);flex-wrap:wrap;justify-content:center;margin-top:var(--Size-2, 8px)}`;
|
|
8541
|
+
const dropiEmptyStateCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--Size-3, 12px);padding:var(--Size-6, 32px) var(--Size-5, 20px);text-align:center}.empty-state-img{max-width:200px;width:100%;height:auto;object-fit:contain;filter:brightness(0) saturate(100%) invert(73%) sepia(9%) saturate(503%) hue-rotate(187deg) brightness(91%) contrast(88%)}.empty-state-svg{width:80px;height:80px}.empty-state-placeholder{display:flex;align-items:center;justify-content:center}.empty-state-title{margin:0;font-size:var(--font-size-l, 18px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d);line-height:1.3}.empty-state-description{margin:0;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c);line-height:1.6;max-width:400px}.empty-state-actions{display:flex;align-items:center;gap:var(--Size-3, 12px);flex-wrap:wrap;justify-content:center;margin-top:var(--Size-2, 8px)}`;
|
|
8542
8542
|
|
|
8543
8543
|
class DropiEmptyState {
|
|
8544
8544
|
constructor(hostRef) {
|
|
@@ -8567,7 +8567,7 @@ class DropiEmptyState {
|
|
|
8567
8567
|
}
|
|
8568
8568
|
}
|
|
8569
8569
|
render() {
|
|
8570
|
-
return (hAsync("div", { key: '
|
|
8570
|
+
return (hAsync("div", { key: '4622061d513d52f33b23241694dc0b443612468e', class: "empty-state" }, hAsync("div", { key: '716002d71cbadf8ee1d3a5dc0e6098db37fc8d36', 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: 'd618e697298977fd9300179cf015d45f77c11ea7', class: "empty-state-title" }, this.title), this.description && hAsync("p", { key: '5e21f5fdb5cb70fa2860046741cebdc93ef2d6df', class: "empty-state-description" }, this.description), hAsync("slot", { key: '65f5120275499a544cc3d49b5683ba10f0f62c03' }), this.buttonText && (hAsync("div", { key: '73ad76bed22bd04a662c52600dd05c76c9e9a17d', class: "empty-state-actions" }, hAsync("dropi-button", { key: 'bdaaf562bc26e3d746e0c8384536eefc864e525d', 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 {
|
|
@@ -8589,7 +8589,7 @@ class DropiEmptyState {
|
|
|
8589
8589
|
}; }
|
|
8590
8590
|
}
|
|
8591
8591
|
|
|
8592
|
-
const dropiFavoriteButtonCss = () => `:host{display:inline-flex}.fav-btn{display:flex;align-items:center;justify-content:center;width:37px;height:37px;border-radius:8px;border:1px solid var(--Gray-Gray-200);background:var(--Neutral-White);cursor:pointer;transition:all 0.2s ease-in-out}.fav-btn:hover,.fav-btn--active{background:var(--Gray-Gray-50)}.fav-btn:active{transform:scale(0.95)}`;
|
|
8592
|
+
const dropiFavoriteButtonCss = () => `:host{display:inline-flex}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.fav-btn{display:flex;align-items:center;justify-content:center;width:37px;height:37px;border-radius:8px;border:1px solid var(--Gray-Gray-200);background:var(--Neutral-White);cursor:pointer;transition:all 0.2s ease-in-out}.fav-btn:hover,.fav-btn--active{background:var(--Gray-Gray-50)}.fav-btn:active{transform:scale(0.95)}`;
|
|
8593
8593
|
|
|
8594
8594
|
/**
|
|
8595
8595
|
* @component dropi-favorite-button
|
|
@@ -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: '3e171ae8604e5087dde7d6715bfe7add91b92654', 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: '6be2f3162bd38282f19e83f98e9de401425f026d', 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 {
|
|
@@ -8626,7 +8626,7 @@ class DropiFavoriteButton {
|
|
|
8626
8626
|
}; }
|
|
8627
8627
|
}
|
|
8628
8628
|
|
|
8629
|
-
const dropiFileUploadCss = () => `:host{display:block;width:100
|
|
8629
|
+
const dropiFileUploadCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.upload-container{display:flex;flex-direction:column;gap:var(--Size-3, 12px);width:100%}.upload-header{display:flex;flex-direction:column;gap:var(--Size-1, 4px);align-items:flex-start;align-self:stretch}.upload-header .text{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 12px);font-style:normal;line-height:150%}.upload-header .title{font-weight:var(--font-weight-medium, 500)}.upload-header .label{font-weight:var(--font-weight-regular, 400)}.file-upload{display:flex;width:100%;flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-3, 12px);background:var(--Neutral-White, #ffffff)}.file-upload__zone{display:flex;padding:var(--Size-5, 24px);flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-6, 32px);align-self:stretch;border-radius:var(--Border-2, 8px);border:1px dashed var(--Gray-Gray-200, #c3c9d9);background:var(--Neutral-White, #ffffff);text-align:center;transition:border-color 0.3s ease}.file-upload__zone.drag-over{border:1px dashed var(--Primary-Primary-500, #f49a3d);background:var(--Primary-Primary-50, #fef8f1)}.info{display:flex;flex-direction:column;align-items:center;gap:var(--Size-2, 8px);align-self:stretch}.info .title{color:var(--Gray-Gray-700, #32394d);text-align:center;font-size:var(--font-size-m, 16px);font-weight:var(--font-weight-medium, 500);line-height:150%}.info.size-small-upload{flex-direction:row;gap:var(--Size-3, 12px)}.info-desc{display:flex;flex-direction:column;align-items:center;gap:var(--Size-1, 4px)}.description{color:var(--Gray-Gray-600, #475066);text-align:center;font-size:var(--font-size-s, 14px);font-style:normal;font-weight:var(--font-weight-regular, 400);line-height:150%}.upload-hidden{display:none}.files-container{display:flex;flex-direction:column;gap:var(--Size-3, 12px)}.grid-list{display:flex;align-items:flex-start;gap:var(--Size-5, 24px);align-self:stretch;flex-wrap:wrap}.add-img{display:flex;height:88px;width:88px;flex-direction:column;justify-content:center;align-items:center;gap:var(--Size-1, 4px);align-self:stretch;border-radius:var(--Border-2, 8px);background:var(--Gray-Gray-50, #f7f8fa);cursor:pointer}.add-img:hover{transform:scale(1.1)}.add-img .icon{display:flex;width:24px;height:24px;padding:4px;justify-content:center;align-items:center;flex-shrink:0;border-radius:var(--Border-3, 12px);background:var(--Gray-Gray-100, #e6eaf2)}.add-img .text{color:var(--Gray-Gray-600, #475066);text-align:center;font-size:var(--font-size-xs, 12px);font-style:normal;font-weight:var(--font-weight-regular, 400);line-height:150%}.card-list{display:flex;flex-direction:column;align-items:flex-start;gap:var(--Size-3, 12px);align-self:stretch;width:100%}.file-card{display:flex;padding:var(--Size-4, 16px);align-items:center;gap:var(--Size-3, 12px);align-self:stretch;border-radius:var(--Border-2, 8px);border:1px solid var(--Gray-Gray-100, #e6eaf2);background:var(--Neutral-White, #ffffff);width:100%}.file-card.error{border-color:var(--Error-Error-300, #f89b9c);background:var(--Error-Error-50, #fef0f0)}.file-card .preview-wrapper{width:34px;height:34px;position:relative;display:inline-block;border-radius:var(--Border-2, 8px);overflow:hidden;flex-shrink:0}.file-card .preview{width:100%;height:100%;object-fit:cover;flex-shrink:0}.file-card .preview.uploading{filter:blur(2px)}.file-card .overlay-icon{width:16px;height:16px;padding:4px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none;display:flex;justify-content:center;align-items:center;flex-shrink:0;border-radius:var(--Border-3, 12px);background:var(--Neutral-White, #ffffff)}.file-card .file-icon{flex-shrink:0}.file-card .info-container{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--Size-2, 8px);flex:1 0 0;min-width:0}.file-card .file-name{overflow:hidden;color:var(--Gray-Gray-600, #475066);text-overflow:ellipsis;font-size:var(--font-size-xs, 12px);font-style:normal;font-weight:var(--font-weight-regular, 400);line-height:150%;white-space:nowrap;max-width:300px}.file-card .file-name.error-text{color:var(--Error-Error-500, #f46a6b)}.file-card .progress-bar-container{width:100%;height:4px;background-color:#f0f0f0;border-radius:4px;overflow:hidden}.file-card .progress-bar{height:100%;border-radius:4.5px;background:var(--Primary-Primary-500, #f49a3d);transition:width 0.3s ease}.file-card .error-label{color:var(--Error-Error-500, #f46a6b);font-size:11px;font-weight:var(--font-weight-regular, 400);line-height:150%}.file-card .deleting-container{display:flex;align-items:center;flex:1 0 0}.file-card .deleting-label{color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-xs, 12px);font-style:italic;font-weight:var(--font-weight-regular, 400);line-height:150%}.file-card .delete,.file-card .preview-image{display:inline-flex;align-items:center;justify-content:center;transition:transform 0.3s ease;border-radius:var(--Border-2, 8px);flex-shrink:0;cursor:pointer}.file-card .delete:hover,.file-card .preview-image:hover{transform:scale(1.1)}.file-card .delete-confirm{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 12px);font-style:normal;font-weight:var(--font-weight-medium, 500);line-height:150%;display:flex;justify-content:space-between;align-items:center;align-self:stretch;flex:1 0 0}.file-card .delete-confirm .message{flex:1}.file-card .delete-confirm .actions{display:flex;align-items:flex-start;gap:var(--Size-2, 8px)}.img-view{display:flex;width:88px;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--Size-2, 8px)}.img-view .preview-wrapper{position:relative;display:inline-block;width:88px;height:88px}.img-view .preview-container{border-radius:var(--Border-2, 8px);overflow:hidden;width:100%;height:100%}.img-view .preview{width:100%;height:100%;object-fit:cover;flex-shrink:0}.img-view .preview.uploading{filter:blur(2px)}.img-view .overlay-icon{width:24px;height:24px;padding:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none;display:flex;justify-content:center;align-items:center;flex-shrink:0;border-radius:var(--Border-3, 12px);background:var(--Neutral-White, #ffffff)}.img-view .delete{position:absolute;top:-12px;right:-9px;display:flex;justify-content:center;align-items:center;flex-shrink:0;border-radius:var(--Border-3, 12px);background:var(--Neutral-White, #ffffff);cursor:pointer}.img-view .delete:hover{transform:scale(1.1)}.img-view.error .preview-wrapper{border:2px solid var(--Error-Error-500, #f46a6b);border-radius:var(--Border-2, 8px)}.img-view.deleting .preview-wrapper{opacity:0.4}.img-view .progress-bar-container{width:100%;height:4px;background-color:#f0f0f0;border-radius:4px;overflow:hidden}.img-view .progress-bar{height:100%;border-radius:4.5px;background:var(--Primary-Primary-500, #f49a3d);transition:width 0.3s ease}.img-view .deleting-info{width:100%;text-align:center}.img-view .deleting-info-label{color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-xxs, 10px);font-style:italic;font-weight:var(--font-weight-regular, 400);line-height:150%}@media screen and (max-width: 599px){.info.size-small-upload{flex-wrap:wrap;justify-content:center}.file-card .file-name{max-width:100px}}`;
|
|
8630
8630
|
|
|
8631
8631
|
/**
|
|
8632
8632
|
* @component dropi-file-upload
|
|
@@ -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: '407e98a26b7798d2d5c3ebcc152abc93674b16ec', class: "upload-container" }, (this.title || this.label) && (hAsync("div", { key: 'ad9a23aac5f8ea1ea3dd0d542aa3c3d1478589b5', class: "upload-header" }, this.title && hAsync("div", { key: '0291ee7f352799779397540ea041ec0283e00493', class: "text title" }, this.title), this.label && hAsync("div", { key: 'f2d19f8b47bf7696a2a5f128472bca9d17031ae1', class: "text label" }, this.label))), this.error && (hAsync("dropi-alert", { key: '0aebca5526b6978bd51e5e8f08c5e912d787345a', message: this.errorMessage, type: "default", state: "error", dismissable: true, showButton: false, onDropiClose: () => { this.error = false; } })), showDropZone && (hAsync("div", { key: '4ea44ac09f835de09923699b96dd4819ce35b647', 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: '683035c8fbea6cf01850a1852d035f09eaddbece', class: `file-upload__zone${this.dragging ? ' drag-over' : ''}` }, !isSmall && (hAsync("svg", { key: 'c8000cd2a7cedbdd1797fd46e8b8edcfc2ab46d6', width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'de53f368035cbdd45c20ee02abb6637a28ce7dd4', 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: '6b8d87a8a4657578d4071f3bbc93c8b784d5ac8e', "clip-path": "url(#up)" }, hAsync("path", { key: '059792ddca3b851ce06902a86f15c643fcd3a894', 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: '51e82a7427a6a91815ee61e4228a849e75b9f778', 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: 'bd3fdab3064619699aa70b465f7a8f742c743433' }, hAsync("clipPath", { key: '0764360b77a7e79d4e316e4af3c80546f41c8cbf', id: "up" }, hAsync("rect", { key: '9bcbdc33f546eebfe1710552559f75f72d802764', width: "16", height: "16", fill: "white", transform: "translate(12 12)" }))))), hAsync("div", { key: 'f389cf8fe7ae39cee5afbabc75bbfe05c91f53f4', class: isSmall ? 'info size-small-upload' : 'info' }, hAsync("div", { key: '962021c155a9d3f9e8b04db2b6a9f60d1e7edc7a', class: "title" }, this.textDropZone), isSmall && (hAsync("dropi-button", { key: '21b6e405cf3791b3e14b7c4829753c6518dbd777', text: this.textButton, size: "small", onClick: (e) => { e.stopPropagation(); this.openFilePicker(); } }))), !isSmall && (hAsync("div", { key: '72bf986362268ca40096cc0b3c8b8d72fe625490', class: "info-desc" }, this.accept && hAsync("div", { key: '805c719de4121a8ac1ca286029f0bcefd3a3e8af', class: "description" }, "Formatos admitidos: ", this.accept), hAsync("div", { key: '51b800716e008bc7b7a2e35199156511648fa1e5', class: "description" }, "Tama\u00F1o m\u00E1ximo: ", this.maxFileSizeMB, "MB"))), !isSmall && (hAsync("dropi-button", { key: '5eecb8856da585ca1e21dbff5a0eedfb9b0c7ab6', text: this.textButton, size: "small", onClick: (e) => { e.stopPropagation(); this.openFilePicker(); } })), hAsync("input", { key: 'a1bc72ff9c334a6ae55ad18d71af0e382739e64a', 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: '779b709474905454168c575aed075ac79a911423', class: "files-container" }, gridFiles.length > 0 && (hAsync("div", { key: 'd7d8446220c5b5f840db986e52a452854e35904a', class: "grid-list" }, gridFiles.map(f => this.renderGridItem(f)), gridFiles.length < this.maxFiles && (hAsync("div", { key: '44347916812578598e8122e757b00737594e3ecc', class: "add-img", onClick: () => this.addImage() }, hAsync("div", { key: 'd9ee216dcfa156c97b5fa26fb56f49192baed84e', class: "icon" }, hAsync("svg", { key: '8b2e788cf232c7db9f1041bec92732c923d266d1', width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '96ab340a487540eb1ad6c98bac192d86ab5db247', 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: '755630166621b9d98040defcc4cdb9b2534d70d7', class: "text" }, "Agregar"))))), cardFiles.length > 0 && (hAsync("div", { key: 'bd51e20a3fd18ba499a3d415838c7041c9a91d91', class: "card-list" }, cardFiles.map(f => this.renderCardItem(f))))))));
|
|
8862
8862
|
}
|
|
8863
8863
|
static get style() { return dropiFileUploadCss(); }
|
|
8864
8864
|
static get cmpMeta() { return {
|
|
@@ -8888,7 +8888,7 @@ class DropiFileUpload {
|
|
|
8888
8888
|
}; }
|
|
8889
8889
|
}
|
|
8890
8890
|
|
|
8891
|
-
const dropiFileUploadProgressBarCss = () => `:host{display:block;width:100
|
|
8891
|
+
const dropiFileUploadProgressBarCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.container-progress-bar{width:100%;height:100%;display:flex;padding:var(--Size-4);gap:var(--Size-3);border-radius:var(--Size-2);border:1px solid var(--Gray-Gray-100);background-color:var(--Neutral-White);min-width:0;overflow:hidden;align-items:center}.container-icon-info{background:var(--Info-Info-50);width:32px;height:32px;border-radius:var(--Size-2);display:flex;justify-content:center;align-items:center;flex-shrink:0}.icon-pdf{background:var(--Error-Error-50);border-radius:var(--Border-2);width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.image-to-view{width:34px;height:34px;border-radius:var(--Border-2);object-fit:cover;flex-shrink:0}.container-bar-title{display:flex;gap:8px;flex:1;flex-direction:column;justify-content:center;min-width:0;p{margin:0;font-size:var(--font-size-s);color:var(--Gray-Gray-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}}progress{width:100%;height:4px;-webkit-appearance:none;appearance:none;border-radius:4.5px;max-width:100%;display:block}progress::-webkit-progress-bar{background-color:var(--Gray-Gray-100);border-radius:4.5px}progress::-webkit-progress-value{background-color:var(--Primary-Primary-500);border-radius:4.5px;transition:width 0.3s ease}progress::-moz-progress-bar{background-color:var(--Primary-Primary-500);border-radius:4.5px}.view-icon,.container-icon-trash{cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:4px;border-radius:var(--Border-1);transition:background 0.2s}.view-icon:hover,.container-icon-trash:hover{background-color:var(--Gray-Gray-50)}`;
|
|
8892
8892
|
|
|
8893
8893
|
/**
|
|
8894
8894
|
* @component dropi-file-upload-progress-bar
|
|
@@ -8952,7 +8952,7 @@ class DropiFileUploadProgressBar {
|
|
|
8952
8952
|
};
|
|
8953
8953
|
}
|
|
8954
8954
|
render() {
|
|
8955
|
-
return (hAsync("div", { key: '
|
|
8955
|
+
return (hAsync("div", { key: '39afbeace57dd78bafdf9b9f14dce0d7307ecb39', class: "container-progress-bar" }, hAsync("div", { key: 'f3013f400a6049c8d1db3e100d433edb4722ade9', class: "container-icon-info", style: { display: this.fileExtension !== 'pdf' ? 'flex' : 'none' } }, this.type !== 'image' && (hAsync("dropi-icon", { key: 'e2b532707b949f8a738b12b971ae7a5a3f79a174', name: "File-text", iconWidth: "24px", iconHeight: "24px", color: "Info-Info-600" })), this.type === 'image' && !this.urlImage && (hAsync("div", { key: '90ebb53e8d183bbb3e01807a41d1ef9d2672586a', style: { width: '34px', height: '34px', borderRadius: '8px', background: 'var(--Gray-Gray-100)' } })), this.type === 'image' && this.urlImage && (hAsync("img", { key: 'c9f8b72e176606851131eeee9805fd5dd56cdac2', src: this.urlImage, class: "image-to-view", width: "34", height: "34", alt: "" }))), this.fileExtension === 'pdf' && (hAsync("div", { key: 'f1609326247d55d116c7ab5ac9528c52dece9e04', class: "icon-pdf" }, hAsync("svg", { key: '96989e4b321721bc9e39946842fe98c214558f21', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, hAsync("g", { key: 'cccc15bacec733b1e067197905190b5ca77f9352', "clip-path": "url(#clip0_6227_22223)" }, hAsync("path", { key: '2d285e9b099ed37a233ca871fa3e938c43799ac1', 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: 'ac13319383889735322d1236bf63e713f1bf1caa' }, hAsync("clipPath", { key: '782e6bff56058c7a54454222237dbaf0d15fe8fd', id: "clip0_6227_22223" }, hAsync("rect", { key: '5deb0a61c079620a83383125ff16c0185583a54a', width: "20", height: "20", fill: "white" })))))), hAsync("div", { key: 'f1793c3d3079a2a849cf9a559231650df59fe919', class: "container-bar-title" }, hAsync("p", { key: 'd08858db3e9121b8a20c923d17a28cc9a1a6e6ee' }, this.textFile), hAsync("progress", { key: 'e244b4a9ed2e1870108be08998d098e3efd34995', value: this.progress, max: "100" })), this.progress === 100 && this.isPreview && (hAsync("div", { key: '4b96072d1445589d05a70c1310b0e9f7604c1187', class: "view-icon", onClick: () => this.viewFile.emit() }, hAsync("svg", { key: '0eb8f9c28e5a4cbb3272a772744f73fc428438b5', xmlns: "http://www.w3.org/2000/svg", width: "18", height: "14", viewBox: "0 0 18 14", fill: "none" }, hAsync("path", { key: '60c18144b8e181767d42368eba1636df89ffb2d0', "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: '928ff53391aa1b6f1be3dc6b7babe5fe06d1869b', "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: 'e8929ff5f5a46add0a2dce59fa03bb796f45cb3e', class: "container-icon-trash", onClick: () => this.deleteFile.emit() }, hAsync("svg", { key: '6b140d85c27fd78f21bf2edfffe75dd76baade1e', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "21", viewBox: "0 0 20 21", fill: "none" }, hAsync("path", { key: 'eb76aa73625ded5fe309a7259dd11e2e787bfa17', 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: '43348651e80869a2c314bd8b241e6083b8eb7cbe', 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: 'd6a83d15610f3d3d14516313571afa35d331ad7c', 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": [{
|
|
@@ -9253,7 +9253,7 @@ const ICON_MAP = {
|
|
|
9253
9253
|
'add-circle': { viewBox: '0 0 24 24', paths: `<path d="M12 2a10 10 0 1 0 10 10A10.01 10.01 0 0 0 12 2m0 18.333A8.333 8.333 0 1 1 20.333 12 8.34 8.34 0 0 1 12 20.333M16.167 12a.833.833 0 0 1-.834.833h-2.5v2.5a.834.834 0 0 1-1.666 0v-2.5h-2.5a.834.834 0 0 1 0-1.666h2.5v-2.5a.834.834 0 0 1 1.666 0v2.5h2.5a.834.834 0 0 1 .834.833"/>` }
|
|
9254
9254
|
};
|
|
9255
9255
|
|
|
9256
|
-
const dropiIconCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;fill:var(--icon-fill, currentColor);overflow:hidden}svg{fill:inherit;stroke:var(--icon-fill, currentColor);stroke-width:var(--icon-stroke-width, 0);display:block;width:100%;height:100%;vertical-align:middle}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
|
|
9256
|
+
const dropiIconCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;fill:var(--icon-fill, currentColor);overflow:hidden;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}svg{fill:inherit;stroke:var(--icon-fill, currentColor);stroke-width:var(--icon-stroke-width, 0);display:block;width:100%;height:100%;vertical-align:middle}.spin{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;
|
|
9257
9257
|
|
|
9258
9258
|
class DropiIcon {
|
|
9259
9259
|
constructor(hostRef) {
|
|
@@ -9340,7 +9340,7 @@ class DropiIcon {
|
|
|
9340
9340
|
}; }
|
|
9341
9341
|
}
|
|
9342
9342
|
|
|
9343
|
-
const dropiIlustrationIconCss = () => `:host{display:inline-flex}.dropi-ilustration{display:inline-flex;align-items:center;justify-content:center}.dropi-ilustration__image,.dropi-ilustration-insignia{margin:0;display:flex;align-items:center;justify-content:center}.dropi-ilustration__image img{max-width:100%;height:auto}.dropi-ilustration__image-mb{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin:0}.dropi-ilustration__image-mb.success{background:var(--Success-Success-500, #22c55e)}.dropi-ilustration__image-mb.error{background:var(--Error-Error-500, #ef4444)}.dropi-ilustration__image-mb.info{background:var(--Info-Info-500, #3b82f6)}.dropi-ilustration__image-mb.warning{background:url('assets/icons/ilustration/bg-warning.svg') no-repeat center;background-size:contain;border-radius:0}.dropi-ilustration-insignia-tag{display:flex;align-items:center;margin:0}.dropi-ilustration-insignia-tag img{position:relative;z-index:2;height:32px;width:auto}.tag{border-radius:32px;color:var(--Neutral-White, #ffffff);text-transform:capitalize;margin:0 0 0 -20px;display:flex;align-items:center;justify-content:flex-start}.tag span{color:var(--Neutral-White, #ffffff);padding:4px 8px 4px 18px;font-size:var(--font-size-xxs)}.tag--verified{background:linear-gradient(90deg, #ffc10d 41.3%, #ff6102 112.32%)}.tag--premium{background:linear-gradient(90deg, #ff6102 56.52%, #ffc10d 107.25%)}.tag--exclusive{background:linear-gradient(90deg, var(--Gray-900, #0e111a) 26.09%, #ff6102 116.67%)}`;
|
|
9343
|
+
const dropiIlustrationIconCss = () => `:host{display:inline-flex;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.dropi-ilustration{display:inline-flex;align-items:center;justify-content:center}.dropi-ilustration__image,.dropi-ilustration-insignia{margin:0;display:flex;align-items:center;justify-content:center}.dropi-ilustration__image img{max-width:100%;height:auto}.dropi-ilustration__image-mb{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin:0}.dropi-ilustration__image-mb.success{background:var(--Success-Success-500, #22c55e)}.dropi-ilustration__image-mb.error{background:var(--Error-Error-500, #ef4444)}.dropi-ilustration__image-mb.info{background:var(--Info-Info-500, #3b82f6)}.dropi-ilustration__image-mb.warning{background:url('assets/icons/ilustration/bg-warning.svg') no-repeat center;background-size:contain;border-radius:0}.dropi-ilustration-insignia-tag{display:flex;align-items:center;margin:0}.dropi-ilustration-insignia-tag img{position:relative;z-index:2;height:32px;width:auto}.tag{border-radius:32px;color:var(--Neutral-White, #ffffff);text-transform:capitalize;margin:0 0 0 -20px;display:flex;align-items:center;justify-content:flex-start}.tag span{color:var(--Neutral-White, #ffffff);padding:4px 8px 4px 18px;font-size:var(--font-size-xxs)}.tag--verified{background:linear-gradient(90deg, #ffc10d 41.3%, #ff6102 112.32%)}.tag--premium{background:linear-gradient(90deg, #ff6102 56.52%, #ffc10d 107.25%)}.tag--exclusive{background:linear-gradient(90deg, var(--Gray-900, #0e111a) 26.09%, #ff6102 116.67%)}`;
|
|
9344
9344
|
|
|
9345
9345
|
/**
|
|
9346
9346
|
* @component dropi-ilustration-icon
|
|
@@ -9364,13 +9364,11 @@ 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
|
-
|
|
9368
|
-
|
|
9369
|
-
|
|
9370
|
-
|
|
9371
|
-
|
|
9372
|
-
};
|
|
9373
|
-
}
|
|
9367
|
+
insigniaIcons = {
|
|
9368
|
+
verified: '/assets/icons/ilustration/verified-new.svg',
|
|
9369
|
+
premium: '/assets/icons/ilustration/premium-new.svg',
|
|
9370
|
+
exclusive: '/assets/icons/ilustration/exclusive.svg',
|
|
9371
|
+
};
|
|
9374
9372
|
getIconName(state) {
|
|
9375
9373
|
const map = {
|
|
9376
9374
|
success: 'Check-circle',
|
|
@@ -9381,7 +9379,7 @@ class DropiIlustrationIcon {
|
|
|
9381
9379
|
return map[state] || 'Comment-round_info';
|
|
9382
9380
|
}
|
|
9383
9381
|
render() {
|
|
9384
|
-
return (hAsync("div", { key: '
|
|
9382
|
+
return (hAsync("div", { key: 'a8c51508251be4a888f9f6f1c1db72e8932548b1', class: "dropi-ilustration" }, this.type === 'dropi' && (hAsync("figure", { key: '53f76a6a979434ce90fe24b7c13e290020e1d65f', class: "dropi-ilustration__image" }, hAsync("img", { key: '00336310a6a9c67449766750dbf6fa92275cf104', src: `/assets/icons/ilustration/${(!this.state || String(this.state) === 'undefined' || String(this.state) === 'null') ? 'default' : this.state}.svg`, alt: this.state ?? 'default', onError: (e) => { e.target.src = '/assets/icons/ilustration/default.svg'; } }))), this.type === 'mb' && (hAsync("figure", { key: '37b4bfaa0412b007d06904e093df1d2e96337664', class: `dropi-ilustration__image-mb ${this.state}` }, ['success', 'error', 'info', 'warning'].includes(this.state) && (hAsync("dropi-icon", { key: '91e298e9859daf6fe925a72beb7ff400cbaebd7e', name: this.getIconName(this.state), iconWidth: "24px", iconHeight: "24px", color: "Neutral-White" })))), this.type === 'insignia' && (hAsync("figure", { key: 'f058946d29757e0821db6346c4103041a94010d6', class: this.tagProduct ? 'dropi-ilustration-insignia-tag' : 'dropi-ilustration-insignia' }, hAsync("img", { key: '45ad72672636b5c145cafd249ae8029c10872bf9', src: this.insigniaIcons[this.stateInsignia], alt: this.stateInsignia, onError: (e) => { e.target.src = `${this.basePath}/default.svg`; } }), this.tagProduct && (hAsync("p", { key: '6522dff159ade1d55fac7921e318524dede1c2a5', class: `tag tag--${this.stateInsignia}` }, hAsync("span", { key: 'aaa5af130374e4f4632a81840fb39ea768d74bb6', class: "Caption-S" }, this.stateInsignia.charAt(0).toUpperCase() + this.stateInsignia.slice(1))))))));
|
|
9385
9383
|
}
|
|
9386
9384
|
static get style() { return dropiIlustrationIconCss(); }
|
|
9387
9385
|
static get cmpMeta() { return {
|
|
@@ -9400,7 +9398,7 @@ class DropiIlustrationIcon {
|
|
|
9400
9398
|
}; }
|
|
9401
9399
|
}
|
|
9402
9400
|
|
|
9403
|
-
const dropiImageMiniatureCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.miniature__label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:var(--Size-2, 8px)}.miniature__grid{display:flex;flex-wrap:wrap;gap:var(--Size-2, 8px)}.miniature__item{position:relative;border-radius:var(--Border-2, 8px);overflow:hidden;cursor:pointer;flex-shrink:0}.miniature__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.2s}.miniature__zoom{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.35);opacity:0;transition:opacity 0.2s}.miniature__item:hover img{transform:scale(1.05)}.miniature__item:hover .miniature__zoom{opacity:1}`;
|
|
9401
|
+
const dropiImageMiniatureCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif)}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.miniature__label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:var(--Size-2, 8px)}.miniature__grid{display:flex;flex-wrap:wrap;gap:var(--Size-2, 8px)}.miniature__item{position:relative;border-radius:var(--Border-2, 8px);overflow:hidden;cursor:pointer;flex-shrink:0}.miniature__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.2s}.miniature__zoom{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.35);opacity:0;transition:opacity 0.2s}.miniature__item:hover img{transform:scale(1.05)}.miniature__item:hover .miniature__zoom{opacity:1}`;
|
|
9404
9402
|
|
|
9405
9403
|
/**
|
|
9406
9404
|
* @component dropi-image-miniature
|
|
@@ -9438,7 +9436,7 @@ class DropiImageMiniature {
|
|
|
9438
9436
|
}
|
|
9439
9437
|
render() {
|
|
9440
9438
|
const imgs = this.parsedImages;
|
|
9441
|
-
return (hAsync("div", { key: '
|
|
9439
|
+
return (hAsync("div", { key: '7c0349371e809443bf0c4c22101ada910a919f40', class: "miniature" }, this.label && hAsync("span", { key: 'ad3ef53f26d762b99df0438cb43cd7be2d008d71', class: "miniature__label" }, this.label), hAsync("div", { key: '266c8d550e59b3e0ed05c370c725e4357fb7f8e5', 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" }))))))));
|
|
9442
9440
|
}
|
|
9443
9441
|
static get style() { return dropiImageMiniatureCss(); }
|
|
9444
9442
|
static get cmpMeta() { return {
|
|
@@ -9456,7 +9454,7 @@ class DropiImageMiniature {
|
|
|
9456
9454
|
}; }
|
|
9457
9455
|
}
|
|
9458
9456
|
|
|
9459
|
-
const dropiImageOverlayCss = () => `:host{display:block}.overlay{position:fixed;inset:0;background:rgba(0,0,0,0.92);display:flex;justify-content:center;align-items:center;z-index:9999;animation:fade-in 0.3s ease-out}.overlay__close{position:absolute;top:24px;right:24px;background:rgba(255, 255, 255, 0.1);border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10010;transition:background 0.15s}.overlay__close:hover{background:rgba(255, 255, 255, 0.2)}.overlay__body{display:flex;width:90%;height:80%;max-width:1200px;gap:32px;align-items:center}.overlay__body--single{justify-content:center}.overlay__thumbs{display:flex;flex-direction:column;gap:12px;height:100%;overflow-y:auto;padding-right:8px;width:100px;flex-shrink:0}.overlay__thumbs::-webkit-scrollbar{width:4px}.overlay__thumbs::-webkit-scrollbar-thumb{background:var(--Gray-Gray-600);border-radius:4px}.overlay__thumb-box{width:80px;height:80px;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;flex-shrink:0;transition:border-color 0.2s}.overlay__thumb-box--active{border-color:var(--Primary-Primary-500, #f49a3d)}.overlay__thumb-img{width:100%;height:100%;object-fit:cover}.overlay__content{flex:1;height:100%;position:relative;display:flex;justify-content:center;align-items:center}.overlay__main-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.5);animation:scale-up 0.3s ease-out}.overlay__nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255, 255, 255, 0.1);border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background 0.2s;z-index:5}.overlay__nav:hover{background:rgba(255, 255, 255, 0.2)}.overlay__nav--prev{left:-24px}.overlay__nav--next{right:-24px;background:var(--Neutral-White)}.overlay__nav--next:hover{background:var(--Neutral-White)}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes scale-up{from{transform:scale(0.9);opacity:0}to{transform:scale(1);opacity:1}}`;
|
|
9457
|
+
const dropiImageOverlayCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif)}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.overlay{position:fixed;inset:0;background:rgba(0,0,0,0.92);display:flex;justify-content:center;align-items:center;z-index:9999;animation:fade-in 0.3s ease-out}.overlay__close{position:absolute;top:24px;right:24px;background:rgba(255, 255, 255, 0.1);border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10010;transition:background 0.15s}.overlay__close:hover{background:rgba(255, 255, 255, 0.2)}.overlay__body{display:flex;width:90%;height:80%;max-width:1200px;gap:32px;align-items:center}.overlay__body--single{justify-content:center}.overlay__thumbs{display:flex;flex-direction:column;gap:12px;height:100%;overflow-y:auto;padding-right:8px;width:100px;flex-shrink:0}.overlay__thumbs::-webkit-scrollbar{width:4px}.overlay__thumbs::-webkit-scrollbar-thumb{background:var(--Gray-Gray-600);border-radius:4px}.overlay__thumb-box{width:80px;height:80px;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;flex-shrink:0;transition:border-color 0.2s}.overlay__thumb-box--active{border-color:var(--Primary-Primary-500, #f49a3d)}.overlay__thumb-img{width:100%;height:100%;object-fit:cover}.overlay__content{flex:1;height:100%;position:relative;display:flex;justify-content:center;align-items:center}.overlay__main-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.5);animation:scale-up 0.3s ease-out}.overlay__nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255, 255, 255, 0.1);border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background 0.2s;z-index:5}.overlay__nav:hover{background:rgba(255, 255, 255, 0.2)}.overlay__nav--prev{left:-24px}.overlay__nav--next{right:-24px;background:var(--Neutral-White)}.overlay__nav--next:hover{background:var(--Neutral-White)}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes scale-up{from{transform:scale(0.9);opacity:0}to{transform:scale(1);opacity:1}}`;
|
|
9460
9458
|
|
|
9461
9459
|
/**
|
|
9462
9460
|
* @component dropi-image-overlay
|
|
@@ -9532,7 +9530,7 @@ class DropiImageOverlay {
|
|
|
9532
9530
|
}; }
|
|
9533
9531
|
}
|
|
9534
9532
|
|
|
9535
|
-
const dropiInputCss = () => `:host{display:block;width:100
|
|
9533
|
+
const dropiInputCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.fixed-label-container{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:8px}.input-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);text-align:left}.asterisk{color:var(--Error-Error-500, #f46a6b)}.form-group{position:relative;width:100%}.input-container{position:relative}.icon-input{position:absolute;top:50%;left:12px;transform:translateY(-50%);z-index:1;display:flex;align-items:center;justify-content:center}.icon-input-password{position:absolute;top:50%;right:13px;transform:translateY(-50%);cursor:pointer;z-index:1;display:flex;align-items:center;justify-content:center}.form-control{box-sizing:border-box;width:100%;padding:var(--Size-2, 8px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);transition:border-color 0.3s ease-in-out;height:40px;outline:none;appearance:none;text-align:left}.form-control::placeholder{color:transparent;transition:color 0.2s ease-in-out}.form-control:focus::placeholder,.fixed-label-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.padding-icon{padding-left:40px}.input-container--has-icon label.label-bottom{left:40px}.input-container--has-icon .form-control:focus+label.label-bottom,.input-container--has-icon .form-control:not(:placeholder-shown)+label.label-bottom{left:0}.text-password{-webkit-text-security:disc;text-security:disc}label.label-bottom{position:absolute;font-weight:var(--font-weight-regular, 400);top:10px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c);left:10px;transition:all 0.2s ease-in-out;pointer-events:none;overflow:hidden;width:90%;white-space:nowrap}.form-control:focus+label.label-bottom,.form-control:not(:placeholder-shown)+label.label-bottom{top:-22px;left:0;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);width:unset}.form-control:disabled+label.label-bottom{color:var(--Gray-Gray-400, #858ea6)}.form-control-helper{display:flex;position:absolute;top:100%;left:0;gap:4px;align-items:center;margin-top:4px}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}.disabled-helper{color:var(--Gray-Gray-400, #858ea6) !important}`;
|
|
9536
9534
|
|
|
9537
9535
|
/**
|
|
9538
9536
|
* @component dropi-input
|
|
@@ -9782,14 +9780,14 @@ class DropiInput {
|
|
|
9782
9780
|
render() {
|
|
9783
9781
|
const showObligatoryAsterisk = this.required && this.showObligatoryAsterisk && !this.disabled;
|
|
9784
9782
|
const showIconInline = !!this.icon;
|
|
9785
|
-
return (hAsync("div", { key: '
|
|
9783
|
+
return (hAsync("div", { key: 'b72b45a9f0a400a09fde388f41d06bacd308fa7d', class: { 'fixed-label-container': this.fixedLabel } }, this.fixedLabel && (hAsync("label", { key: '9381114b6188475d0c71d17ef4dff52811f4cad8', class: "input-label Body-S-Regular", htmlFor: this.resolvedId }, this.label, showObligatoryAsterisk && hAsync("span", { key: 'b85900a3a6d0c39f7a4aeb7a30dcb9be0a6b5c5b', class: "asterisk" }, " *"))), hAsync("div", { key: '26240513e57c894ce840895bc9492c6c2a6818f0', class: "form-group" }, hAsync("div", { key: 'c5dd44d4b6e02dc37bccb99b30c8f0673c08743c', class: { 'input-container': true, 'input-container--has-icon': showIconInline } }, showIconInline && (hAsync("dropi-icon", { key: '54fd55147d5354bcc7002ff27c40bba21097bf0e', class: "icon-input", name: this.icon, color: this.iconColor, iconWidth: "20px", iconHeight: "20px", style: { width: '20px', height: '20px' } })), this.passwordInput && (hAsync("dropi-icon", { key: '818e11d8674c1ebc48ace50038b422c5c533d998', 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: '782d8ba72bd59a127b6da4bf54f54955a60bae5e', id: this.resolvedId, class: {
|
|
9786
9784
|
'form-control': true,
|
|
9787
9785
|
'form-control-valid': !this.isInvalid && this.touched && !!this.value,
|
|
9788
9786
|
'form-control-invalid': this.isInvalid,
|
|
9789
9787
|
'padding-icon': showIconInline,
|
|
9790
9788
|
'text-password': this.passwordInput && !this.showPassword,
|
|
9791
9789
|
'fixed-label-input': this.fixedLabel,
|
|
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: '
|
|
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: '4d84150f83856508a63785a31543ed1b3c65eff3', class: "Body-S-Regular label-bottom", htmlFor: this.resolvedId }, this.label, showObligatoryAsterisk && hAsync("span", { key: 'c6f1b61254851d52d4fbbdd9f71bff57ad4b43fa', class: "asterisk" }, " *"))), this.showHelper && (hAsync("div", { key: 'ed45a1e3adcf7d2063a6d212a4250a07d9cc274a', class: "form-control-helper" }, this.isInvalid && hAsync("dropi-icon", { key: '1406953e6665b9a4e8ee2527c0f247ef2c52882a', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), hAsync("span", { key: 'ce1ee3a839856c408b58f737ac7fae63bad779e6', class: {
|
|
9793
9791
|
'disabled-helper': this.disabled,
|
|
9794
9792
|
'invalid-color': this.isInvalid,
|
|
9795
9793
|
} }, this.textHelper)))))));
|
|
@@ -9844,7 +9842,7 @@ class DropiInput {
|
|
|
9844
9842
|
}; }
|
|
9845
9843
|
}
|
|
9846
9844
|
|
|
9847
|
-
const dropiLanguagesSelectorCss = () => `:host{display:inline-block;position:relative}*,*::before,*::after{box-sizing:border-box}.custom-dropdown{position:relative;cursor:pointer;user-select:none}.custom-dropdown.open dropi-icon{transform:rotate(180deg)}.selected-option{display:flex;height:
|
|
9845
|
+
const dropiLanguagesSelectorCss = () => `:host{display:inline-block;position:relative}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.custom-dropdown{position:relative;cursor:pointer;user-select:none}.custom-dropdown.open dropi-icon{transform:rotate(180deg)}.selected-option{display:flex;height:40px;padding:var(--Size-2, 8px) var(--Size-3, 12px);align-items:center;gap:var(--Size-2, 8px);border-radius:4px;border:1px solid var(--Gray-Gray-200, #c3c9d9);background:var(--Neutral-White, #ffffff);font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066)}.dropdown-options{position:absolute;top:100%;left:0;right:0;background:white;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:6px;margin-top:4px;z-index:1000;overflow-y:auto;box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);padding:0;list-style:none;height:0;opacity:0;visibility:hidden;transition:height 0.2s ease, opacity 0.2s ease, visibility 0.2s ease;max-height:0}.dropdown-options.dropdown-open{max-height:300px;height:auto;opacity:1;visibility:visible}.dropdown-options li{padding:8px 12px;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066)}.dropdown-options li:hover,.dropdown-options li.active{background:var(--Gray-Gray-50, #f7f8fa)}@media screen and (max-width: 720px){.selected-option span,.dropdown-options li span{display:none}}`;
|
|
9848
9846
|
|
|
9849
9847
|
/**
|
|
9850
9848
|
* @component dropi-languages-selector
|
|
@@ -9923,7 +9921,7 @@ class DropiLanguagesSelector {
|
|
|
9923
9921
|
}; }
|
|
9924
9922
|
}
|
|
9925
9923
|
|
|
9926
|
-
const dropiLogoCss = () => `:host{display:inline-block}.dropi-logo{margin:0;padding:0;display:flex;align-items:center;justify-content:center}.dropi-logo img{display:block;object-fit:contain}.dropi-logo--large img{width:256px;height:84px}.dropi-logo--small img{width:86px;height:81px}`;
|
|
9924
|
+
const dropiLogoCss = () => `:host{display:inline-block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.dropi-logo{margin:0;padding:0;display:flex;align-items:center;justify-content:center}.dropi-logo img{display:block;object-fit:contain}.dropi-logo--large img{width:256px;height:84px}.dropi-logo--small img{width:86px;height:81px}`;
|
|
9927
9925
|
|
|
9928
9926
|
const FALLBACK_SVG = `data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgNDAiPjx0ZXh0IHk9IjMwIiBmb250LXNpemU9IjI0IiBmb250LWZhbWlseT0ic2Fucy1zZXJpZiIgZmlsbD0iIzg1OGVhNiI+ZHJvcGk8L3RleHQ+PC9zdmc+`;
|
|
9929
9927
|
/**
|
|
@@ -9954,7 +9952,7 @@ class DropiLogo {
|
|
|
9954
9952
|
e.target.src = FALLBACK_SVG;
|
|
9955
9953
|
}
|
|
9956
9954
|
render() {
|
|
9957
|
-
return (hAsync("figure", { key: '
|
|
9955
|
+
return (hAsync("figure", { key: 'bd2383909e65f976a8a85a4b2f58d1d9f271799c', class: { 'dropi-logo': true, [`dropi-logo--${this.size}`]: true } }, hAsync("img", { key: '1aaaf412c2991db5b92180bce8528deef2c5914e', src: this.urlLogo || FALLBACK_SVG, alt: "Dropi logo", onError: (e) => this.handleError(e) })));
|
|
9958
9956
|
}
|
|
9959
9957
|
static get style() { return dropiLogoCss(); }
|
|
9960
9958
|
static get cmpMeta() { return {
|
|
@@ -9971,7 +9969,7 @@ class DropiLogo {
|
|
|
9971
9969
|
}; }
|
|
9972
9970
|
}
|
|
9973
9971
|
|
|
9974
|
-
const dropiLottieLoaderCss = () => `:host{display:block}.loader-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.85);z-index:9999}.loader-container{display:flex;flex-direction:column;align-items:center;gap:var(--Size-4, 16px)}.lottie-animation{display:flex;align-items:center;justify-content:center;width:300px;height:300px}.lottie-animation lottie-player{display:block;width:300px !important;height:300px !important}.loader-text{display:flex;flex-direction:column;align-items:center;gap:var(--Size-2, 8px);text-align:center}.loader-title{margin:0;font-size:var(--font-size-m, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.loader-message{margin:0;font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-500, #69738c)}`;
|
|
9972
|
+
const dropiLottieLoaderCss = () => `:host{display:block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.loader-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.85);z-index:9999}.loader-container{display:flex;flex-direction:column;align-items:center;gap:var(--Size-4, 16px)}.lottie-animation{display:flex;align-items:center;justify-content:center;width:300px;height:300px}.lottie-animation lottie-player{display:block;width:300px !important;height:300px !important}.loader-text{display:flex;flex-direction:column;align-items:center;gap:var(--Size-2, 8px);text-align:center}.loader-title{margin:0;font-size:var(--font-size-m, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.loader-message{margin:0;font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-500, #69738c)}`;
|
|
9975
9973
|
|
|
9976
9974
|
/**
|
|
9977
9975
|
* @component dropi-lottie-loader
|
|
@@ -10010,7 +10008,7 @@ class DropiLottieLoader {
|
|
|
10010
10008
|
}; }
|
|
10011
10009
|
}
|
|
10012
10010
|
|
|
10013
|
-
const dropiMediaPlayerCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.dropi-media-player{position:relative;width:100%;max-width:335px;height:auto;aspect-ratio:335 / 567;background-color:var(--Neutral-Black);border-radius:var(--Border-2, 8px);overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer}.dropi-media-player--mobile-vertical{max-width:335px;aspect-ratio:335 / 567}.dropi-media-player--mobile-compact{max-width:335px;aspect-ratio:335 / 337}.dropi-media-player--desktop{max-width:587px;aspect-ratio:587 / 567}.dropi-media-player__video{width:100%;height:100%;object-fit:cover}.dropi-media-player__center-play{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:400px;background-color:rgba(14, 17, 26, 0.6);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;transition:opacity 0.3s ease;pointer-events:auto}.dropi-media-player__center-play--hidden{opacity:0;pointer-events:none}.dropi-media-player__controls-bar{position:absolute;bottom:0;left:0;width:100%;height:72px;padding:24px;display:flex;flex-direction:row;align-items:center;gap:10px;background:linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);transition:opacity 0.3s ease;box-sizing:border-box}.dropi-media-player__controls-bar--hidden{opacity:0;pointer-events:none}.dropi-media-player__timestamp{font-family:'Inter', sans-serif;font-size:var(--font-size-xs, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Neutral-White);white-space:nowrap;flex-shrink:0}.dropi-media-player__progress{flex:1;padding:6px 0;cursor:pointer;position:relative}.dropi-media-player__progress-track{position:relative;width:100%;height:5px;border-radius:var(--Border-2, 8px);background-color:var(--Gray-Gray-700, #32394d)}.dropi-media-player__progress-fill{height:100%;background-color:var(--Neutral-White);border-radius:var(--Border-2, 8px);will-change:width}.dropi-media-player__progress-thumb{position:absolute;top:50%;transform:translate(-50%, -50%);width:12px;height:12px;border-radius:50%;background-color:var(--Neutral-White);pointer-events:none;will-change:left}.dropi-media-player__actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.dropi-media-player__btn{-webkit-appearance:none;appearance:none;background:transparent;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--Neutral-White);transition:opacity 0.15s ease}.dropi-media-player__btn:hover{opacity:0.8}.dropi-media-player__btn--speed{font-family:'Inter', sans-serif;font-size:var(--font-size-sm, 14px);font-weight:var(--font-weight-medium, 500);color:var(--Neutral-White);min-width:20px}.dropi-media-player__speed-control{position:relative;display:flex;align-items:center}.dropi-media-player__speed-menu{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--Gray-Gray-800, #1f2433);border-radius:var(--Border-2, 8px);padding:6px 0;min-width:44px;display:flex;flex-direction:column;z-index:20}.dropi-media-player__speed-option{-webkit-appearance:none;appearance:none;background:transparent;border:none;padding:6px 10px;font-family:'Inter', sans-serif;font-size:var(--font-size-s);font-weight:var(--font-weight-medium);color:var(--Neutral-White);cursor:pointer;text-align:center;white-space:nowrap;transition:opacity 0.15s ease}.dropi-media-player__speed-option--active{color:var(--Primary-Primary-500, #f49a3d)}.dropi-media-player__speed-option:hover{opacity:0.8}.dropi-media-player__volume-control{position:relative;display:flex;align-items:center}.dropi-media-player__volume-popup{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:32px;height:108px;display:flex;align-items:center;justify-content:center;background:var(--Gray-Gray-800, #1f2433);border-radius:var(--Border-2, 8px);overflow:visible;z-index:20}.dropi-media-player__volume-slider{-webkit-appearance:none;appearance:none;width:97px;height:8px;transform:rotate(-90deg);border-radius:4px;cursor:pointer;outline:none;flex-shrink:0}.dropi-media-player__volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--Neutral-White);cursor:pointer}.dropi-media-player__volume-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--Neutral-White);border:none;cursor:pointer}.dropi-media-player__volume-slider::-webkit-slider-runnable-track{border-radius:4px}.dropi-media-player__volume-slider::-moz-range-track{height:8px;background:var(--Gray-Gray-700, #32394d);border-radius:4px}.dropi-media-player__blur-bg{display:none;position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(21px);transform:scale(1.15);z-index:0}.dropi-media-player__blur-overlay{display:none;position:absolute;inset:0;background-color:rgba(0, 0, 0, 0.7);z-index:0}.dropi-media-player.is-fullscreen,.dropi-media-player:fullscreen{max-width:none;aspect-ratio:auto;width:100vw;height:100vh;border-radius:0}.dropi-media-player.is-fullscreen .dropi-media-player__blur-bg,.dropi-media-player:fullscreen .dropi-media-player__blur-bg,.dropi-media-player.is-fullscreen .dropi-media-player__blur-overlay,.dropi-media-player:fullscreen .dropi-media-player__blur-overlay{display:block}.dropi-media-player.is-fullscreen .dropi-media-player__video,.dropi-media-player:fullscreen .dropi-media-player__video{object-fit:contain;position:relative;z-index:1}.dropi-media-player.is-fullscreen .dropi-media-player__center-play,.dropi-media-player:fullscreen .dropi-media-player__center-play,.dropi-media-player.is-fullscreen .dropi-media-player__controls-bar,.dropi-media-player:fullscreen .dropi-media-player__controls-bar{z-index:2}`;
|
|
10011
|
+
const dropiMediaPlayerCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.dropi-media-player{position:relative;width:100%;max-width:335px;height:auto;aspect-ratio:335 / 567;background-color:var(--Neutral-Black);border-radius:var(--Border-2, 8px);overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer}.dropi-media-player--mobile-vertical{max-width:335px;aspect-ratio:335 / 567}.dropi-media-player--mobile-compact{max-width:335px;aspect-ratio:335 / 337}.dropi-media-player--desktop{max-width:587px;aspect-ratio:587 / 567}.dropi-media-player__video{width:100%;height:100%;object-fit:cover}.dropi-media-player__center-play{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:400px;background-color:rgba(14, 17, 26, 0.6);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;transition:opacity 0.3s ease;pointer-events:auto}.dropi-media-player__center-play--hidden{opacity:0;pointer-events:none}.dropi-media-player__controls-bar{position:absolute;bottom:0;left:0;width:100%;height:72px;padding:24px;display:flex;flex-direction:row;align-items:center;gap:10px;background:linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000);transition:opacity 0.3s ease;box-sizing:border-box}.dropi-media-player__controls-bar--hidden{opacity:0;pointer-events:none}.dropi-media-player__timestamp{font-family:var(--font-family-01, 'Inter', sans-serif);font-size:var(--font-size-xs, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Neutral-White);white-space:nowrap;flex-shrink:0}.dropi-media-player__progress{flex:1;padding:6px 0;cursor:pointer;position:relative}.dropi-media-player__progress-track{position:relative;width:100%;height:5px;border-radius:var(--Border-2, 8px);background-color:var(--Gray-Gray-700, #32394d)}.dropi-media-player__progress-fill{height:100%;background-color:var(--Neutral-White);border-radius:var(--Border-2, 8px);will-change:width}.dropi-media-player__progress-thumb{position:absolute;top:50%;transform:translate(-50%, -50%);width:12px;height:12px;border-radius:50%;background-color:var(--Neutral-White);pointer-events:none;will-change:left}.dropi-media-player__actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.dropi-media-player__btn{-webkit-appearance:none;appearance:none;background:transparent;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--Neutral-White);transition:opacity 0.15s ease}.dropi-media-player__btn:hover{opacity:0.8}.dropi-media-player__btn--speed{font-family:var(--font-family-01, 'Inter', sans-serif);font-size:var(--font-size-sm, 14px);font-weight:var(--font-weight-medium, 500);color:var(--Neutral-White);min-width:20px}.dropi-media-player__speed-control{position:relative;display:flex;align-items:center}.dropi-media-player__speed-menu{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--Gray-Gray-800, #1f2433);border-radius:var(--Border-2, 8px);padding:6px 0;min-width:44px;display:flex;flex-direction:column;z-index:20}.dropi-media-player__speed-option{-webkit-appearance:none;appearance:none;background:transparent;border:none;padding:6px 10px;font-family:var(--font-family-01, 'Inter', sans-serif);font-size:var(--font-size-s);font-weight:var(--font-weight-medium);color:var(--Neutral-White);cursor:pointer;text-align:center;white-space:nowrap;transition:opacity 0.15s ease}.dropi-media-player__speed-option--active{color:var(--Primary-Primary-500, #f49a3d)}.dropi-media-player__speed-option:hover{opacity:0.8}.dropi-media-player__volume-control{position:relative;display:flex;align-items:center}.dropi-media-player__volume-popup{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:32px;height:108px;display:flex;align-items:center;justify-content:center;background:var(--Gray-Gray-800, #1f2433);border-radius:var(--Border-2, 8px);overflow:visible;z-index:20}.dropi-media-player__volume-slider{-webkit-appearance:none;appearance:none;width:97px;height:8px;transform:rotate(-90deg);border-radius:4px;cursor:pointer;outline:none;flex-shrink:0}.dropi-media-player__volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--Neutral-White);cursor:pointer}.dropi-media-player__volume-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--Neutral-White);border:none;cursor:pointer}.dropi-media-player__volume-slider::-webkit-slider-runnable-track{border-radius:4px}.dropi-media-player__volume-slider::-moz-range-track{height:8px;background:var(--Gray-Gray-700, #32394d);border-radius:4px}.dropi-media-player__blur-bg{display:none;position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(21px);transform:scale(1.15);z-index:0}.dropi-media-player__blur-overlay{display:none;position:absolute;inset:0;background-color:rgba(0, 0, 0, 0.7);z-index:0}.dropi-media-player.is-fullscreen,.dropi-media-player:fullscreen{max-width:none;aspect-ratio:auto;width:100vw;height:100vh;border-radius:0}.dropi-media-player.is-fullscreen .dropi-media-player__blur-bg,.dropi-media-player:fullscreen .dropi-media-player__blur-bg,.dropi-media-player.is-fullscreen .dropi-media-player__blur-overlay,.dropi-media-player:fullscreen .dropi-media-player__blur-overlay{display:block}.dropi-media-player.is-fullscreen .dropi-media-player__video,.dropi-media-player:fullscreen .dropi-media-player__video{object-fit:contain;position:relative;z-index:1}.dropi-media-player.is-fullscreen .dropi-media-player__center-play,.dropi-media-player:fullscreen .dropi-media-player__center-play,.dropi-media-player.is-fullscreen .dropi-media-player__controls-bar,.dropi-media-player:fullscreen .dropi-media-player__controls-bar{z-index:2}`;
|
|
10014
10012
|
|
|
10015
10013
|
class DropiMediaPlayer {
|
|
10016
10014
|
constructor(hostRef) {
|
|
@@ -10225,7 +10223,7 @@ class DropiMediaPlayer {
|
|
|
10225
10223
|
}; }
|
|
10226
10224
|
}
|
|
10227
10225
|
|
|
10228
|
-
const dropiModalCss = () => `:host{display:contents}*,*::before,*::after{box-sizing:border-box}.modal-root{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0;transition:opacity 0.18s ease;z-index:var(--dropi-z-index-modal, 9999);visibility:hidden}.modal-root--open{opacity:1;pointer-events:auto;visibility:visible}.modal-root--closing{opacity:1;pointer-events:none;visibility:visible}.modal-mask{position:absolute;inset:0;background:rgba(6,11,16,0.66);pointer-events:auto;opacity:0;transition:opacity 0.18s ease}.modal-root--open .modal-mask{opacity:1}.modal-root--closing .modal-mask{opacity:0}.modal-panel{position:relative;pointer-events:auto;display:flex;flex-direction:column;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);box-shadow:0 0 60px rgba(0,0,0,0.06);overflow:hidden;padding:var(--Size-6, 32px);gap:var(--Size-5, 24px);max-height:calc(100vh - 60px);opacity:0;transform:translateY(16px) scale(0.92);transition:opacity 0.18s ease, transform 0.18s ease}.modal-root--open .modal-panel{opacity:1;transform:none}.modal-root--closing .modal-panel{opacity:0;transform:translateY(-12px) scale(1.06)}.modal-header{display:flex;align-items:center;gap:4px}.modal-title{color:var(--Gray-Gray-700,#32394d);font-size:var(--Size-5, 24px);font-weight:var(--font-weight-bold);flex:1;text-align:left}.modal-close{margin-left:auto;border:0;background:transparent;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:var(--font-size-xxl);line-height:1;color:var(--Gray-Gray-400)}.modal-close:hover{opacity:0.7}.modal-content{padding-right:8px;overflow:auto;flex:1;display:flex;flex-direction:column;scrollbar-width:thin;scrollbar-color:var(--Gray-Gray-300,#a3abbf) var(--Gray-Gray-50,#f7f8fa)}.modal-content::-webkit-scrollbar{width:4px}.modal-content::-webkit-scrollbar-track{background:var(--Gray-Gray-50,#f7f8fa);border-radius:16px}.modal-content::-webkit-scrollbar-thumb{background:var(--Gray-Gray-300,#a3abbf);border-radius:16px}.modal-footer{display:flex;justify-content:flex-end;align-items:flex-start;gap:var(--Size-1, 4px);width:100%;margin-top:auto;flex-shrink:0}.modal-footer:empty{display:none}::slotted(.button-container){display:grid;grid-template-columns:1fr 1fr;gap:var(--Size-4, 16px);min-width:470px;width:100%}::slotted(.button-container)>*{width:100%}::slotted(.button-container) dropi-button{width:100%}.modal-panel.size-m .modal-footer,.modal-panel.size-s .modal-footer,.modal-panel.size-xs .modal-footer{justify-content:flex-end}.modal-panel.size-m .modal-footer ::slotted(.button-container),.modal-panel.size-s .modal-footer ::slotted(.button-container),.modal-panel.size-xs .modal-footer ::slotted(.button-container){min-width:unset !important;width:100%}.modal-panel.size-drawer-s .modal-footer ::slotted(.button-container){min-width:unset;display:flex;flex-direction:column-reverse;gap:var(--Size-4, 16px)}.modal-panel.size-full{width:100%;height:100vh;max-height:100vh;border-radius:0}.modal-panel.size-xxl{width:calc(100% - 60px);max-width:1520px;height:calc(100vh - 120px);max-height:900px}.modal-panel.size-l{width:1137px;max-width:1137px;max-height:754px}.modal-panel.size-m{max-width:550px;width:550px}.modal-panel.size-s{width:454px}.modal-panel.size-xs{width:320px;padding:24px;gap:16px}.modal-root--right{align-items:stretch;justify-content:flex-end}.modal-root--right .modal-panel{height:100vh;max-height:100vh;border-radius:0;gap:0;opacity:1;transform:translateX(100%);transition:transform 0.32s cubic-bezier(0.4,0,0.2,1)}.modal-root--open.modal-root--right .modal-panel{transform:translateX(0)}.modal-root--closing.modal-root--right .modal-panel{transform:translateX(100%)}.modal-root--right .modal-panel.size-drawer-s{width:351px;padding:20px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-drawer-m{width:550px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-drawer-l{width:1137px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-drawer-xxl{width:1214px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-sidebar-half{width:50vw;min-width:600px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}@media (max-width: 768px){.modal-root--right .modal-panel.size-drawer-s,.modal-root--right .modal-panel.size-drawer-m,.modal-root--right .modal-panel.size-drawer-l,.modal-root--right .modal-panel.size-drawer-xxl,.modal-root--right .modal-panel.size-sidebar-half{width:100vw;min-width:unset}}.modal-root--left{align-items:stretch;justify-content:flex-start}.modal-root--left .modal-panel{height:100vh;max-height:100vh;border-radius:0;gap:0;opacity:1;transform:translateX(-100%);transition:transform 0.32s cubic-bezier(0.4,0,0.2,1)}.modal-root--open.modal-root--left .modal-panel{transform:translateX(0)}.modal-root--closing.modal-root--left .modal-panel{transform:translateX(-100%)}.modal-root--top{align-items:flex-start}.modal-root--bottom{align-items:flex-end}@media (max-width: 599px){.modal-panel{padding:20px;width:100% !important}.modal-panel:not(.size-s){border-radius:0 !important;height:100% !important;max-height:unset !important}.modal-root--right .modal-panel{width:100vw !important;min-width:unset !important}.modal-footer{justify-content:center}.modal-footer ::slotted(.button-container){width:100%;min-width:unset !important;display:flex;flex-direction:column-reverse;gap:var(--Size-4, 16px)}}@media (prefers-reduced-motion: reduce){.modal-root,.modal-mask,.modal-panel{transition:none !important}}`;
|
|
10226
|
+
const dropiModalCss = () => `:host{display:contents;font-family:var(--font-family-01, 'Inter', sans-serif)}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.modal-root{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0;transition:opacity 0.18s ease;z-index:var(--dropi-z-index-modal, 9999);visibility:hidden}.modal-root--open{opacity:1;pointer-events:auto;visibility:visible}.modal-root--closing{opacity:1;pointer-events:none;visibility:visible}.modal-mask{position:absolute;inset:0;background:rgba(6,11,16,0.66);pointer-events:auto;opacity:0;transition:opacity 0.18s ease}.modal-root--open .modal-mask{opacity:1}.modal-root--closing .modal-mask{opacity:0}.modal-panel{position:relative;pointer-events:auto;display:flex;flex-direction:column;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);box-shadow:0 0 60px rgba(0,0,0,0.06);overflow:hidden;padding:var(--Size-6, 32px);gap:var(--Size-5, 24px);max-height:calc(100vh - 60px);opacity:0;transform:translateY(16px) scale(0.92);transition:opacity 0.18s ease, transform 0.18s ease}.modal-root--open .modal-panel{opacity:1;transform:none}.modal-root--closing .modal-panel{opacity:0;transform:translateY(-12px) scale(1.06)}.modal-header{display:flex;align-items:center;gap:4px}.modal-title{color:var(--Gray-Gray-700,#32394d);font-size:var(--Size-5, 24px);font-weight:var(--font-weight-bold);flex:1;text-align:left}.modal-close{margin-left:auto;border:0;background:transparent;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:var(--font-size-xxl);line-height:1;color:var(--Gray-Gray-400)}.modal-close:hover{opacity:0.7}.modal-content{padding-right:8px;overflow:auto;flex:1;display:flex;flex-direction:column;scrollbar-width:thin;scrollbar-color:var(--Gray-Gray-300,#a3abbf) var(--Gray-Gray-50,#f7f8fa)}.modal-content::-webkit-scrollbar{width:4px}.modal-content::-webkit-scrollbar-track{background:var(--Gray-Gray-50,#f7f8fa);border-radius:16px}.modal-content::-webkit-scrollbar-thumb{background:var(--Gray-Gray-300,#a3abbf);border-radius:16px}.modal-footer{display:flex;justify-content:flex-end;align-items:flex-start;gap:var(--Size-1, 4px);width:100%;margin-top:auto;flex-shrink:0}.modal-footer:empty{display:none}::slotted(.button-container){display:grid;grid-template-columns:1fr 1fr;gap:var(--Size-4, 16px);min-width:470px;width:100%}::slotted(.button-container)>*{width:100%}::slotted(.button-container) dropi-button{width:100%}.modal-panel.size-m .modal-footer,.modal-panel.size-s .modal-footer,.modal-panel.size-xs .modal-footer{justify-content:flex-end}.modal-panel.size-m .modal-footer ::slotted(.button-container),.modal-panel.size-s .modal-footer ::slotted(.button-container),.modal-panel.size-xs .modal-footer ::slotted(.button-container){min-width:unset !important;width:100%}.modal-panel.size-drawer-s .modal-footer ::slotted(.button-container){min-width:unset;display:flex;flex-direction:column-reverse;gap:var(--Size-4, 16px)}.modal-panel.size-full{width:100%;height:100vh;max-height:100vh;border-radius:0}.modal-panel.size-xxl{width:calc(100% - 60px);max-width:1520px;height:calc(100vh - 120px);max-height:900px}.modal-panel.size-l{width:1137px;max-width:1137px;max-height:754px}.modal-panel.size-m{max-width:550px;width:550px}.modal-panel.size-s{width:454px}.modal-panel.size-xs{width:320px;padding:24px;gap:16px}.modal-root--right{align-items:stretch;justify-content:flex-end}.modal-root--right .modal-panel{height:100vh;max-height:100vh;border-radius:0;gap:0;opacity:1;transform:translateX(100%);transition:transform 0.32s cubic-bezier(0.4,0,0.2,1)}.modal-root--open.modal-root--right .modal-panel{transform:translateX(0)}.modal-root--closing.modal-root--right .modal-panel{transform:translateX(100%)}.modal-root--right .modal-panel.size-drawer-s{width:351px;padding:20px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-drawer-m{width:550px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-drawer-l{width:1137px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-drawer-xxl{width:1214px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}.modal-root--right .modal-panel.size-sidebar-half{width:50vw;min-width:600px;box-shadow:0 8px 40px rgba(0,0,0,0.16)}@media (max-width: 768px){.modal-root--right .modal-panel.size-drawer-s,.modal-root--right .modal-panel.size-drawer-m,.modal-root--right .modal-panel.size-drawer-l,.modal-root--right .modal-panel.size-drawer-xxl,.modal-root--right .modal-panel.size-sidebar-half{width:100vw;min-width:unset}}.modal-root--left{align-items:stretch;justify-content:flex-start}.modal-root--left .modal-panel{height:100vh;max-height:100vh;border-radius:0;gap:0;opacity:1;transform:translateX(-100%);transition:transform 0.32s cubic-bezier(0.4,0,0.2,1)}.modal-root--open.modal-root--left .modal-panel{transform:translateX(0)}.modal-root--closing.modal-root--left .modal-panel{transform:translateX(-100%)}.modal-root--top{align-items:flex-start}.modal-root--bottom{align-items:flex-end}@media (max-width: 599px){.modal-panel{padding:20px;width:100% !important}.modal-panel:not(.size-s){border-radius:0 !important;height:100% !important;max-height:unset !important}.modal-root--right .modal-panel{width:100vw !important;min-width:unset !important}.modal-footer{justify-content:center}.modal-footer ::slotted(.button-container){width:100%;min-width:unset !important;display:flex;flex-direction:column-reverse;gap:var(--Size-4, 16px)}}@media (prefers-reduced-motion: reduce){.modal-root,.modal-mask,.modal-panel{transition:none !important}}`;
|
|
10229
10227
|
|
|
10230
10228
|
/**
|
|
10231
10229
|
* @component dropi-modal
|
|
@@ -10356,7 +10354,7 @@ class DropiModal {
|
|
|
10356
10354
|
}
|
|
10357
10355
|
}
|
|
10358
10356
|
render() {
|
|
10359
|
-
return (hAsync("div", { key: '
|
|
10357
|
+
return (hAsync("div", { key: '53711d354c4b27605ac5f6055cd69c6ab43f570e', class: `modal-root modal-root--${this.position}${this.isOpen ? ' modal-root--open' : ''}${this.isClosing ? ' modal-root--closing' : ''}` }, (this.modal ?? true) && hAsync("div", { key: '4147c3dbb245ca88fa7b351778c6e4fcc46c14f6', class: "modal-mask", onClick: () => this.canDismiss && this.dismissable && this.dismiss() }), hAsync("div", { key: 'ca1c89b733bf8137acfffc339e27eae61b776e70', 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: '7b8cef664836de6f82741e7ba9818474e6e3e6ca', class: "modal-header" }, this.header && hAsync("span", { key: 'adc171e6a6a9e02735efbe2396bab24cbbbd9973', class: "modal-title" }, this.header), hAsync("slot", { key: '1efb24ac5262501c30ba27cac2ed3a0a04a39840', name: "header" }), this.showCloseIcon && (hAsync("button", { key: 'bd904805550989474cbdc594862afa3fe2f66339', class: "modal-close", onClick: () => this.dismiss(), "aria-label": "Cerrar" }, "\u00D7")))), hAsync("div", { key: 'e45eea610d3cdcc9c437b0f9a1da533cfecae96d', class: "modal-content" }, hAsync("slot", { key: '84faf7ccf6619bd280c1785bff2bcd6aae173488' })), this.showFooter && hAsync("div", { key: 'ce5112038986f29630fb0936b785a026cb775e91', class: "modal-footer" }, hAsync("slot", { key: '0bbfbc0c55dc61555472ae23116c7eae85107eb8', name: "footer" })))));
|
|
10360
10358
|
}
|
|
10361
10359
|
static get watchers() { return {
|
|
10362
10360
|
"visible": [{
|
|
@@ -10402,7 +10400,7 @@ class DropiModal {
|
|
|
10402
10400
|
}; }
|
|
10403
10401
|
}
|
|
10404
10402
|
|
|
10405
|
-
const dropiNavbarCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.navbar{display:flex;align-items:center;height:56px;padding:0 var(--Size-4, 16px);background:var(--Neutral-White, #ffffff);border-bottom:1px solid var(--Gray-Gray-100, #eceef4);gap:var(--Size-4, 16px);position:relative}.navbar__left{display:flex;align-items:center;gap:var(--Size-2, 8px);flex-shrink:0}.navbar__menu-btn{background:none;border:none;padding:6px;cursor:pointer;border-radius:var(--Border-1, 4px);display:flex;align-items:center;transition:background 0.15s}.navbar__menu-btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.navbar__logo{height:28px;object-fit:contain}.navbar__items{flex:1;list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:var(--Size-1, 4px)}.navbar__item{display:flex;align-items:center;gap:var(--Size-1, 4px);padding:6px var(--Size-3, 12px);background:none;border:none;border-radius:var(--Border-1, 4px);font-size:var(--font-size-s, 12px);font-family:
|
|
10403
|
+
const dropiNavbarCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.navbar{display:flex;align-items:center;height:56px;padding:0 var(--Size-4, 16px);background:var(--Neutral-White, #ffffff);border-bottom:1px solid var(--Gray-Gray-100, #eceef4);gap:var(--Size-4, 16px);position:relative}.navbar__left{display:flex;align-items:center;gap:var(--Size-2, 8px);flex-shrink:0}.navbar__menu-btn{background:none;border:none;padding:6px;cursor:pointer;border-radius:var(--Border-1, 4px);display:flex;align-items:center;transition:background 0.15s}.navbar__menu-btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.navbar__logo{height:28px;object-fit:contain}.navbar__items{flex:1;list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:var(--Size-1, 4px)}.navbar__item{display:flex;align-items:center;gap:var(--Size-1, 4px);padding:6px var(--Size-3, 12px);background:none;border:none;border-radius:var(--Border-1, 4px);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-600, #475066);cursor:pointer;transition:background 0.15s, color 0.15s;white-space:nowrap}.navbar__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.navbar__item--active{background:var(--Primary-Primary-50, #fff5eb);color:var(--Primary-Primary-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.navbar__badge{background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #ffffff);font-size:var(--font-size-xxs);font-weight:var(--font-weight-bold);min-width:16px;height:16px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 4px}.navbar__right{display:flex;align-items:center;gap:var(--Size-2, 8px);flex-shrink:0}.navbar__icon-btn{position:relative;background:none;border:none;padding:6px;cursor:pointer;border-radius:var(--Border-1, 4px);display:flex;align-items:center;transition:background 0.15s}.navbar__icon-btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.navbar__notif-badge{position:absolute;top:2px;right:2px;background:var(--Error-Error-500, #f46a6b);color:var(--Neutral-White, #ffffff);font-size:9px;font-weight:var(--font-weight-bold);min-width:14px;height:14px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 3px}.navbar__user-btn{display:flex;align-items:center;gap:var(--Size-1, 4px);background:none;border:none;padding:4px 8px;border-radius:var(--Border-1, 4px);cursor:pointer;transition:background 0.15s;font-family:var(--font-family-01, 'Inter', sans-serif)}.navbar__user-btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.navbar__avatar{width:28px;height:28px;border-radius:50%;object-fit:cover}.navbar__avatar-placeholder{width:28px;height:28px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700)}.navbar__user-name{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}`;
|
|
10406
10404
|
|
|
10407
10405
|
/**
|
|
10408
10406
|
* @component dropi-navbar
|
|
@@ -10448,9 +10446,9 @@ class DropiNavbar {
|
|
|
10448
10446
|
}
|
|
10449
10447
|
render() {
|
|
10450
10448
|
const items = this.parsedData;
|
|
10451
|
-
return (hAsync("nav", { key: '
|
|
10449
|
+
return (hAsync("nav", { key: 'd4405b424adf15001e591693b5f757ec91ee37b7', class: "navbar" }, hAsync("div", { key: 'f191a9e8ecca13129c8c43da215d863c6025ac3b', class: "navbar__left" }, this.showMenuToggle && (hAsync("button", { key: '07d601bfa96bfc5cbb0ea6d44b4aec86bf0a1f1d', class: "navbar__menu-btn", onClick: () => this.dropiMenuToggle.emit(), "aria-label": "Men\u00FA" }, hAsync("dropi-icon", { key: 'd904648c698c41aa10f3d438676ac16a25f0b2cd', name: "Menu", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-700" }))), this.logoUrl && (hAsync("img", { key: '692b0866baeb1fab0fd8ae610da6059ac1d51bc0', class: "navbar__logo", src: this.logoUrl, alt: this.logoAlt })), this.title && hAsync("span", { key: '657edf577a245aee63115ee628f7a3f15e86f6db', class: "navbar__title" }, this.title)), items.length > 0 && (hAsync("ul", { key: 'c535d6e5c3ca78161d382615a74f61ff8f46e338', 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: 'ac9afc5a9f5255540a0246619277601ff863063e', class: "navbar__right" }, hAsync("button", { key: 'a056854a983697b698bafd02a5ab51541d76b537', class: "navbar__icon-btn", onClick: () => this.dropiNotificationsClick.emit(), "aria-label": "Notificaciones" }, hAsync("dropi-icon", { key: 'de8e50c25300d82409666ecbdb043611b545ccb8', name: "Bell", iconWidth: "20px", iconHeight: "20px", color: "Gray-Gray-600" }), this.notifications > 0 && (hAsync("span", { key: '34a95f2fd8d412948e20144e1441680b9db8f741', class: "navbar__notif-badge" }, this.notifications > 99 ? '99+' : this.notifications))), hAsync("button", { key: 'd6e72f033993efa500e579aca2450458cd92fc1b', class: "navbar__user-btn", onClick: () => this.dropiUserClick.emit(), type: "button" }, this.userAvatar
|
|
10452
10450
|
? hAsync("img", { class: "navbar__avatar", src: this.userAvatar, alt: this.userName })
|
|
10453
|
-
: hAsync("div", { class: "navbar__avatar-placeholder" }, this.userName ? this.userName[0].toUpperCase() : '?'), this.userName && hAsync("span", { key: '
|
|
10451
|
+
: hAsync("div", { class: "navbar__avatar-placeholder" }, this.userName ? this.userName[0].toUpperCase() : '?'), this.userName && hAsync("span", { key: '37bdf7197882ccac95fed9173cb5ea1f89b0f274', class: "navbar__user-name" }, this.userName), hAsync("dropi-icon", { key: '5a5a486c17e985f7473b231cec080da6ebe25ea8', name: "Arrow-Down-2", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-400" })))));
|
|
10454
10452
|
}
|
|
10455
10453
|
static get style() { return dropiNavbarCss(); }
|
|
10456
10454
|
static get cmpMeta() { return {
|
|
@@ -10473,7 +10471,7 @@ class DropiNavbar {
|
|
|
10473
10471
|
}; }
|
|
10474
10472
|
}
|
|
10475
10473
|
|
|
10476
|
-
const dropiOtpSendCodeCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.otp{display:flex;flex-direction:column;align-items:center;gap:var(--Size-4, 16px)}.otp__label{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066);text-align:center;margin:0}.otp__inputs{display:flex;gap:var(--Size-4, 16px)}.otp__digit{width:56px;height:56px;border:1.5px solid var(--Gray-Gray-200, #d3d7de);border-radius:var(--Border-2, 8px);text-align:center;font-size:22px;font-weight:var(--font-weight-bold, 700);font-family:
|
|
10474
|
+
const dropiOtpSendCodeCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.otp{display:flex;flex-direction:column;align-items:center;gap:var(--Size-4, 16px)}.otp__label{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066);text-align:center;margin:0}.otp__inputs{display:flex;gap:var(--Size-4, 16px)}.otp__digit{width:56px;height:56px;border:1.5px solid var(--Gray-Gray-200, #d3d7de);border-radius:var(--Border-2, 8px);text-align:center;font-size:22px;font-weight:var(--font-weight-bold, 700);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-800, #1f2433);outline:none;transition:border-color 0.15s ease;background:var(--Neutral-White, #ffffff)}.otp__digit:focus{border:2px solid var(--Primary-Primary-500, #f49a3d)}.otp__digit--filled{border:1px solid var(--Success-Success-500, #0abb87);color:var(--Neutral-Neutral-900, #0e111a)}.otp__digit--error{border:1px solid var(--Error-Error-500, #f46a6b)}.otp__error{margin:0;font-size:var(--font-size-xs, 10px);color:var(--Error-Error-500, #f46a6b);text-align:center}.otp__resend{text-align:center}.otp__countdown{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-400, #858ea6)}.otp__resend-btn{background:none;border:none;padding:0;font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Primary-Primary-500, #f49a3d);cursor:pointer;text-decoration:underline}`;
|
|
10477
10475
|
|
|
10478
10476
|
const RESEND_SECONDS = 30;
|
|
10479
10477
|
/**
|
|
@@ -10485,6 +10483,8 @@ class DropiOtpSendCode {
|
|
|
10485
10483
|
registerInstance(this, hostRef);
|
|
10486
10484
|
this.codeCompleted = createEvent(this, "codeCompleted");
|
|
10487
10485
|
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,6 +10523,10 @@ 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;
|
|
10526
10530
|
/** Emitted when resend is requested */
|
|
10527
10531
|
dropiResend;
|
|
10528
10532
|
componentWillLoad() {
|
|
@@ -10559,6 +10563,8 @@ class DropiOtpSendCode {
|
|
|
10559
10563
|
this.internals.setFormValue(finalCode);
|
|
10560
10564
|
this.codeCompleted.emit(finalCode);
|
|
10561
10565
|
this.codeAccepted.emit(finalCode);
|
|
10566
|
+
this.dropiCodeCompleted.emit(finalCode);
|
|
10567
|
+
this.dropiCodeAccepted.emit(finalCode);
|
|
10562
10568
|
}
|
|
10563
10569
|
else {
|
|
10564
10570
|
this.internals.setFormValue(newDigits.join(''));
|
|
@@ -10582,6 +10588,8 @@ class DropiOtpSendCode {
|
|
|
10582
10588
|
this.internals.setFormValue(finalCode);
|
|
10583
10589
|
this.codeCompleted.emit(finalCode);
|
|
10584
10590
|
this.codeAccepted.emit(finalCode);
|
|
10591
|
+
this.dropiCodeCompleted.emit(finalCode);
|
|
10592
|
+
this.dropiCodeAccepted.emit(finalCode);
|
|
10585
10593
|
}
|
|
10586
10594
|
else {
|
|
10587
10595
|
this.internals.setFormValue(newDigits.join(''));
|
|
@@ -10589,14 +10597,14 @@ class DropiOtpSendCode {
|
|
|
10589
10597
|
}
|
|
10590
10598
|
render() {
|
|
10591
10599
|
const engineLabel = this.engine === 'sms' ? 'SMS' : this.engine === '2fa' ? 'autenticador' : 'correo';
|
|
10592
|
-
return (hAsync("div", { key: '
|
|
10600
|
+
return (hAsync("div", { key: '1aa0cda83f1441587bcb14a7bf6f18ff7c545fd2', class: "otp" }, this.showLabelContact && (hAsync("p", { key: '4eb04c3fdbaf2a48fc9029bb16036a55cda0bb13', class: "otp__label" }, "Ingresa el c\u00F3digo enviado a tu ", engineLabel, this.labelContact && hAsync("strong", { key: 'cbe1613ba00a24b53be2d50d98e65c5cd04b03d6' }, " ", this.labelContact))), hAsync("div", { key: 'db1e3ed5bd801fe908a6652946e068042f1d27e1', class: "otp__inputs", onPaste: (e) => this.handlePaste(e) }, this.digits.map((_, i) => (hAsync("input", { key: i, ref: (el) => {
|
|
10593
10601
|
if (el)
|
|
10594
10602
|
this.inputs[i] = el;
|
|
10595
10603
|
}, class: {
|
|
10596
10604
|
'otp__digit': true,
|
|
10597
10605
|
'otp__digit--filled': this.digitStates[i] === 'filled',
|
|
10598
10606
|
'otp__digit--error': this.error,
|
|
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: '
|
|
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: '2feba6695271851e1f071b7131b59578d7e46843', class: "otp__error" }, this.errorMessage)), hAsync("div", { key: '31f3ee833dad96e2dd123fe1dd17b773825bafa2', 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")))));
|
|
10600
10608
|
}
|
|
10601
10609
|
static get formAssociated() { return true; }
|
|
10602
10610
|
static get watchers() { return {
|
|
@@ -10627,7 +10635,7 @@ class DropiOtpSendCode {
|
|
|
10627
10635
|
}; }
|
|
10628
10636
|
}
|
|
10629
10637
|
|
|
10630
|
-
const dropiPaginatorCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.paginator{display:flex;align-items:center;justify-content:flex-end;gap:var(--Size-4, 16px);flex-wrap:wrap}.paginator-pages{display:flex;align-items:center;gap:var(--Size-1, 4px)}.paginator-btn{width:32px;height:32px;padding:0;border:none;border-radius:50%;background:transparent;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:
|
|
10638
|
+
const dropiPaginatorCss = () => `:host{display:block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.paginator{display:flex;align-items:center;justify-content:flex-end;gap:var(--Size-4, 16px);flex-wrap:wrap}.paginator-pages{display:flex;align-items:center;gap:var(--Size-1, 4px)}.paginator-btn{width:32px;height:32px;padding:0;border:none;border-radius:50%;background:transparent;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background 0.15s ease}.paginator-btn:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.paginator-btn:disabled{opacity:0.4;cursor:not-allowed}.paginator-btn--active{background:var(--Primary-Primary-500, #f49a3d);color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.paginator-btn--active:hover{background:var(--Primary-Primary-500, #f49a3d)}.paginator-btn--arrow{width:auto;padding:0 var(--Size-2, 8px);border-radius:var(--Border-1, 4px);gap:4px}.paginator-btn--arrow:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.paginator-label{font-size:var(--font-size-s, 12px);color:inherit}.paginator-ellipsis{color:var(--Gray-Gray-400, #858ea6);padding:0 4px;font-size:var(--font-size-s, 12px);display:flex;align-items:center}.paginator-size{display:flex;align-items:center;gap:var(--Size-2, 8px)}.paginator-size-label{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-500, #69738c)}.paginator-size-select{height:32px;padding:0 var(--Size-2, 8px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-1, 4px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);cursor:pointer;outline:none}`;
|
|
10631
10639
|
|
|
10632
10640
|
/**
|
|
10633
10641
|
* @component dropi-paginator
|
|
@@ -10688,9 +10696,9 @@ class DropiPaginator {
|
|
|
10688
10696
|
const pages = this.pageNumbers;
|
|
10689
10697
|
const isFirst = this.currentPage <= 1;
|
|
10690
10698
|
const isLast = this.currentPage >= this.totalPages;
|
|
10691
|
-
return (hAsync("div", { key: '
|
|
10699
|
+
return (hAsync("div", { key: 'd1cd366b0c319ba8b023b6fcfe3f5f30cdbebd8b', class: "paginator" }, hAsync("div", { key: '53097e1770f1d2e30ae9c90e68a9eadcb5b634dd', class: "paginator-pages" }, !isFirst && !this.noLabels && (hAsync("button", { key: 'fb3f833af40b25e76ba9450845fb40b5b19991df', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(1), "aria-label": "Primera p\u00E1gina", disabled: this.disabled }, hAsync("dropi-icon", { key: '821fe4e4fc448394ff644726ecc2c13207d873ef', name: "Arrow-double-small-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isFirst && (hAsync("button", { key: '2ca32ccc8b22c4a22db36898ab5497ff977df5ad', class: { 'paginator-btn': true, 'paginator-btn--arrow': true }, onClick: () => this.goTo(this.currentPage - 1), "aria-label": "Anterior", disabled: this.disabled }, hAsync("dropi-icon", { key: 'bfa46b76b049d7a011d4c2c80f6dff2e865e8fe6', name: "Dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }), !this.noLabels && hAsync("span", { key: '54aafd90b0898df46ebb70007da8b3fe0f874cae', class: "paginator-label" }, "Anterior"))), pages.map((p, i) => p === '...'
|
|
10692
10700
|
? hAsync("span", { class: "paginator-ellipsis", key: `e${i}` }, "\u2026")
|
|
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: '
|
|
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: '141ddb9f0b92010d03f7b000a289c6b04b2ad805', 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: '0ee3c7b22e2d2a07c485094de3b947fb17f9d2fa', class: "paginator-label" }, "Siguiente"), hAsync("dropi-icon", { key: '0482e40d329968d86e04d661b06db06bb2cff2a4', name: "Dropdown-Right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), !isLast && !this.noLabels && (hAsync("button", { key: '7dc88568008d878d0b33d44492ac344d2e060c7c', 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: '68cff2b75e05dc3f2774cba68bd87cff10f09f32', name: "Arrow-double-small-right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))))));
|
|
10694
10702
|
}
|
|
10695
10703
|
static get style() { return dropiPaginatorCss(); }
|
|
10696
10704
|
static get cmpMeta() { return {
|
|
@@ -10710,7 +10718,7 @@ class DropiPaginator {
|
|
|
10710
10718
|
}; }
|
|
10711
10719
|
}
|
|
10712
10720
|
|
|
10713
|
-
const dropiPhoneInputCss = () => `:host{display:block;width:100%;position:relative;font-family:'Inter', sans-serif}*,*::before,*::after{box-sizing:border-box}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type='number']{-moz-appearance:textfield;appearance:textfield}.phone-wrap{width:100%}.phone-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.phone-input-container{display:flex;align-items:center;gap:8px}.custom-select{position:relative;width:50%}.form-control{flex:1;width:100%;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:5px;font-size:14px;font-family:
|
|
10721
|
+
const dropiPhoneInputCss = () => `:host{display:block;width:100%;position:relative;font-family:var(--font-family-01, 'Inter', sans-serif)}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type='number']{-moz-appearance:textfield;appearance:textfield}.phone-wrap{width:100%}.phone-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.phone-input-container{display:flex;align-items:center;gap:8px}.custom-select{position:relative;width:50%}.form-control{flex:1;width:100%;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:5px;font-size:14px;font-family:var(--font-family-01, 'Inter', sans-serif);transition:border-color 0.3s ease-in-out;height:40px;padding:0 12px;outline:none;color:var(--Gray-Gray-700, #32394d);background-color:var(--Neutral-White, #ffffff)}.form-control::placeholder{color:var(--Gray-Gray-500, #69738c)}.form-control:focus::placeholder{color:var(--Gray-Gray-500, #69738c)}.form-control:focus{border-color:var(--Info-Info-500, #50a5f1);outline:none}.form-control:disabled{border:1px solid var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);outline:none}.form-control.is-invalid{background:#fffbfb;border-color:var(--Error-Error-500, #f46a6b) !important}.select-button{width:100%;height:40px;padding:0.47rem 0.75rem;padding-right:7px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer}.select-button img{width:20px;height:20px}.select-button:focus{border-color:var(--Info-Info-500, #50a5f1) !important;outline:none}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:unset}.select-button.select-completed{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066);background:var(--Neutral-White, #ffffff)}.select-button.select-invalid{border-color:var(--Error-Error-500, #f46a6b) !important}.select-dropdown{position:absolute;width:100%;overflow:hidden;list-style:none;padding:0;margin:4px 0 0 0;border:1px solid transparent;border-radius:var(--Border-2, 8px);overflow-y:scroll;z-index:var(--dropi-z-index-overlay, 11000)}.select-dropdown::-webkit-scrollbar{width:6px}.select-dropdown::-webkit-scrollbar-thumb{background-color:var(--Gray-Gray-300, #d1d6e1);border-radius:4px}.expanded-select{max-height:250px;background:var(--Neutral-White, #ffffff);box-shadow:var(--Shadow-medium, 0 4px 16px rgba(0, 0, 0, 0.08));border:1px solid var(--Gray-Gray-200, #c3c9d9);transition:max-height 0.2s ease-in}.collapsed-select{max-height:0;background:transparent;box-shadow:none;border:1px solid transparent;transition:max-height 0.2s ease-out, background 0.6s ease-out, box-shadow 0.6s ease-out}.select-dropdown li{margin:0;padding:0}.option{width:100%;height:45px;border-radius:var(--Border-2, 8px);padding-top:var(--Size-3, 12px);padding-right:var(--Size-4, 16px);padding-bottom:var(--Size-3, 12px);padding-left:var(--Size-4, 16px);border:none;background:transparent;text-align:left;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);cursor:pointer;display:flex;align-items:center;gap:8px}.option img{width:20px;height:20px}.option:hover{background:var(--Gray-Gray-50, #f7f8fa)}.option:disabled{color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:unset}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}.phone-error{margin:4px 0 0;font-size:var(--font-size-xs, 10px);color:var(--Error-Error-500, #f46a6b)}`;
|
|
10714
10722
|
|
|
10715
10723
|
const COUNTRIES = [
|
|
10716
10724
|
{ code: '57', name: 'Colombia', flag: 'CO', maxLength: 10 },
|
|
@@ -10910,10 +10918,10 @@ class DropiPhoneInput {
|
|
|
10910
10918
|
render() {
|
|
10911
10919
|
const country = this.selectedCountry;
|
|
10912
10920
|
const isInvalid = this.isValidPhone === false;
|
|
10913
|
-
return (hAsync("div", { key: '
|
|
10921
|
+
return (hAsync("div", { key: '340a9af3074266525d2a4d4f34e199d2f3b34341', class: "phone-wrap" }, hAsync("div", { key: '7e9332d83170af53a4e8afed6150d0527d2ee4d8', class: "phone-input-container" }, hAsync("div", { key: 'd0c84d124882c98d531fea537d3426cb60896cc3', class: "custom-select" }, hAsync("button", { key: '5e4eb16afe2ba811b70c4453cf8f33f5e3cef8bf', type: "button", class: { 'select-button': true, 'select-invalid': isInvalid }, disabled: this.disabledInput, onClick: () => {
|
|
10914
10922
|
if (!this.disabledInput)
|
|
10915
10923
|
this.open = !this.open;
|
|
10916
|
-
} }, hAsync("span", { key: '
|
|
10924
|
+
} }, hAsync("span", { key: 'f743c48a2f525c017d11b2549853331a2a65421c', style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, hAsync("img", { key: '24fd9dbba0f999287a19de677db663487735a579', src: `https://flagsapi.com/${country.flag}/flat/24.png`, alt: "flag" }), country.code), hAsync("dropi-icon", { key: 'b249a0e0cfc71ba1520566467d602ace6356e8f9', name: this.open ? 'Dropdown-up' : 'Dropdown-down', iconWidth: "14px", iconHeight: "14px", color: "Gray-Gray-500" })), hAsync("ul", { key: '173bd8cfdb1d0b436adce3ae5344444b621962f0', 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: '5797774eacd4bd148dc9fd10782b46b8cde7bd27', 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) }))));
|
|
10917
10925
|
}
|
|
10918
10926
|
static get formAssociated() { return true; }
|
|
10919
10927
|
static get watchers() { return {
|
|
@@ -10949,7 +10957,7 @@ class DropiPhoneInput {
|
|
|
10949
10957
|
}; }
|
|
10950
10958
|
}
|
|
10951
10959
|
|
|
10952
|
-
const dropiProgressBarCss = () => `:host{display:block;width:100
|
|
10960
|
+
const dropiProgressBarCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.progress-container{width:100%;display:flex;flex-direction:column;gap:4px}.progress-header{display:flex;justify-content:flex-end}.progress-value{font-size:var(--font-size-xs, 12px);color:var(--Gray-Gray-600, #475066);font-weight:500}.progress-track{width:100%;border-radius:999px;overflow:hidden;position:relative}.progress-fill{height:100%;border-radius:999px;transition:width 0.3s ease-in-out, background-color 0.3s ease-in-out}`;
|
|
10953
10961
|
|
|
10954
10962
|
class DropiProgressBar {
|
|
10955
10963
|
constructor(hostRef) {
|
|
@@ -10972,7 +10980,7 @@ class DropiProgressBar {
|
|
|
10972
10980
|
width: `${Math.min(100, Math.max(0, this.value))}%`,
|
|
10973
10981
|
backgroundColor: this.color || `var(--${this.getSeverityVariable()}, #50A5F1)`,
|
|
10974
10982
|
};
|
|
10975
|
-
return (hAsync("div", { key: '
|
|
10983
|
+
return (hAsync("div", { key: 'a9ccf6692e56b1fd73dbbe4d79d6f08e057597a6', class: "progress-container" }, this.showValue && (hAsync("div", { key: 'ce85b6b25d27bee0219aeeb0d495a868e947822a', class: "progress-header" }, hAsync("span", { key: '662ca3792ea6ca93400da71d8f1f76b95e2d7bf3', class: "progress-value" }, this.value, "%"))), hAsync("div", { key: '8ef2f390e6a9994c4b3bdb374c578fc7195053ca', class: "progress-track", style: { height: this.height, backgroundColor: this.trackColor } }, hAsync("div", { key: '7118c9fe383970614b14f91cc3c4fa73eabcec0a', class: "progress-fill", style: fillStyle }))));
|
|
10976
10984
|
}
|
|
10977
10985
|
getSeverityVariable() {
|
|
10978
10986
|
switch (this.severity) {
|
|
@@ -11002,7 +11010,7 @@ class DropiProgressBar {
|
|
|
11002
11010
|
}; }
|
|
11003
11011
|
}
|
|
11004
11012
|
|
|
11005
|
-
const dropiRadioButtonCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.dropi-radio-button{display:flex;align-items:center;justify-content:flex-start;gap:20px}label{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);line-height:1.5}input[type='radio']{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:2px solid var(--Gray-Gray-200, #c3c9d9);border-radius:50%;background-color:transparent;position:relative;cursor:pointer;outline:none;flex-shrink:0;align-self:center;vertical-align:middle;margin:0}input[type='radio']::before{content:'';position:absolute;top:3px;left:3px;width:10px;height:10px;background-color:var(--Primary-Primary-400, #f7b46f);border-radius:50%;display:none}input[type='radio']:checked{border:2px solid var(--Primary-Primary-500, #f49a3d)}input[type='radio']:checked::before{display:block}`;
|
|
11013
|
+
const dropiRadioButtonCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.dropi-radio-button{display:flex;align-items:center;justify-content:flex-start;gap:20px}label{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;color:var(--Gray-Gray-700, #32394d);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-regular, 400);line-height:1.5}input[type='radio']{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-width:20px;border:2px solid var(--Gray-Gray-200, #c3c9d9);border-radius:50%;background-color:transparent;position:relative;cursor:pointer;outline:none;flex-shrink:0;align-self:center;vertical-align:middle;margin:0}input[type='radio']::before{content:'';position:absolute;top:3px;left:3px;width:10px;height:10px;background-color:var(--Primary-Primary-400, #f7b46f);border-radius:50%;display:none}input[type='radio']:checked{border:2px solid var(--Primary-Primary-500, #f49a3d)}input[type='radio']:checked::before{display:block}`;
|
|
11006
11014
|
|
|
11007
11015
|
/**
|
|
11008
11016
|
* @component dropi-radio-button
|
|
@@ -11051,7 +11059,7 @@ class DropiRadioButton {
|
|
|
11051
11059
|
this.dropiChange.emit(e);
|
|
11052
11060
|
}
|
|
11053
11061
|
render() {
|
|
11054
|
-
return (hAsync("div", { key: '
|
|
11062
|
+
return (hAsync("div", { key: 'a29eaa3007a8b858f9518e7335416b580b6884d5', class: "dropi-radio-button" }, hAsync("label", { key: '3a6d4f3850cd7a5fbd469acb264679d8db5758cf', htmlFor: this.inputId }, hAsync("input", { key: '5da6efd3ff40753609431547ddc575c4bc214400', id: this.inputId, type: "radio", name: this.name, checked: this.checked, onChange: (e) => this.handleChange(e) }), this.label)));
|
|
11055
11063
|
}
|
|
11056
11064
|
static get formAssociated() { return true; }
|
|
11057
11065
|
static get watchers() { return {
|
|
@@ -11079,7 +11087,7 @@ class DropiRadioButton {
|
|
|
11079
11087
|
}; }
|
|
11080
11088
|
}
|
|
11081
11089
|
|
|
11082
|
-
const dropiRadioSelectionListCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.rsl__search{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);margin-bottom:var(--Size-2, 8px)}.rsl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:
|
|
11090
|
+
const dropiRadioSelectionListCss = () => `:host{display:block;width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.rsl__search{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);margin-bottom:var(--Size-2, 8px)}.rsl__search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:transparent}.rsl__list{display:flex;flex-direction:column;gap:var(--Size-2, 8px)}.rsl__item{display:flex;align-items:flex-start;gap:var(--Size-3, 12px);padding:var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);cursor:pointer;transition:border-color 0.15s, background 0.15s}.rsl__item:hover{background:var(--Gray-Gray-50, #f7f8fa)}.rsl__item--selected{border-color:var(--Primary-Primary-500, #f49a3d);background:var(--Primary-Primary-50, #fff5eb)}.rsl__radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--Gray-Gray-300, #a3abbf);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px;transition:border-color 0.15s}.rsl__radio--checked{border-color:var(--Primary-Primary-500, #f49a3d)}.rsl__radio-dot{width:8px;height:8px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.rsl__content{display:flex;flex-direction:column;gap:2px}.rsl__name{font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d)}.rsl__desc{font-size:var(--font-size-xs, 10px);line-height:1.4;color:var(--Gray-Gray-500, #69738c)}`;
|
|
11083
11091
|
|
|
11084
11092
|
/**
|
|
11085
11093
|
* @component dropi-radio-selection-list
|
|
@@ -11122,10 +11130,10 @@ class DropiRadioSelectionList {
|
|
|
11122
11130
|
return this.parsedOptions.filter(o => o.name?.toLowerCase().includes(q));
|
|
11123
11131
|
}
|
|
11124
11132
|
render() {
|
|
11125
|
-
return (hAsync("div", { key: '
|
|
11133
|
+
return (hAsync("div", { key: '84ee5164211b7c1a5169cebf4bd7aa5da6665dea', class: "rsl" }, this.showFilter && (hAsync("div", { key: 'e88120ded47d75873eff4cf32e67943eee035261', class: "rsl__search" }, hAsync("dropi-icon", { key: '9dfa96dff08a8dcd41031d7ff59996bf91ee967c', name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("input", { key: 'bad133dae286af64c155a64eed802a66d68827af', class: "rsl__search-input", type: "text", placeholder: this.filterPlaceholder, value: this.filterText, onInput: (e) => {
|
|
11126
11134
|
this.filterText = e.target.value;
|
|
11127
11135
|
this.dropiSearch.emit({ searchValue: this.filterText, filteredOptions: this.filtered });
|
|
11128
|
-
} }))), hAsync("div", { key: '
|
|
11136
|
+
} }))), hAsync("div", { key: '2454d0f42bf03e636fc674fe14605b3c54ea3a2b', class: "rsl__list" }, this.filtered.map(opt => {
|
|
11129
11137
|
const isSelected = opt.id === this.selectedOption;
|
|
11130
11138
|
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)))));
|
|
11131
11139
|
}))));
|
|
@@ -11156,7 +11164,7 @@ class DropiRadioSelectionList {
|
|
|
11156
11164
|
}; }
|
|
11157
11165
|
}
|
|
11158
11166
|
|
|
11159
|
-
const dropiReadMoreCss = () => `:host{display:block}.read-more__text{margin:0;font-size:var(--font-size-s, 12px);font-family:
|
|
11167
|
+
const dropiReadMoreCss = () => `:host{display:block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.read-more__text{margin:0;font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-800, #1f2433);line-height:1.5}.read-more__toggle{all:unset;display:inline;font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-600);cursor:pointer}.read-more__toggle:hover{color:var(--Primary-Primary-600, #d4872e)}`;
|
|
11160
11168
|
|
|
11161
11169
|
/**
|
|
11162
11170
|
* @component dropi-read-more
|
|
@@ -11190,7 +11198,7 @@ class DropiReadMore {
|
|
|
11190
11198
|
}
|
|
11191
11199
|
render() {
|
|
11192
11200
|
const showToggle = this.needsTruncation && (this.expanded ? this.showSeeLess : true);
|
|
11193
|
-
return (hAsync("div", { key: '
|
|
11201
|
+
return (hAsync("div", { key: 'cdd9eba33482b53a7693e0fb78f6678d12622084', class: "read-more" }, hAsync("p", { key: '8ed7c19c440152ec71293f3cc452a0a215accb85', class: "read-more__text", style: this.textStyle ? this.textStyle : undefined }, this.displayText, showToggle && (hAsync("button", { key: '1838a5a3752fb6f1a7e68b00f167eea862acf713', class: "read-more__toggle", style: this.buttonStyle ? this.buttonStyle : undefined, onClick: () => this.expanded = !this.expanded }, this.expanded ? ' Ver menos' : '... Ver más')))));
|
|
11194
11202
|
}
|
|
11195
11203
|
static get style() { return dropiReadMoreCss(); }
|
|
11196
11204
|
static get cmpMeta() { return {
|
|
@@ -11210,7 +11218,7 @@ class DropiReadMore {
|
|
|
11210
11218
|
}; }
|
|
11211
11219
|
}
|
|
11212
11220
|
|
|
11213
|
-
const dropiSearchCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.search-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.search-input-row{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:10px;pointer-events:none;z-index:1}.search-input{width:100%;height:40px;padding:0 36px 0 34px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);font-size:var(--font-size-s, 12px);font-family:
|
|
11221
|
+
const dropiSearchCss = () => `:host{display:block;width:100%;position:relative;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.search-label{display:block;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);margin-bottom:4px}.search-input-row{position:relative;display:flex;align-items:center;width:100%}.search-icon{position:absolute;left:10px;pointer-events:none;z-index:1}.search-input{width:100%;height:40px;padding:0 36px 0 34px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);outline:none;transition:border-color 0.2s}.search-input:focus{border-color:var(--Info-Info-500, #50a5f1)}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{position:absolute;right:10px;display:flex;align-items:center;background:none;border:none;padding:0;cursor:pointer;z-index:1}.search-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:var(--dropdown-height, 240px);overflow-y:auto;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);box-shadow:0 4px 16px rgba(0, 0, 0, 0.08);z-index:100}.search-option{display:flex;align-items:center;gap:var(--Size-2, 8px);padding:var(--Size-2, 8px) var(--Size-3, 12px);cursor:pointer;transition:background 0.15s;user-select:none}.search-option:hover{background:var(--Gray-Gray-50, #f7f8fa)}.search-option--selected{background:var(--Primary-Primary-50, #fff5eb)}.search-option__label{flex:1;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-700, #32394d);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-no-results{padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-400, #858ea6);text-align:center}`;
|
|
11214
11222
|
|
|
11215
11223
|
/**
|
|
11216
11224
|
* @component dropi-search
|
|
@@ -11321,10 +11329,10 @@ class DropiSearch {
|
|
|
11321
11329
|
}
|
|
11322
11330
|
render() {
|
|
11323
11331
|
const showDropdown = this.open && this.parsedOptions.length > 0;
|
|
11324
|
-
return (hAsync("div", { key: '
|
|
11332
|
+
return (hAsync("div", { key: '3fbdeabe60de3f1bb56c400d7f01576ae885e35b', class: "search-wrap" }, this.label && hAsync("label", { key: 'c9768021ffda16c845cfb0c9ed8780307286a314', class: "search-label" }, this.label), hAsync("div", { key: '316863b87f7d87858a04b4fb92414fd565fcbaa2', class: `search-input-row search-input-row--${this.type}` }, this.showIcon && hAsync("dropi-icon", { key: '6e0e8fe288434be674a2c38c4751431eaab5230a', class: "search-icon", name: "Search", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), hAsync("input", { key: 'db8000e4901cad3083f13031f4571a25adea6b9d', 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: () => {
|
|
11325
11333
|
if (this.parsedOptions.length)
|
|
11326
11334
|
this.open = true;
|
|
11327
|
-
}, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (hAsync("button", { key: '
|
|
11335
|
+
}, onBlur: () => { setTimeout(() => this.open = false, 150); this.dropiBlur.emit(); } }), this.showClear && this.textInput && (hAsync("button", { key: 'c163dc376acb3d87fc5104f9da4b864972e90479', class: "search-clear", onClick: () => this.handleClear(), "aria-label": "Limpiar" }, hAsync("dropi-icon", { key: '203d31ed6689702cf32673378b6c0cc879ee11cd', name: "Close-small", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" })))), showDropdown && (hAsync("div", { key: '52180c44f8610e66feb0a827d1ecb081ce5f29a8', 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])))))))));
|
|
11328
11336
|
}
|
|
11329
11337
|
static get watchers() { return {
|
|
11330
11338
|
"dataToSearch": [{
|
|
@@ -11360,7 +11368,7 @@ class DropiSearch {
|
|
|
11360
11368
|
}; }
|
|
11361
11369
|
}
|
|
11362
11370
|
|
|
11363
|
-
const dropiSelectCss = () => `:host{display:block;width:100%;text-align:left}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}.custom-select label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.disabled-label{color:var(--Gray-Gray-400, #858ea6) !important}.asterisk{color:var(--Error-Error-500, #f46a6b)}.dropdown-container{display:flex;align-items:center;gap:4px}.left-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-m, 14px);white-space:nowrap}.select-button{box-sizing:border-box;width:100%;height:40px;padding:0 0.75rem;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);font-family:
|
|
11371
|
+
const dropiSelectCss = () => `:host{display:block;width:100%;text-align:left;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.custom-select{position:relative;width:100%}.custom-select label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.disabled-label{color:var(--Gray-Gray-400, #858ea6) !important}.asterisk{color:var(--Error-Error-500, #f46a6b)}.dropdown-container{display:flex;align-items:center;gap:4px}.left-label{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-m, 14px);white-space:nowrap}.select-button{box-sizing:border-box;width:100%;height:40px;padding:0 0.75rem;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-500, #69738c);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;transition:border-color 0.2s ease;gap:8px}.select-button:focus{outline:none;border-color:var(--Info-Info-500, #50a5f1)}.select-button:disabled{border-color:var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.select-completed{border-color:var(--Gray-Gray-400, #858ea6);color:var(--Gray-Gray-600, #475066)}.select-button-error{border-color:var(--Error-Error-500, #f46a6b) !important}.no-border{border:none !important;color:var(--Gray-Gray-600, #475066);padding:var(--Size-4, 16px);background-color:transparent !important;gap:var(--Size-2, 8px)}.no-border:disabled{background-color:transparent !important}.button-content{display:flex;align-items:center;gap:8px;overflow:hidden;flex:1;min-width:0}.elipsis{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-dropdown-overlay{position:fixed;max-height:250px;overflow-y:auto;list-style:none;padding:var(--Size-4, 16px) var(--Size-4, 16px) var(--Size-3, 12px);margin:0;border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);box-shadow:0px 8px 24px rgba(0, 0, 0, 0.12);z-index:var(--dropi-z-index-overlay, 11000);animation:dropdown-open 120ms ease-out}.select-dropdown-overlay.within-modal{position:absolute}@keyframes dropdown-open{from{opacity:0;transform:scaleY(0.95);transform-origin:top}to{opacity:1;transform:scaleY(1);transform-origin:top}}.option{box-sizing:border-box;width:100%;min-height:40px;border-radius:var(--Border-2, 8px);padding:var(--Size-3, 12px) var(--Size-4, 16px);border:none;background:transparent;text-align:left;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);cursor:pointer;display:flex;align-items:center;gap:var(--Size-2, 8px);transition:background 0.15s ease}.option:hover:not(:disabled){background:var(--Gray-Gray-50, #f7f8fa)}.option:disabled,.disabled-option{opacity:0.5;cursor:not-allowed}.option.selected-option:not(.option-radio){background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-group-title{padding:var(--Size-3, 12px) var(--Size-4, 16px);font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-medium, 500);color:var(--Gray-Gray-500, #69738c);list-style:none}.option-group{padding-left:var(--Size-6, 32px)}.sticky-search{position:sticky;top:calc(-1 * var(--Size-4, 16px));background:var(--Neutral-White, #ffffff);z-index:10;margin:calc(-1 * var(--Size-4, 16px)) calc(-1 * var(--Size-4, 16px)) 0;padding:var(--Size-2, 8px) var(--Size-4, 16px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2);list-style:none}.search-wrapper{display:flex;align-items:center;gap:8px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);padding:6px 10px;background:var(--Neutral-White, #ffffff)}.search-input{flex:1;border:none;outline:none;font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:transparent}.search-input::placeholder{color:var(--Gray-Gray-400, #858ea6)}.search-clear{background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.multi-checkbox{width:18px;height:18px;min-width:18px;border-radius:var(--Border-1, 4px);border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s, border-color 0.15s}.multi-checkbox.checked{background:var(--Primary-Primary-500, #f49a3d);border-color:var(--Primary-Primary-500, #f49a3d)}.option-radio{display:flex;align-items:center;gap:12px}.option-radio.selected-option{border-radius:var(--Border-2, 8px);background:var(--Primary-Primary-50, #fef8f2);color:var(--Primary-Primary-500, #f49a3d)}.option-radio.selected-option .option-second-label{color:var(--Primary-Primary-500, #f49a3d)}.radio{width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid var(--Gray-Gray-200, #c3c9d9);display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio.selected{border-color:var(--Primary-Primary-500, #f49a3d)}.circle{width:12px;height:12px;border-radius:50%;background:var(--Primary-Primary-500, #f49a3d)}.labels-container{display:flex;justify-content:space-between;width:100%;min-width:0}.option-image{width:24px;height:24px;border-radius:60px;object-fit:cover;flex-shrink:0}.small-image{width:20px;height:20px}.option-image-fallback{width:24px;height:24px;border-radius:60px;background:var(--Primary-Primary-500, #f49a3d);color:white;font-size:13px;font-weight:var(--font-weight-bold);display:flex;justify-content:center;align-items:center;flex-shrink:0}.small-image.option-image-fallback{width:20px;height:20px}.option-second-label{color:var(--Gray-Gray-700, #32394d);font-weight:var(--font-weight-bold);white-space:nowrap}.flag-placeholder{font-size:11px;font-weight:var(--font-weight-semibold);color:var(--Gray-Gray-500, #69738c);flex-shrink:0}.select-helper,.select-helper-error{display:flex;gap:var(--Size-1, 4px);align-items:center;margin-top:var(--Size-1, 4px)}.select-helper span{color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.select-helper-error span{color:var(--Error-Error-500, #f46a6b);font-size:var(--font-size-xs, 10px)}.no-results{padding:var(--Size-3, 12px) var(--Size-4, 16px);color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-s, 12px);list-style:none;text-align:center}`;
|
|
11364
11372
|
|
|
11365
11373
|
/**
|
|
11366
11374
|
* @component dropi-select
|
|
@@ -11765,7 +11773,7 @@ class DropiSelect {
|
|
|
11765
11773
|
]), !this.isGrouped && this.filteredOptions.map(opt => this.renderOption(opt)), this.filteredOptions.length === 0 && (hAsync("li", { class: "no-results" }, "Sin resultados"))));
|
|
11766
11774
|
}
|
|
11767
11775
|
render() {
|
|
11768
|
-
return (hAsync("div", { key: '
|
|
11776
|
+
return (hAsync("div", { key: 'aadc390ca4cb204cd529b13fcd3f4dcad40693a7', class: "custom-select" }, !this.dropdownType && this.label && (hAsync("label", { key: '26ab0fcf78f7f9c4c85e97bce2214225ba8667cb', class: { 'disabled-label': this.disabled } }, this.label, this.showObligatory && !this.disabled && hAsync("span", { key: '5389aeb4e55045779439e5e79ed93c6df761bc53', class: "asterisk" }, " *"))), hAsync("div", { key: 'e442f571c93f4895ff1610fa36434dba0f864328', class: "dropdown-container" }, this.dropdownType && this.label && (hAsync("div", { key: '7bc098b873db053b9c8860ac77568e7308404583', class: "left-label" }, this.label)), this.renderTrigger()), this.textHelper && !this.hasError && (hAsync("div", { key: 'd1f99c6de156774be5da4d66e134548273194d5d', class: "select-helper" }, hAsync("span", { key: '059c0fffa95109e7a91c72eb74f22d9b8b47200c' }, this.textHelper))), this.hasError && this.errorText && (hAsync("div", { key: 'f4eaff9cf130eb4db28e1f8eb28c4514cf03a908', class: "select-helper-error" }, hAsync("dropi-icon", { key: 'ad4d25c3d6aece7941d57608e1632b5888823433', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" }), hAsync("span", { key: 'fe3ec25f82fde1545bfc06a63f98f9693bc16045' }, this.errorText))), this.renderDropdown()));
|
|
11769
11777
|
}
|
|
11770
11778
|
static get formAssociated() { return true; }
|
|
11771
11779
|
static get watchers() { return {
|
|
@@ -11825,7 +11833,7 @@ class DropiSelect {
|
|
|
11825
11833
|
}; }
|
|
11826
11834
|
}
|
|
11827
11835
|
|
|
11828
|
-
const dropiSidebarCss = () => `:host{display:block}.main-sidebar-container{margin-top:20px}.sidebar-option{height:45px;display:flex;align-items:center;position:relative;font-weight:var(--font-weight-medium, 500);gap:var(--Size-3, 12px);padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);border-radius:var(--Border-1, 4px);min-width:147px;cursor:pointer;user-select:none}.sidebar-option .arrow{position:absolute;right:17px;transition:transform 0.3s ease}.sidebar-option .arrow-expanded{transform:rotate(180deg)}.sidebar-default-option{color:var(--Gray-Gray-500, #68738f)}.sidebar-active-option{color:var(--Primary-Primary-500, #f49a3d);background-color:#fef8f1}.sidebar-sub-item{overflow:hidden;max-height:0;height:auto;font-weight:var(--font-weight-medium, 500);gap:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);cursor:pointer;opacity:0;padding:0 var(--Size-3, 12px) 0 var(--Size-8, 32px);transition:max-height 0.3s ease-out, opacity 0.3s ease-out, padding 0.3s ease-out;user-select:none}.sidebar-sub-item.sidebar-expanded{max-height:200px;opacity:1;padding:var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-8, 32px)}.sidebar-sub-item-default{color:var(--Gray-Gray-500, #68738f)}.sidebar-sub-item-active{color:var(--Primary-Primary-500, #f49a3d)}.space-between{justify-content:space-between}`;
|
|
11836
|
+
const dropiSidebarCss = () => `:host{display:block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.main-sidebar-container{margin-top:20px}.sidebar-option{height:45px;display:flex;align-items:center;position:relative;font-weight:var(--font-weight-medium, 500);gap:var(--Size-3, 12px);padding:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);border-radius:var(--Border-1, 4px);min-width:147px;cursor:pointer;user-select:none}.sidebar-option .arrow{position:absolute;right:17px;transition:transform 0.3s ease}.sidebar-option .arrow-expanded{transform:rotate(180deg)}.sidebar-default-option{color:var(--Gray-Gray-500, #68738f)}.sidebar-active-option{color:var(--Primary-Primary-500, #f49a3d);background-color:#fef8f1}.sidebar-sub-item{overflow:hidden;max-height:0;height:auto;font-weight:var(--font-weight-medium, 500);gap:var(--Size-3, 12px);font-size:var(--font-size-s, 12px);cursor:pointer;opacity:0;padding:0 var(--Size-3, 12px) 0 var(--Size-8, 32px);transition:max-height 0.3s ease-out, opacity 0.3s ease-out, padding 0.3s ease-out;user-select:none}.sidebar-sub-item.sidebar-expanded{max-height:200px;opacity:1;padding:var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-3, 12px) var(--Size-8, 32px)}.sidebar-sub-item-default{color:var(--Gray-Gray-500, #68738f)}.sidebar-sub-item-active{color:var(--Primary-Primary-500, #f49a3d)}.space-between{justify-content:space-between}`;
|
|
11829
11837
|
|
|
11830
11838
|
/**
|
|
11831
11839
|
* @component dropi-sidebar
|
|
@@ -11874,7 +11882,7 @@ class DropiSidebar {
|
|
|
11874
11882
|
this.dropiIndexChange.emit(itemClicked);
|
|
11875
11883
|
}
|
|
11876
11884
|
render() {
|
|
11877
|
-
return (hAsync("div", { key: '
|
|
11885
|
+
return (hAsync("div", { key: 'db912a2643a3c32909d0c6a057d191ce6af80c5e', class: "main-sidebar-container" }, this.parsedProperties.map(item => {
|
|
11878
11886
|
return [
|
|
11879
11887
|
/* Item Principal */
|
|
11880
11888
|
hAsync("div", { class: {
|
|
@@ -11914,7 +11922,7 @@ class DropiSidebar {
|
|
|
11914
11922
|
}; }
|
|
11915
11923
|
}
|
|
11916
11924
|
|
|
11917
|
-
const dropiSimpleStepperCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__item{display:flex;flex-direction:column;align-items:center;flex:1}.stepper__circle-row{display:flex;align-items:center;width:100%}.stepper__circle{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.stepper__circle--pending{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.stepper__circle--active{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__dot{width:8px;height:8px;border-radius:50%;background:var(--Neutral-White, #ffffff);display:block}.stepper__circle--pending .stepper__dot{background:var(--Gray-Gray-400, #858ea6)}.stepper__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Neutral-White, #ffffff)}.stepper__circle--pending .stepper__number{color:var(--Gray-Gray-500, #69738c)}.stepper__line{flex:1;height:2px;background:var(--Gray-Gray-200, #c3c9d9);transition:background 0.2s}.stepper__line--done{background:var(--Primary-Primary-500, #f49a3d)}.stepper__label{margin-top:6px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);text-align:center}`;
|
|
11925
|
+
const dropiSimpleStepperCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__item{display:flex;flex-direction:column;align-items:center;flex:1}.stepper__circle-row{display:flex;align-items:center;width:100%}.stepper__circle{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.stepper__circle--pending{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.stepper__circle--active{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.stepper__dot{width:8px;height:8px;border-radius:50%;background:var(--Neutral-White, #ffffff);display:block}.stepper__circle--pending .stepper__dot{background:var(--Gray-Gray-400, #858ea6)}.stepper__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Neutral-White, #ffffff)}.stepper__circle--pending .stepper__number{color:var(--Gray-Gray-500, #69738c)}.stepper__line{flex:1;height:2px;background:var(--Gray-Gray-200, #c3c9d9);transition:background 0.2s}.stepper__line--done{background:var(--Primary-Primary-500, #f49a3d)}.stepper__label{margin-top:6px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-600, #475066);text-align:center}`;
|
|
11918
11926
|
|
|
11919
11927
|
/**
|
|
11920
11928
|
* @component dropi-simple-stepper
|
|
@@ -11950,7 +11958,7 @@ class DropiSimpleStepper {
|
|
|
11950
11958
|
render() {
|
|
11951
11959
|
const labels = this.parsedLabels;
|
|
11952
11960
|
const steps = Array.from({ length: this.stepsCount }, (_, i) => i + 1);
|
|
11953
|
-
return (hAsync("div", { key: '
|
|
11961
|
+
return (hAsync("div", { key: '79775ae72739bea9fdd09557f22bd33dba8ed865', class: "stepper" }, steps.map((step, i) => {
|
|
11954
11962
|
const isCompleted = step < this.currentStep;
|
|
11955
11963
|
const isActive = step === this.currentStep;
|
|
11956
11964
|
const isLast = i === steps.length - 1;
|
|
@@ -11981,7 +11989,7 @@ class DropiSimpleStepper {
|
|
|
11981
11989
|
}; }
|
|
11982
11990
|
}
|
|
11983
11991
|
|
|
11984
|
-
const dropiSkeletonCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.skeleton-lines{display:flex;flex-direction:column;gap:8px}.skeleton{background:linear-gradient( 90deg, var(--Gray-Gray-100, #e6eaf2) 25%, var(--Gray-Gray-50, #f7f8fa) 50%, var(--Gray-Gray-100, #e6eaf2) 75% );background-size:200% 100%;animation:shimmer 1.6s ease-in-out infinite}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
|
|
11992
|
+
const dropiSkeletonCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.skeleton-lines{display:flex;flex-direction:column;gap:8px}.skeleton{background:linear-gradient( 90deg, var(--Gray-Gray-100, #e6eaf2) 25%, var(--Gray-Gray-50, #f7f8fa) 50%, var(--Gray-Gray-100, #e6eaf2) 75% );background-size:200% 100%;animation:shimmer 1.6s ease-in-out infinite}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
|
|
11985
11993
|
|
|
11986
11994
|
/**
|
|
11987
11995
|
* @component dropi-skeleton
|
|
@@ -12052,7 +12060,7 @@ class DropiSkeleton {
|
|
|
12052
12060
|
}; }
|
|
12053
12061
|
}
|
|
12054
12062
|
|
|
12055
|
-
const dropiStepsCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__step{display:flex;flex-direction:column;align-items:center;flex:1
|
|
12063
|
+
const dropiStepsCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01)}.stepper{display:flex;align-items:flex-start;width:100%}.stepper__step{display:flex;flex-direction:column;align-items:center;flex:1}.stepper__circle-wrap{display:flex;align-items:center;width:100%}.stepper__line{flex:1;height:2px;background:var(--Gray-Gray-200);transition:background 0.2s}.stepper__line--done{background:var(--Primary-Primary-500)}.stepper__line--invisible{background:transparent}.stepper__circle{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);flex-shrink:0;transition:background 0.2s, border-color 0.2s}.stepper__circle--pending{background:var(--Neutral-White);border:2px solid var(--Gray-Gray-200);color:var(--Gray-Gray-400)}.stepper__circle--focus{background:var(--Neutral-White);border:2px solid var(--Primary-Primary-500);color:var(--Primary-Primary-500)}.stepper__circle--completed{background:var(--Primary-Primary-500);border:2px solid var(--Primary-Primary-500);color:var(--Neutral-White)}.stepper__label{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:var(--Size-2);text-align:center;padding:0 4px}.stepper__title{font-size:var(--font-size-s);font-weight:var(--font-weight-semibold);color:var(--Gray-Gray-400)}.stepper__desc{font-size:var(--font-size-xs);color:var(--Gray-Gray-400)}.stepper__step--focus .stepper__title{color:var(--Gray-Gray-700);font-weight:var(--font-weight-bold)}.stepper__step--focus .stepper__desc{color:var(--Gray-Gray-500)}.stepper__step--completed .stepper__title{color:var(--Gray-Gray-600);font-weight:var(--font-weight-semibold)}.stepper__step--completed .stepper__desc{color:var(--Gray-Gray-500)}`;
|
|
12056
12064
|
|
|
12057
12065
|
/**
|
|
12058
12066
|
* @component dropi-steps
|
|
@@ -12093,11 +12101,21 @@ class DropiSteps {
|
|
|
12093
12101
|
render() {
|
|
12094
12102
|
const labels = this.parsedLabels;
|
|
12095
12103
|
const steps = Array.from({ length: this.stepsCount }, (_, i) => i + 1);
|
|
12096
|
-
return (hAsync("div", { key: '
|
|
12104
|
+
return (hAsync("div", { key: '14c7581b46733cafda1dfbc3ffc6204ea1058aba', class: "stepper" }, steps.map((step) => {
|
|
12097
12105
|
const state = this.stepState(step);
|
|
12098
12106
|
const label = labels[step - 1];
|
|
12107
|
+
const isFirst = step === 1;
|
|
12099
12108
|
const isLast = step === this.stepsCount;
|
|
12100
|
-
|
|
12109
|
+
const prevState = step > 1 ? this.stepState(step - 1) : null;
|
|
12110
|
+
return (hAsync("div", { class: { 'stepper__step': true, [`stepper__step--${state}`]: true }, key: step }, hAsync("div", { class: "stepper__circle-wrap" }, hAsync("div", { class: {
|
|
12111
|
+
'stepper__line': true,
|
|
12112
|
+
'stepper__line--done': prevState === 'completed',
|
|
12113
|
+
'stepper__line--invisible': isFirst,
|
|
12114
|
+
} }), hAsync("div", { class: { 'stepper__circle': true, [`stepper__circle--${state}`]: true } }, state === 'completed' ? (hAsync("dropi-icon", { name: "Check", iconWidth: "12px", iconHeight: "12px", color: "Neutral-White" })) : (this.showNumberOfStep ? hAsync("span", null, step) : null)), hAsync("div", { class: {
|
|
12115
|
+
'stepper__line': true,
|
|
12116
|
+
'stepper__line--done': state === 'completed' || state === 'focus',
|
|
12117
|
+
'stepper__line--invisible': isLast,
|
|
12118
|
+
} })), label && (hAsync("div", { class: "stepper__label" }, label.title && hAsync("span", { class: "stepper__title" }, label.title), label.description && hAsync("span", { class: "stepper__desc" }, label.description)))));
|
|
12101
12119
|
})));
|
|
12102
12120
|
}
|
|
12103
12121
|
static get style() { return dropiStepsCss(); }
|
|
@@ -12117,7 +12135,7 @@ class DropiSteps {
|
|
|
12117
12135
|
}; }
|
|
12118
12136
|
}
|
|
12119
12137
|
|
|
12120
|
-
const dropiSwitchCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.toggle-switch{position:relative;display:inline-block;width:40px;height:21px;margin-bottom:0;cursor:pointer}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--Gray-Gray-200, #c3c9d9);transition:0.4s;border-radius:34px}.slider::before{position:absolute;content:'';height:17px;width:17px;left:3px;bottom:2px;background-color:var(--Neutral-White, #ffffff);transition:0.4s;border-radius:50%}input:checked+.slider{background-color:var(--Primary-Primary-500, #f49a3d)}input:checked+.slider::before{transform:translateX(17px)}:host([disabled]) .toggle-switch{cursor:not-allowed;opacity:0.5}`;
|
|
12138
|
+
const dropiSwitchCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.toggle-switch{position:relative;display:inline-block;width:40px;height:21px;margin-bottom:0;cursor:pointer}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--Gray-Gray-200, #c3c9d9);transition:0.4s;border-radius:34px}.slider::before{position:absolute;content:'';height:17px;width:17px;left:3px;bottom:2px;background-color:var(--Neutral-White, #ffffff);transition:0.4s;border-radius:50%}input:checked+.slider{background-color:var(--Primary-Primary-500, #f49a3d)}input:checked+.slider::before{transform:translateX(17px)}:host([disabled]) .toggle-switch{cursor:not-allowed;opacity:0.5}`;
|
|
12121
12139
|
|
|
12122
12140
|
/**
|
|
12123
12141
|
* @component dropi-switch
|
|
@@ -12156,7 +12174,7 @@ class DropiSwitch {
|
|
|
12156
12174
|
this.dropiChange.emit(this.isChecked);
|
|
12157
12175
|
}
|
|
12158
12176
|
render() {
|
|
12159
|
-
return (hAsync("label", { key: '
|
|
12177
|
+
return (hAsync("label", { key: '7dc67521be6d2ac8999086845b353547334a493d', class: "toggle-switch" }, hAsync("input", { key: '3e31957e1a963027a6006189850a57c51e3a70c9', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: (e) => this.onToggleChange(e) }), hAsync("span", { key: '72d5f6c239667dd4a209d1eff483bf951cd1c67c', class: "slider" })));
|
|
12160
12178
|
}
|
|
12161
12179
|
static get formAssociated() { return true; }
|
|
12162
12180
|
static get watchers() { return {
|
|
@@ -12179,7 +12197,7 @@ class DropiSwitch {
|
|
|
12179
12197
|
}; }
|
|
12180
12198
|
}
|
|
12181
12199
|
|
|
12182
|
-
const dropiTableCss = () => `:host{display:block;width:100%;min-width:0}*,*::before,*::after{box-sizing:border-box}.table-container{width:100%;min-width:0;border-radius:var(--Border-3);padding:0 var(--Size-4) var(--Size-4) var(--Size-4);background-color:var(--Neutral-White)}.search-container{margin-block:var(--Size-5);display:flex;flex-direction:column;gap:var(--Size-4)}.table-title{padding-block:var(--Size-2);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);color:var(--Gray-Gray-700);margin:0}.search-actions{display:flex;align-items:flex-end;gap:var(--Size-3);width:100%}.search-actions dropi-input{flex:1}.search-actions.only-filter{justify-content:flex-end}.table-tools{display:flex;justify-content:flex-end}.column-selector-container{position:relative}.column-selector-btn{min-width:40px;width:40px;height:40px;padding:0;border:1px solid var(--Gray-Gray-200);border-radius:var(--Border-2);background:var(--Neutral-White);cursor:pointer;display:flex;align-items:center;justify-content:center}.column-selector-btn:hover{background:var(--Gray-Gray-50)}.column-selector-menu{position:absolute;top:calc(100% + 8px);right:0;width:min(320px, 88vw);border:1px solid var(--Gray-Gray-200);border-radius:var(--Border-2);background:var(--Neutral-White);box-shadow:var(--Shadow-medium);z-index:20;padding:var(--Size-1)}.column-selector-footer{border-top:1px solid var(--Gray-Gray-100);margin-top:var(--Size-1);padding:var(--Size-2) var(--Size-4);display:flex;align-items:center}.column-selector-all{display:inline-flex;align-items:center;gap:var(--Size-2);color:var(--Gray-Gray-700);font-size:var(--font-size-s);cursor:pointer;user-select:none}.column-selector-option{display:flex;align-items:center;gap:var(--Size-2);padding:var(--Size-2) var(--Size-3);font-size:var(--font-size-s);color:var(--Gray-Gray-700);cursor:pointer;border-radius:var(--Border-1)}.column-selector-option:hover{background:var(--Gray-Gray-50)}.table-wrapper{overflow-x:auto;width:100%;position:relative}.table-wrapper.has-sticky-actions{width:100%}.table-wrapper::-webkit-scrollbar{height:6px}.table-wrapper::-webkit-scrollbar-track{background:transparent}.table-wrapper::-webkit-scrollbar-thumb{background:var(--Gray-Gray-200, #c3c9d9);border-radius:3px}.table-wrapper::-webkit-scrollbar-thumb:hover{background:var(--Gray-Gray-400, #858ea6)}.custom-table{width:100%;border-collapse:collapse}.custom-table th,.custom-table td{position:relative;padding:var(--Size-3);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);color:var(--Gray-Gray-700)}.custom-table th::after,.custom-table td::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--Gray-Gray-100)}.custom-table th{height:55px;user-select:none}.custom-table th.sortable{cursor:pointer}.custom-table td{height:80px;min-width:100px;font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.headers-container{display:flex;flex-direction:column;align-items:center;gap:var(--Size-1)}.headers-container.align-left{align-items:flex-start}.headers-container.align-right{align-items:flex-end}.headers{display:flex;flex-wrap:nowrap;justify-content:space-around;align-items:center;gap:4px}.headers span{font-weight:var(--font-weight-bold);color:var(--Gray-Gray-600);font-size:var(--font-size-xs);text-align:center}.headers.align-left span{text-align:left}.headers.align-right span{text-align:right}.order-icons{display:flex;flex-direction:column}.order-icons dropi-icon{height:6px;display:flex}.checkbox-header{width:fit-content;min-width:fit-content;max-width:fit-content;text-align:center;padding:var(--Size-3) !important}.custom-table.has-checkbox td:first-child{width:fit-content;min-width:fit-content;max-width:fit-content;text-align:center;padding:8px !important}.table-row:hover{background-color:var(--Gray-Gray-50);transition:background-color 0.3s ease}.table-row:hover td:last-child{background-color:var(--Gray-Gray-50);transition:background-color 0.3s ease}.table-row.sub-row td:first-child{padding-left:2rem !important}.cell-content{display:inline-block;width:100%;text-align:left}td.actions,th.actions{position:sticky;right:0;z-index:2;background-color:var(--Neutral-White);width:120px;min-width:120px;max-width:120px;text-align:center}td.actions{vertical-align:middle}td.actions>div{display:flex !important;justify-content:center !important;align-items:center !important;width:100%;height:100%}.table-row:hover td.actions{background-color:var(--Gray-Gray-50);transition:background-color 0.3s ease}.actions-header{width:100%;text-align:center;user-select:none}.short-actions{display:flex;gap:var(--Size-2);align-items:center;justify-content:center}.action-icon{cursor:pointer}.action-button{position:relative}.actions-menu{position:absolute;top:0;right:80px;padding:var(--Size-2);border-radius:var(--Border-2);background-color:var(--Neutral-White);box-shadow:var(--Shadow-medium);z-index:10;animation:fadeIn 0.3s ease-in-out forwards}.action-item{padding:var(--Size-2);font-size:var(--font-size-xs);color:var(--Gray-Gray-600);height:45px;width:190px;display:flex;gap:var(--Size-4);align-items:center;justify-content:left;cursor:pointer;border-radius:var(--Border-1)}.action-item:hover{background-color:var(--Gray-Gray-50)}.table-labels{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);white-space:nowrap}.table-labels.multiline{white-space:pre;line-height:1.6}.text-wrap-label{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);white-space:normal;word-break:break-word;overflow-wrap:break-word;line-height:1.5}.date-label{display:inline-flex;flex-direction:column}.date-label span{font-weight:var(--font-weight-regular);color:var(--Gray-Gray-600);white-space:nowrap;font-size:var(--font-size-s)}.flag-container{display:inline-flex;align-items:center;gap:var(--Size-3)}.flag-container span{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.text-icon-label{display:inline-flex;flex-wrap:nowrap;gap:var(--Size-2);align-items:center}.text-icon-label span{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.image-label{display:inline-flex;flex-direction:column;justify-content:center}.img-container{display:flex;width:24px;padding-bottom:var(--Size-1);align-items:center}.img-container img{border-radius:60px;height:24px;width:24px;object-fit:cover}.container-cell{display:inline-flex;flex-direction:column}.status-label{display:inline-flex;flex-direction:column;gap:var(--Size-1)}.status-dot{display:flex;gap:var(--Size-2);align-items:center}.status-text{font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);color:var(--Gray-Gray-700)}.status-description{font-weight:var(--font-weight-regular);font-size:var(--font-size-s);color:var(--Gray-Gray-600)}.dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.dot-low{background-color:var(--Success-Success-500)}.dot-medium{background-color:var(--Warning-Warning-500)}.dot-high{background-color:var(--Error-Error-500)}.low-opacity{opacity:0.5}.highlight-column{background:var(--Primary-Primary-50)}.text-link-label{display:flex;flex-wrap:nowrap;white-space:nowrap;gap:var(--Size-1)}.text-link-label span{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.text-link-label a{color:var(--Info-Info-500);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.empty-table{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:400px}.empty-message-container{display:flex;width:420px;padding:var(--Size-4);flex-direction:column;align-items:center;gap:var(--Size-4);text-align:center;color:var(--Gray-Gray-500);font-size:var(--font-size-s)}.pagination{margin-top:var(--Size-4);display:flex;justify-content:space-between;align-items:center}.page-size-selector{display:flex;gap:5px;align-items:baseline}.page-size-selector label{font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);color:var(--Gray-Gray-700)}.page-size-selector select{width:fit-content;height:29px;border-radius:var(--Border-2);padding:var(--Size-1);border:1px solid var(--Gray-Gray-200);color:var(--Gray-Gray-500);background:var(--Neutral-White);font-size:var(--font-size-xs);cursor:pointer}.total-results{font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);color:var(--Gray-Gray-600)}.skeleton{height:14px;background:linear-gradient(90deg, var(--Gray-Gray-100) 25%, var(--Gray-Gray-50) 50%, var(--Gray-Gray-100) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--Border-1)}.skeleton--sm{width:20px}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.search-actions{flex-direction:column;align-items:stretch}.column-selector-menu{left:0;right:0;width:100%;max-height:45vh;overflow-y:auto}.pagination{flex-direction:column;align-items:center;gap:var(--Size-3)}td.actions,th.actions{width:60px;min-width:60px}.table-wrapper.has-sticky-actions{width:calc(100% - 60px)}}`;
|
|
12200
|
+
const dropiTableCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif);width:100%;min-width:0}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.table-container{width:100%;min-width:0;border-radius:var(--Border-3);padding:0 var(--Size-4) var(--Size-4) var(--Size-4);background-color:var(--Neutral-White)}.search-container{margin-block:var(--Size-5);display:flex;flex-direction:column;gap:var(--Size-4)}.table-title{padding-block:var(--Size-2);font-size:var(--font-size-m);font-weight:var(--font-weight-bold);color:var(--Gray-Gray-700);margin:0}.search-actions{display:flex;align-items:flex-end;gap:var(--Size-3);width:100%}.search-actions dropi-input{flex:1}.search-actions.only-filter{justify-content:flex-end}.table-tools{display:flex;justify-content:flex-end}.column-selector-container{position:relative}.column-selector-btn{min-width:40px;width:40px;height:40px;padding:0;border:1px solid var(--Gray-Gray-200);border-radius:var(--Border-2);background:var(--Neutral-White);cursor:pointer;display:flex;align-items:center;justify-content:center}.column-selector-btn:hover{background:var(--Gray-Gray-50)}.column-selector-menu{position:absolute;top:calc(100% + 8px);right:0;width:min(320px, 88vw);border:1px solid var(--Gray-Gray-200);border-radius:var(--Border-2);background:var(--Neutral-White);box-shadow:var(--Shadow-medium);z-index:20;padding:var(--Size-1)}.column-selector-footer{border-top:1px solid var(--Gray-Gray-100);margin-top:var(--Size-1);padding:var(--Size-2) var(--Size-4);display:flex;align-items:center}.column-selector-all{display:inline-flex;align-items:center;gap:var(--Size-2);color:var(--Gray-Gray-700);font-size:var(--font-size-s);cursor:pointer;user-select:none}.column-selector-option{display:flex;align-items:center;gap:var(--Size-2);padding:var(--Size-2) var(--Size-3);font-size:var(--font-size-s);color:var(--Gray-Gray-700);cursor:pointer;border-radius:var(--Border-1)}.column-selector-option:hover{background:var(--Gray-Gray-50)}.table-wrapper{overflow-x:auto;width:100%;position:relative}.table-wrapper.has-sticky-actions{width:100%}.table-wrapper::-webkit-scrollbar{height:6px}.table-wrapper::-webkit-scrollbar-track{background:transparent}.table-wrapper::-webkit-scrollbar-thumb{background:var(--Gray-Gray-200, #c3c9d9);border-radius:3px}.table-wrapper::-webkit-scrollbar-thumb:hover{background:var(--Gray-Gray-400, #858ea6)}.custom-table{width:100%;border-collapse:collapse}.custom-table th,.custom-table td{position:relative;padding:var(--Size-3);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);color:var(--Gray-Gray-700)}.custom-table th::after,.custom-table td::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--Gray-Gray-100)}.custom-table th{height:55px;user-select:none}.custom-table th.sortable{cursor:pointer}.custom-table td{height:80px;min-width:100px;font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.headers-container{display:flex;flex-direction:column;align-items:center;gap:var(--Size-1)}.headers-container.align-left{align-items:flex-start}.headers-container.align-right{align-items:flex-end}.headers{display:flex;flex-wrap:nowrap;justify-content:space-around;align-items:center;gap:4px}.headers span{font-weight:var(--font-weight-bold);color:var(--Gray-Gray-600);font-size:var(--font-size-xs);text-align:center}.headers.align-left span{text-align:left}.headers.align-right span{text-align:right}.order-icons{display:flex;flex-direction:column}.order-icons dropi-icon{height:6px;display:flex}.checkbox-header{width:fit-content;min-width:fit-content;max-width:fit-content;text-align:center;padding:var(--Size-3) !important}.custom-table.has-checkbox td:first-child{width:fit-content;min-width:fit-content;max-width:fit-content;text-align:center;padding:8px !important}.table-row:hover{background-color:var(--Gray-Gray-50);transition:background-color 0.3s ease}.table-row:hover td:last-child{background-color:var(--Gray-Gray-50);transition:background-color 0.3s ease}.table-row.sub-row td:first-child{padding-left:2rem !important}.cell-content{display:inline-block;width:100%;text-align:left}td.actions,th.actions{position:sticky;right:0;z-index:2;background-color:var(--Neutral-White);width:120px;min-width:120px;max-width:120px;text-align:center}td.actions{vertical-align:middle}td.actions>div{display:flex !important;justify-content:center !important;align-items:center !important;width:100%;height:100%}.table-row:hover td.actions{background-color:var(--Gray-Gray-50);transition:background-color 0.3s ease}.actions-header{width:100%;text-align:center;user-select:none}.short-actions{display:flex;gap:var(--Size-2);align-items:center;justify-content:center}.action-icon{cursor:pointer}.action-button{position:relative}.actions-menu{position:absolute;top:0;right:80px;padding:var(--Size-2);border-radius:var(--Border-2);background-color:var(--Neutral-White);box-shadow:var(--Shadow-medium);z-index:10;animation:fadeIn 0.3s ease-in-out forwards}.action-item{padding:var(--Size-2);font-size:var(--font-size-xs);color:var(--Gray-Gray-600);height:45px;width:190px;display:flex;gap:var(--Size-4);align-items:center;justify-content:left;cursor:pointer;border-radius:var(--Border-1)}.action-item:hover{background-color:var(--Gray-Gray-50)}.table-labels{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);white-space:nowrap}.table-labels.multiline{white-space:pre;line-height:1.6}.text-wrap-label{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s);white-space:normal;word-break:break-word;overflow-wrap:break-word;line-height:1.5}.date-label{display:inline-flex;flex-direction:column}.date-label span{font-weight:var(--font-weight-regular);color:var(--Gray-Gray-600);white-space:nowrap;font-size:var(--font-size-s)}.flag-container{display:inline-flex;align-items:center;gap:var(--Size-3)}.flag-container span{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.text-icon-label{display:inline-flex;flex-wrap:nowrap;gap:var(--Size-2);align-items:center}.text-icon-label span{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.image-label{display:inline-flex;flex-direction:column;justify-content:center}.img-container{display:flex;width:24px;padding-bottom:var(--Size-1);align-items:center}.img-container img{border-radius:60px;height:24px;width:24px;object-fit:cover}.container-cell{display:inline-flex;flex-direction:column}.status-label{display:inline-flex;flex-direction:column;gap:var(--Size-1)}.status-dot{display:flex;gap:var(--Size-2);align-items:center}.status-text{font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);color:var(--Gray-Gray-700)}.status-description{font-weight:var(--font-weight-regular);font-size:var(--font-size-s);color:var(--Gray-Gray-600)}.dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.dot-low{background-color:var(--Success-Success-500)}.dot-medium{background-color:var(--Warning-Warning-500)}.dot-high{background-color:var(--Error-Error-500)}.low-opacity{opacity:0.5}.highlight-column{background:var(--Primary-Primary-50)}.text-link-label{display:flex;flex-wrap:nowrap;white-space:nowrap;gap:var(--Size-1)}.text-link-label span{color:var(--Gray-Gray-600);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.text-link-label a{color:var(--Info-Info-500);font-weight:var(--font-weight-regular);font-size:var(--font-size-s)}.empty-table{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:400px}.empty-message-container{display:flex;width:420px;padding:var(--Size-4);flex-direction:column;align-items:center;gap:var(--Size-4);text-align:center;color:var(--Gray-Gray-500);font-size:var(--font-size-s)}.pagination{margin-top:var(--Size-4);display:flex;justify-content:space-between;align-items:center}.page-size-selector{display:flex;gap:5px;align-items:baseline}.page-size-selector label{font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);color:var(--Gray-Gray-700)}.page-size-selector select{width:fit-content;height:29px;border-radius:var(--Border-2);padding:var(--Size-1);border:1px solid var(--Gray-Gray-200);color:var(--Gray-Gray-500);background:var(--Neutral-White);font-size:var(--font-size-xs);cursor:pointer}.total-results{font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);color:var(--Gray-Gray-600)}.skeleton{height:14px;background:linear-gradient(90deg, var(--Gray-Gray-100) 25%, var(--Gray-Gray-50) 50%, var(--Gray-Gray-100) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--Border-1)}.skeleton--sm{width:20px}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.search-actions{flex-direction:column;align-items:stretch}.column-selector-menu{left:0;right:0;width:100%;max-height:45vh;overflow-y:auto}.pagination{flex-direction:column;align-items:center;gap:var(--Size-3)}td.actions,th.actions{width:60px;min-width:60px}.table-wrapper.has-sticky-actions{width:calc(100% - 60px)}}`;
|
|
12183
12201
|
|
|
12184
12202
|
/**
|
|
12185
12203
|
* @component dropi-table
|
|
@@ -12528,7 +12546,7 @@ class DropiTable {
|
|
|
12528
12546
|
}; }
|
|
12529
12547
|
}
|
|
12530
12548
|
|
|
12531
|
-
const dropiTabsCss = () => `:host{display:block;width:100%}*,*::before,*::after{box-sizing:border-box}.tabs-container{display:flex;flex-wrap:nowrap;overflow-x:auto;width:100%;height:52px;scrollbar-width:none}.tabs-container::-webkit-scrollbar{width:0;height:0}.tab-item{padding:var(--Size-4,16px) var(--Size-5,20px);background:var(--Neutral-White, #ffffff);border-bottom:2px solid var(--Gray-Gray-100,#e6eaf2);cursor:pointer;display:flex;gap:16px;align-items:center;white-space:nowrap;flex-shrink:0;transition:border-color 0.15s ease;user-select:none}.tab-item:hover:not(.tab-item--disabled):not(.tab-item--active){border-color:var(--Gray-Gray-300,#a3abbf)}.tab-item--active{border-bottom:2px solid var(--Primary-Primary-500,#f49a3d)}.tab-item--disabled{background:rgba(223,228,237,0.22);cursor:not-allowed;opacity:0.7;pointer-events:none}.tab-label-row{display:flex;align-items:center;gap:8px}.tab-label{font-size:var(--font-size-s,14px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-400,#858ea6);line-height:20px}.tab-item--active .tab-label{color:var(--Gray-Gray-600,#475066)}.tab-item--disabled .tab-label{font-weight:var(--font-weight-light);color:var(--Gray-Gray-300,#a3abbf)}.tab-counter{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:20px;font-size:var(--font-size-xxs);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple);background:var(--Gray-Gray-100,#e6eaf2);color:var(--Gray-Gray-500,#69738c)}.tab-counter--active{background-color:var(--Primary-Primary-500, #F49A3D);color:var(--Neutral-White)}.tab-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background-color:var(--Primary-Primary-500, #f49a3d);flex-shrink:0}`;
|
|
12549
|
+
const dropiTabsCss = () => `:host{display:block;font-family:var(--font-family-01, 'Inter', sans-serif);width:100%}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}*,*::before,*::after{box-sizing:border-box}.tabs-container{display:flex;flex-wrap:nowrap;overflow-x:auto;width:100%;height:52px;scrollbar-width:none}.tabs-container::-webkit-scrollbar{width:0;height:0}.tab-item{padding:var(--Size-4,16px) var(--Size-5,20px);background:var(--Neutral-White, #ffffff);border-bottom:2px solid var(--Gray-Gray-100,#e6eaf2);cursor:pointer;display:flex;gap:16px;align-items:center;white-space:nowrap;flex-shrink:0;transition:border-color 0.15s ease;user-select:none}.tab-item:hover:not(.tab-item--disabled):not(.tab-item--active){border-color:var(--Gray-Gray-300,#a3abbf)}.tab-item--active{border-bottom:2px solid var(--Primary-Primary-500,#f49a3d)}.tab-item--disabled{background:rgba(223,228,237,0.22);cursor:not-allowed;opacity:0.7;pointer-events:none}.tab-label-row{display:flex;align-items:center;gap:8px}.tab-label{font-size:var(--font-size-s,14px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-400,#858ea6);line-height:20px}.tab-item--active .tab-label{color:var(--Gray-Gray-600,#475066)}.tab-item--disabled .tab-label{font-weight:var(--font-weight-light);color:var(--Gray-Gray-300,#a3abbf)}.tab-counter{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:20px;font-size:var(--font-size-xxs);font-weight:var(--font-weight-bold);line-height:var(--lineheight-simple);background:var(--Gray-Gray-100,#e6eaf2);color:var(--Gray-Gray-500,#69738c)}.tab-counter--active{background-color:var(--Primary-Primary-500, #F49A3D);color:var(--Neutral-White)}.tab-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background-color:var(--Primary-Primary-500, #f49a3d);flex-shrink:0}`;
|
|
12532
12550
|
|
|
12533
12551
|
/**
|
|
12534
12552
|
* @component dropi-tabs
|
|
@@ -12569,7 +12587,7 @@ class DropiTabs {
|
|
|
12569
12587
|
this.dropiIndexChange.emit(tab);
|
|
12570
12588
|
}
|
|
12571
12589
|
render() {
|
|
12572
|
-
return (hAsync("div", { key: '
|
|
12590
|
+
return (hAsync("div", { key: '51afd113d7c502b933b93e775b3c0fe2ac1ffd1d', class: "tabs-container", role: "tablist" }, this.parsedTabs.map(tab => {
|
|
12573
12591
|
const isActive = tab.id === this.activeTab;
|
|
12574
12592
|
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
|
|
12575
12593
|
? hAsync("dropi-icon", { name: "Check-circle", iconWidth: "12px", iconHeight: "12px", color: "Success-Success-500" })
|
|
@@ -12598,7 +12616,7 @@ class DropiTabs {
|
|
|
12598
12616
|
}; }
|
|
12599
12617
|
}
|
|
12600
12618
|
|
|
12601
|
-
const dropiTagCss = () => `:host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}.container-chips{display:flex;align-items:center;justify-content:center}.tags{display:inline-flex;padding:4px 8px;justify-content:center;align-items:center;gap:4px;border-radius:var(--Border-5, 9999px);overflow:hidden;text-align:center;text-overflow:ellipsis;font-size:var(--font-size-xs, 12px);font-weight:var(--font-weight-medium, 500);line-height:var(--lineheight-large, 150%);animation:fade-in 200ms ease-out}.tags.dot-variant,.tags.text-variant{padding:0;gap:8px;background-color:transparent !important;line-height:normal}.dot-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0}@keyframes fade-in{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}}`;
|
|
12619
|
+
const dropiTagCss = () => `:host{display:inline-flex}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.container-chips{display:flex;align-items:center;justify-content:center}.tags{display:inline-flex;padding:4px 8px;justify-content:center;align-items:center;gap:4px;border-radius:var(--Border-5, 9999px);overflow:hidden;text-align:center;text-overflow:ellipsis;font-size:var(--font-size-xs, 12px);font-weight:var(--font-weight-medium, 500);line-height:var(--lineheight-large, 150%);animation:fade-in 200ms ease-out}.tags.dot-variant,.tags.text-variant{padding:0;gap:8px;background-color:transparent !important;line-height:normal}.dot-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0}@keyframes fade-in{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}}`;
|
|
12602
12620
|
|
|
12603
12621
|
/**
|
|
12604
12622
|
* @component dropi-tag
|
|
@@ -12668,7 +12686,7 @@ class DropiTag {
|
|
|
12668
12686
|
return typeof this.text === 'string' && this.text.trim().length > 0;
|
|
12669
12687
|
}
|
|
12670
12688
|
render() {
|
|
12671
|
-
return (hAsync("div", { key: '
|
|
12689
|
+
return (hAsync("div", { key: '84d16e23ea93c74736129a56d919148715377f6d', class: "container-chips" }, hAsync("div", { key: '34c07dad33b89078a40161b1fca139d08a3aaff3', class: {
|
|
12672
12690
|
tags: true,
|
|
12673
12691
|
'icon-only': this.showIcon && !this.hasContent,
|
|
12674
12692
|
'dot-variant': this.variant === 'dot',
|
|
@@ -12677,7 +12695,7 @@ class DropiTag {
|
|
|
12677
12695
|
backgroundColor: (this.variant === 'dot' || this.variant === 'text') ? 'transparent' : this.bgColor,
|
|
12678
12696
|
color: this.textColor,
|
|
12679
12697
|
fontWeight: this.fontWeight
|
|
12680
|
-
} }, this.variant === 'dot' && (hAsync("div", { key: '
|
|
12698
|
+
} }, this.variant === 'dot' && (hAsync("div", { key: '09007ce8723056bead8b71e3c5d1be4c8beaf445', class: "dot-indicator", style: { backgroundColor: this.dotColor } })), this.showIcon && this.icon && (hAsync("dropi-icon", { key: '82f6f39bb752f32f870a10b7ffd15a611f8895ee', class: "file-icon", name: this.icon, iconWidth: "16px", iconHeight: "16px", color: this.variant === 'dot' ? 'Gray-Gray-500' : this.iconColor })), this.hasContent && hAsync("span", { key: '94a6ab523d204dd26175c2cf5bad8d66e20d6f85' }, this.text))));
|
|
12681
12699
|
}
|
|
12682
12700
|
static get watchers() { return {
|
|
12683
12701
|
"type": [{
|
|
@@ -12708,7 +12726,7 @@ class DropiTag {
|
|
|
12708
12726
|
}; }
|
|
12709
12727
|
}
|
|
12710
12728
|
|
|
12711
|
-
const dropiTagTypeProductCss = () => `:host{display:inline-block}.type-variation{border-radius:4px;background:var(--Warning-Warning-500);padding:2px 6px;font-size:var(--font-size-xs);color:var(--Neutral-White);text-transform:capitalize;font-weight:var(--font-weight-regular);width:fit-content}`;
|
|
12729
|
+
const dropiTagTypeProductCss = () => `:host{display:inline-block;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.type-variation{border-radius:4px;background:var(--Warning-Warning-500);padding:2px 6px;font-size:var(--font-size-xs);color:var(--Neutral-White);text-transform:capitalize;font-weight:var(--font-weight-regular);width:fit-content}`;
|
|
12712
12730
|
|
|
12713
12731
|
/**
|
|
12714
12732
|
* @component dropi-tag-type-product
|
|
@@ -12721,7 +12739,7 @@ class DropiTagTypeProduct {
|
|
|
12721
12739
|
/** Label text. Default: VARIABLE */
|
|
12722
12740
|
label = 'VARIABLE';
|
|
12723
12741
|
render() {
|
|
12724
|
-
return hAsync("div", { key: '
|
|
12742
|
+
return hAsync("div", { key: '30cc0207828626fdcdb8dd84d34200903e52a146', class: "type-variation" }, this.label);
|
|
12725
12743
|
}
|
|
12726
12744
|
static get style() { return dropiTagTypeProductCss(); }
|
|
12727
12745
|
static get cmpMeta() { return {
|
|
@@ -12736,7 +12754,7 @@ class DropiTagTypeProduct {
|
|
|
12736
12754
|
}; }
|
|
12737
12755
|
}
|
|
12738
12756
|
|
|
12739
|
-
const dropiTextAreaCss = () => `:host{display:flex;flex-direction:column;width:100
|
|
12757
|
+
const dropiTextAreaCss = () => `:host{display:flex;flex-direction:column;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}*,*::before,*::after{box-sizing:border-box}.textarea-wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:4px}.textarea-wrapper label{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066)}.asterisk{color:var(--Error-Error-500, #f46a6b)}.textarea-container{position:relative;display:flex;flex-direction:column}textarea.form-control{box-sizing:border-box;width:100%;flex:1;overflow:auto;padding:var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);font-size:var(--font-size-s, 12px);font-family:var(--font-family-01, 'Inter', sans-serif);color:var(--Gray-Gray-700, #32394d);background:var(--Neutral-White, #ffffff);transition:border-color 0.3s ease-in-out;outline:none;appearance:none}textarea.form-control:focus{border-color:var(--Info-Info-500, #50a5f1)}textarea.form-control:focus::placeholder{color:var(--Gray-Gray-400, #858ea6)}textarea.form-control-valid{border-color:var(--Gray-Gray-400, #858ea6) !important;color:var(--Gray-Gray-600, #475066)}textarea.form-control-invalid{border-color:var(--Error-Error-500, #f46a6b) !important;color:var(--Gray-Gray-600, #475066)}textarea.form-control:disabled{border-color:var(--Gray-Gray-200, #c3c9d9) !important;color:var(--Gray-Gray-400, #858ea6);background-color:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed}.char-counter{position:absolute;bottom:10px;right:16px;font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c);pointer-events:none}.form-control-helper{display:flex;gap:4px;align-items:center}.form-control-helper span{display:block;color:var(--Gray-Gray-600, #475066);font-size:var(--font-size-xs, 10px)}.invalid-color{color:var(--Error-Error-500, #f46a6b) !important}`;
|
|
12740
12758
|
|
|
12741
12759
|
/**
|
|
12742
12760
|
* @component dropi-text-area
|
|
@@ -12851,12 +12869,12 @@ class DropiTextArea {
|
|
|
12851
12869
|
render() {
|
|
12852
12870
|
const showAsterisk = this.required && this.showObligatoryAsterisk && !this.disabled;
|
|
12853
12871
|
const showHelper = this.textHelper || this.isInvalid;
|
|
12854
|
-
return (hAsync("div", { key: '
|
|
12872
|
+
return (hAsync("div", { key: 'c60ecee8d33a2ea89e4fe9f8922c073c42e40325', class: "textarea-wrapper" }, this.label && (hAsync("label", { key: 'f51e92e244f65d5934e00187014502a168e44e88', htmlFor: this.resolvedId, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : 'var(--Gray-Gray-600)' } }, this.label, showAsterisk && hAsync("span", { key: 'd0290bd7ef48bd5875d978584f9a2ca83f784d5f', class: "asterisk" }, " *"))), hAsync("div", { key: 'dd0f517a5f1d670638a4c30a1cefbba90dc78182', class: "textarea-container" }, hAsync("textarea", { key: 'bbfc1065fcbcbc9f39c029c5e39e3d3aaf6f270e', id: this.resolvedId, class: {
|
|
12855
12873
|
'form-control': true,
|
|
12856
12874
|
'Body-M-Regular': true,
|
|
12857
12875
|
'form-control-valid': !this.isInvalid && this.touched && !!this.value,
|
|
12858
12876
|
'form-control-invalid': this.isInvalid,
|
|
12859
|
-
}, 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: '
|
|
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: '6ede091e4e93682f3dcc41f3ef349e45f8302f89', class: "char-counter" }, this.charCount, "/", this.maxLength))), showHelper && (hAsync("div", { key: '4de46271b004b4d7fe0d3d52c3161c2330b9289d', class: "form-control-helper" }, this.isInvalid && (hAsync("dropi-icon", { key: 'edf7e714cd50f69fb2613bc9515b902a7eb63465', name: "Warning-circle", iconWidth: "12px", iconHeight: "12px", color: "Error-Error-500" })), hAsync("span", { key: '364a69a89fafe0677966208c10fe8e9e2f3a1b58', class: { 'invalid-color': this.isInvalid }, style: { color: this.disabled ? 'var(--Gray-Gray-400)' : undefined } }, this.textHelper)))));
|
|
12860
12878
|
}
|
|
12861
12879
|
static get formAssociated() { return true; }
|
|
12862
12880
|
static get watchers() { return {
|
|
@@ -12895,7 +12913,7 @@ class DropiTextArea {
|
|
|
12895
12913
|
}; }
|
|
12896
12914
|
}
|
|
12897
12915
|
|
|
12898
|
-
const dropiTimeLineCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.timeline{display:flex;flex-direction:column}.tl-step{display:flex;align-items:flex-start;gap:var(--Size-3, 12px)}.tl-step__marker{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.tl-step__icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background 0.2s, border-color 0.2s}.tl-step--pending .tl-step__icon{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.tl-step--active .tl-step__icon{background:var(--Neutral-White, #ffffff);border:2px solid var(--Primary-Primary-500, #f49a3d);box-shadow:0 0 0 4px var(--Primary-Primary-100, #fde9d0)}.tl-step--done .tl-step__icon{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.tl-step__dot{width:8px;height:8px;border-radius:50%;display:block}.tl-step--pending .tl-step__dot{background:var(--Gray-Gray-300, #a3abbf)}.tl-step--active .tl-step__dot{background:var(--Primary-Primary-500, #f49a3d)}.tl-step--done .tl-step__dot{background:var(--Neutral-White, #ffffff)}.tl-step__line{flex:1;width:2px;min-height:24px;margin:4px 0;background:var(--Gray-Gray-200, #c3c9d9)}.tl-step--done+.tl-step .tl-step__line,.tl-step--done .tl-step__line{background:var(--Primary-Primary-500, #f49a3d)}.tl-step__content{display:flex;flex-direction:column;gap:2px;padding-top:6px;padding-bottom:var(--Size-4, 16px)}.tl-step__label{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.tl-step--pending .tl-step__label{color:var(--Gray-Gray-400, #858ea6);font-weight:var(--font-weight-regular, 400)}.tl-step__subtitle{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}`;
|
|
12916
|
+
const dropiTimeLineCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.timeline{display:flex;flex-direction:column}.tl-step{display:flex;align-items:flex-start;gap:var(--Size-3, 12px)}.tl-step__marker{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.tl-step__icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background 0.2s, border-color 0.2s}.tl-step--pending .tl-step__icon{background:var(--Gray-Gray-100, #e6eaf2);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.tl-step--active .tl-step__icon{background:var(--Neutral-White, #ffffff);border:2px solid var(--Primary-Primary-500, #f49a3d);box-shadow:0 0 0 4px var(--Primary-Primary-100, #fde9d0)}.tl-step--done .tl-step__icon{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.tl-step__dot{width:8px;height:8px;border-radius:50%;display:block}.tl-step--pending .tl-step__dot{background:var(--Gray-Gray-300, #a3abbf)}.tl-step--active .tl-step__dot{background:var(--Primary-Primary-500, #f49a3d)}.tl-step--done .tl-step__dot{background:var(--Neutral-White, #ffffff)}.tl-step__line{flex:1;width:2px;min-height:24px;margin:4px 0;background:var(--Gray-Gray-200, #c3c9d9)}.tl-step--done+.tl-step .tl-step__line,.tl-step--done .tl-step__line{background:var(--Primary-Primary-500, #f49a3d)}.tl-step__content{display:flex;flex-direction:column;gap:2px;padding-top:6px;padding-bottom:var(--Size-4, 16px)}.tl-step__label{font-size:var(--font-size-s, 12px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d)}.tl-step--pending .tl-step__label{color:var(--Gray-Gray-400, #858ea6);font-weight:var(--font-weight-regular, 400)}.tl-step__subtitle{font-size:var(--font-size-xs, 10px);color:var(--Gray-Gray-500, #69738c)}`;
|
|
12899
12917
|
|
|
12900
12918
|
/**
|
|
12901
12919
|
* @component dropi-time-line
|
|
@@ -12920,7 +12938,7 @@ class DropiTimeLine {
|
|
|
12920
12938
|
}
|
|
12921
12939
|
render() {
|
|
12922
12940
|
const steps = this.parsedSteps;
|
|
12923
|
-
return (hAsync("div", { key: '
|
|
12941
|
+
return (hAsync("div", { key: '99a4da366d7fd97258688711d51f5829f7b0a36f', class: "timeline" }, steps.map((step, i) => {
|
|
12924
12942
|
const isLast = i === steps.length - 1;
|
|
12925
12943
|
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))));
|
|
12926
12944
|
})));
|
|
@@ -12938,7 +12956,7 @@ class DropiTimeLine {
|
|
|
12938
12956
|
}; }
|
|
12939
12957
|
}
|
|
12940
12958
|
|
|
12941
|
-
const dropiToastCss = () => `:host{display:contents}
|
|
12959
|
+
const dropiToastCss = () => `:host{display:contents;font-family:var(--font-family-01, 'Inter', sans-serif)}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.dropi-toast-container{position:fixed;z-index:var(--dropi-z-index-toast, 12000);display:flex;flex-direction:column;gap:8px;max-width:380px;width:100%;pointer-events:none;box-sizing:border-box}.dropi-toast-container--top-right{top:80px;right:0;padding:var(--Size-2, 8px)}.dropi-toast-container--top-left{top:80px;left:0;padding:var(--Size-2, 8px)}.dropi-toast-container--bottom-right{bottom:24px;right:0;padding:var(--Size-2, 8px);flex-direction:column-reverse}.dropi-toast-container--bottom-left{bottom:24px;left:0;padding:var(--Size-2, 8px);flex-direction:column-reverse}.dropi-toast-container--top-center{top:80px;left:50%;transform:translateX(-50%);padding:var(--Size-2, 8px)}.dropi-toast-container--bottom-center{bottom:24px;left:50%;transform:translateX(-50%);padding:var(--Size-2, 8px);flex-direction:column-reverse}.dropi-toast-wrapper{pointer-events:auto;animation:dropi-toast-in 0.28s ease;transition:opacity 0.28s ease, transform 0.28s ease, max-height 0.32s ease;overflow:hidden;max-height:200px;box-sizing:border-box}.dropi-toast-wrapper--leaving{opacity:0;transform:translateX(20px);max-height:0;pointer-events:none}@keyframes dropi-toast-in{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.dropi-toast-item{position:relative;display:flex;align-items:center;border-radius:8px;background:#ffffff;box-shadow:0.5px -1px 7px 0px rgba(0,0,0,0.06), 0px 4px 20px 0px rgba(0,0,0,0.12);border-left:8px solid;overflow:hidden;min-width:300px;box-sizing:border-box}.dropi-toast-item--success{border-color:var(--Success-Success-500,#34c38f)}.dropi-toast-item--error{border-color:var(--Error-Error-500,#f46a6b)}.dropi-toast-item--warn{border-color:var(--Warning-Warning-500,#f1b44c)}.dropi-toast-item--info{border-color:var(--Info-Info-500,#50a5f1)}.dropi-toast-content{display:flex;flex-direction:row;align-items:center;padding:16px 16px 16px 8px;gap:16px;box-sizing:border-box;flex:1}.dropi-toast-lottie{width:56px;height:56px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.dropi-toast-lottie lottie-player{display:block;width:56px;height:56px;flex-shrink:0}.dropi-toast-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--Size-1, 4px)}.dropi-toast-title{margin:0;font-size:var(--font-size-l,18px);font-weight:var(--font-weight-bold,700);color:var(--Gray-Gray-700,#32394d);line-height:1.1;text-align:left;max-width:250px}.dropi-toast-detail{margin:0;font-size:var(--font-size-s,14px);color:var(--Gray-Gray-500,#69738c);line-height:1.4;text-align:left;max-width:250px}.dropi-toast-close{position:absolute;top:18px;right:10px;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0;display:flex;align-items:center;justify-content:center}.dropi-toast-close:hover{opacity:0.7}`;
|
|
12942
12960
|
|
|
12943
12961
|
/**
|
|
12944
12962
|
* @component dropi-toast
|
|
@@ -12982,21 +13000,18 @@ class DropiToast {
|
|
|
12982
13000
|
this.items = this.items.filter(i => i.msg.id !== id);
|
|
12983
13001
|
}, 320);
|
|
12984
13002
|
}
|
|
12985
|
-
|
|
12986
|
-
success: '
|
|
12987
|
-
error: '
|
|
12988
|
-
warn: '
|
|
12989
|
-
info: '
|
|
13003
|
+
severityToLottieKey = {
|
|
13004
|
+
success: 'success',
|
|
13005
|
+
error: 'error',
|
|
13006
|
+
warn: 'warning',
|
|
13007
|
+
info: 'question',
|
|
12990
13008
|
};
|
|
12991
|
-
getLottieHtml(severity) {
|
|
12992
|
-
return `<lottie-player src="${this.lottieMap[severity]}" background="transparent" speed="1" loop autoplay></lottie-player>`;
|
|
12993
|
-
}
|
|
12994
13009
|
render() {
|
|
12995
|
-
return (hAsync("div", { key: '
|
|
13010
|
+
return (hAsync("div", { key: '97766971df05e40548f0711b172beb87013ddba4', 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" })))))))));
|
|
12996
13011
|
}
|
|
12997
13012
|
static get style() { return dropiToastCss(); }
|
|
12998
13013
|
static get cmpMeta() { return {
|
|
12999
|
-
"$flags$":
|
|
13014
|
+
"$flags$": 512,
|
|
13000
13015
|
"$tagName$": "dropi-toast",
|
|
13001
13016
|
"$members$": {
|
|
13002
13017
|
"position": [1],
|
|
@@ -13011,7 +13026,7 @@ class DropiToast {
|
|
|
13011
13026
|
}; }
|
|
13012
13027
|
}
|
|
13013
13028
|
|
|
13014
|
-
const dropiTooltipCss$1 = () => `:host{display:inline-block;position:relative}.tooltip-simple-bubble{position:absolute;background:var(--Gray-Gray-800, #1e293b);color:white;padding:4px 8px;border-radius:4px;font-size:12px;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity 0.2s;z-index:var(--dropi-z-index-overlay, 11000)}:host(:hover) .tooltip-simple-bubble{opacity:1}.tooltip-simple--outlined .tooltip-simple-bubble{border:1px solid var(--Gray-Gray-300);background:white;color:var(--Gray-Gray-800)}`;
|
|
13029
|
+
const dropiTooltipCss$1 = () => `:host{display:inline-block;position:relative;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.tooltip-simple-bubble{position:absolute;background:var(--Gray-Gray-800, #1e293b);color:white;padding:4px 8px;border-radius:4px;font-size:12px;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity 0.2s;z-index:var(--dropi-z-index-overlay, 11000)}:host(:hover) .tooltip-simple-bubble{opacity:1}.tooltip-simple--outlined .tooltip-simple-bubble{border:1px solid var(--Gray-Gray-300);background:white;color:var(--Gray-Gray-800)}`;
|
|
13015
13030
|
|
|
13016
13031
|
/**
|
|
13017
13032
|
* @component dropi-tooltip
|
|
@@ -13026,7 +13041,7 @@ class DropiTooltip {
|
|
|
13026
13041
|
/** Whether the tooltip has an outline style (matches Angular `outlined`) */
|
|
13027
13042
|
outlined = false;
|
|
13028
13043
|
render() {
|
|
13029
|
-
return (hAsync("div", { key: '
|
|
13044
|
+
return (hAsync("div", { key: '5d3f7f2dc89ae9172e98a5f6a83256a382dee83f', class: { 'tooltip-simple': true, 'tooltip-simple--outlined': this.outlined } }, hAsync("slot", { key: 'fe5fcc52d61af40c9d90dbc4f7cf7373e9a984f0' }), this.text && (hAsync("div", { key: '22132d97bf57d291e7d3e37188d6d30bab5313e5', class: "tooltip-simple-bubble" }, this.text))));
|
|
13030
13045
|
}
|
|
13031
13046
|
static get style() { return dropiTooltipCss$1(); }
|
|
13032
13047
|
static get cmpMeta() { return {
|
|
@@ -13042,7 +13057,7 @@ class DropiTooltip {
|
|
|
13042
13057
|
}; }
|
|
13043
13058
|
}
|
|
13044
13059
|
|
|
13045
|
-
const dropiTooltipCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}.tooltip-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.tooltip-bubble{position:absolute;z-index:var(--dropi-z-index-overlay, 11000);background:var(--Gray-Gray-800);color:var(--Neutral-White, #ffffff);font-size:var(--font-size-s,14px);line-height:1.5;padding:8px 12px;border-radius:8px;white-space:normal;pointer-events:none;opacity:0;transition:opacity 0.15s ease, transform 0.15s ease;word-break:break-word;box-shadow:var(--Shadow-medium);text-align:left;width:max-content}.tooltip-bubble--visible{opacity:1}.tooltip-bubble--top{bottom:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--bottom{top:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--left{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-bubble--right{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-arrow{position:absolute;width:12px;height:6px}.tooltip-arrow::before{content:'';position:absolute;width:0;height:0}.tooltip-arrow--top{top:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--top::before{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--Gray-Gray-800)}.tooltip-arrow--bottom{bottom:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--bottom::before{border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid var(--Gray-Gray-800)}.tooltip-arrow--left{left:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--left::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid var(--Gray-Gray-800)}.tooltip-arrow--right{right:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--right::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid var(--Gray-Gray-800)}`;
|
|
13060
|
+
const dropiTooltipCss = () => `:host{display:inline-block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.tooltip-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.tooltip-bubble{position:absolute;z-index:var(--dropi-z-index-overlay, 11000);background:var(--Gray-Gray-800);color:var(--Neutral-White, #ffffff);font-size:var(--font-size-s,14px);line-height:1.5;padding:8px 12px;border-radius:8px;white-space:normal;pointer-events:none;opacity:0;transition:opacity 0.15s ease, transform 0.15s ease;word-break:break-word;box-shadow:var(--Shadow-medium);text-align:left;width:max-content}.tooltip-bubble--visible{opacity:1}.tooltip-bubble--top{bottom:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--bottom{top:calc(100% + 12px);left:50%;transform:translateX(-50%)}.tooltip-bubble--left{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-bubble--right{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.tooltip-arrow{position:absolute;width:12px;height:6px}.tooltip-arrow::before{content:'';position:absolute;width:0;height:0}.tooltip-arrow--top{top:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--top::before{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--Gray-Gray-800)}.tooltip-arrow--bottom{bottom:100%;left:50%;transform:translateX(-50%)}.tooltip-arrow--bottom::before{border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid var(--Gray-Gray-800)}.tooltip-arrow--left{left:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--left::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid var(--Gray-Gray-800)}.tooltip-arrow--right{right:100%;top:50%;transform:translateY(-50%)}.tooltip-arrow--right::before{border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid var(--Gray-Gray-800)}`;
|
|
13046
13061
|
|
|
13047
13062
|
/**
|
|
13048
13063
|
* @component dropi-tooltip
|
|
@@ -13167,12 +13182,12 @@ class DropiTooltipV2 {
|
|
|
13167
13182
|
const bubbleStyle = { maxWidth: this.maxWidth };
|
|
13168
13183
|
if (this.minWidth)
|
|
13169
13184
|
bubbleStyle.minWidth = this.minWidth;
|
|
13170
|
-
return (hAsync("div", { key: '
|
|
13185
|
+
return (hAsync("div", { key: 'a112b58703e2ff09e966d7bd5a1f2d94a480ea34', class: "tooltip-wrapper", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onClick: this.handleClick, onFocusin: this.handleFocusin, onFocusout: this.handleFocusout }, this.showIcon && (hAsync("dropi-icon", { key: 'd9cc5fa8203e7eb3e1080bf7f44386cf3c246712', name: this.iconName, iconWidth: `${this.iconSize}px`, iconHeight: `${this.iconSize}px`, color: this.iconColor })), hAsync("slot", { key: '2998dec714338b56b013964d17b6232580be14f0' }), this.displayContent && (hAsync("div", { key: 'c4fd7685ecfb70d10eabb5bb204f2f44939d7e27', class: {
|
|
13171
13186
|
'tooltip-bubble': true,
|
|
13172
13187
|
[`tooltip-bubble--${this.position}`]: true,
|
|
13173
13188
|
[`tooltip-bubble--arrow-${this.arrowPosition}`]: true,
|
|
13174
13189
|
'tooltip-bubble--visible': this.visible,
|
|
13175
|
-
}, style: bubbleStyle, role: "tooltip" }, this.showX && (hAsync("button", { key: '
|
|
13190
|
+
}, style: bubbleStyle, role: "tooltip" }, this.showX && (hAsync("button", { key: '3dbbd89a47c793fac1d34ef4278452ff8ca51d5f', class: "tooltip-close", onClick: this.handleClose, "aria-label": "Cerrar" }, hAsync("dropi-icon", { key: 'd77048bd4c71de51d3e4db5e88f3d80f8d8693b9', name: "Close-small", iconWidth: "12px", iconHeight: "12px", color: "Gray-Gray-500" }))), this.title && !this.text && hAsync("strong", { key: 'd4ff1fd39e0aa80fff9183f7c3b4d85ab71cbcb6', class: "tooltip-title" }, this.title), this.label && !this.text && hAsync("span", { key: 'ffb27d3a0b9649cc6a54d096cb889c13d1233724', class: "tooltip-label" }, this.label), this.text && hAsync("span", { key: '845a5bed4ada40307769c7c274a061b1308b76d7' }, this.text), hAsync("span", { key: '1bc5ef70a8af3b9fe3cb27413e2aad98b0863f6f', class: `tooltip-arrow tooltip-arrow--${this.position}` })))));
|
|
13176
13191
|
}
|
|
13177
13192
|
static get style() { return dropiTooltipCss(); }
|
|
13178
13193
|
static get cmpMeta() { return {
|
|
@@ -13202,7 +13217,7 @@ class DropiTooltipV2 {
|
|
|
13202
13217
|
}; }
|
|
13203
13218
|
}
|
|
13204
13219
|
|
|
13205
|
-
const dropiVerticalStepsCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}.vertical-steps{display:flex;flex-direction:column}.v-step{display:flex;align-items:flex-start;gap:var(--Size-3, 12px)}.v-step--clickable{cursor:pointer}.v-step__indicator{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.v-step__circle{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.v-step__circle--pending{background:var(--Neutral-White, #ffffff);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.v-step__circle--current{background:var(--Neutral-White, #ffffff);border:2px solid var(--Primary-Primary-500, #f49a3d)}.v-step__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.v-step__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-500, #69738c)}.v-step__circle--current .v-step__number{color:var(--Primary-Primary-500, #f49a3d)}.v-step__line{flex:1;width:2px;min-height:24px;background:var(--Gray-Gray-200, #c3c9d9);margin:4px 0;transition:background 0.2s}.v-step__line--done{background:var(--Primary-Primary-500, #f49a3d)}.v-step__label{padding-top:4px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066);line-height:1.4}.v-step__label--current{color:var(--Gray-Gray-800, #1f2433);font-weight:var(--font-weight-bold, 700)}.v-step__label--completed{color:var(--Gray-Gray-500, #69738c)}`;
|
|
13220
|
+
const dropiVerticalStepsCss = () => `:host{display:block}*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}.vertical-steps{display:flex;flex-direction:column}.v-step{display:flex;align-items:flex-start;gap:var(--Size-3, 12px)}.v-step--clickable{cursor:pointer}.v-step__indicator{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.v-step__circle{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.2s, border-color 0.2s}.v-step__circle--pending{background:var(--Neutral-White, #ffffff);border:2px solid var(--Gray-Gray-200, #c3c9d9)}.v-step__circle--current{background:var(--Neutral-White, #ffffff);border:2px solid var(--Primary-Primary-500, #f49a3d)}.v-step__circle--completed{background:var(--Primary-Primary-500, #f49a3d);border:2px solid var(--Primary-Primary-500, #f49a3d)}.v-step__number{font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-500, #69738c)}.v-step__circle--current .v-step__number{color:var(--Primary-Primary-500, #f49a3d)}.v-step__line{flex:1;width:2px;min-height:24px;background:var(--Gray-Gray-200, #c3c9d9);margin:4px 0;transition:background 0.2s}.v-step__line--done{background:var(--Primary-Primary-500, #f49a3d)}.v-step__label{padding-top:4px;font-size:var(--font-size-s, 12px);color:var(--Gray-Gray-600, #475066);line-height:1.4}.v-step__label--current{color:var(--Gray-Gray-800, #1f2433);font-weight:var(--font-weight-bold, 700)}.v-step__label--completed{color:var(--Gray-Gray-500, #69738c)}`;
|
|
13206
13221
|
|
|
13207
13222
|
/**
|
|
13208
13223
|
* @component dropi-vertical-steps
|
|
@@ -13246,7 +13261,7 @@ class DropiVerticalSteps {
|
|
|
13246
13261
|
}
|
|
13247
13262
|
render() {
|
|
13248
13263
|
const steps = this.parsedSteps;
|
|
13249
|
-
return (hAsync("div", { key: '
|
|
13264
|
+
return (hAsync("div", { key: 'ade3e320cb1abf80effaa345178f2fa0f51e12af', class: "vertical-steps" }, steps.map((step, i) => {
|
|
13250
13265
|
const state = this.resolveState(i, step);
|
|
13251
13266
|
const isLast = i === steps.length - 1;
|
|
13252
13267
|
const isClickable = this.clickable && state === 'completed';
|
|
@@ -13269,7 +13284,7 @@ class DropiVerticalSteps {
|
|
|
13269
13284
|
}; }
|
|
13270
13285
|
}
|
|
13271
13286
|
|
|
13272
|
-
const dropiYoutubeLazyVideoCss = () => `:host{display:block;width:100
|
|
13287
|
+
const dropiYoutubeLazyVideoCss = () => `:host{display:block;width:100%;button,input,select,textarea{font-family:var(--font-family-01, 'Inter', sans-serif)}}.video-wrapper{position:relative;width:100%;padding-bottom:56.25%;background:var(--Neutral-Black);overflow:hidden;border-radius:12px}.video-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.thumbnail{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer;display:flex;align-items:center;justify-content:center;overflow:hidden}.thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}.thumbnail:hover img{transform:scale(1.05)}.play-button{position:absolute;color:white;border:none;border-radius:50%;width:70px;height:70px;cursor:pointer;transition:background 0.3s ease;background:rgba(14, 17, 26, 0.6);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}.play-button:hover{background:rgba(0, 0, 0, 0.8)}@media screen and (max-width: 768px){.play-button{width:40px;height:40px}}`;
|
|
13273
13288
|
|
|
13274
13289
|
/**
|
|
13275
13290
|
* @component dropi-youtube-lazy-video
|
|
@@ -13299,7 +13314,7 @@ class DropiYoutubeLazyVideo {
|
|
|
13299
13314
|
return `https://www.youtube.com/embed/${this.videoId}?autoplay=1&rel=0&modestbranding=1`;
|
|
13300
13315
|
}
|
|
13301
13316
|
render() {
|
|
13302
|
-
return (hAsync("div", { key: '
|
|
13317
|
+
return (hAsync("div", { key: 'f310994121b567e362532af9f2e78e22696316b8', class: `video-wrapper${this.isPlaying ? ' playing' : ''}` }, !this.isPlaying && (hAsync("div", { key: '2cdac5802266567917515c1dfc37f0527e645162', class: "thumbnail", onClick: () => { this.isPlaying = true; } }, hAsync("img", { key: '19b3f6886af2dcb2053afcab8ac7677d799cd119', src: this.thumbnail, alt: `Video thumbnail ${this.videoId}` }), hAsync("button", { key: '9a96fb89a30d05130c743dc9a8eec4223b57ddad', class: "play-button", "aria-label": "Reproducir video" }, hAsync("dropi-icon", { key: '31e28e81e0758e26f9c70ffe78a321e8eb1b125e', name: "Play", iconWidth: "17px", iconHeight: "21px", color: "Neutral-White" })))), this.isPlaying && (hAsync("iframe", { key: '8c0ae2649f0ef9436309b4be68e0108d16b6e0de', src: this.videoUrl, title: this.videoTitle, frameborder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, loading: "lazy" }))));
|
|
13303
13318
|
}
|
|
13304
13319
|
static get style() { return dropiYoutubeLazyVideoCss(); }
|
|
13305
13320
|
static get cmpMeta() { return {
|