@dropi/ui 0.1.22 → 0.1.23
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/{esm → dropi-ui}/dropi-accordion-item.entry.js +8 -2
- package/dist/dropi-ui/dropi-accordion-item.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-accordion.entry.js +4 -1
- package/dist/dropi-ui/dropi-accordion.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-alert-legacy.entry.js +4 -1
- package/dist/dropi-ui/dropi-alert-legacy.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-alert-modal.entry.js +4 -1
- package/dist/dropi-ui/dropi-alert-modal.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-alert.entry.js +4 -1
- package/dist/dropi-ui/dropi-alert.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-avatars.entry.js +4 -1
- package/dist/dropi-ui/dropi-avatars.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-badge-legacy.entry.js +4 -1
- package/dist/dropi-ui/dropi-badge-legacy.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-badge.entry.js +4 -1
- package/dist/dropi-ui/dropi-badge.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-banner-external.entry.js +4 -1
- package/dist/dropi-ui/dropi-banner-external.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-breadcrumb.entry.js +4 -1
- package/dist/dropi-ui/dropi-breadcrumb.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-button.entry.js +4 -1
- package/dist/dropi-ui/dropi-button.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-card-checkbox.entry.js +4 -1
- package/dist/dropi-ui/dropi-card-checkbox.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-card-product.entry.js +4 -1
- package/dist/dropi-ui/dropi-card-product.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-card-section.entry.js +4 -1
- package/dist/dropi-ui/dropi-card-section.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-carousel.entry.js +4 -1
- package/dist/dropi-ui/dropi-carousel.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-checkbox-selection-list.entry.js +4 -1
- package/dist/dropi-ui/dropi-checkbox-selection-list.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-checkbox.entry.js +4 -1
- package/dist/dropi-ui/dropi-checkbox.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-chips.entry.js +4 -1
- package/dist/dropi-ui/dropi-chips.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-city-selector.entry.js +4 -1
- package/dist/dropi-ui/dropi-city-selector.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-color-picker.entry.js +4 -1
- package/dist/dropi-ui/dropi-color-picker.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-country-flags.entry.js +4 -1
- package/dist/dropi-ui/dropi-country-flags.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-country-selector.entry.js +4 -1
- package/dist/dropi-ui/dropi-country-selector.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-date-picker-range.entry.js +4 -1
- package/dist/dropi-ui/dropi-date-picker-range.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-date-picker.entry.js +4 -1
- package/dist/dropi-ui/dropi-date-picker.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-drawer.entry.js +4 -1
- package/dist/dropi-ui/dropi-drawer.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-dropdown.entry.js +4 -1
- package/dist/dropi-ui/dropi-dropdown.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-empty-state.entry.js +4 -1
- package/dist/dropi-ui/dropi-empty-state.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-favorite-button.entry.js +4 -1
- package/dist/dropi-ui/dropi-favorite-button.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-file-upload-progress-bar.entry.js +4 -1
- package/dist/dropi-ui/dropi-file-upload-progress-bar.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-file-upload.entry.js +4 -1
- package/dist/dropi-ui/dropi-file-upload.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-icon.entry.js +4 -1
- package/dist/dropi-ui/dropi-icon.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-ilustration-icon.entry.js +4 -1
- package/dist/dropi-ui/dropi-ilustration-icon.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-image-miniature.entry.js +4 -1
- package/dist/dropi-ui/dropi-image-miniature.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-image-overlay.entry.js +4 -1
- package/dist/dropi-ui/dropi-image-overlay.entry.js.map +1 -0
- package/dist/{esm/dropi-input_3.entry.js → dropi-ui/dropi-input.entry.js} +4 -128
- package/dist/dropi-ui/dropi-input.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-languages-selector.entry.js +4 -1
- package/dist/dropi-ui/dropi-languages-selector.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-logo.entry.js +4 -1
- package/dist/dropi-ui/dropi-logo.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-lottie-loader.entry.js +4 -1
- package/dist/dropi-ui/dropi-lottie-loader.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-media-player.entry.js +4 -1
- package/dist/dropi-ui/dropi-media-player.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-modal.entry.js +4 -1
- package/dist/dropi-ui/dropi-modal.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-navbar.entry.js +4 -1
- package/dist/dropi-ui/dropi-navbar.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-otp-send-code.entry.js +4 -1
- package/dist/dropi-ui/dropi-otp-send-code.entry.js.map +1 -0
- package/dist/dropi-ui/dropi-paginator.entry.js +70 -0
- package/dist/dropi-ui/dropi-paginator.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-phone-input.entry.js +4 -1
- package/dist/dropi-ui/dropi-phone-input.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-radio-button.entry.js +4 -1
- package/dist/dropi-ui/dropi-radio-button.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-radio-selection-list.entry.js +4 -1
- package/dist/dropi-ui/dropi-radio-selection-list.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-read-more.entry.js +4 -1
- package/dist/dropi-ui/dropi-read-more.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-search.entry.js +4 -1
- package/dist/dropi-ui/dropi-search.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-select.entry.js +4 -1
- package/dist/dropi-ui/dropi-select.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-sidebar.entry.js +4 -1
- package/dist/dropi-ui/dropi-sidebar.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-simple-stepper.entry.js +4 -1
- package/dist/dropi-ui/dropi-simple-stepper.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-skeleton.entry.js +4 -1
- package/dist/dropi-ui/dropi-skeleton.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-steps.entry.js +4 -1
- package/dist/dropi-ui/dropi-steps.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-switch.entry.js +4 -1
- package/dist/dropi-ui/dropi-switch.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-table.entry.js +4 -1
- package/dist/dropi-ui/dropi-table.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-tabs.entry.js +4 -1
- package/dist/dropi-ui/dropi-tabs.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-tag-type-product.entry.js +4 -1
- package/dist/dropi-ui/dropi-tag-type-product.entry.js.map +1 -0
- package/dist/dropi-ui/dropi-tag.entry.js +69 -0
- package/dist/dropi-ui/dropi-tag.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-text-area.entry.js +4 -1
- package/dist/dropi-ui/dropi-text-area.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-time-line.entry.js +4 -1
- package/dist/dropi-ui/dropi-time-line.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-toast.entry.js +4 -1
- package/dist/dropi-ui/dropi-toast.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-tooltip-v2.entry.js +4 -1
- package/dist/dropi-ui/dropi-tooltip-v2.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-tooltip.entry.js +4 -1
- package/dist/dropi-ui/dropi-tooltip.entry.js.map +1 -0
- package/dist/dropi-ui/dropi-ui.css +311 -1
- package/dist/dropi-ui/dropi-ui.esm.js +50 -1
- package/dist/dropi-ui/dropi-ui.esm.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-vertical-steps.entry.js +4 -1
- package/dist/dropi-ui/dropi-vertical-steps.entry.js.map +1 -0
- package/dist/{esm → dropi-ui}/dropi-youtube-lazy-video.entry.js +4 -1
- package/dist/dropi-ui/dropi-youtube-lazy-video.entry.js.map +1 -0
- package/dist/dropi-ui/index-Cvp2LQOM.js +4585 -0
- package/dist/dropi-ui/index-Cvp2LQOM.js.map +1 -0
- package/dist/dropi-ui/index.esm.js +4 -0
- package/dist/dropi-ui/index.esm.js.map +1 -0
- package/package.json +1 -1
- package/readme.md +18 -16
- package/dist/cjs/dropi-accordion-item.cjs.entry.js +0 -54
- package/dist/cjs/dropi-accordion.cjs.entry.js +0 -19
- package/dist/cjs/dropi-alert-legacy.cjs.entry.js +0 -39
- package/dist/cjs/dropi-alert-modal.cjs.entry.js +0 -128
- package/dist/cjs/dropi-alert.cjs.entry.js +0 -64
- package/dist/cjs/dropi-avatars.cjs.entry.js +0 -31
- package/dist/cjs/dropi-badge-legacy.cjs.entry.js +0 -30
- package/dist/cjs/dropi-badge.cjs.entry.js +0 -37
- package/dist/cjs/dropi-banner-external.cjs.entry.js +0 -63
- package/dist/cjs/dropi-breadcrumb.cjs.entry.js +0 -48
- package/dist/cjs/dropi-button.cjs.entry.js +0 -87
- package/dist/cjs/dropi-card-checkbox.cjs.entry.js +0 -48
- package/dist/cjs/dropi-card-product.cjs.entry.js +0 -78
- package/dist/cjs/dropi-card-section.cjs.entry.js +0 -38
- package/dist/cjs/dropi-carousel.cjs.entry.js +0 -153
- package/dist/cjs/dropi-checkbox-selection-list.cjs.entry.js +0 -73
- package/dist/cjs/dropi-checkbox.cjs.entry.js +0 -36
- package/dist/cjs/dropi-chips.cjs.entry.js +0 -30
- package/dist/cjs/dropi-city-selector.cjs.entry.js +0 -104
- package/dist/cjs/dropi-color-picker.cjs.entry.js +0 -319
- package/dist/cjs/dropi-country-flags.cjs.entry.js +0 -37
- package/dist/cjs/dropi-country-selector.cjs.entry.js +0 -197
- package/dist/cjs/dropi-date-picker-range.cjs.entry.js +0 -115
- package/dist/cjs/dropi-date-picker.cjs.entry.js +0 -223
- package/dist/cjs/dropi-drawer.cjs.entry.js +0 -79
- package/dist/cjs/dropi-dropdown.cjs.entry.js +0 -65
- package/dist/cjs/dropi-empty-state.cjs.entry.js +0 -36
- package/dist/cjs/dropi-favorite-button.cjs.entry.js +0 -27
- package/dist/cjs/dropi-file-upload-progress-bar.cjs.entry.js +0 -77
- package/dist/cjs/dropi-file-upload.cjs.entry.js +0 -237
- package/dist/cjs/dropi-icon.cjs.entry.js +0 -67
- package/dist/cjs/dropi-ilustration-icon.cjs.entry.js +0 -39
- package/dist/cjs/dropi-image-miniature.cjs.entry.js +0 -44
- package/dist/cjs/dropi-image-overlay.cjs.entry.js +0 -63
- package/dist/cjs/dropi-input_3.cjs.entry.js +0 -392
- package/dist/cjs/dropi-languages-selector.cjs.entry.js +0 -61
- package/dist/cjs/dropi-logo.cjs.entry.js +0 -37
- package/dist/cjs/dropi-lottie-loader.cjs.entry.js +0 -27
- package/dist/cjs/dropi-media-player.cjs.entry.js +0 -192
- package/dist/cjs/dropi-modal.cjs.entry.js +0 -142
- package/dist/cjs/dropi-navbar.cjs.entry.js +0 -54
- package/dist/cjs/dropi-otp-send-code.cjs.entry.js +0 -92
- package/dist/cjs/dropi-phone-input.cjs.entry.js +0 -197
- package/dist/cjs/dropi-radio-button.cjs.entry.js +0 -47
- package/dist/cjs/dropi-radio-selection-list.cjs.entry.js +0 -60
- package/dist/cjs/dropi-read-more.cjs.entry.js +0 -40
- package/dist/cjs/dropi-search.cjs.entry.js +0 -124
- package/dist/cjs/dropi-select.cjs.entry.js +0 -382
- package/dist/cjs/dropi-sidebar.cjs.entry.js +0 -78
- package/dist/cjs/dropi-simple-stepper.cjs.entry.js +0 -53
- package/dist/cjs/dropi-skeleton.cjs.entry.js +0 -57
- package/dist/cjs/dropi-steps.cjs.entry.js +0 -52
- package/dist/cjs/dropi-switch.cjs.entry.js +0 -30
- package/dist/cjs/dropi-table.cjs.entry.js +0 -299
- package/dist/cjs/dropi-tabs.cjs.entry.js +0 -51
- package/dist/cjs/dropi-tag-type-product.cjs.entry.js +0 -19
- package/dist/cjs/dropi-text-area.cjs.entry.js +0 -134
- package/dist/cjs/dropi-time-line.cjs.entry.js +0 -34
- package/dist/cjs/dropi-toast.cjs.entry.js +0 -56
- package/dist/cjs/dropi-tooltip-v2.cjs.entry.js +0 -131
- package/dist/cjs/dropi-tooltip.cjs.entry.js +0 -21
- package/dist/cjs/dropi-ui.cjs.js +0 -24
- package/dist/cjs/dropi-vertical-steps.cjs.entry.js +0 -55
- package/dist/cjs/dropi-youtube-lazy-video.cjs.entry.js +0 -33
- package/dist/cjs/index-C8kwDvpf.js +0 -2773
- package/dist/cjs/index.cjs.js +0 -2
- package/dist/cjs/loader.cjs.js +0 -12
- package/dist/collection/assets/icons/symbol/svg/sprite.css.svg +0 -1
- package/dist/collection/collection-manifest.json +0 -77
- package/dist/collection/components/dropi-accordion/dropi-accordion-item.css +0 -45
- package/dist/collection/components/dropi-accordion/dropi-accordion-item.js +0 -172
- package/dist/collection/components/dropi-accordion/dropi-accordion.css +0 -21
- package/dist/collection/components/dropi-accordion/dropi-accordion.js +0 -48
- package/dist/collection/components/dropi-alert/dropi-alert.css +0 -128
- package/dist/collection/components/dropi-alert/dropi-alert.js +0 -371
- package/dist/collection/components/dropi-alert-legacy/dropi-alert-legacy.css +0 -31
- package/dist/collection/components/dropi-alert-legacy/dropi-alert-legacy.js +0 -128
- package/dist/collection/components/dropi-alert-modal/dropi-alert-modal.css +0 -105
- package/dist/collection/components/dropi-alert-modal/dropi-alert-modal.js +0 -525
- package/dist/collection/components/dropi-avatars/dropi-avatars.css +0 -55
- package/dist/collection/components/dropi-avatars/dropi-avatars.js +0 -126
- package/dist/collection/components/dropi-badge/dropi-badge.css +0 -41
- package/dist/collection/components/dropi-badge/dropi-badge.js +0 -71
- package/dist/collection/components/dropi-badge-legacy/dropi-badge-legacy.css +0 -17
- package/dist/collection/components/dropi-badge-legacy/dropi-badge-legacy.js +0 -119
- package/dist/collection/components/dropi-banner-external/dropi-banner-external.css +0 -56
- package/dist/collection/components/dropi-banner-external/dropi-banner-external.js +0 -254
- package/dist/collection/components/dropi-breadcrumb/dropi-breadcrumb.css +0 -69
- package/dist/collection/components/dropi-breadcrumb/dropi-breadcrumb.js +0 -171
- package/dist/collection/components/dropi-button/dropi-button.css +0 -177
- package/dist/collection/components/dropi-button/dropi-button.js +0 -323
- package/dist/collection/components/dropi-card-checkbox/dropi-card-checkbox.css +0 -92
- package/dist/collection/components/dropi-card-checkbox/dropi-card-checkbox.js +0 -222
- package/dist/collection/components/dropi-card-product/dropi-card-product.css +0 -235
- package/dist/collection/components/dropi-card-product/dropi-card-product.js +0 -386
- package/dist/collection/components/dropi-card-section/dropi-card-section.css +0 -42
- package/dist/collection/components/dropi-card-section/dropi-card-section.js +0 -178
- package/dist/collection/components/dropi-carousel/dropi-carousel.css +0 -148
- package/dist/collection/components/dropi-carousel/dropi-carousel.js +0 -379
- package/dist/collection/components/dropi-checkbox/dropi-checkbox.css +0 -47
- package/dist/collection/components/dropi-checkbox/dropi-checkbox.js +0 -103
- package/dist/collection/components/dropi-checkbox-selection-list/dropi-checkbox-selection-list.css +0 -44
- package/dist/collection/components/dropi-checkbox-selection-list/dropi-checkbox-selection-list.js +0 -267
- package/dist/collection/components/dropi-chips/dropi-chips.css +0 -68
- package/dist/collection/components/dropi-chips/dropi-chips.js +0 -169
- package/dist/collection/components/dropi-city-selector/dropi-city-selector.css +0 -218
- package/dist/collection/components/dropi-city-selector/dropi-city-selector.js +0 -242
- package/dist/collection/components/dropi-color-picker/dropi-color-picker.css +0 -210
- package/dist/collection/components/dropi-color-picker/dropi-color-picker.js +0 -393
- package/dist/collection/components/dropi-country-flags/dropi-country-flags.css +0 -30
- package/dist/collection/components/dropi-country-flags/dropi-country-flags.js +0 -129
- package/dist/collection/components/dropi-country-selector/dropi-country-selector.css +0 -211
- package/dist/collection/components/dropi-country-selector/dropi-country-selector.js +0 -429
- package/dist/collection/components/dropi-date-picker/dropi-date-picker.css +0 -215
- package/dist/collection/components/dropi-date-picker/dropi-date-picker.js +0 -516
- package/dist/collection/components/dropi-date-picker-range/dropi-date-picker-range.css +0 -143
- package/dist/collection/components/dropi-date-picker-range/dropi-date-picker-range.js +0 -327
- package/dist/collection/components/dropi-drawer/dropi-drawer.css +0 -129
- package/dist/collection/components/dropi-drawer/dropi-drawer.js +0 -287
- package/dist/collection/components/dropi-dropdown/dropi-dropdown.css +0 -51
- package/dist/collection/components/dropi-dropdown/dropi-dropdown.js +0 -209
- package/dist/collection/components/dropi-empty-state/dropi-empty-state.css +0 -59
- package/dist/collection/components/dropi-empty-state/dropi-empty-state.js +0 -222
- package/dist/collection/components/dropi-favorite-button/dropi-favorite-button.css +0 -24
- package/dist/collection/components/dropi-favorite-button/dropi-favorite-button.js +0 -78
- package/dist/collection/components/dropi-file-upload/dropi-file-upload.css +0 -464
- package/dist/collection/components/dropi-file-upload/dropi-file-upload.js +0 -517
- package/dist/collection/components/dropi-file-upload-progress-bar/dropi-file-upload-progress-bar.css +0 -115
- package/dist/collection/components/dropi-file-upload-progress-bar/dropi-file-upload-progress-bar.js +0 -258
- package/dist/collection/components/dropi-icon/dropi-icon.css +0 -26
- package/dist/collection/components/dropi-icon/dropi-icon.js +0 -159
- package/dist/collection/components/dropi-ilustration-icon/dropi-ilustration-icon.css +0 -91
- package/dist/collection/components/dropi-ilustration-icon/dropi-ilustration-icon.js +0 -150
- package/dist/collection/components/dropi-image-miniature/dropi-image-miniature.css +0 -45
- package/dist/collection/components/dropi-image-miniature/dropi-image-miniature.js +0 -150
- package/dist/collection/components/dropi-image-overlay/dropi-image-overlay.css +0 -127
- package/dist/collection/components/dropi-image-overlay/dropi-image-overlay.js +0 -156
- package/dist/collection/components/dropi-input/dropi-input.css +0 -185
- package/dist/collection/components/dropi-input/dropi-input.js +0 -808
- package/dist/collection/components/dropi-languages-selector/dropi-languages-selector.css +0 -79
- package/dist/collection/components/dropi-languages-selector/dropi-languages-selector.js +0 -158
- package/dist/collection/components/dropi-logo/dropi-logo.css +0 -26
- package/dist/collection/components/dropi-logo/dropi-logo.js +0 -107
- package/dist/collection/components/dropi-lottie-loader/dropi-lottie-loader.css +0 -56
- package/dist/collection/components/dropi-lottie-loader/dropi-lottie-loader.js +0 -116
- package/dist/collection/components/dropi-media-player/dropi-media-player.css +0 -320
- package/dist/collection/components/dropi-media-player/dropi-media-player.js +0 -394
- package/dist/collection/components/dropi-modal/dropi-modal.css +0 -140
- package/dist/collection/components/dropi-modal/dropi-modal.js +0 -695
- package/dist/collection/components/dropi-navbar/dropi-navbar.css +0 -166
- package/dist/collection/components/dropi-navbar/dropi-navbar.js +0 -302
- package/dist/collection/components/dropi-otp-send-code/dropi-otp-send-code.css +0 -67
- package/dist/collection/components/dropi-otp-send-code/dropi-otp-send-code.js +0 -221
- package/dist/collection/components/dropi-paginator/dropi-paginator.css +0 -103
- package/dist/collection/components/dropi-paginator/dropi-paginator.js +0 -215
- package/dist/collection/components/dropi-phone-input/dropi-phone-input.css +0 -209
- package/dist/collection/components/dropi-phone-input/dropi-phone-input.js +0 -442
- package/dist/collection/components/dropi-radio-button/dropi-radio-button.css +0 -62
- package/dist/collection/components/dropi-radio-button/dropi-radio-button.js +0 -174
- package/dist/collection/components/dropi-radio-selection-list/dropi-radio-selection-list.css +0 -64
- package/dist/collection/components/dropi-radio-selection-list/dropi-radio-selection-list.js +0 -259
- package/dist/collection/components/dropi-read-more/dropi-read-more.css +0 -25
- package/dist/collection/components/dropi-read-more/dropi-read-more.js +0 -154
- package/dist/collection/components/dropi-search/dropi-search.css +0 -112
- package/dist/collection/components/dropi-search/dropi-search.js +0 -526
- package/dist/collection/components/dropi-select/dropi-select.css +0 -366
- package/dist/collection/components/dropi-select/dropi-select.js +0 -1018
- package/dist/collection/components/dropi-select/select.types.js +0 -1
- package/dist/collection/components/dropi-sidebar/dropi-sidebar.css +0 -76
- package/dist/collection/components/dropi-sidebar/dropi-sidebar.js +0 -143
- package/dist/collection/components/dropi-simple-stepper/dropi-simple-stepper.css +0 -94
- package/dist/collection/components/dropi-simple-stepper/dropi-simple-stepper.js +0 -194
- package/dist/collection/components/dropi-skeleton/dropi-skeleton.css +0 -27
- package/dist/collection/components/dropi-skeleton/dropi-skeleton.js +0 -192
- package/dist/collection/components/dropi-steps/dropi-steps.css +0 -95
- package/dist/collection/components/dropi-steps/dropi-steps.js +0 -173
- package/dist/collection/components/dropi-switch/dropi-switch.css +0 -57
- package/dist/collection/components/dropi-switch/dropi-switch.js +0 -96
- package/dist/collection/components/dropi-table/dropi-table.css +0 -540
- package/dist/collection/components/dropi-table/dropi-table.js +0 -973
- package/dist/collection/components/dropi-tabs/dropi-tabs.css +0 -47
- package/dist/collection/components/dropi-tabs/dropi-tabs.js +0 -181
- package/dist/collection/components/dropi-tag/dropi-tag.css +0 -39
- package/dist/collection/components/dropi-tag/dropi-tag.js +0 -190
- package/dist/collection/components/dropi-tag-type-product/dropi-tag-type-product.css +0 -14
- package/dist/collection/components/dropi-tag-type-product/dropi-tag-type-product.js +0 -48
- package/dist/collection/components/dropi-text-area/dropi-text-area.css +0 -100
- package/dist/collection/components/dropi-text-area/dropi-text-area.js +0 -512
- package/dist/collection/components/dropi-time-line/dropi-time-line.css +0 -108
- package/dist/collection/components/dropi-time-line/dropi-time-line.js +0 -69
- package/dist/collection/components/dropi-toast/dropi-toast.css +0 -63
- package/dist/collection/components/dropi-toast/dropi-toast.js +0 -165
- package/dist/collection/components/dropi-tooltip/dropi-tooltip.css +0 -32
- package/dist/collection/components/dropi-tooltip/dropi-tooltip.js +0 -70
- package/dist/collection/components/dropi-tooltip-v2/dropi-tooltip.css +0 -67
- package/dist/collection/components/dropi-tooltip-v2/dropi-tooltip.js +0 -468
- package/dist/collection/components/dropi-vertical-steps/dropi-vertical-steps.css +0 -95
- package/dist/collection/components/dropi-vertical-steps/dropi-vertical-steps.js +0 -167
- package/dist/collection/components/dropi-youtube-lazy-video/dropi-youtube-lazy-video.css +0 -73
- package/dist/collection/components/dropi-youtube-lazy-video/dropi-youtube-lazy-video.js +0 -110
- package/dist/collection/index.js +0 -1
- package/dist/collection/utils/utils.js +0 -3
- package/dist/collection/utils/utils.unit.test.js +0 -16
- package/dist/components/dropi-accordion-item.js +0 -1
- package/dist/components/dropi-accordion.js +0 -1
- package/dist/components/dropi-alert-legacy.js +0 -1
- package/dist/components/dropi-alert-modal.js +0 -1
- package/dist/components/dropi-alert.js +0 -1
- package/dist/components/dropi-avatars.js +0 -1
- package/dist/components/dropi-badge-legacy.js +0 -1
- package/dist/components/dropi-badge.js +0 -1
- package/dist/components/dropi-banner-external.js +0 -1
- package/dist/components/dropi-breadcrumb.js +0 -1
- package/dist/components/dropi-button.js +0 -1
- package/dist/components/dropi-card-checkbox.js +0 -1
- package/dist/components/dropi-card-product.js +0 -1
- package/dist/components/dropi-card-section.js +0 -1
- package/dist/components/dropi-carousel.js +0 -1
- package/dist/components/dropi-checkbox-selection-list.js +0 -1
- package/dist/components/dropi-checkbox.js +0 -1
- package/dist/components/dropi-chips.js +0 -1
- package/dist/components/dropi-city-selector.js +0 -1
- package/dist/components/dropi-color-picker.js +0 -1
- package/dist/components/dropi-country-flags.js +0 -1
- package/dist/components/dropi-country-selector.js +0 -1
- package/dist/components/dropi-date-picker-range.js +0 -1
- package/dist/components/dropi-date-picker.js +0 -1
- package/dist/components/dropi-drawer.js +0 -1
- package/dist/components/dropi-dropdown.js +0 -1
- package/dist/components/dropi-empty-state.js +0 -1
- package/dist/components/dropi-favorite-button.js +0 -1
- package/dist/components/dropi-file-upload-progress-bar.js +0 -1
- package/dist/components/dropi-file-upload.js +0 -1
- package/dist/components/dropi-icon.js +0 -1
- package/dist/components/dropi-ilustration-icon.js +0 -1
- package/dist/components/dropi-image-miniature.js +0 -1
- package/dist/components/dropi-image-overlay.js +0 -1
- package/dist/components/dropi-input.js +0 -1
- package/dist/components/dropi-languages-selector.js +0 -1
- package/dist/components/dropi-logo.js +0 -1
- package/dist/components/dropi-lottie-loader.js +0 -1
- package/dist/components/dropi-media-player.js +0 -1
- package/dist/components/dropi-modal.js +0 -1
- package/dist/components/dropi-navbar.js +0 -1
- package/dist/components/dropi-otp-send-code.js +0 -1
- package/dist/components/dropi-paginator.js +0 -1
- package/dist/components/dropi-phone-input.js +0 -1
- package/dist/components/dropi-radio-button.js +0 -1
- package/dist/components/dropi-radio-selection-list.js +0 -1
- package/dist/components/dropi-read-more.js +0 -1
- package/dist/components/dropi-search.js +0 -1
- package/dist/components/dropi-select.js +0 -1
- package/dist/components/dropi-sidebar.js +0 -1
- package/dist/components/dropi-simple-stepper.js +0 -1
- package/dist/components/dropi-skeleton.js +0 -1
- package/dist/components/dropi-steps.js +0 -1
- package/dist/components/dropi-switch.js +0 -1
- package/dist/components/dropi-table.js +0 -1
- package/dist/components/dropi-tabs.js +0 -1
- package/dist/components/dropi-tag-type-product.js +0 -1
- package/dist/components/dropi-tag.js +0 -1
- package/dist/components/dropi-text-area.js +0 -1
- package/dist/components/dropi-time-line.js +0 -1
- package/dist/components/dropi-toast.js +0 -1
- package/dist/components/dropi-tooltip-v2.js +0 -1
- package/dist/components/dropi-tooltip.js +0 -1
- package/dist/components/dropi-vertical-steps.js +0 -1
- package/dist/components/dropi-youtube-lazy-video.js +0 -1
- package/dist/components/index.js +0 -1
- package/dist/components/p-B9R8Apw7.js +0 -1
- package/dist/components/p-B_Ace02i.js +0 -1
- package/dist/components/p-BrjO_JXp.js +0 -1
- package/dist/components/p-BwhxWL4p.js +0 -1
- package/dist/components/p-Bz2jXX3R.js +0 -1
- package/dist/components/p-CV4X3Gm4.js +0 -1
- package/dist/components/p-CV_oz45O.js +0 -1
- package/dist/components/p-D-vQQQNz.js +0 -1
- package/dist/components/p-D13d88W3.js +0 -1
- package/dist/components/p-DGUfr98Z.js +0 -1
- package/dist/components/p-a-hGQrJd.js +0 -1
- package/dist/components/p-o5gyrbbD.js +0 -1
- package/dist/dropi-ui/p-00e5a2de.entry.js +0 -1
- package/dist/dropi-ui/p-0188e07a.entry.js +0 -1
- package/dist/dropi-ui/p-02710049.entry.js +0 -1
- package/dist/dropi-ui/p-17c56074.entry.js +0 -1
- package/dist/dropi-ui/p-18adf694.entry.js +0 -1
- package/dist/dropi-ui/p-1a3619c3.entry.js +0 -1
- package/dist/dropi-ui/p-1d3d6a32.entry.js +0 -1
- package/dist/dropi-ui/p-25640777.entry.js +0 -1
- package/dist/dropi-ui/p-2674d901.entry.js +0 -1
- package/dist/dropi-ui/p-2af538b9.entry.js +0 -1
- package/dist/dropi-ui/p-3013f3b8.entry.js +0 -1
- package/dist/dropi-ui/p-3321ca70.entry.js +0 -1
- package/dist/dropi-ui/p-33d242ec.entry.js +0 -1
- package/dist/dropi-ui/p-39af6478.entry.js +0 -1
- package/dist/dropi-ui/p-3e36c8b8.entry.js +0 -1
- package/dist/dropi-ui/p-3ebc9b7b.entry.js +0 -1
- package/dist/dropi-ui/p-446a481d.entry.js +0 -1
- package/dist/dropi-ui/p-50a5e548.entry.js +0 -1
- package/dist/dropi-ui/p-50e0d44f.entry.js +0 -1
- package/dist/dropi-ui/p-53a7a37d.entry.js +0 -1
- package/dist/dropi-ui/p-5c0bd7c2.entry.js +0 -1
- package/dist/dropi-ui/p-5cee6721.entry.js +0 -1
- package/dist/dropi-ui/p-5fb33ae4.entry.js +0 -1
- package/dist/dropi-ui/p-665ef7ba.entry.js +0 -1
- package/dist/dropi-ui/p-66b80371.entry.js +0 -1
- package/dist/dropi-ui/p-7bfc1c27.entry.js +0 -1
- package/dist/dropi-ui/p-7c0d2edf.entry.js +0 -1
- package/dist/dropi-ui/p-7eb27836.entry.js +0 -1
- package/dist/dropi-ui/p-85444414.entry.js +0 -1
- package/dist/dropi-ui/p-86283e99.entry.js +0 -1
- package/dist/dropi-ui/p-8bf5d8ee.entry.js +0 -1
- package/dist/dropi-ui/p-9032ba00.entry.js +0 -1
- package/dist/dropi-ui/p-9212f544.entry.js +0 -1
- package/dist/dropi-ui/p-92291873.entry.js +0 -1
- package/dist/dropi-ui/p-955e52f8.entry.js +0 -1
- package/dist/dropi-ui/p-976a15e3.entry.js +0 -1
- package/dist/dropi-ui/p-9b037086.entry.js +0 -1
- package/dist/dropi-ui/p-9e0129cc.entry.js +0 -1
- package/dist/dropi-ui/p-9ffec3f7.entry.js +0 -1
- package/dist/dropi-ui/p-D5SAM1O2.js +0 -2
- package/dist/dropi-ui/p-a1c93e55.entry.js +0 -1
- package/dist/dropi-ui/p-a232c6a7.entry.js +0 -1
- package/dist/dropi-ui/p-a3c4d677.entry.js +0 -1
- package/dist/dropi-ui/p-a457e8ca.entry.js +0 -1
- package/dist/dropi-ui/p-a4e1df5e.entry.js +0 -1
- package/dist/dropi-ui/p-a822a23e.entry.js +0 -1
- package/dist/dropi-ui/p-a8f24270.entry.js +0 -1
- package/dist/dropi-ui/p-ae35d538.entry.js +0 -1
- package/dist/dropi-ui/p-af8e2157.entry.js +0 -1
- package/dist/dropi-ui/p-b2623a5c.entry.js +0 -1
- package/dist/dropi-ui/p-b3d3c72e.entry.js +0 -1
- package/dist/dropi-ui/p-c3614c4a.entry.js +0 -1
- package/dist/dropi-ui/p-cbf5367e.entry.js +0 -1
- package/dist/dropi-ui/p-cc527d91.entry.js +0 -1
- package/dist/dropi-ui/p-cdde481b.entry.js +0 -1
- package/dist/dropi-ui/p-d42d4ef7.entry.js +0 -1
- package/dist/dropi-ui/p-db38bf16.entry.js +0 -1
- package/dist/dropi-ui/p-dd5d8b1b.entry.js +0 -1
- package/dist/dropi-ui/p-e3ad21f8.entry.js +0 -1
- package/dist/dropi-ui/p-e6e766ed.entry.js +0 -1
- package/dist/dropi-ui/p-ec263862.entry.js +0 -1
- package/dist/dropi-ui/p-efc2fc35.entry.js +0 -1
- package/dist/dropi-ui/p-f41cd9b5.entry.js +0 -1
- package/dist/dropi-ui/p-fa3d0267.entry.js +0 -1
- package/dist/esm/dropi-ui.js +0 -20
- package/dist/esm/index-D5SAM1O2.js +0 -2763
- package/dist/esm/index.js +0 -1
- package/dist/esm/loader.js +0 -10
- package/dist/index.cjs.js +0 -1
- package/dist/index.js +0 -1
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
const dropiButtonCss = () => `:host{display:inline-block}: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:1px solid var(--Gray-Gray-200, #c3c9d9);color:var(--Gray-Gray-500, #69738c)}.btn.tertiary.default:hover,.btn.tertiary.legacy:hover{border-color:var(--Gray-Gray-400, #858ea6);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:1px solid var(--Gray-Gray-200, #c3c9d9);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)}}`;
|
|
6
|
-
|
|
7
|
-
const DropiButton = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.onClick = index.createEvent(this, "onClick", 7);
|
|
11
|
-
}
|
|
12
|
-
/** Visual color palette */
|
|
13
|
-
type = 'default';
|
|
14
|
-
/** Primary (filled) | Secondary (outlined) | Tertiary (ghost) */
|
|
15
|
-
severity = 'primary';
|
|
16
|
-
/** Button size */
|
|
17
|
-
size = 'normal';
|
|
18
|
-
/** Button state */
|
|
19
|
-
state = 'default';
|
|
20
|
-
/** Full width button */
|
|
21
|
-
fullWidth = false;
|
|
22
|
-
/** Icon name to show before the text */
|
|
23
|
-
preIcon = '';
|
|
24
|
-
/** Icon name to show after the text */
|
|
25
|
-
postIcon = '';
|
|
26
|
-
/** Custom icon color override */
|
|
27
|
-
customIconColor = '';
|
|
28
|
-
/** Button label */
|
|
29
|
-
text = '';
|
|
30
|
-
/** Emitted on click (not emitted when disabled or loading) */
|
|
31
|
-
onClick;
|
|
32
|
-
colorMap = {
|
|
33
|
-
default: 'Primary-Primary-',
|
|
34
|
-
success: 'Success-Success-',
|
|
35
|
-
error: 'Error-Error-',
|
|
36
|
-
info: 'Info-Info-',
|
|
37
|
-
legacy: 'Secondary-Secondary-',
|
|
38
|
-
warning: 'Warning-Warning-',
|
|
39
|
-
dropdown: 'Gray-Gray-',
|
|
40
|
-
'default-light': 'Gray-Gray-',
|
|
41
|
-
};
|
|
42
|
-
get iconSize() {
|
|
43
|
-
if (this.size === 'large')
|
|
44
|
-
return '24px';
|
|
45
|
-
if (this.size === 'small')
|
|
46
|
-
return '16px';
|
|
47
|
-
return '18px';
|
|
48
|
-
}
|
|
49
|
-
get color() {
|
|
50
|
-
const intensity = this.state === 'disabled' ? '300' : '500';
|
|
51
|
-
return (this.colorMap[this.type] ?? 'Primary-Primary-') + intensity;
|
|
52
|
-
}
|
|
53
|
-
get fontColor() {
|
|
54
|
-
if (this.severity === 'tertiary') {
|
|
55
|
-
return this.type === 'default' || this.type === 'legacy' ? 'Gray-Gray-500' : this.color;
|
|
56
|
-
}
|
|
57
|
-
if (this.severity === 'secondary')
|
|
58
|
-
return this.color;
|
|
59
|
-
return 'Neutral-White';
|
|
60
|
-
}
|
|
61
|
-
handleClick(e) {
|
|
62
|
-
if (this.state !== 'disabled' && this.state !== 'loading') {
|
|
63
|
-
this.onClick.emit(e);
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
renderLoadingSpinner() {
|
|
67
|
-
return (index.h("svg", { class: "spin", width: this.iconSize, height: this.iconSize, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M22.8 12C23.4627 12 24.0062 11.4614 23.9401 10.802C23.8232 9.6371 23.5362 8.49339 23.0866 7.4078C22.4835 5.95189 21.5996 4.62902 20.4853 3.51472C19.371 2.40042 18.0481 1.5165 16.5922 0.913445C15.5066 0.463778 14.3629 0.17683 13.198 0.0599502C12.5386 -0.00621439 12 0.537258 12 1.2C12 1.86274 12.5393 2.39227 13.1969 2.4749C14.0463 2.58164 14.8795 2.80176 15.6738 3.13076C16.8385 3.6132 17.8968 4.32033 18.7882 5.21177C19.6797 6.10322 20.3868 7.16151 20.8692 8.32624C21.1982 9.12051 21.4184 9.95367 21.5251 10.8031C21.6077 11.4607 22.1373 12 22.8 12Z", fill: `var(--${this.fontColor})` })));
|
|
68
|
-
}
|
|
69
|
-
render() {
|
|
70
|
-
const isDisabled = this.state === 'disabled' || this.state === 'loading';
|
|
71
|
-
const hasText = this.text !== '';
|
|
72
|
-
const showPostIcon = this.postIcon !== '' || this.type === 'dropdown';
|
|
73
|
-
const dropdownIcon = this.type === 'dropdown' ? 'Dropdown-down' : this.postIcon;
|
|
74
|
-
return (index.h("button", { key: 'd21aeb2274c317795bb0daad6d30c2bc9f3ede9f', class: {
|
|
75
|
-
btn: true,
|
|
76
|
-
'without-text': !hasText,
|
|
77
|
-
[this.severity]: true,
|
|
78
|
-
[this.type]: true,
|
|
79
|
-
[this.size]: true,
|
|
80
|
-
[this.state]: true,
|
|
81
|
-
'full-width': this.fullWidth,
|
|
82
|
-
}, disabled: isDisabled, onClick: (e) => this.handleClick(e) }, this.preIcon && (index.h("dropi-icon", { key: '6711ece5a9c871db989e6bc4572c0d0ebfa7f899', name: this.preIcon, width: this.iconSize, height: this.iconSize, color: this.fontColor })), hasText && index.h("span", { key: '9fc49de08b5672c6e2dae9b3cea9587d451fac0d', class: "text" }, this.text), showPostIcon && (index.h("dropi-icon", { key: '1ce254e23b16fb7013469fb3e2d71fe70dba5a9d', name: dropdownIcon, width: this.iconSize, height: this.iconSize, color: this.fontColor })), this.state === 'loading' && this.renderLoadingSpinner(), index.h("slot", { key: '72857295b27aa6ef6981276d68497f33958a584c' })));
|
|
83
|
-
}
|
|
84
|
-
};
|
|
85
|
-
DropiButton.style = dropiButtonCss();
|
|
86
|
-
|
|
87
|
-
exports.dropi_button = DropiButton;
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
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)}`;
|
|
6
|
-
|
|
7
|
-
const DropiCardCheckbox = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.onChange = index.createEvent(this, "onChange", 7);
|
|
11
|
-
}
|
|
12
|
-
/** Visual type — matches Angular: 'default' | 'with card' */
|
|
13
|
-
type = 'default';
|
|
14
|
-
/** Whether the checkbox is checked — matches Angular 'state' */
|
|
15
|
-
state = 'checked';
|
|
16
|
-
/** Main title — matches Angular 'title' */
|
|
17
|
-
title = 'Tittle';
|
|
18
|
-
/** Optional description below title */
|
|
19
|
-
description = '';
|
|
20
|
-
/** Optional extra info shown on the right */
|
|
21
|
-
extraInfo = '';
|
|
22
|
-
/** Optional extra info description shown below extraInfo */
|
|
23
|
-
extraInfoDescription = '';
|
|
24
|
-
/** Disables interaction */
|
|
25
|
-
disabled = false;
|
|
26
|
-
/** Emitted with the new checked state when clicked */
|
|
27
|
-
onChange;
|
|
28
|
-
get isChecked() {
|
|
29
|
-
return this.state === 'checked';
|
|
30
|
-
}
|
|
31
|
-
handleClick() {
|
|
32
|
-
if (this.disabled)
|
|
33
|
-
return;
|
|
34
|
-
this.state = this.isChecked ? 'default' : 'checked';
|
|
35
|
-
this.onChange.emit(this.isChecked);
|
|
36
|
-
}
|
|
37
|
-
render() {
|
|
38
|
-
return (index.h("div", { key: '238a146e7500efbc01d83a8494ee577fbb600729', class: {
|
|
39
|
-
'container-card-check': true,
|
|
40
|
-
'default-card': this.type === 'default',
|
|
41
|
-
'is-checked': this.isChecked && this.type === 'with card',
|
|
42
|
-
'disabled': this.disabled,
|
|
43
|
-
}, onClick: () => this.handleClick() }, index.h("dropi-checkbox", { key: '405d834de33790be58fba7e50b0e579889f04394', checked: this.isChecked, disabled: this.disabled }), index.h("div", { key: '49659771de9ca8ee8c2fa9fbe828a1d94fbd3c9e', class: "container-text" }, index.h("div", { key: '7d39435ef56cd61605e9d9b69d6917e3ec8470fa', class: "title-check" }, this.title), this.description && index.h("div", { key: '00a7723401979d7a9d926ce939eb09430ddb7372', class: "description-text" }, this.description)), (this.extraInfo || this.extraInfoDescription) && (index.h("div", { key: '4d1c9e49f6e397f0433827960167ff88bcd669db', class: "extra-info" }, this.extraInfo && index.h("div", { key: 'b9da8514c2013cd6cab9cf6005dad8d3ae30b930' }, this.extraInfo), this.extraInfoDescription && index.h("h4", { key: 'ac2fcbc6359ea173911f181b2a145de59af10c9d' }, this.extraInfoDescription)))));
|
|
44
|
-
}
|
|
45
|
-
};
|
|
46
|
-
DropiCardCheckbox.style = dropiCardCheckboxCss();
|
|
47
|
-
|
|
48
|
-
exports.dropi_card_checkbox = DropiCardCheckbox;
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
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}`;
|
|
6
|
-
|
|
7
|
-
const DropiCardProduct = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.onProductClick = index.createEvent(this, "onProductClick", 7);
|
|
11
|
-
this.changeFavorite = index.createEvent(this, "changeFavorite", 7);
|
|
12
|
-
this.dropiAddProduct = index.createEvent(this, "dropiAddProduct", 7);
|
|
13
|
-
this.dropiSupplierClick = index.createEvent(this, "dropiSupplierClick", 7);
|
|
14
|
-
}
|
|
15
|
-
/** Product image URL */
|
|
16
|
-
image = '';
|
|
17
|
-
/** Product name */
|
|
18
|
-
productName = '';
|
|
19
|
-
/** Sale / supplier price (Precio proveedor) */
|
|
20
|
-
salePrice = 0;
|
|
21
|
-
/** Suggested price for the dropshipper (Precio sugerido) */
|
|
22
|
-
suggestedPrice = 0;
|
|
23
|
-
/** Price currency symbol */
|
|
24
|
-
currency = '$';
|
|
25
|
-
/** Supplier / store name */
|
|
26
|
-
supplier = '';
|
|
27
|
-
/** Category label */
|
|
28
|
-
category = '';
|
|
29
|
-
/** Stock quantity (0 = Agotado) */
|
|
30
|
-
stock = 0;
|
|
31
|
-
/** Supplier category for insignia: 'verified' | 'premium' | 'exclusive' | '' */
|
|
32
|
-
supplierCategory = '';
|
|
33
|
-
/** Show favorite button */
|
|
34
|
-
showFavorite = true;
|
|
35
|
-
/** Is marked as favorite */
|
|
36
|
-
isFavorite = false;
|
|
37
|
-
/** Show "Enviar a cliente" button */
|
|
38
|
-
showAddButton = true;
|
|
39
|
-
/** Emitted when card is clicked — matches Angular 'onProductClick' */
|
|
40
|
-
onProductClick;
|
|
41
|
-
/** Emitted when favorite toggled — matches Angular 'changeFavorite' */
|
|
42
|
-
changeFavorite;
|
|
43
|
-
/** Emitted when "Enviar a cliente" button clicked */
|
|
44
|
-
dropiAddProduct;
|
|
45
|
-
/** Emitted when supplier name clicked */
|
|
46
|
-
dropiSupplierClick;
|
|
47
|
-
formatPrice(val) {
|
|
48
|
-
if (val == null)
|
|
49
|
-
return '0';
|
|
50
|
-
return val.toLocaleString('es-CO');
|
|
51
|
-
}
|
|
52
|
-
get inStock() {
|
|
53
|
-
return this.stock > 0;
|
|
54
|
-
}
|
|
55
|
-
getStockColor() {
|
|
56
|
-
if (this.stock === 0)
|
|
57
|
-
return 'var(--Error-Error-500, #f46a6b)';
|
|
58
|
-
if (this.stock <= 10)
|
|
59
|
-
return 'var(--Warning-Warning-500, #f59e0b)';
|
|
60
|
-
return 'var(--Success-Success-500, #0abb87)';
|
|
61
|
-
}
|
|
62
|
-
render() {
|
|
63
|
-
return (index.h("div", { key: '42990ea883dcd6cc72e1f62771f7b9554c36bdba', class: "dropi-card-product", onClick: () => this.onProductClick.emit() }, index.h("div", { key: '59295427ddc350ec3c70d7d1bd4803ffa6bf26b0', class: "product-image-container" }, index.h("div", { key: '9d10e18f2eadf16f0c0b1b7cb7860d08f2ca778f', class: "product-image" }, index.h("img", { key: '19f7af8eddcbea880d32ef30603d55bfe9337f17', src: this.image || '', alt: this.productName, onError: (e) => {
|
|
64
|
-
e.target.src = './assets/utils/no-image.jpg';
|
|
65
|
-
}, class: !this.image ? 'error-img' : '' }), this.showFavorite && (index.h("button", { key: 'a6e13eea7c211fd772fe5ee7c13c7d475d54986c', class: { 'favorite-button': true, 'favorite-active': this.isFavorite }, onClick: (e) => {
|
|
66
|
-
e.stopPropagation();
|
|
67
|
-
this.isFavorite = !this.isFavorite;
|
|
68
|
-
this.changeFavorite.emit(this.isFavorite);
|
|
69
|
-
}, "aria-label": "Favorito" }, index.h("dropi-icon", { key: '0020aaa1beffedd0243c62f616dfeb6428ec63e5', name: this.isFavorite ? 'Heart-solid' : 'Heart', width: "18px", height: "18px", color: this.isFavorite ? '#fff' : '#858ea6' }))))), index.h("div", { key: '390a04f46d8394deb0591969a04525f3687509a0', class: "product-info" }, this.supplierCategory && (index.h("dropi-ilustration-icon", { key: '7fa320fcc36f6d4929197a2d88e59deb76d34ab0', class: "supplier-insignia", type: "insignia", stateInsignia: this.supplierCategory, tagProduct: true })), index.h("div", { key: '67e922b0afc44b3f376db3b20a33d7cc0ae8e987', class: "product-header" }, this.category && (index.h("span", { key: '421f39afc07922579610fe57abdfa37b4fa68586', class: "category" }, this.category)), index.h("div", { key: 'e4ad1d38535bd876298efb6d819d3355ac6b7446', class: "stock-info" }, index.h("span", { key: '5dbdabc282dbfaee4adec81668d38a909e04227d', class: "stock-label" }, "Stock:"), index.h("span", { key: 'f14a47956953779f4527404930b4a988ac5c5737', class: "stock-value", style: { color: this.getStockColor() } }, this.stock === 0 ? 'Agotado' : this.stock))), index.h("h3", { key: '4403e622316112df4075fafbbbbc17151d2e1b39', class: "product-name" }, this.productName), this.supplier && (index.h("div", { key: '28554238023a313e1698847a5faccd17e9bbd750', class: "supplier-info" }, index.h("span", { key: 'e34245925f659f232050ad835cf83690b112d7d0', class: "supplier-label" }, "Proveedor:"), index.h("span", { key: 'cabf8743951095acf0c05dd6e48ee74140984773', class: "supplier-name", onClick: (e) => { e.stopPropagation(); this.dropiSupplierClick.emit(); } }, this.supplier))), index.h("div", { key: '193982dc4aea14f337f64c9156d97f7c23d02db7', class: "price-container" }, index.h("div", { key: 'f2925c29fe4d5f9be2f92c501b92351e9a4f60e0', class: "price-item" }, index.h("span", { key: 'd0a8f99140d6ced64e19a69a2f198ba861cca017', class: "price-label" }, "Precio proveedor"), index.h("span", { key: '6fa5b8b5cd1f6d6e7b2551bdceedf65e3cb0029d', class: "price-value" }, this.currency, " ", this.formatPrice(this.salePrice))), index.h("div", { key: '0a37ead7f660608ed6303c97893fdd9156b5bfad', class: "price-item" }, index.h("span", { key: '8bb33b1b418fdbb79c31ed69ddfa2598f6450efd', class: "price-label" }, "Precio sugerido"), index.h("span", { key: '2df4c30b299190461f0032a66cc8d281ce9c9dab', class: "price-value" }, this.currency, " ", this.formatPrice(this.suggestedPrice))))), index.h("div", { key: '91a8306e386ac8d0422a02d3b4bac2d96ba7bebc', class: "separator" }), this.showAddButton && (index.h("div", { key: '69fd0267e5388770f5067a23d4ddf2636867b030', class: { 'action-button': true, 'action-button--disabled': !this.inStock }, onClick: (e) => {
|
|
70
|
-
e.stopPropagation();
|
|
71
|
-
if (this.inStock)
|
|
72
|
-
this.dropiAddProduct.emit();
|
|
73
|
-
} }, index.h("dropi-icon", { key: '6e9a7333778b5a4e75bca612f7900909e9b52c80', name: "Shopping-cart-arrow-rigth", width: "20px", height: "20px", color: "#f49a3d" }), index.h("span", { key: '1f3eb20049a94cb74bef8c89f8773a831667dc7b', class: "button-text" }, "Enviar a cliente")))));
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
DropiCardProduct.style = dropiCardProductCss();
|
|
77
|
-
|
|
78
|
-
exports.dropi_card_product = DropiCardProduct;
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
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:inherit;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}`;
|
|
6
|
-
|
|
7
|
-
const DropiCardSection = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.onChange = index.createEvent(this, "onChange", 7);
|
|
11
|
-
this.onClick = index.createEvent(this, "onClick", 7);
|
|
12
|
-
}
|
|
13
|
-
/** Section title — matches Angular 'title' */
|
|
14
|
-
title = 'title';
|
|
15
|
-
/** Section description */
|
|
16
|
-
description = 'Description';
|
|
17
|
-
/** Control type on the right */
|
|
18
|
-
typeElement = 'dropdown';
|
|
19
|
-
/** Title size variant */
|
|
20
|
-
type = 'important';
|
|
21
|
-
/** Switch checked state */
|
|
22
|
-
isChecked = false;
|
|
23
|
-
/** Emitted when switch changes */
|
|
24
|
-
onChange;
|
|
25
|
-
/** Emitted when dropdown icon is clicked */
|
|
26
|
-
onClick;
|
|
27
|
-
render() {
|
|
28
|
-
return (index.h("div", { key: 'aa7548c223bf3238b7af10e52821e3ffd19fefca', class: "card-section" }, index.h("div", { key: '6b0ed1e7f7c282b0f67277567a2fa1ffbab9d04e', class: "card-section__text" }, this.type === 'important'
|
|
29
|
-
? index.h("h5", { class: "card-section__title card-section__title--important" }, this.title)
|
|
30
|
-
: index.h("h6", { class: "card-section__title" }, this.title), this.description && index.h("p", { key: 'f0c83d631d541d95c19e4a246634da56413a3de9', class: "card-section__desc" }, this.description)), index.h("div", { key: '976d78401ab26872df88115ae0f0449bcd2faae9', class: "card-section__control" }, this.typeElement === 'switch' ? (index.h("dropi-switch", { isChecked: this.isChecked, onOnChange: (e) => {
|
|
31
|
-
this.isChecked = e.detail;
|
|
32
|
-
this.onChange.emit(e.detail);
|
|
33
|
-
} })) : (index.h("button", { class: "card-section__dropdown-btn", onClick: () => this.onClick.emit(), "aria-label": "Expandir" }, index.h("dropi-icon", { name: "Dropdown-down", width: "20px", height: "20px", color: "Gray-Gray-500" }))))));
|
|
34
|
-
}
|
|
35
|
-
};
|
|
36
|
-
DropiCardSection.style = dropiCardSectionCss();
|
|
37
|
-
|
|
38
|
-
exports.dropi_card_section = DropiCardSection;
|
|
@@ -1,153 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
const dropiCarouselCss = () => `:host{display:block;width:100%}*,*::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}}`;
|
|
6
|
-
|
|
7
|
-
const DropiCarousel = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.pageChange = index.createEvent(this, "pageChange", 7);
|
|
11
|
-
this.onPage = index.createEvent(this, "onPage", 7);
|
|
12
|
-
}
|
|
13
|
-
get el() { return index.getElement(this); }
|
|
14
|
-
/** Items to display (Array of URLs or objects) */
|
|
15
|
-
value = [];
|
|
16
|
-
/** Active page index */
|
|
17
|
-
page = 0;
|
|
18
|
-
/** Number of items visible per page */
|
|
19
|
-
numVisible = 1;
|
|
20
|
-
/** Number of items to scroll per click */
|
|
21
|
-
numScroll = 1;
|
|
22
|
-
/** Orientation of the carousel */
|
|
23
|
-
orientation = 'horizontal';
|
|
24
|
-
/** Show navigation arrows */
|
|
25
|
-
showNavigators = true;
|
|
26
|
-
/** Show dot indicators */
|
|
27
|
-
showIndicators = true;
|
|
28
|
-
/** Autoplay interval in ms (0 = disabled) */
|
|
29
|
-
autoplayInterval = 0;
|
|
30
|
-
/** Infinite scrolling */
|
|
31
|
-
circular = false;
|
|
32
|
-
parsedValue = [];
|
|
33
|
-
internalPage = 0;
|
|
34
|
-
isAnimating = false;
|
|
35
|
-
totalPages = 0;
|
|
36
|
-
itemsContainer;
|
|
37
|
-
timer;
|
|
38
|
-
pageChange;
|
|
39
|
-
onPage;
|
|
40
|
-
handleValue(val) {
|
|
41
|
-
this.parsedValue = typeof val === 'string' ? JSON.parse(val) : (val || []);
|
|
42
|
-
this.updateTotalPages();
|
|
43
|
-
this.updateTransform();
|
|
44
|
-
}
|
|
45
|
-
handlePage(val) {
|
|
46
|
-
this.internalPage = val;
|
|
47
|
-
this.updateTransform();
|
|
48
|
-
}
|
|
49
|
-
componentWillLoad() {
|
|
50
|
-
if (!this.value || (Array.isArray(this.value) && this.value.length === 0)) {
|
|
51
|
-
const attrValue = this.el.getAttribute('value');
|
|
52
|
-
if (attrValue)
|
|
53
|
-
this.value = attrValue;
|
|
54
|
-
}
|
|
55
|
-
this.handleValue(this.value);
|
|
56
|
-
this.internalPage = this.page;
|
|
57
|
-
}
|
|
58
|
-
componentDidLoad() {
|
|
59
|
-
this.updateTransform();
|
|
60
|
-
if (this.autoplayInterval > 0) {
|
|
61
|
-
this.startAutoplay();
|
|
62
|
-
}
|
|
63
|
-
window.addEventListener('resize', this.onResize);
|
|
64
|
-
}
|
|
65
|
-
disconnectedCallback() {
|
|
66
|
-
this.stopAutoplay();
|
|
67
|
-
window.removeEventListener('resize', this.onResize);
|
|
68
|
-
}
|
|
69
|
-
onResize = () => {
|
|
70
|
-
this.updateTotalPages();
|
|
71
|
-
this.updateTransform();
|
|
72
|
-
};
|
|
73
|
-
startAutoplay() {
|
|
74
|
-
this.timer = setInterval(() => this.navForward(), this.autoplayInterval);
|
|
75
|
-
}
|
|
76
|
-
stopAutoplay() {
|
|
77
|
-
if (this.timer)
|
|
78
|
-
clearInterval(this.timer);
|
|
79
|
-
}
|
|
80
|
-
updateTotalPages() {
|
|
81
|
-
if (!this.parsedValue.length || this.parsedValue.length <= this.numVisible) {
|
|
82
|
-
this.totalPages = 1;
|
|
83
|
-
return;
|
|
84
|
-
}
|
|
85
|
-
const totalItems = this.parsedValue.length;
|
|
86
|
-
const remainingItems = totalItems - this.numVisible;
|
|
87
|
-
this.totalPages = Math.ceil(remainingItems / this.numScroll) + 1;
|
|
88
|
-
}
|
|
89
|
-
updateTransform() {
|
|
90
|
-
if (!this.itemsContainer)
|
|
91
|
-
return;
|
|
92
|
-
const prop = this.orientation === 'vertical' ? 'translateY' : 'translateX';
|
|
93
|
-
const firstItem = this.itemsContainer.querySelector('.dropi-carousel-item');
|
|
94
|
-
if (!firstItem)
|
|
95
|
-
return;
|
|
96
|
-
const itemSize = this.orientation === 'vertical' ? firstItem.offsetHeight : firstItem.offsetWidth;
|
|
97
|
-
const itemsScrolled = this.internalPage * this.numScroll;
|
|
98
|
-
const maxScroll = Math.max(0, this.parsedValue.length - this.numVisible);
|
|
99
|
-
const safeScroll = Math.min(itemsScrolled, maxScroll);
|
|
100
|
-
const translateValue = -(safeScroll * itemSize);
|
|
101
|
-
this.itemsContainer.style.transform = `${prop}(${translateValue}px)`;
|
|
102
|
-
}
|
|
103
|
-
navForward = (e) => {
|
|
104
|
-
if (e)
|
|
105
|
-
e.preventDefault();
|
|
106
|
-
if (this.circular || this.internalPage < this.totalPages - 1) {
|
|
107
|
-
this.isAnimating = true;
|
|
108
|
-
this.internalPage = (this.internalPage + 1) % this.totalPages;
|
|
109
|
-
this.page = this.internalPage;
|
|
110
|
-
this.updateTransform();
|
|
111
|
-
this.pageChange.emit(this.internalPage);
|
|
112
|
-
setTimeout(() => (this.isAnimating = false), 500);
|
|
113
|
-
}
|
|
114
|
-
};
|
|
115
|
-
navBackward = (e) => {
|
|
116
|
-
if (e)
|
|
117
|
-
e.preventDefault();
|
|
118
|
-
if (this.circular || this.internalPage > 0) {
|
|
119
|
-
this.isAnimating = true;
|
|
120
|
-
this.internalPage = (this.internalPage - 1 + this.totalPages) % this.totalPages;
|
|
121
|
-
this.page = this.internalPage;
|
|
122
|
-
this.updateTransform();
|
|
123
|
-
this.pageChange.emit(this.internalPage);
|
|
124
|
-
setTimeout(() => (this.isAnimating = false), 500);
|
|
125
|
-
}
|
|
126
|
-
};
|
|
127
|
-
onDotClick(index) {
|
|
128
|
-
this.isAnimating = true;
|
|
129
|
-
this.internalPage = index;
|
|
130
|
-
this.page = this.internalPage;
|
|
131
|
-
this.updateTransform();
|
|
132
|
-
this.pageChange.emit(this.internalPage);
|
|
133
|
-
setTimeout(() => (this.isAnimating = false), 500);
|
|
134
|
-
}
|
|
135
|
-
render() {
|
|
136
|
-
const items = this.parsedValue;
|
|
137
|
-
if (!items.length)
|
|
138
|
-
return null;
|
|
139
|
-
const itemFlexBasis = `${100 / this.numVisible}%`;
|
|
140
|
-
return (index.h("div", { class: { 'dropi-carousel-container': true, 'vertical': this.orientation === 'vertical' } }, index.h("div", { class: "dropi-carousel-content" }, this.showNavigators && items.length > this.numVisible && (index.h("button", { class: "dropi-carousel-nav dropi-carousel-prev", disabled: !this.circular && this.internalPage === 0, onClick: (e) => this.navBackward(e), "aria-label": "Anterior" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, index.h("path", { d: "M14.659 17.5a.833.833 0 0 1-.589-.244l-4.43-4.431a.833.833 0 0 1 0-1.178l4.43-4.431a.834.834 0 0 1 1.179 1.178L11.42 12.25l3.83 3.829a.833.833 0 0 1-.59 1.421Z", fill: "#475066" })))), index.h("div", { class: "dropi-carousel-items-content" }, index.h("div", { class: "dropi-carousel-items-container", ref: (el) => (this.itemsContainer = el), style: { transition: this.isAnimating ? 'transform 0.5s ease' : 'none' } }, items.map((item, i) => (index.h("div", { class: "dropi-carousel-item", style: { flex: `0 0 ${itemFlexBasis}` } }, typeof item === 'string' ? (index.h("img", { src: item, alt: `Slide ${i + 1}` })) : (index.h("slot", { name: `item-${i}` }))))))), this.showNavigators && items.length > this.numVisible && (index.h("button", { class: "dropi-carousel-nav dropi-carousel-next", disabled: !this.circular && this.internalPage >= this.totalPages - 1, onClick: (e) => this.navForward(e), "aria-label": "Siguiente" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, index.h("path", { d: "M9.341 17.5a.833.833 0 0 0 .589-.244l4.43-4.431a.833.833 0 0 0 0-1.178l-4.43-4.431a.834.834 0 0 0-1.179 1.178l3.83 3.829-3.83 3.829a.833.833 0 0 0 .59 1.421Z", fill: "#475066" }))))), this.showIndicators && this.totalPages > 1 && (index.h("ul", { class: "dropi-carousel-indicators" }, Array.from({ length: this.totalPages }).map((_, i) => (index.h("li", { class: { active: i === this.internalPage }, onClick: () => this.onDotClick(i) }, index.h("button", { type: "button", "aria-label": `Página ${i + 1}` }))))))));
|
|
141
|
-
}
|
|
142
|
-
static get watchers() { return {
|
|
143
|
-
"value": [{
|
|
144
|
-
"handleValue": 0
|
|
145
|
-
}],
|
|
146
|
-
"page": [{
|
|
147
|
-
"handlePage": 0
|
|
148
|
-
}]
|
|
149
|
-
}; }
|
|
150
|
-
};
|
|
151
|
-
DropiCarousel.style = dropiCarouselCss();
|
|
152
|
-
|
|
153
|
-
exports.dropi_carousel = DropiCarousel;
|
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
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:inherit;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)}`;
|
|
6
|
-
|
|
7
|
-
const DropiCheckboxSelectionList = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.checkedValues = index.createEvent(this, "checkedValues", 7);
|
|
11
|
-
this.onSearch = index.createEvent(this, "onSearch", 7);
|
|
12
|
-
}
|
|
13
|
-
/** Options array or JSON string */
|
|
14
|
-
options = [];
|
|
15
|
-
/** Show search filter */
|
|
16
|
-
showFilter = true;
|
|
17
|
-
/** Search placeholder */
|
|
18
|
-
filterPlaceholder = 'Search';
|
|
19
|
-
/** Show "no results" message */
|
|
20
|
-
showNotFound = true;
|
|
21
|
-
/** Empty state message */
|
|
22
|
-
notFoundMessage = 'No related results found';
|
|
23
|
-
/** Allow multiple selection */
|
|
24
|
-
multiSelect = true;
|
|
25
|
-
/** Debounce delay in ms for search input (matches Angular `searchDelay`) */
|
|
26
|
-
searchDelay = 100;
|
|
27
|
-
filterText = '';
|
|
28
|
-
selected = [];
|
|
29
|
-
parsedOptions = [];
|
|
30
|
-
/** Emitted when selection changes — matches Angular 'checkedValues' */
|
|
31
|
-
checkedValues;
|
|
32
|
-
/** Emitted on search — matches Angular 'onSearch' */
|
|
33
|
-
onSearch;
|
|
34
|
-
optionsChanged(val) {
|
|
35
|
-
this.parsedOptions = typeof val === 'string' ? JSON.parse(val) : (val || []);
|
|
36
|
-
}
|
|
37
|
-
componentWillLoad() { this.optionsChanged(this.options); }
|
|
38
|
-
get filtered() {
|
|
39
|
-
if (!this.filterText)
|
|
40
|
-
return this.parsedOptions;
|
|
41
|
-
const q = this.filterText.toLowerCase();
|
|
42
|
-
return this.parsedOptions.filter(o => o.label?.toLowerCase().includes(q));
|
|
43
|
-
}
|
|
44
|
-
toggle(id) {
|
|
45
|
-
if (this.multiSelect) {
|
|
46
|
-
this.selected = this.selected.includes(id)
|
|
47
|
-
? this.selected.filter(s => s !== id)
|
|
48
|
-
: [...this.selected, id];
|
|
49
|
-
}
|
|
50
|
-
else {
|
|
51
|
-
this.selected = this.selected.includes(id) ? [] : [id];
|
|
52
|
-
}
|
|
53
|
-
this.checkedValues.emit(this.selected);
|
|
54
|
-
}
|
|
55
|
-
render() {
|
|
56
|
-
const items = this.filtered;
|
|
57
|
-
return (index.h("div", { key: 'a86957a361ddab935966496e85da0474d6c7618a', class: "csl" }, this.showFilter && (index.h("div", { key: 'c6e6d3c7386a788c0e3141ac77b78b597020e43d', class: "csl__search" }, index.h("dropi-icon", { key: '02b8bbc778c1811f65f4cd07bfd0618a0c647573', name: "Search", width: "16px", height: "16px", color: "Gray-Gray-400" }), index.h("input", { key: '935768e39f732099837e2d3dc4791ab2f7f31273', class: "csl__search-input", type: "text", placeholder: this.filterPlaceholder, value: this.filterText, onInput: (e) => {
|
|
58
|
-
this.filterText = e.target.value;
|
|
59
|
-
this.onSearch.emit(this.filterText);
|
|
60
|
-
} }), this.filterText && (index.h("button", { key: 'b93947ffd70113fc80e425dd0da04cce04ad3f27', class: "csl__clear", onClick: () => { this.filterText = ''; this.onSearch.emit(''); } }, index.h("dropi-icon", { key: 'b2e152f7276a914fc03664dabdb3574a2cbeb2c6', name: "Close-small", width: "14px", height: "14px", color: "Gray-Gray-400" }))))), index.h("div", { key: '6010ffc9d6ff60dc444da1274609f2b15f69d4a8', class: "csl__list" }, items.length === 0 && this.showNotFound ? (index.h("div", { class: "csl__empty" }, this.notFoundMessage)) : (items.map(opt => {
|
|
61
|
-
const checked = this.selected.includes(opt.id);
|
|
62
|
-
return (index.h("div", { class: "csl__item", key: opt.id, onClick: () => this.toggle(opt.id) }, index.h("dropi-checkbox", { checked: checked }), opt.icon && index.h("img", { class: "csl__icon", src: opt.icon, alt: opt.label }), index.h("span", { class: "csl__label" }, opt.label)));
|
|
63
|
-
})))));
|
|
64
|
-
}
|
|
65
|
-
static get watchers() { return {
|
|
66
|
-
"options": [{
|
|
67
|
-
"optionsChanged": 0
|
|
68
|
-
}]
|
|
69
|
-
}; }
|
|
70
|
-
};
|
|
71
|
-
DropiCheckboxSelectionList.style = dropiCheckboxSelectionListCss();
|
|
72
|
-
|
|
73
|
-
exports.dropi_checkbox_selection_list = DropiCheckboxSelectionList;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
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}`;
|
|
6
|
-
|
|
7
|
-
const DropiCheckbox = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.onChange = index.createEvent(this, "onChange", 7);
|
|
11
|
-
}
|
|
12
|
-
/** Whether the checkbox is checked */
|
|
13
|
-
checked = false;
|
|
14
|
-
/** Whether the checkbox is disabled */
|
|
15
|
-
disabled = false;
|
|
16
|
-
/** Emitted when the checked state changes */
|
|
17
|
-
onChange;
|
|
18
|
-
changeState() {
|
|
19
|
-
if (this.disabled)
|
|
20
|
-
return;
|
|
21
|
-
this.checked = !this.checked;
|
|
22
|
-
this.onChange.emit(this.checked);
|
|
23
|
-
}
|
|
24
|
-
render() {
|
|
25
|
-
return (index.h("div", { key: 'fdc1c54733617c0dab1ae11050d90650dc3eba91', class: "container-dropi-checkbox", onClick: () => this.changeState() }, index.h("div", { key: '6329c1a53e8b9f85ea26ca01afb920583570e85f', class: {
|
|
26
|
-
check: true,
|
|
27
|
-
isCheck: this.checked,
|
|
28
|
-
noCheck: !this.checked,
|
|
29
|
-
disabled: this.disabled,
|
|
30
|
-
} }, index.h("svg", { key: '50b1ebd160e1ee6b28ef23651f1e12afc9406f8a', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none" }, index.h("path", { key: '518070eaa2902d4cdc5e905f8a80d06b3d044f3d', 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" })))));
|
|
31
|
-
}
|
|
32
|
-
static get formAssociated() { return true; }
|
|
33
|
-
};
|
|
34
|
-
DropiCheckbox.style = dropiCheckboxCss();
|
|
35
|
-
|
|
36
|
-
exports.dropi_checkbox = DropiCheckbox;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-C8kwDvpf.js');
|
|
4
|
-
|
|
5
|
-
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:inherit;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}`;
|
|
6
|
-
|
|
7
|
-
const DropiChips = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
index.registerInstance(this, hostRef);
|
|
10
|
-
this.onClose = index.createEvent(this, "onClose", 7);
|
|
11
|
-
}
|
|
12
|
-
/** Visual style (named customStyle to avoid conflict with HTMLElement.style) */
|
|
13
|
-
customStyle = 'fill';
|
|
14
|
-
/** Content type */
|
|
15
|
-
type = 'icon';
|
|
16
|
-
/** Avatar image URL (when type = 'avatar') */
|
|
17
|
-
urlImg = '';
|
|
18
|
-
/** Show the close/remove icon */
|
|
19
|
-
showIcon = false;
|
|
20
|
-
/** Icon name (when type = 'icon') */
|
|
21
|
-
icon = '';
|
|
22
|
-
/** Emitted when the close icon is clicked */
|
|
23
|
-
onClose;
|
|
24
|
-
render() {
|
|
25
|
-
return (index.h("div", { key: '1d2faf302cc3eb832d55f46f98a7817fb616e4e1', class: { 'chip': true, [`chip--${this.customStyle}`]: true } }, this.type === 'avatar' && this.urlImg && (index.h("img", { key: '3014d189c71a8d3bc23f11caf1181285c6b1b0ed', class: "chip__avatar", src: this.urlImg, alt: "" })), this.type === 'icon' && this.icon && (index.h("dropi-icon", { key: '42c60e26f35e08582045833049d140c3aceaa11d', class: "chip__pre-icon", name: this.icon, width: "14px", height: "14px", color: "currentColor" })), index.h("span", { key: '474a4adfc086e20b2007f1b423f53b29454546be', class: "chip__text" }, index.h("slot", { key: '3c3460ffc17a54b8446b63f7b7c7a76162bb5838' })), this.showIcon && (index.h("button", { key: '6da5b10c81f203dcd204c0fa93babbcab8aaba16', class: "chip__close", onClick: () => this.onClose.emit(), "aria-label": "Eliminar" }, index.h("dropi-icon", { key: '14ef2e91ede7847830b0e491fd844f9efa637f9a', name: "Cross-circle", width: "14px", height: "14px", color: "currentColor" })))));
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
DropiChips.style = dropiChipsCss();
|
|
29
|
-
|
|
30
|
-
exports.dropi_chips = DropiChips;
|