atomicuilibrary 0.1.0 → 0.1.3
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/category-section.cjs.entry.js +2 -2
- package/dist/cjs/dom-BvBb0kmW.js +267 -0
- package/dist/cjs/exploration-project-tailwind.cjs.js +2 -2
- package/dist/cjs/{index-ClkOYpT8.js → index-C32cWsm5.js} +1 -1
- package/dist/cjs/layout-manager.cjs.entry.js +3 -3
- package/dist/cjs/library-card.cjs.entry.js +2 -2
- package/dist/cjs/lm-container_2.cjs.entry.js +2 -2
- package/dist/cjs/lm-panel_3.cjs.entry.js +4 -4
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/my-component.cjs.entry.js +1 -1
- package/dist/cjs/my-step.cjs.entry.js +2 -2
- package/dist/cjs/nav-bar.cjs.entry.js +4 -4
- package/dist/cjs/smart-step.cjs.entry.js +3 -3
- package/dist/cjs/timeline-item.cjs.entry.js +2 -2
- package/dist/cjs/ui-accordion_11.cjs.entry.js +132 -50
- package/dist/cjs/ui-advanced-data-table.cjs.entry.js +2 -2
- package/dist/cjs/ui-anchor.cjs.entry.js +2 -2
- package/dist/cjs/ui-animate-on-scroll.cjs.entry.js +3 -3
- package/dist/cjs/ui-aside-panel.cjs.entry.js +10 -11
- package/dist/cjs/ui-avatar-group_5.cjs.entry.js +1694 -0
- package/dist/cjs/ui-breadcrumb-item.cjs.entry.js +3 -3
- package/dist/cjs/ui-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/ui-callout-banner.cjs.entry.js +2 -2
- package/dist/cjs/ui-card.cjs.entry.js +4 -3
- package/dist/cjs/ui-carousel.cjs.entry.js +1 -1
- package/dist/cjs/ui-checkbox.cjs.entry.js +3 -3
- package/dist/cjs/ui-code-editor.cjs.entry.js +2 -2
- package/dist/cjs/ui-code-preview.cjs.entry.js +2 -2
- package/dist/cjs/ui-color-picker.cjs.entry.js +256 -22
- package/dist/cjs/ui-command-palette.cjs.entry.js +1 -1
- package/dist/cjs/ui-dialog-box.cjs.entry.js +85 -11
- package/dist/cjs/ui-dialog-content.cjs.entry.js +1 -1
- package/dist/cjs/ui-dialog-footer_2.cjs.entry.js +1 -1
- package/dist/cjs/ui-divider.cjs.entry.js +1 -1
- package/dist/cjs/ui-dock-host.cjs.entry.js +4 -4
- package/dist/cjs/ui-dock.cjs.entry.js +2 -2
- package/dist/cjs/ui-drag-drop.cjs.entry.js +2 -2
- package/dist/cjs/ui-dropdown_2.cjs.entry.js +104 -34
- package/dist/cjs/ui-empty-state.cjs.entry.js +2 -2
- package/dist/cjs/ui-fab-item.cjs.entry.js +2 -2
- package/dist/cjs/ui-fab.cjs.entry.js +4 -4
- package/dist/cjs/ui-file-upload.cjs.entry.js +143 -44
- package/dist/cjs/ui-horizontal-nav.cjs.entry.js +2 -2
- package/dist/cjs/ui-knob.cjs.entry.js +1 -1
- package/dist/cjs/ui-label.cjs.entry.js +473 -0
- package/dist/cjs/ui-library.cjs.entry.js +2 -2
- package/dist/cjs/ui-list-group_2.cjs.entry.js +349 -60
- package/dist/cjs/ui-list.cjs.entry.js +76 -42
- package/dist/cjs/ui-masonry.cjs.entry.js +1 -1
- package/dist/cjs/ui-meter-group.cjs.entry.js +5 -4
- package/dist/cjs/ui-navigation-item.cjs.entry.js +5 -5
- package/dist/cjs/ui-number-input.cjs.entry.js +7 -3
- package/dist/cjs/ui-otp-input.cjs.entry.js +5 -5
- package/dist/cjs/{ui-pagination_4.cjs.entry.js → ui-pagination_3.cjs.entry.js} +35 -506
- package/dist/cjs/ui-panel.cjs.entry.js +1 -1
- package/dist/cjs/ui-pattern-input.cjs.entry.js +46 -11
- package/dist/cjs/ui-progress.cjs.entry.js +66 -9
- package/dist/cjs/ui-range-slider.cjs.entry.js +2 -2
- package/dist/cjs/ui-resizable-panel.cjs.entry.js +2 -2
- package/dist/cjs/ui-scroll-top.cjs.entry.js +1 -1
- package/dist/cjs/ui-smart-context-menu.cjs.entry.js +1 -1
- package/dist/cjs/ui-smart-stepper.cjs.entry.js +2 -2
- package/dist/cjs/ui-snackbar.cjs.entry.js +1 -1
- package/dist/cjs/ui-speed-dial.cjs.entry.js +1 -1
- package/dist/cjs/ui-speedometer.cjs.entry.js +28 -17
- package/dist/cjs/ui-splitter.cjs.entry.js +1 -1
- package/dist/cjs/ui-step.cjs.entry.js +2 -2
- package/dist/cjs/ui-stepper.cjs.entry.js +1 -1
- package/dist/cjs/ui-switch.cjs.entry.js +14 -13
- package/dist/cjs/ui-tabs.cjs.entry.js +2 -2
- package/dist/cjs/ui-tag.cjs.entry.js +58 -13
- package/dist/cjs/ui-timeline.cjs.entry.js +10 -2
- package/dist/cjs/ui-timer.cjs.entry.js +2 -2
- package/dist/cjs/ui-toolbar.cjs.entry.js +2 -2
- package/dist/cjs/ui-tooltip.cjs.entry.js +4 -4
- package/dist/cjs/ui-top-bar.cjs.entry.js +1 -1
- package/dist/cjs/ui-transfer-list.cjs.entry.js +6 -6
- package/dist/cjs/ui-tree.cjs.entry.js +30 -15
- package/dist/cjs/ui-workspace-manager.cjs.entry.js +2 -2
- package/dist/collection/assets/js/component-config.js +1 -0
- package/dist/collection/assets/js/demo-loader.js +2 -0
- package/dist/collection/assets/js/demos/about-demo.js +13 -13
- package/dist/collection/assets/js/demos/accordion-demo.js +66 -66
- package/dist/collection/assets/js/demos/advanced-data-table-demo.js +102 -102
- package/dist/collection/assets/js/demos/anchor-demo.js +27 -28
- package/dist/collection/assets/js/demos/animate-on-scroll-demo.js +12 -12
- package/dist/collection/assets/js/demos/aside-panel-demo.js +51 -51
- package/dist/collection/assets/js/demos/avatar-demo.js +433 -95
- package/dist/collection/assets/js/demos/badge-demo.js +51 -52
- package/dist/collection/assets/js/demos/breadcrumb-demo.js +7 -7
- package/dist/collection/assets/js/demos/button-demo.js +117 -107
- package/dist/collection/assets/js/demos/button-toggle-demo.js +199 -96
- package/dist/collection/assets/js/demos/callout-banner-demo.js +23 -23
- package/dist/collection/assets/js/demos/card-demo.js +23 -22
- package/dist/collection/assets/js/demos/carousel-demo.js +632 -360
- package/dist/collection/assets/js/demos/checkbox-demo.js +124 -7
- package/dist/collection/assets/js/demos/color-picker-demo.js +394 -100
- package/dist/collection/assets/js/demos/command-palette-demo.js +182 -65
- package/dist/collection/assets/js/demos/complex-form-demo.js +5 -5
- package/dist/collection/assets/js/demos/context-menu-demo.js +43 -43
- package/dist/collection/assets/js/demos/dialog-demo-temp.js +3 -3
- package/dist/collection/assets/js/demos/dialog-demo.js +336 -230
- package/dist/collection/assets/js/demos/divider-demo.js +59 -62
- package/dist/collection/assets/js/demos/dock-demo.js +12 -12
- package/dist/collection/assets/js/demos/dock-host-init.js +31 -31
- package/dist/collection/assets/js/demos/documentation-demo.js +34 -34
- package/dist/collection/assets/js/demos/drag-drop-demo.js +2 -2
- package/dist/collection/assets/js/demos/dropdown-demo.js +140 -136
- package/dist/collection/assets/js/demos/dropdown-subtitle-demo.js +2 -2
- package/dist/collection/assets/js/demos/empty-state-demo.js +294 -78
- package/dist/collection/assets/js/demos/fab-demo.js +95 -11
- package/dist/collection/assets/js/demos/file-upload-demo.js +641 -171
- package/dist/collection/assets/js/demos/home-components.js +2 -2
- package/dist/collection/assets/js/demos/horizontal-nav-demo.js +6 -6
- package/dist/collection/assets/js/demos/icon-demo.js +17 -17
- package/dist/collection/assets/js/demos/input-demo.js +147 -143
- package/dist/collection/assets/js/demos/knob-demo.js +29 -30
- package/dist/collection/assets/js/demos/label-demo.js +697 -0
- package/dist/collection/assets/js/demos/layout-manager-demo.js +55 -55
- package/dist/collection/assets/js/demos/list-demo.js +185 -122
- package/dist/collection/assets/js/demos/loader-demo.js +48 -48
- package/dist/collection/assets/js/demos/masonry-demo.js +568 -140
- package/dist/collection/assets/js/demos/meter-group-demo.js +14 -16
- package/dist/collection/assets/js/demos/multi-level-context-menu-demo.js +25 -25
- package/dist/collection/assets/js/demos/my-profile-demo.js +27 -27
- package/dist/collection/assets/js/demos/nav-bar-demo.js +1 -1
- package/dist/collection/assets/js/demos/number-input-demo.js +262 -211
- package/dist/collection/assets/js/demos/pagination-demo.js +29 -29
- package/dist/collection/assets/js/demos/panel-demo.js +18 -25
- package/dist/collection/assets/js/demos/pattern-input-demo.js +278 -40
- package/dist/collection/assets/js/demos/popover-demo.js +240 -149
- package/dist/collection/assets/js/demos/progress-demo.js +170 -156
- package/dist/collection/assets/js/demos/radio-demo.js +73 -12
- package/dist/collection/assets/js/demos/range-slider-demo.js +33 -33
- package/dist/collection/assets/js/demos/rating-demo.js +19 -19
- package/dist/collection/assets/js/demos/scroll-top-demo.js +8 -9
- package/dist/collection/assets/js/demos/skeleton-demo.js +110 -52
- package/dist/collection/assets/js/demos/skeleton-performance-demo.js +2 -2
- package/dist/collection/assets/js/demos/smart-dialog-demo.js +12 -12
- package/dist/collection/assets/js/demos/smart-menu-demo.js +17 -17
- package/dist/collection/assets/js/demos/snackbar-demo.js +53 -53
- package/dist/collection/assets/js/demos/speed-dial-demo.js +14 -14
- package/dist/collection/assets/js/demos/speedometer-demo.js +40 -32
- package/dist/collection/assets/js/demos/split-button-demo.js +2 -2
- package/dist/collection/assets/js/demos/splitter-demo.js +14 -14
- package/dist/collection/assets/js/demos/stack-demo.js +27 -27
- package/dist/collection/assets/js/demos/stepper-demo.js +49 -49
- package/dist/collection/assets/js/demos/switch-demo.js +561 -125
- package/dist/collection/assets/js/demos/tabs-demo.js +22 -22
- package/dist/collection/assets/js/demos/tag-demo.js +62 -62
- package/dist/collection/assets/js/demos/theme-selector-demo.js +27 -27
- package/dist/collection/assets/js/demos/timeline-demo.js +10 -10
- package/dist/collection/assets/js/demos/timeline-playground.js +2 -2
- package/dist/collection/assets/js/demos/timer-demo.js +10 -10
- package/dist/collection/assets/js/demos/toolbar-demo.js +17 -17
- package/dist/collection/assets/js/demos/tooltip-demo.js +92 -90
- package/dist/collection/assets/js/demos/top-bar-demo.js +6 -6
- package/dist/collection/assets/js/demos/transfer-list-demo.js +20 -20
- package/dist/collection/assets/js/demos/tree-demo.js +50 -66
- package/dist/collection/assets/js/demos/workspace-manager-demo.js +20 -20
- package/dist/collection/collection-manifest.json +1 -2
- package/dist/collection/components/accordion/accordion.css +275 -9
- package/dist/collection/components/accordion/accordion.js +7 -6
- package/dist/collection/components/advanced-data-table/advanced-data-table.css +5 -5
- package/dist/collection/components/advanced-data-table/advanced-data-table.js +2 -2
- package/dist/collection/components/anchor/anchor.css +1 -0
- package/dist/collection/components/animate-on-scroll/animate-on-scroll.js +2 -2
- package/dist/collection/components/aside-panel/aside-panel.css +2 -2
- package/dist/collection/components/aside-panel/aside-panel.js +10 -11
- package/dist/collection/components/avatar/avatar.css +6 -6
- package/dist/collection/components/avatar/avatar.js +63 -11
- package/dist/collection/components/badge/badge.css +27 -17
- package/dist/collection/components/badge/badge.js +6 -3
- package/dist/collection/components/breadcrumb/breadcrumb-item.js +2 -2
- package/dist/collection/components/button/button.css +1 -0
- package/dist/collection/components/button/button.js +3 -3
- package/dist/collection/components/button-toggle/button-toggle.js +2 -2
- package/dist/collection/components/button-toggle-group/button-toggle-group.css +161 -14
- package/dist/collection/components/button-toggle-group/button-toggle-group.js +2 -2
- package/dist/collection/components/callout-banner/callout-banner.css +75 -0
- package/dist/collection/components/callout-banner/callout-banner.js +1 -1
- package/dist/collection/components/card/card.css +221 -9
- package/dist/collection/components/card/card.js +3 -2
- package/dist/collection/components/checkbox/checkbox.js +3 -3
- package/dist/collection/components/code-editor/code-editor.js +1 -1
- package/dist/collection/components/code-preview/ui-code-preview.js +1 -1
- package/dist/collection/components/color-picker/color-picker.css +110 -6
- package/dist/collection/components/color-picker/color-picker.js +302 -26
- package/dist/collection/components/context-menu/context-menu.css +9 -9
- package/dist/collection/components/dialog-box/dialog-box.js +116 -14
- package/dist/collection/components/dialog-header/dialog-header.js +1 -1
- package/dist/collection/components/dock/dock.css +116 -3
- package/dist/collection/components/dock-host/ui-dock-host.js +3 -3
- package/dist/collection/components/drag-drop/drag-drop.js +1 -1
- package/dist/collection/components/dropdown/dropdown.css +101 -8
- package/dist/collection/components/dropdown/dropdown.js +94 -28
- package/dist/collection/components/empty-state/empty-state.js +1 -1
- package/dist/collection/components/fab/fab.css +87 -15
- package/dist/collection/components/fab/fab.js +3 -3
- package/dist/collection/components/fab-item/fab-item.js +1 -1
- package/dist/collection/components/file-upload/file-upload.css +1362 -31
- package/dist/collection/components/file-upload/file-upload.js +171 -50
- package/dist/collection/components/horizontal-nav/horizontal-nav.css +9 -9
- package/dist/collection/components/horizontal-nav/horizontal-nav.js +2 -2
- package/dist/collection/components/icon/icon.js +1 -1
- package/dist/collection/components/input/input.css +9 -0
- package/dist/collection/components/input/input.js +20 -9
- package/dist/collection/components/label/label.css +583 -0
- package/dist/collection/components/label/label.js +1669 -0
- package/dist/collection/components/layout-manager/layout-manager.js +1 -1
- package/dist/collection/components/layout-manager/lm-floating-window/lm-floating-window.js +1 -1
- package/dist/collection/components/layout-manager/lm-panel/lm-panel.js +1 -1
- package/dist/collection/components/layout-manager/lm-splitter/lm-splitter.js +1 -1
- package/dist/collection/components/layout-manager/lm-tabs/lm-tabs.js +1 -1
- package/dist/collection/components/library/category-section.js +1 -1
- package/dist/collection/components/library/library-card.js +1 -1
- package/dist/collection/components/library/library.js +1 -1
- package/dist/collection/components/list/list.css +46 -5
- package/dist/collection/components/list/list.js +76 -42
- package/dist/collection/components/list-group/list-group.css +0 -2
- package/dist/collection/components/list-group/list-group.js +11 -5
- package/dist/collection/components/list-item/list-item.css +403 -131
- package/dist/collection/components/list-item/list-item.js +345 -61
- package/dist/collection/components/loader/loader.css +1 -1
- package/dist/collection/components/loader/loader.js +2 -2
- package/dist/collection/components/meter-group/meter-group.css +5 -0
- package/dist/collection/components/meter-group/meter-group.js +3 -2
- package/dist/collection/components/my-step/my-step.js +1 -1
- package/dist/collection/components/nav-bar/nav-bar.css +4 -4
- package/dist/collection/components/nav-bar/nav-bar.js +6 -6
- package/dist/collection/components/number-input/number-input.js +6 -2
- package/dist/collection/components/otp-input/otp-input.css +10 -0
- package/dist/collection/components/otp-input/otp-input.js +3 -3
- package/dist/collection/components/pagination/pagination.js +1 -1
- package/dist/collection/components/pattern-input/pattern-input.css +0 -1
- package/dist/collection/components/pattern-input/pattern-input.js +44 -9
- package/dist/collection/components/popover/popover.css +35 -7
- package/dist/collection/components/popover/popover.js +64 -9
- package/dist/collection/components/progress/progress.css +176 -32
- package/dist/collection/components/progress/progress.js +66 -8
- package/dist/collection/components/radio/radio.css +2 -0
- package/dist/collection/components/radio/radio.js +2 -2
- package/dist/collection/components/range-slider/range-slider.css +284 -31
- package/dist/collection/components/range-slider/range-slider.js +5 -5
- package/dist/collection/components/rating/rating.css +151 -65
- package/dist/collection/components/rating/rating.js +31 -13
- package/dist/collection/components/resizable-panel/resizable-panel.js +1 -1
- package/dist/collection/components/skeleton/skeleton-loader.css +144 -44
- package/dist/collection/components/skeleton/skeleton-loader.js +11 -7
- package/dist/collection/components/smart-stepper/smart-step.js +2 -2
- package/dist/collection/components/smart-stepper/smart-stepper.js +1 -1
- package/dist/collection/components/speedometer/speedometer.css +26 -6
- package/dist/collection/components/speedometer/speedometer.js +26 -15
- package/dist/collection/components/stack/stack.js +2 -2
- package/dist/collection/components/step/step.js +1 -1
- package/dist/collection/components/stepper/stepper.js +1 -1
- package/dist/collection/components/switch/switch.css +367 -8
- package/dist/collection/components/switch/switch.js +13 -12
- package/dist/collection/components/tag/tag.css +38 -12
- package/dist/collection/components/tag/tag.js +58 -13
- package/dist/collection/components/tag-group/tag-group.css +0 -1
- package/dist/collection/components/tag-group/tag-group.js +3 -3
- package/dist/collection/components/timeline/timeline.css +380 -317
- package/dist/collection/components/timeline/timeline.js +8 -0
- package/dist/collection/components/timeline-item/timeline-item.js +1 -1
- package/dist/collection/components/timer/timer.js +1 -1
- package/dist/collection/components/toggle-group/toggle-group.css +7 -3
- package/dist/collection/components/toggle-group/toggle-group.js +7 -3
- package/dist/collection/components/toolbar/toolbar.js +1 -1
- package/dist/collection/components/tooltip/tooltip.js +4 -4
- package/dist/collection/components/top-bar/top-bar.js +2 -2
- package/dist/collection/components/transfer-list/transfer-list.css +13 -13
- package/dist/collection/components/transfer-list/transfer-list.js +4 -4
- package/dist/collection/components/tree/tree.css +35 -21
- package/dist/collection/components/tree/tree.js +28 -13
- package/dist/collection/components/ui-navigation-bar/navigation-bar/navigation-bar.css +34 -16
- package/dist/collection/components/ui-navigation-bar/navigation-bar/navigation-bar.js +46 -11
- package/dist/collection/components/ui-navigation-bar/navigation-item.css +7 -7
- package/dist/collection/components/ui-navigation-bar/navigation-item.js +3 -3
- package/dist/collection/utils/dom.js +151 -151
- package/dist/components/avatar-group.js +1 -1
- package/dist/components/avatar.js +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/button-toggle.js +1 -1
- package/dist/components/button.js +1 -0
- package/dist/components/category-section2.js +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/context-menu.js +1 -1
- package/dist/components/dialog-header.js +1 -1
- package/dist/components/dom.js +1 -1
- package/dist/components/dropdown.js +1 -1
- package/dist/components/icon.js +2 -2
- package/dist/components/input.js +1 -1
- package/dist/components/layout-manager.js +1 -1
- package/dist/components/library-card2.js +1 -1
- package/dist/components/list-group.js +1 -1
- package/dist/components/list-item.js +1 -1
- package/dist/components/lm-container2.js +1 -1
- package/dist/components/lm-floating-window2.js +1 -1
- package/dist/components/lm-panel2.js +1 -1
- package/dist/components/lm-splitter2.js +1 -1
- package/dist/components/lm-tabs2.js +1 -1
- package/dist/components/loader.js +1 -1
- package/dist/components/my-step.js +1 -1
- package/dist/components/nav-bar.js +1 -1
- package/dist/components/pagination.js +1 -1
- package/dist/components/popover.js +1 -0
- package/dist/components/radio.js +1 -1
- package/dist/components/range-slider.js +1 -1
- package/dist/components/rating.js +1 -1
- package/dist/components/resizable-panel.js +1 -1
- package/dist/components/skeleton-loader.js +1 -1
- package/dist/components/smart-step.js +1 -1
- package/dist/components/stack.js +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/tag-group.js +1 -1
- package/dist/components/tag.js +1 -1
- package/dist/components/timeline-item.js +1 -1
- package/dist/components/toggle-group.js +1 -1
- package/dist/components/tooltip.js +1 -1
- package/dist/components/ui-accordion.js +1 -1
- package/dist/components/ui-advanced-data-table.js +1 -1
- package/dist/components/ui-anchor.js +1 -1
- package/dist/components/ui-animate-on-scroll.js +1 -1
- package/dist/components/ui-aside-panel.js +1 -1
- package/dist/components/ui-badge.js +1 -1
- package/dist/components/ui-breadcrumb-item.js +1 -1
- package/dist/components/ui-breadcrumb.js +1 -1
- package/dist/components/ui-button-toggle-group.js +1 -1
- package/dist/components/ui-button.js +1 -1
- package/dist/components/ui-callout-banner.js +1 -1
- package/dist/components/ui-card.js +1 -1
- package/dist/components/ui-carousel.js +1 -1
- package/dist/components/ui-code-editor.js +1 -1
- package/dist/components/ui-code-preview.js +1 -1
- package/dist/components/ui-color-picker.js +1 -1
- package/dist/components/ui-command-palette.js +1 -1
- package/dist/components/ui-dialog-box.js +1 -1
- package/dist/components/ui-dock-host.js +1 -1
- package/dist/components/ui-dock.js +1 -1
- package/dist/components/ui-drag-drop.js +1 -1
- package/dist/components/ui-empty-state.js +1 -1
- package/dist/components/ui-fab-item.js +1 -1
- package/dist/components/ui-fab.js +1 -1
- package/dist/components/ui-file-upload.js +1 -1
- package/dist/components/ui-horizontal-nav.js +1 -1
- package/dist/components/ui-knob.js +1 -1
- package/dist/components/{ui-color-controller.d.ts → ui-label.d.ts} +4 -4
- package/dist/components/ui-label.js +1 -0
- package/dist/components/ui-library.js +1 -1
- package/dist/components/ui-list.js +1 -1
- package/dist/components/ui-masonry.js +1 -1
- package/dist/components/ui-meter-group.js +1 -1
- package/dist/components/ui-navigation-bar.js +1 -1
- package/dist/components/ui-navigation-item.js +1 -1
- package/dist/components/ui-number-input.js +1 -1
- package/dist/components/ui-otp-input.js +1 -1
- package/dist/components/ui-panel.js +1 -1
- package/dist/components/ui-pattern-input.js +1 -1
- package/dist/components/ui-popover.js +1 -1
- package/dist/components/ui-progress.js +1 -1
- package/dist/components/ui-scroll-top.js +1 -1
- package/dist/components/ui-smart-stepper.js +1 -1
- package/dist/components/ui-snackbar.js +1 -1
- package/dist/components/ui-speed-dial.js +1 -1
- package/dist/components/ui-speedometer.js +1 -1
- package/dist/components/ui-splitter.js +1 -1
- package/dist/components/ui-step.js +1 -1
- package/dist/components/ui-stepper.js +1 -1
- package/dist/components/ui-tabs.js +1 -1
- package/dist/components/ui-timeline.js +1 -1
- package/dist/components/ui-timer.js +1 -1
- package/dist/components/ui-toolbar.js +1 -1
- package/dist/components/ui-top-bar.js +1 -1
- package/dist/components/ui-transfer-list.js +1 -1
- package/dist/components/ui-tree.js +1 -1
- package/dist/components/ui-workspace-manager.js +1 -1
- package/dist/esm/category-section.entry.js +2 -2
- package/dist/esm/dom-DFBTWhGw.js +262 -0
- package/dist/esm/exploration-project-tailwind.js +3 -3
- package/dist/esm/{index-DUsoYu9r.js → index-Dqu2zaH1.js} +1 -1
- package/dist/esm/layout-manager.entry.js +3 -3
- package/dist/esm/library-card.entry.js +2 -2
- package/dist/esm/lm-container_2.entry.js +2 -2
- package/dist/esm/lm-panel_3.entry.js +4 -4
- package/dist/esm/loader.js +3 -3
- package/dist/esm/my-component.entry.js +1 -1
- package/dist/esm/my-step.entry.js +2 -2
- package/dist/esm/nav-bar.entry.js +4 -4
- package/dist/esm/smart-step.entry.js +3 -3
- package/dist/esm/timeline-item.entry.js +2 -2
- package/dist/esm/ui-accordion_11.entry.js +132 -50
- package/dist/esm/ui-advanced-data-table.entry.js +2 -2
- package/dist/esm/ui-anchor.entry.js +2 -2
- package/dist/esm/ui-animate-on-scroll.entry.js +3 -3
- package/dist/esm/ui-aside-panel.entry.js +10 -11
- package/dist/esm/ui-avatar-group_5.entry.js +1688 -0
- package/dist/esm/ui-breadcrumb-item.entry.js +3 -3
- package/dist/esm/ui-breadcrumb.entry.js +1 -1
- package/dist/esm/ui-callout-banner.entry.js +2 -2
- package/dist/esm/ui-card.entry.js +4 -3
- package/dist/esm/ui-carousel.entry.js +1 -1
- package/dist/esm/ui-checkbox.entry.js +3 -3
- package/dist/esm/ui-code-editor.entry.js +2 -2
- package/dist/esm/ui-code-preview.entry.js +2 -2
- package/dist/esm/ui-color-picker.entry.js +256 -22
- package/dist/esm/ui-command-palette.entry.js +1 -1
- package/dist/esm/ui-dialog-box.entry.js +85 -11
- package/dist/esm/ui-dialog-content.entry.js +1 -1
- package/dist/esm/ui-dialog-footer_2.entry.js +1 -1
- package/dist/esm/ui-divider.entry.js +1 -1
- package/dist/esm/ui-dock-host.entry.js +4 -4
- package/dist/esm/ui-dock.entry.js +2 -2
- package/dist/esm/ui-drag-drop.entry.js +2 -2
- package/dist/esm/ui-dropdown_2.entry.js +104 -34
- package/dist/esm/ui-empty-state.entry.js +2 -2
- package/dist/esm/ui-fab-item.entry.js +2 -2
- package/dist/esm/ui-fab.entry.js +4 -4
- package/dist/esm/ui-file-upload.entry.js +143 -44
- package/dist/esm/ui-horizontal-nav.entry.js +2 -2
- package/dist/esm/ui-knob.entry.js +1 -1
- package/dist/esm/ui-label.entry.js +471 -0
- package/dist/esm/ui-library.entry.js +2 -2
- package/dist/esm/ui-list-group_2.entry.js +349 -60
- package/dist/esm/ui-list.entry.js +76 -42
- package/dist/esm/ui-masonry.entry.js +1 -1
- package/dist/esm/ui-meter-group.entry.js +5 -4
- package/dist/esm/ui-navigation-item.entry.js +5 -5
- package/dist/esm/ui-number-input.entry.js +7 -3
- package/dist/esm/ui-otp-input.entry.js +5 -5
- package/dist/esm/{ui-pagination_4.entry.js → ui-pagination_3.entry.js} +36 -506
- package/dist/esm/ui-panel.entry.js +1 -1
- package/dist/esm/ui-pattern-input.entry.js +46 -11
- package/dist/esm/ui-progress.entry.js +66 -9
- package/dist/esm/ui-range-slider.entry.js +2 -2
- package/dist/esm/ui-resizable-panel.entry.js +2 -2
- package/dist/esm/ui-scroll-top.entry.js +1 -1
- package/dist/esm/ui-smart-context-menu.entry.js +1 -1
- package/dist/esm/ui-smart-stepper.entry.js +2 -2
- package/dist/esm/ui-snackbar.entry.js +1 -1
- package/dist/esm/ui-speed-dial.entry.js +1 -1
- package/dist/esm/ui-speedometer.entry.js +28 -17
- package/dist/esm/ui-splitter.entry.js +1 -1
- package/dist/esm/ui-step.entry.js +2 -2
- package/dist/esm/ui-stepper.entry.js +1 -1
- package/dist/esm/ui-switch.entry.js +14 -13
- package/dist/esm/ui-tabs.entry.js +2 -2
- package/dist/esm/ui-tag.entry.js +58 -13
- package/dist/esm/ui-timeline.entry.js +10 -2
- package/dist/esm/ui-timer.entry.js +2 -2
- package/dist/esm/ui-toolbar.entry.js +2 -2
- package/dist/esm/ui-tooltip.entry.js +4 -4
- package/dist/esm/ui-top-bar.entry.js +1 -1
- package/dist/esm/ui-transfer-list.entry.js +6 -6
- package/dist/esm/ui-tree.entry.js +30 -15
- package/dist/esm/ui-workspace-manager.entry.js +2 -2
- package/dist/exploration-project-tailwind/exploration-project-tailwind.css +1 -1
- package/dist/exploration-project-tailwind/exploration-project-tailwind.esm.js +1 -1
- package/dist/exploration-project-tailwind/{p-7ba2258a.entry.js → p-024a299a.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-0a71896a.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-35296877.entry.js → p-0cdeb8d8.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-a42fdc33.entry.js → p-139cefbc.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-036d2a44.entry.js → p-198c83e5.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-236f47b1.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-81ebba11.entry.js → p-25530d0d.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-41cd6bf0.entry.js → p-298f2057.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-85e36111.entry.js → p-2b5a8e3e.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-e8c6d395.entry.js → p-2b6aa7bc.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-70bacda8.entry.js → p-2cfba753.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-cbee2607.entry.js → p-2fe22958.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-20ecc116.entry.js → p-3012e780.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-321c3f46.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-8b57fe4e.entry.js → p-3ab43638.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-3ad7e47e.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-3b1ca826.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-3ee8ddae.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-e22317c1.entry.js → p-3efb44c8.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-36861546.entry.js → p-42e3bc28.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-4360331a.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-2f961934.entry.js → p-443de32b.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-898dd0fa.entry.js → p-44d15451.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-4288c158.entry.js → p-46071679.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-a3f465d9.entry.js → p-497d6182.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-4ad8c55c.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-4aaa8e40.entry.js → p-4c46ac0b.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-98e91da5.entry.js → p-5042ddaa.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-60190e0e.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-60530874.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-200241f8.entry.js → p-6108565d.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-fb4aca69.entry.js → p-62889cfe.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-c02284ea.entry.js → p-66f71613.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-7889bfc4.entry.js → p-67c440b2.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-c1c8ac28.entry.js → p-6f09503f.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-721bdbc3.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-747b02ea.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-c6fd72e1.entry.js → p-754cb046.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-97af03cc.entry.js → p-7ed3bba2.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-d59da767.entry.js → p-864cebb7.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-4d73c143.entry.js → p-96ee3196.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-54965530.entry.js → p-97086868.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-d114a347.entry.js → p-9c5ced88.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-9d3044d4.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-9e079be6.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-790556f0.entry.js → p-9e4c45f5.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-9eee7394.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-DFBTWhGw.js +1 -0
- package/dist/exploration-project-tailwind/p-Dqu2zaH1.js +2 -0
- package/dist/exploration-project-tailwind/p-a7bdedc2.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-c87aeab6.entry.js → p-a8ec29de.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-6ddbee42.entry.js → p-ae617f62.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-05a436d3.entry.js → p-aef76052.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-b5f043fa.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-b637b91b.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-d2e45c5e.entry.js → p-bc49a088.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-6b838549.entry.js → p-bd9a631f.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-e8ba0c95.entry.js → p-bf4b6767.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-c0fa400e.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-8578b616.entry.js → p-c4f3d990.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-c68ddb2f.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-c79574c4.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-c840098d.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-a1ad32a2.entry.js → p-c8663cbe.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-cb6e38a6.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-cb9f2df1.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-cfe8b696.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-d00e13ae.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-c4ba7e52.entry.js → p-d01ed934.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-aa85ff78.entry.js → p-d4e57d94.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-ccb5c737.entry.js → p-d5bd3a3f.entry.js} +1 -1
- package/dist/exploration-project-tailwind/{p-45482d86.entry.js → p-d987cebe.entry.js} +1 -1
- package/dist/exploration-project-tailwind/p-d9ae77c0.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-e9bae5c7.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-f516fabc.entry.js +1 -0
- package/dist/exploration-project-tailwind/p-f68e2794.entry.js +1 -0
- package/dist/exploration-project-tailwind/{p-d30e24bd.entry.js → p-fa034f69.entry.js} +1 -1
- package/dist/types/components/aside-panel/aside-panel.d.ts +0 -3
- package/dist/types/components/avatar/avatar.d.ts +3 -0
- package/dist/types/components/avatar/types.d.ts +2 -0
- package/dist/types/components/badge/badge.d.ts +1 -0
- package/dist/types/components/color-picker/color-picker.d.ts +35 -2
- package/dist/types/components/dialog-box/dialog-box.d.ts +10 -0
- package/dist/types/components/dropdown/dropdown.d.ts +5 -0
- package/dist/types/components/file-upload/file-upload.d.ts +23 -6
- package/dist/types/components/label/label.d.ts +290 -0
- package/dist/types/components/label/types.d.ts +39 -0
- package/dist/types/components/list/list.d.ts +2 -1
- package/dist/types/components/list-group/list-group.d.ts +1 -0
- package/dist/types/components/list-item/list-item.d.ts +45 -17
- package/dist/types/components/pattern-input/pattern-input.d.ts +6 -0
- package/dist/types/components/popover/popover.d.ts +3 -0
- package/dist/types/components/progress/progress.d.ts +7 -0
- package/dist/types/components/range-slider/range-slider.d.ts +2 -2
- package/dist/types/components/rating/rating.d.ts +1 -0
- package/dist/types/components/skeleton/skeleton-loader.d.ts +1 -1
- package/dist/types/components/speedometer/speedometer.d.ts +1 -0
- package/dist/types/components/tag/tag.d.ts +4 -0
- package/dist/types/components/tree/tree.d.ts +1 -0
- package/dist/types/components/ui-navigation-bar/navigation-bar/navigation-bar.d.ts +1 -1
- package/dist/types/components.d.ts +742 -425
- package/dist/types/types/common.d.ts +2 -2
- package/dist/types/types/common.type.d.ts +2 -0
- package/dist/types/utils/dom.d.ts +4 -4
- package/package.json +4 -5
- package/dist/cjs/dom-oP1E4Rd3.js +0 -267
- package/dist/cjs/ui-avatar-group_3.cjs.entry.js +0 -634
- package/dist/cjs/ui-color-controller.cjs.entry.js +0 -150
- package/dist/cjs/ui-popover.cjs.entry.js +0 -517
- package/dist/cjs/ui-smart-location-dropdown.cjs.entry.js +0 -565
- package/dist/collection/components/color-controller/color-controller.css +0 -108
- package/dist/collection/components/color-controller/color-controller.js +0 -224
- package/dist/collection/components/smart-location-dropdown/smart-location-dropdown.css +0 -357
- package/dist/collection/components/smart-location-dropdown/smart-location-dropdown.js +0 -1190
- package/dist/components/ui-color-controller.js +0 -1
- package/dist/components/ui-smart-location-dropdown.d.ts +0 -11
- package/dist/components/ui-smart-location-dropdown.js +0 -1
- package/dist/esm/dom-BMFah5q3.js +0 -262
- package/dist/esm/ui-avatar-group_3.entry.js +0 -630
- package/dist/esm/ui-color-controller.entry.js +0 -148
- package/dist/esm/ui-popover.entry.js +0 -515
- package/dist/esm/ui-smart-location-dropdown.entry.js +0 -563
- package/dist/exploration-project-tailwind/p-06f0c679.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-0d31c9e9.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-148e81df.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-16bdd162.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-2347d21b.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-3d381f75.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-4417a9d8.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-44742ddd.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-47e2a7ee.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-4bef8bed.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-4efd63ce.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-5c835d90.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-61717490.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-717dad1f.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-71d95bb1.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-9bd14f69.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-9fc06ff0.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-BMFah5q3.js +0 -1
- package/dist/exploration-project-tailwind/p-DUsoYu9r.js +0 -2
- package/dist/exploration-project-tailwind/p-a27f59d2.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-a7b07cf4.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-bd89d060.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-c63c522e.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-c69dd43e.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-d6ce9721.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-dc92a343.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-debede45.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-e76318c7.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-ea51c5d8.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-eab5ad36.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-f0bc5d7e.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-f1beee72.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-f543392f.entry.js +0 -1
- package/dist/exploration-project-tailwind/p-f61cfb7c.entry.js +0 -1
- package/dist/types/components/color-controller/color-controller.d.ts +0 -24
- package/dist/types/components/smart-location-dropdown/smart-location-dropdown.d.ts +0 -119
- package/dist/types/components/smart-location-dropdown/types.d.ts +0 -37
- /package/dist/collection/components/{smart-location-dropdown → label}/types.js +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as e,createEvent as a,h as i,Host as o,transformTag as r}from"@stencil/core/internal/client";import{d as n,a as s}from"./badge.js";import{d as c}from"./icon.js";import{d as l}from"./input.js";import{d as m}from"./loader.js";const p=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.actionClick=a(this,"actionClick",7),this.backClick=a(this,"backClick",7),this.itemClick=a(this,"itemClick",7),this.searchChange=a(this,"searchChange",7),this.retry=a(this,"retry",7)}heading;message;type="no-data";icon;image;imageAlt="Empty state";iconColor;iconSize="64px";variant="default";size="md";align="center";rounded=!1;elevated=!1;fullHeight=!1;padding;maxWidth="500px";compact=!1;loadingAction;illustration;confetti=!1;description;showSearch=!1;searchPlaceholder="Try another search...";searchValue="";retryDelay=0;retryLabel="Retrying in {n}s...";actions="[]";primaryAction;primaryActionIcon;secondaryAction;secondaryActionIcon;items="[]";itemsTitle;showBackButton=!1;backButtonLabel="Go Back";animated=!0;customClass;actionClick;backClick;itemClick;searchChange;retry;parseActions(){if("string"==typeof this.actions)try{return JSON.parse(this.actions)}catch{return[]}return this.actions||[]}parseItems(){if("string"==typeof this.items)try{return JSON.parse(this.items)}catch{return[]}return this.items||[]}handleActionClick(t){this.actionClick.emit({action:t.label,value:t.value})}handlePrimaryAction(){this.primaryAction&&this.actionClick.emit({action:"primary",value:this.primaryAction})}handleSecondaryAction(){this.secondaryAction&&this.actionClick.emit({action:"secondary",value:this.secondaryAction})}handleBackClick(){this.backClick.emit()}handleItemClick(t){this.itemClick.emit({item:t})}handleSearchChange(t){this.searchChange.emit(t.target.value)}currentRetryCount=0;retryTimer;onRetryDelayChange(){this.retryDelay>0?this.startRetryTimer():this.retryTimer&&clearInterval(this.retryTimer)}componentWillLoad(){this.retryDelay>0&&this.startRetryTimer()}startRetryTimer(){this.currentRetryCount=this.retryDelay,this.retryTimer&&clearInterval(this.retryTimer),this.retryTimer=setInterval((()=>{this.currentRetryCount--,this.currentRetryCount<=0&&(clearInterval(this.retryTimer),this.retry.emit())}),1e3)}disconnectedCallback(){this.retryTimer&&clearInterval(this.retryTimer)}getDefaultContent(){const t={"no-data":{icon:"inbox",library:"fontawesome",heading:"No Data Available",message:"There is no data to display at the moment."},"no-results":{icon:"search",library:"fontawesome",heading:"No Results Found",message:"We couldn't find any results matching your search."},error:{icon:"exclamation-triangle",library:"fontawesome",heading:"Something Went Wrong",message:"An error occurred while loading the data. Please try again."},404:{icon:"frown",library:"fontawesome",heading:"404 - Not Found",message:"The resource you are looking for has vanished into the void."},401:{icon:"user-lock",library:"fontawesome",heading:"401 - Unauthorized",message:"Please log in to access this protected area."},403:{icon:"ban",library:"fontawesome",heading:"403 - Forbidden",message:"You do not have the required permissions to view this content."},405:{icon:"hand-paper",library:"fontawesome",heading:"405 - Method Not Allowed",message:"This action is not supported for this resource."},410:{icon:"trash-alt",library:"fontawesome",heading:"410 - Gone",message:"This resource has been permanently removed."},418:{icon:"coffee",library:"fontawesome",heading:"418 - I'm a Teapot",message:"I refuse to brew coffee because I am, short and stout, a teapot."},429:{icon:"hourglass-half",library:"fontawesome",heading:"429 - Too Many Requests",message:"You've sent too many requests. Please take a breath and try again later."},500:{icon:"server",library:"fontawesome",heading:"500 - Server Error",message:"Something went wrong on our end. Our best minds are on it."},503:{icon:"plug",library:"fontawesome",heading:"503 - Service Unavailable",message:"The server is temporarily down for maintenance or overloaded."},offline:{icon:"wifi",library:"fontawesome",heading:"No Internet Connection",message:"Check your network cables, modem, and router or try reconnecting."},onboarding:{icon:"paper-plane",library:"fontawesome",heading:"Welcome Abroad!",message:"Get started by creating your first project or inviting teammates."},accomplishment:{icon:"trophy",library:"fontawesome",heading:"You're All Caught Up!",message:"Great job! You've completed everything on your list for today."},success:{icon:"check-circle",library:"fontawesome",heading:"Mission Accomplished",message:"Action completed successfully. Everything looks perfect."},"no-messages":{icon:"comment-slash",library:"fontawesome",heading:"No Messages Yet",message:"It's quiet here. Start a conversation to see messages appear."},"no-notifications":{icon:"bell-slash",library:"fontawesome",heading:"No New Notifications",message:"We'll let you know when something important happens."},"no-favorites":{icon:"heart-broken",library:"fontawesome",heading:"No Favorites Saved",message:"Tap the heart icon on items you love to save them here."},"no-tasks":{icon:"clipboard-check",library:"fontawesome",heading:"No Tasks Found",message:"Your list is empty. Add a new task to stay organized."},"no-history":{icon:"history",library:"fontawesome",heading:"No Recent Activity",message:"Your history will appear here once you start using the app."},"no-files":{icon:"folder-open",library:"fontawesome",heading:"Folder is Empty",message:'Drag and drop files here to upload or click "New File".'},paywall:{icon:"crown",library:"fontawesome",heading:"Premium Feature",message:"Unlock this and 50+ other features with a Pro subscription."},"no-search":{icon:"search-minus",library:"fontawesome",heading:"No Results Matching Filters",message:"Try adjusting your search terms or filters to find what you need."},empty:{icon:"folder-open",library:"fontawesome",heading:"Nothing Here Yet",message:"Get started by adding your first item."},"coming-soon":{icon:"rocket",library:"fontawesome",heading:"Coming Soon",message:"This feature is under development and will be available soon."},maintenance:{icon:"tools",library:"fontawesome",heading:"Under Maintenance",message:"We are currently performing maintenance. Please check back later."},custom:{icon:"info-circle",library:"fontawesome",heading:"Empty State",message:"No content available."}};return t[this.type]||t.custom}renderIcon(){const t=this.getDefaultContent(),e=this.icon||t.icon;if(this.image)return i("div",{class:"empty-state-image"},i("img",{src:this.image,alt:this.imageAlt}));if(this.illustration){if(this.illustration.startsWith("http")||this.illustration.startsWith("/")||this.illustration.includes("."))return i("div",{class:"empty-state-illustration"},i("img",{src:this.illustration,alt:this.imageAlt}));const a={"no-data":i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg"},i("rect",{x:"40",y:"40",width:"120",height:"80",rx:"8",fill:"currentColor","fill-opacity":"0.1"}),i("path",{d:"M40 60h120M70 80h60M70 100h30",stroke:"currentColor","stroke-width":"2","stroke-opacity":"0.2","stroke-linecap":"round"}),i("circle",{cx:"100",cy:"80",r:"20",fill:"currentColor","fill-opacity":"0.05"})),error:i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg illust-error"},i("circle",{cx:"100",cy:"80",r:"50",fill:"currentColor","fill-opacity":"0.1"}),i("path",{d:"M100 50v40M100 105v5",stroke:"currentColor","stroke-width":"6","stroke-linecap":"round"}),i("path",{d:"M60 120l80-80",stroke:"currentColor","stroke-width":"2","stroke-opacity":"0.3","stroke-dasharray":"5 5"})),"no-results":i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg"},i("circle",{cx:"90",cy:"70",r:"30",stroke:"currentColor","stroke-width":"3","stroke-opacity":"0.2"}),i("path",{d:"M115 95l30 30",stroke:"currentColor","stroke-width":"3","stroke-opacity":"0.2","stroke-linecap":"round"}),i("rect",{x:"40",y:"110",width:"120",height:"4",rx:"2",fill:"currentColor","fill-opacity":"0.1"})),offline:i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg"},i("path",{d:"M50 80a70 70 0 0 1 100 0M70 100a40 40 0 0 1 60 0M100 120h.01",stroke:"currentColor","stroke-width":"3","stroke-opacity":"0.2","stroke-linecap":"round"}),i("line",{x1:"60",y1:"50",x2:"140",y2:"130",stroke:"currentColor","stroke-width":"2","stroke-opacity":"0.5"}))};return i("div",{class:"empty-state-illustration illustration-"+this.illustration},a[this.illustration]||i("div",{class:"illustration-placeholder"},i("ui-icon",{name:e,library:t.library||"fontawesome",size:"48px"}),i("div",{class:"illustration-glow"})))}return i("div",{class:"empty-state-icon"},e?i("slot",{name:"icon"},i("ui-icon",{name:e,library:t.library||"fontawesome",size:this.iconSize,color:this.iconColor||"currentColor"})):i("slot",{name:"icon"}))}renderActions(){const t=this.parseActions(),e=this.primaryAction||this.secondaryAction,a=t.length>0;return e||a?i("div",{class:"empty-state-actions"},this.showSearch&&i("div",{class:"empty-state-search"},i("ui-icon",{name:"search",library:"lucide",size:"16px"}),i("ui-input",{placeholder:this.searchPlaceholder,value:this.searchValue,onInput:t=>this.handleSearchChange(t)})),this.retryDelay>0&&this.currentRetryCount>0&&i("div",{class:"empty-state-timer"},i("span",{class:"timer-text"},this.retryLabel.replace("{n}",""+this.currentRetryCount)),i("div",{class:"timer-progress"},i("div",{class:"timer-progress-bar",style:{width:this.currentRetryCount/this.retryDelay*100+"%"}}))),e&&i("div",{class:"simple-actions"},this.primaryAction&&i("ui-button",{variant:"primary",loading:"primary"===this.loadingAction,disabled:"primary"===this.loadingAction,onClick:()=>this.handlePrimaryAction(),icon:this.primaryActionIcon,iconLibrary:"fontawesome",label:this.primaryAction}),this.secondaryAction&&i("ui-button",{variant:"secondary",loading:"secondary"===this.loadingAction,disabled:"secondary"===this.loadingAction,onClick:()=>this.handleSecondaryAction(),icon:this.secondaryActionIcon?.replace(/^fa[sb]? fa-/,""),iconLibrary:"fontawesome",label:this.secondaryAction})),a&&i("div",{class:"complex-actions"},t.map((t=>i("ui-button",{variant:t.variant||"secondary",loading:this.loadingAction===t.value||this.loadingAction===t.label,disabled:this.loadingAction===t.value||this.loadingAction===t.label,onClick:()=>this.handleActionClick(t),icon:t.icon?.replace(/^fa[sb]? fa-/,""),iconLibrary:"fontawesome",label:t.label})))),i("slot",{name:"actions"})):null}renderItems(){const t=this.parseItems();return 0===t.length?null:i("div",{class:"empty-state-items"},this.itemsTitle&&i("h4",{class:"items-title"},this.itemsTitle),i("ul",{class:"items-list"},t.map((t=>i("li",{class:"item",onClick:()=>this.handleItemClick(t)},t.icon&&i("ui-icon",{name:t.icon,library:"fontawesome",size:"14px"}),i("span",null,t.label))))))}renderBackButton(){return this.showBackButton?i("div",{class:"empty-state-back"},i("ui-button",{variant:"ghost",onClick:()=>this.handleBackClick(),icon:"arrow-left",iconLibrary:"fontawesome",label:this.backButtonLabel,size:"sm"})):null}render(){const t=this.getDefaultContent(),e=this.heading||t.heading,a=this.message||t.message,r={"empty-state-container":!0,["variant-"+this.variant]:!0,["size-"+this.size]:!0,["align-"+this.align]:!0,["type-"+this.type]:!0,rounded:this.rounded,elevated:this.elevated,"full-height":this.fullHeight,animated:this.animated,compact:this.compact,"confetti-active":this.confetti,...this.customClass?{[this.customClass]:!0}:{}};return i(o,{key:"0f7a224ca36c6e2fcda778b134ed8d8d4396d9b6"},i("div",{key:"6ac5efd99135e6484d84139250e84e8e22b7fedd",class:r,style:{padding:this.padding||void 0,maxWidth:this.maxWidth||void 0}},this.renderBackButton(),i("div",{key:"c8ab7670d312a8ea4e5e69b2331db1b6374476c4",class:"empty-state-content"},this.renderIcon(),i("slot",{key:"11d5618957f52edc36c6db9370b630bf02ef58fc",name:"heading"},e&&i("h2",{key:"786051e59375b5e04cad426320fc768a0622cf82",class:"empty-state-title"},e)),i("slot",{key:"11a7eb49b8e3eb457942125ad1512bfaf062228b",name:"message"},a&&i("p",{key:"7c74c4c3721f562ae616ee1992ab0782f81f6b3d",class:"empty-state-message"},a)),this.description&&i("p",{key:"a49d0e45e660f30a3af67c6db480cf2ce2a5717e",class:"empty-state-description"},this.description),i("slot",{key:"31d8ea03a88a1032c02fa6ae1bb511d1a239cd62",name:"custom-content"}),this.renderItems(),this.renderActions(),i("slot",{key:"20d487b415fe17ba94746fafd2bbf97dfa033b0d",name:"footer"}))))}static get watchers(){return{retryDelay:[{onRetryDelayChange:0}]}}static get style(){return'@charset "UTF-8";.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%}.empty-state-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;box-sizing:border-box}.empty-state-container.full-height{min-height:100vh}.empty-state-container.variant-default{background:transparent}.empty-state-container.variant-outlined{border:2px dashed var(--border-strong, #d1d5db);border-radius:12px}.empty-state-container.variant-filled{background:var(--bg-primary, #f9fafb);border-radius:12px}.empty-state-container.variant-minimal{padding:24px}.empty-state-container.variant-glass{background:rgba(var(--ui-color-surface-rgb, 255, 255, 255), 0.4);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(var(--ui-color-surface-rgb, 255, 255, 255), 0.3);border-radius:20px;box-shadow:0 12px 40px rgba(0, 0, 0, 0.1)}.empty-state-container.variant-glass .empty-state-title{color:var(--ui-color-text, var(--text-primary, #111827))}.empty-state-container.variant-glass .empty-state-title{color:var(--text-primary, #1a1a1a);text-shadow:0 1px 2px rgba(255, 255, 255, 0.5)}.empty-state-container.rounded{border-radius:16px}.empty-state-container.elevated{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)}.empty-state-container.compact{padding:16px}.empty-state-container.compact .empty-state-icon{margin-bottom:12px}.empty-state-container.compact .empty-state-title{font-size:1.1rem;margin-bottom:4px}.empty-state-container.compact .empty-state-message{font-size:0.85rem;margin-bottom:16px}.empty-state-container.compact .empty-state-actions{margin-bottom:0;gap:8px}.empty-state-container.compact .action-button{padding:6px 12px;font-size:0.8rem}.empty-state-container.size-sm{padding:24px 16px}.empty-state-container.size-sm .empty-state-icon i{font-size:48px}.empty-state-container.size-sm .empty-state-title{font-size:1.25rem}.empty-state-container.size-sm .empty-state-message{font-size:0.875rem}.empty-state-container.size-md{padding:48px 24px}.empty-state-container.size-md .empty-state-icon i{font-size:64px}.empty-state-container.size-md .empty-state-title{font-size:1.5rem}.empty-state-container.size-md .empty-state-message{font-size:1rem}.empty-state-container.size-lg{padding:64px 32px}.empty-state-container.size-lg .empty-state-icon i{font-size:96px}.empty-state-container.size-lg .empty-state-title{font-size:2rem}.empty-state-container.size-lg .empty-state-message{font-size:1.125rem}.empty-state-container.align-left{align-items:flex-start;text-align:left}.empty-state-container.align-left .empty-state-content{align-items:flex-start}.empty-state-container.align-center{align-items:center;text-align:center}.empty-state-container.align-center .empty-state-content{align-items:center}.empty-state-container.align-right{align-items:flex-end;text-align:right}.empty-state-container.align-right .empty-state-content{align-items:flex-end}.empty-state-container.animated .empty-state-icon,.empty-state-container.animated .empty-state-image,.empty-state-container.animated .empty-state-illustration{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1), bob 4s ease-in-out infinite 0.8s}.empty-state-container.animated .empty-state-title{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both}.empty-state-container.animated .empty-state-message{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both}.empty-state-container.animated .empty-state-actions{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both}.empty-state-container:hover .empty-state-icon i,.empty-state-container:hover .empty-state-illustration ui-icon{transform:scale(1.05) translateY(-5px);filter:drop-shadow(0 10px 15px rgba(0, 0, 0, 0.1))}.empty-state-content{display:flex;flex-direction:column;align-items:center;max-width:100%;width:100%}.empty-state-icon{margin-bottom:24px}.empty-state-icon i{font-size:64px;color:var(--text-muted, #9ca3af);transition:color 0.3s ease}.type-error .empty-state-icon i{color:var(--color-danger, #ef4444)}.type-401 .empty-state-icon i{color:var(--color-primary, #8b5cf6);animation:fadeIn 1s ease-in-out infinite alternate}.type-403 .empty-state-icon i{color:var(--color-danger, #f43f5e)}.type-404 .empty-state-icon i{color:var(--color-warning, #f59e0b);animation:glitch 2.5s linear infinite alternate}.type-offline .empty-state-icon i{color:var(--text-muted, #64748b);animation:pulse-signal 2s ease-in-out infinite}.type-500 .empty-state-icon i{color:var(--color-danger, #ef4444);animation:glitch 0.5s linear infinite alternate;animation-delay:2s}.type-no-results .empty-state-icon i{color:var(--text-muted, #6b7280)}.type-coming-soon .empty-state-icon i{color:var(--color-success, #3dcd58)}.type-maintenance .empty-state-icon i{color:var(--color-warning, #f59e0b);animation:rotate-slow 6s linear infinite}.type-onboarding .empty-state-icon i{color:var(--color-primary, #10b981);animation:fadeInUp 1s ease-out}.type-accomplishment .empty-state-icon i,.type-success .empty-state-icon i{color:var(--color-success, #10b981);animation:popOut 1.5s ease-out infinite alternate}.type-paywall .empty-state-icon i{color:var(--color-warning-hover, #d97706);animation:bounce 2s infinite}.type-no-messages .empty-state-icon i{color:var(--color-danger, #ec4899)}.type-no-notifications .empty-state-icon i{color:var(--color-danger, #f43f5e)}.type-no-favorites .empty-state-icon i{color:var(--color-danger, #ef4444)}.type-429 .empty-state-icon i{color:var(--color-primary, #6366f1);animation:pulse-signal 2s infinite}.type-418 .empty-state-icon i{color:var(--color-primary, #7c3aed)}.empty-state-image{margin-bottom:24px;max-width:300px}.empty-state-image img{width:100%;height:auto;object-fit:contain;border-radius:8px}.size-lg .empty-state-image{max-width:400px}.empty-state-illustration{margin-bottom:24px;position:relative;display:flex;justify-content:center;align-items:center}.empty-state-illustration .illustration-placeholder{width:120px;height:120px;background:linear-gradient(135deg, rgba(var(--color-success-rgb, 61, 205, 88), 0.1), rgba(var(--color-primary-rgb, 59, 130, 246), 0.1));border-radius:30% 70% 70% 30%/30% 30% 70% 70%;display:flex;align-items:center;justify-content:center;animation:morph 8s ease-in-out infinite;position:relative;overflow:hidden}.empty-state-illustration .illustration-placeholder i{font-size:48px;color:var(--primary-color, var(--color-primary, #10b981));z-index:2}.empty-state-illustration .illustration-placeholder .illustration-glow{position:absolute;width:100%;height:100%;background:radial-gradient(circle, rgba(var(--color-success-rgb, 61, 205, 88), 0.2) 0%, transparent 70%);animation:pulse 4s ease-in-out infinite}.empty-state-illustration img{max-width:100%;height:auto;border-radius:12px;animation:float 6s ease-in-out infinite}.empty-state-title{margin:0 0 12px 0;font-size:1.5rem;font-weight:600;color:var(--empty-state-title-color, var(--text-primary, #111827));line-height:1.3}.empty-state-message{margin:0 0 32px 0;font-size:1rem;color:var(--empty-state-message-color, var(--text-muted, #6b7280));line-height:1.6;max-width:100%}.empty-state-actions{display:flex;flex-direction:column;gap:16px;width:100%;max-width:400px;margin-bottom:24px}.empty-state-actions .simple-actions,.empty-state-actions .complex-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.empty-state-search{display:flex;align-items:center;gap:12px;background:var(--ui-color-surface-soft, rgba(0, 0, 0, 0.03));border:1px solid var(--ui-color-border, var(--border-default, #e5e7eb));padding:8px 16px;border-radius:12px;margin-bottom:8px;width:100%;transition:all 0.2s}.empty-state-search:focus-within{border-color:var(--color-primary, #10b981);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);background:var(--bg-primary, #ffffff)}.empty-state-search ui-icon{color:var(--text-muted, #6b7280)}.empty-state-search input{border:none;background:transparent;outline:none;font-size:0.9375rem;flex:1;color:inherit}.empty-state-timer{margin-bottom:16px;width:100%;text-align:center}.empty-state-timer .timer-text{font-size:0.85rem;color:var(--text-muted, #6b7280);font-weight:500;display:block;margin-bottom:8px}.empty-state-timer .timer-progress{height:4px;background:var(--bg-secondary, #f3f4f6);border-radius:2px;overflow:hidden}.empty-state-timer .timer-progress-bar{height:100%;background:var(--color-primary, #10b981);transition:width 1s linear}.empty-state-description{margin:-16px 0 32px 0;font-size:0.875rem;color:var(--text-muted, #9ca3af);max-width:80%;line-height:1.5}.action-button{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border:none;border-radius:8px;font-size:0.9375rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;white-space:nowrap}.action-button i{font-size:1rem}.action-button.primary{background:var(--color-primary, #10b981);color:var(--text-standard, #ffffff)}.action-button.primary:hover{background:var(--color-primary-hover, #2563eb);transform:translateY(-1px);box-shadow:0 4px 12px rgba(var(--color-primary-rgb, 59, 130, 246), 0.3)}.action-button.primary:active{transform:translateY(0)}.action-button.primary.is-loading{opacity:0.8;cursor:wait;pointer-events:none}.action-button.primary.is-loading i{margin-right:8px}.action-button.secondary{background:var(--bg-secondary, #f3f4f6);color:var(--text-secondary, #374151);border:1px solid var(--border-default, #e5e7eb)}.action-button.secondary:hover{background:var(--bg-primary, #e5e7eb);border-color:var(--border-strong, #d1d5db)}.action-button.secondary:active{background:var(--bg-secondary, #d1d5db)}.action-button.text{background:transparent;color:var(--color-success, #3dcd58);padding:8px 16px}.action-button.text:hover{background:rgba(var(--color-success-rgb, 61, 205, 88), 0.1)}.action-button.text:active{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.15)}.size-sm .action-button{padding:8px 16px;font-size:0.875rem}.size-lg .action-button{padding:14px 28px;font-size:1rem}.empty-state-items{margin-bottom:24px;width:100%;max-width:400px}.items-title{margin:0 0 12px 0;font-size:0.875rem;font-weight:600;color:var(--text-muted, #6b7280);text-transform:uppercase;letter-spacing:0.05em}.items-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-primary, #f9fafb);border:1px solid var(--border-default, #e5e7eb);border-radius:8px;cursor:pointer;transition:all 0.2s ease}.item i{font-size:1rem;color:var(--text-muted, #6b7280);flex-shrink:0}.item span{font-size:0.9375rem;color:var(--text-secondary, #374151);flex:1}.item:hover{background:var(--bg-secondary, #f3f4f6);border-color:var(--border-strong, #d1d5db);transform:translateX(4px)}.item:active{background:var(--bg-primary, #e5e7eb)}.empty-state-back{align-self:flex-start;margin-bottom:24px}.back-button{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:transparent;border:none;border-radius:6px;color:var(--text-muted, #6b7280);font-size:0.9375rem;cursor:pointer;transition:all 0.2s ease}.back-button i{font-size:0.875rem}.back-button:hover{background:var(--bg-secondary, #f3f4f6);color:var(--text-secondary, #374151)}.back-button:active{background:var(--bg-primary, #e5e7eb)}@keyframes fadeInUp{from{opacity:0;transform:translateY(40px) scale(0.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes glitch{0%{transform:translate(0)}2%{transform:translate(-2px, 1.5px)}4%{transform:translate(-2px, -1.5px)}6%{transform:translate(2px, 1.5px)}8%{transform:translate(2px, -1.5px)}10%{transform:translate(0)}100%{transform:translate(0)}}@keyframes pulse-signal{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(0.92)}}@keyframes rotate-slow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes morph{0%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}50%{border-radius:50% 50% 20% 80%/25% 80% 20% 75%}100%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse{0%,100%{transform:scale(1);opacity:0.5}50%{transform:scale(1.2);opacity:0.8}}.confetti-active{position:relative;overflow:hidden}.confetti-active::before,.confetti-active::after{content:"🎉";position:absolute;font-size:2rem;animation:popOut 1s ease-out forwards;pointer-events:none;z-index:10}.confetti-active::before{left:10%;top:20%;animation-delay:0.1s}.confetti-active::after{right:10%;top:30%;animation-delay:0.3s}@keyframes popOut{0%{transform:scale(0) rotate(0deg);opacity:0}50%{transform:scale(1.5) rotate(15deg);opacity:1}100%{transform:scale(1.2) rotate(0deg);opacity:0;transform:translateY(-50px)}}::slotted([slot=custom-content]){margin:16px 0}::slotted([slot=footer]){margin-top:24px}@media (max-width: 640px){.empty-state-container{padding:32px 16px}.empty-state-container.size-lg{padding:48px 20px}.empty-state-icon i{font-size:48px !important}.empty-state-image{max-width:200px !important}.empty-state-title{font-size:1.25rem !important}.empty-state-message{font-size:0.875rem !important}.action-button{width:100%;justify-content:center}.simple-actions,.complex-actions{flex-direction:column;width:100%}}'}},[769,"ui-empty-state",{heading:[1],message:[1],type:[1],icon:[1],image:[1],imageAlt:[1,"image-alt"],iconColor:[1,"icon-color"],iconSize:[1,"icon-size"],variant:[1],size:[1],align:[1],rounded:[4],elevated:[4],fullHeight:[4,"full-height"],padding:[1],maxWidth:[1,"max-width"],compact:[4],loadingAction:[1,"loading-action"],illustration:[1],confetti:[4],description:[1],showSearch:[4,"show-search"],searchPlaceholder:[1,"search-placeholder"],searchValue:[1,"search-value"],retryDelay:[2,"retry-delay"],retryLabel:[1,"retry-label"],actions:[1],primaryAction:[1,"primary-action"],primaryActionIcon:[1,"primary-action-icon"],secondaryAction:[1,"secondary-action"],secondaryActionIcon:[1,"secondary-action-icon"],items:[1],itemsTitle:[1,"items-title"],showBackButton:[4,"show-back-button"],backButtonLabel:[1,"back-button-label"],animated:[4],customClass:[1,"custom-class"],currentRetryCount:[32]},void 0,{retryDelay:[{onRetryDelayChange:0}]}]),d=p,h=function(){"undefined"!=typeof customElements&&["ui-empty-state","ui-badge","ui-button","ui-icon","ui-input","ui-loader"].forEach((t=>{switch(t){case"ui-empty-state":customElements.get(r(t))||customElements.define(r(t),p);break;case"ui-badge":customElements.get(r(t))||s();break;case"ui-button":customElements.get(r(t))||n();break;case"ui-icon":customElements.get(r(t))||c();break;case"ui-input":customElements.get(r(t))||l();break;case"ui-loader":customElements.get(r(t))||m()}}))};export{d as UiEmptyState,h as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as e,createEvent as a,h as i,Host as o,transformTag as r}from"@stencil/core/internal/client";import{d as n}from"./badge.js";import{d as s}from"./button.js";import{d as c}from"./icon.js";import{d as l}from"./input.js";import{d as m}from"./loader.js";const p=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.actionClick=a(this,"actionClick",7),this.backClick=a(this,"backClick",7),this.itemClick=a(this,"itemClick",7),this.searchChange=a(this,"searchChange",7),this.retry=a(this,"retry",7)}heading;message;type="no-data";icon;image;imageAlt="Empty state";iconColor;iconSize="64px";variant="default";size="md";align="center";rounded=!1;elevated=!1;fullHeight=!1;padding;maxWidth="500px";compact=!1;loadingAction;illustration;confetti=!1;description;showSearch=!1;searchPlaceholder="Try another search...";searchValue="";retryDelay=0;retryLabel="Retrying in {n}s...";actions="[]";primaryAction;primaryActionIcon;secondaryAction;secondaryActionIcon;items="[]";itemsTitle;showBackButton=!1;backButtonLabel="Go Back";animated=!0;customClass;actionClick;backClick;itemClick;searchChange;retry;parseActions(){if("string"==typeof this.actions)try{return JSON.parse(this.actions)}catch{return[]}return this.actions||[]}parseItems(){if("string"==typeof this.items)try{return JSON.parse(this.items)}catch{return[]}return this.items||[]}handleActionClick(t){this.actionClick.emit({action:t.label,value:t.value})}handlePrimaryAction(){this.primaryAction&&this.actionClick.emit({action:"primary",value:this.primaryAction})}handleSecondaryAction(){this.secondaryAction&&this.actionClick.emit({action:"secondary",value:this.secondaryAction})}handleBackClick(){this.backClick.emit()}handleItemClick(t){this.itemClick.emit({item:t})}handleSearchChange(t){this.searchChange.emit(t.target.value)}currentRetryCount=0;retryTimer;onRetryDelayChange(){this.retryDelay>0?this.startRetryTimer():this.retryTimer&&clearInterval(this.retryTimer)}componentWillLoad(){this.retryDelay>0&&this.startRetryTimer()}startRetryTimer(){this.currentRetryCount=this.retryDelay,this.retryTimer&&clearInterval(this.retryTimer),this.retryTimer=setInterval((()=>{this.currentRetryCount--,this.currentRetryCount<=0&&(clearInterval(this.retryTimer),this.retry.emit())}),1e3)}disconnectedCallback(){this.retryTimer&&clearInterval(this.retryTimer)}getDefaultContent(){const t={"no-data":{icon:"inbox",library:"fontawesome",heading:"No Data Available",message:"There is no data to display at the moment."},"no-results":{icon:"search",library:"fontawesome",heading:"No Results Found",message:"We couldn't find any results matching your search."},error:{icon:"exclamation-triangle",library:"fontawesome",heading:"Something Went Wrong",message:"An error occurred while loading the data. Please try again."},404:{icon:"frown",library:"fontawesome",heading:"404 - Not Found",message:"The resource you are looking for has vanished into the void."},401:{icon:"user-lock",library:"fontawesome",heading:"401 - Unauthorized",message:"Please log in to access this protected area."},403:{icon:"ban",library:"fontawesome",heading:"403 - Forbidden",message:"You do not have the required permissions to view this content."},405:{icon:"hand-paper",library:"fontawesome",heading:"405 - Method Not Allowed",message:"This action is not supported for this resource."},410:{icon:"trash-alt",library:"fontawesome",heading:"410 - Gone",message:"This resource has been permanently removed."},418:{icon:"coffee",library:"fontawesome",heading:"418 - I'm a Teapot",message:"I refuse to brew coffee because I am, short and stout, a teapot."},429:{icon:"hourglass-half",library:"fontawesome",heading:"429 - Too Many Requests",message:"You've sent too many requests. Please take a breath and try again later."},500:{icon:"server",library:"fontawesome",heading:"500 - Server Error",message:"Something went wrong on our end. Our best minds are on it."},503:{icon:"plug",library:"fontawesome",heading:"503 - Service Unavailable",message:"The server is temporarily down for maintenance or overloaded."},offline:{icon:"wifi",library:"fontawesome",heading:"No Internet Connection",message:"Check your network cables, modem, and router or try reconnecting."},onboarding:{icon:"paper-plane",library:"fontawesome",heading:"Welcome Abroad!",message:"Get started by creating your first project or inviting teammates."},accomplishment:{icon:"trophy",library:"fontawesome",heading:"You're All Caught Up!",message:"Great job! You've completed everything on your list for today."},success:{icon:"check-circle",library:"fontawesome",heading:"Mission Accomplished",message:"Action completed successfully. Everything looks perfect."},"no-messages":{icon:"comment-slash",library:"fontawesome",heading:"No Messages Yet",message:"It's quiet here. Start a conversation to see messages appear."},"no-notifications":{icon:"bell-slash",library:"fontawesome",heading:"No New Notifications",message:"We'll let you know when something important happens."},"no-favorites":{icon:"heart-broken",library:"fontawesome",heading:"No Favorites Saved",message:"Tap the heart icon on items you love to save them here."},"no-tasks":{icon:"clipboard-check",library:"fontawesome",heading:"No Tasks Found",message:"Your list is empty. Add a new task to stay organized."},"no-history":{icon:"history",library:"fontawesome",heading:"No Recent Activity",message:"Your history will appear here once you start using the app."},"no-files":{icon:"folder-open",library:"fontawesome",heading:"Folder is Empty",message:'Drag and drop files here to upload or click "New File".'},paywall:{icon:"crown",library:"fontawesome",heading:"Premium Feature",message:"Unlock this and 50+ other features with a Pro subscription."},"no-search":{icon:"search-minus",library:"fontawesome",heading:"No Results Matching Filters",message:"Try adjusting your search terms or filters to find what you need."},empty:{icon:"folder-open",library:"fontawesome",heading:"Nothing Here Yet",message:"Get started by adding your first item."},"coming-soon":{icon:"rocket",library:"fontawesome",heading:"Coming Soon",message:"This feature is under development and will be available soon."},maintenance:{icon:"tools",library:"fontawesome",heading:"Under Maintenance",message:"We are currently performing maintenance. Please check back later."},custom:{icon:"info-circle",library:"fontawesome",heading:"Empty State",message:"No content available."}};return t[this.type]||t.custom}renderIcon(){const t=this.getDefaultContent(),e=this.icon||t.icon;if(this.image)return i("div",{class:"empty-state-image"},i("img",{src:this.image,alt:this.imageAlt}));if(this.illustration){if(this.illustration.startsWith("http")||this.illustration.startsWith("/")||this.illustration.includes("."))return i("div",{class:"empty-state-illustration"},i("img",{src:this.illustration,alt:this.imageAlt}));const a={"no-data":i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg"},i("rect",{x:"40",y:"40",width:"120",height:"80",rx:"8",fill:"currentColor","fill-opacity":"0.1"}),i("path",{d:"M40 60h120M70 80h60M70 100h30",stroke:"currentColor","stroke-width":"2","stroke-opacity":"0.2","stroke-linecap":"round"}),i("circle",{cx:"100",cy:"80",r:"20",fill:"currentColor","fill-opacity":"0.05"})),error:i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg illust-error"},i("circle",{cx:"100",cy:"80",r:"50",fill:"currentColor","fill-opacity":"0.1"}),i("path",{d:"M100 50v40M100 105v5",stroke:"currentColor","stroke-width":"6","stroke-linecap":"round"}),i("path",{d:"M60 120l80-80",stroke:"currentColor","stroke-width":"2","stroke-opacity":"0.3","stroke-dasharray":"5 5"})),"no-results":i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg"},i("circle",{cx:"90",cy:"70",r:"30",stroke:"currentColor","stroke-width":"3","stroke-opacity":"0.2"}),i("path",{d:"M115 95l30 30",stroke:"currentColor","stroke-width":"3","stroke-opacity":"0.2","stroke-linecap":"round"}),i("rect",{x:"40",y:"110",width:"120",height:"4",rx:"2",fill:"currentColor","fill-opacity":"0.1"})),offline:i("svg",{viewBox:"0 0 200 160",fill:"none",class:"illust-svg"},i("path",{d:"M50 80a70 70 0 0 1 100 0M70 100a40 40 0 0 1 60 0M100 120h.01",stroke:"currentColor","stroke-width":"3","stroke-opacity":"0.2","stroke-linecap":"round"}),i("line",{x1:"60",y1:"50",x2:"140",y2:"130",stroke:"currentColor","stroke-width":"2","stroke-opacity":"0.5"}))};return i("div",{class:"empty-state-illustration illustration-"+this.illustration},a[this.illustration]||i("div",{class:"illustration-placeholder"},i("ui-icon",{name:e,library:t.library||"fontawesome",size:"48px"}),i("div",{class:"illustration-glow"})))}return i("div",{class:"empty-state-icon"},e?i("slot",{name:"icon"},i("ui-icon",{name:e,library:t.library||"fontawesome",size:this.iconSize,color:this.iconColor||"currentColor"})):i("slot",{name:"icon"}))}renderActions(){const t=this.parseActions(),e=this.primaryAction||this.secondaryAction,a=t.length>0;return e||a?i("div",{class:"empty-state-actions"},this.showSearch&&i("div",{class:"empty-state-search"},i("ui-icon",{name:"search",library:"lucide",size:"16px"}),i("ui-input",{placeholder:this.searchPlaceholder,value:this.searchValue,onInput:t=>this.handleSearchChange(t)})),this.retryDelay>0&&this.currentRetryCount>0&&i("div",{class:"empty-state-timer"},i("span",{class:"timer-text"},this.retryLabel.replace("{n}",""+this.currentRetryCount)),i("div",{class:"timer-progress"},i("div",{class:"timer-progress-bar",style:{width:this.currentRetryCount/this.retryDelay*100+"%"}}))),e&&i("div",{class:"simple-actions"},this.primaryAction&&i("ui-button",{variant:"primary",loading:"primary"===this.loadingAction,disabled:"primary"===this.loadingAction,onClick:()=>this.handlePrimaryAction(),icon:this.primaryActionIcon,iconLibrary:"fontawesome",label:this.primaryAction}),this.secondaryAction&&i("ui-button",{variant:"secondary",loading:"secondary"===this.loadingAction,disabled:"secondary"===this.loadingAction,onClick:()=>this.handleSecondaryAction(),icon:this.secondaryActionIcon?.replace(/^fa[sb]? fa-/,""),iconLibrary:"fontawesome",label:this.secondaryAction})),a&&i("div",{class:"complex-actions"},t.map((t=>i("ui-button",{variant:t.variant||"secondary",loading:this.loadingAction===t.value||this.loadingAction===t.label,disabled:this.loadingAction===t.value||this.loadingAction===t.label,onClick:()=>this.handleActionClick(t),icon:t.icon?.replace(/^fa[sb]? fa-/,""),iconLibrary:"fontawesome",label:t.label})))),i("slot",{name:"actions"})):null}renderItems(){const t=this.parseItems();return 0===t.length?null:i("div",{class:"empty-state-items"},this.itemsTitle&&i("h4",{class:"items-title"},this.itemsTitle),i("ul",{class:"items-list"},t.map((t=>i("li",{class:"item",onClick:()=>this.handleItemClick(t)},t.icon&&i("ui-icon",{name:t.icon,library:"fontawesome",size:"14px"}),i("span",null,t.label))))))}renderBackButton(){return this.showBackButton?i("div",{class:"empty-state-back"},i("ui-button",{variant:"ghost",onClick:()=>this.handleBackClick(),icon:"arrow-left",iconLibrary:"fontawesome",label:this.backButtonLabel,size:"sm"})):null}render(){const t=this.getDefaultContent(),e=this.heading||t.heading,a=this.message||t.message,r={"empty-state-container":!0,["variant-"+this.variant]:!0,["size-"+this.size]:!0,["align-"+this.align]:!0,["type-"+this.type]:!0,rounded:this.rounded,elevated:this.elevated,"full-height":this.fullHeight,animated:this.animated,compact:this.compact,"confetti-active":this.confetti,...this.customClass?{[this.customClass]:!0}:{}};return i(o,{key:"b4aba509d0fe262be1254d1c1f06095408711739"},i("div",{key:"747641713fd40e4ddadfb5fcfb2e2df24bd9e0b0",class:r,style:{padding:this.padding||void 0,maxWidth:this.maxWidth||void 0}},this.renderBackButton(),i("div",{key:"566cc5184652308e834deb2b1866247c979fa4f7",class:"empty-state-content"},this.renderIcon(),i("slot",{key:"35a6d4f00def6f8549084ad484ac212097256679",name:"heading"},e&&i("h2",{key:"a7b7aafd7a02a02042540d52bd2d3e2eecbdfcf4",class:"empty-state-title"},e)),i("slot",{key:"a53e7b77686f392eaf0d9eb2569fc896f9e5b216",name:"message"},a&&i("p",{key:"1f84852f31494063d0bcdb9eb3e025ffda729e0a",class:"empty-state-message"},a)),this.description&&i("p",{key:"96ef197c70889b83be57c26f7e174fcceba5d44c",class:"empty-state-description"},this.description),i("slot",{key:"2707adbdaaca80e83c6318c1bab0b9fdaaa5f4cd",name:"custom-content"}),this.renderItems(),this.renderActions(),i("slot",{key:"fb8dfa1d372bffb367967f13e711954334ec304a",name:"footer"}))))}static get watchers(){return{retryDelay:[{onRetryDelayChange:0}]}}static get style(){return'@charset "UTF-8";.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%}.empty-state-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;box-sizing:border-box}.empty-state-container.full-height{min-height:100vh}.empty-state-container.variant-default{background:transparent}.empty-state-container.variant-outlined{border:2px dashed var(--border-strong, #d1d5db);border-radius:12px}.empty-state-container.variant-filled{background:var(--bg-primary, #f9fafb);border-radius:12px}.empty-state-container.variant-minimal{padding:24px}.empty-state-container.variant-glass{background:rgba(var(--ui-color-surface-rgb, 255, 255, 255), 0.4);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(var(--ui-color-surface-rgb, 255, 255, 255), 0.3);border-radius:20px;box-shadow:0 12px 40px rgba(0, 0, 0, 0.1)}.empty-state-container.variant-glass .empty-state-title{color:var(--ui-color-text, var(--text-primary, #111827))}.empty-state-container.variant-glass .empty-state-title{color:var(--text-primary, #1a1a1a);text-shadow:0 1px 2px rgba(255, 255, 255, 0.5)}.empty-state-container.rounded{border-radius:16px}.empty-state-container.elevated{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)}.empty-state-container.compact{padding:16px}.empty-state-container.compact .empty-state-icon{margin-bottom:12px}.empty-state-container.compact .empty-state-title{font-size:1.1rem;margin-bottom:4px}.empty-state-container.compact .empty-state-message{font-size:0.85rem;margin-bottom:16px}.empty-state-container.compact .empty-state-actions{margin-bottom:0;gap:8px}.empty-state-container.compact .action-button{padding:6px 12px;font-size:0.8rem}.empty-state-container.size-sm{padding:24px 16px}.empty-state-container.size-sm .empty-state-icon i{font-size:48px}.empty-state-container.size-sm .empty-state-title{font-size:1.25rem}.empty-state-container.size-sm .empty-state-message{font-size:0.875rem}.empty-state-container.size-md{padding:48px 24px}.empty-state-container.size-md .empty-state-icon i{font-size:64px}.empty-state-container.size-md .empty-state-title{font-size:1.5rem}.empty-state-container.size-md .empty-state-message{font-size:1rem}.empty-state-container.size-lg{padding:64px 32px}.empty-state-container.size-lg .empty-state-icon i{font-size:96px}.empty-state-container.size-lg .empty-state-title{font-size:2rem}.empty-state-container.size-lg .empty-state-message{font-size:1.125rem}.empty-state-container.align-left{align-items:flex-start;text-align:left}.empty-state-container.align-left .empty-state-content{align-items:flex-start}.empty-state-container.align-center{align-items:center;text-align:center}.empty-state-container.align-center .empty-state-content{align-items:center}.empty-state-container.align-right{align-items:flex-end;text-align:right}.empty-state-container.align-right .empty-state-content{align-items:flex-end}.empty-state-container.animated .empty-state-icon,.empty-state-container.animated .empty-state-image,.empty-state-container.animated .empty-state-illustration{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1), bob 4s ease-in-out infinite 0.8s}.empty-state-container.animated .empty-state-title{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both}.empty-state-container.animated .empty-state-message{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both}.empty-state-container.animated .empty-state-actions{animation:fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both}.empty-state-container:hover .empty-state-icon i,.empty-state-container:hover .empty-state-illustration ui-icon{transform:scale(1.05) translateY(-5px);filter:drop-shadow(0 10px 15px rgba(0, 0, 0, 0.1))}.empty-state-content{display:flex;flex-direction:column;align-items:center;max-width:100%;width:100%}.empty-state-icon{margin-bottom:24px}.empty-state-icon i{font-size:64px;color:var(--text-muted, #9ca3af);transition:color 0.3s ease}.type-error .empty-state-icon i{color:var(--color-danger, #ef4444)}.type-401 .empty-state-icon i{color:var(--color-primary, #8b5cf6);animation:fadeIn 1s ease-in-out infinite alternate}.type-403 .empty-state-icon i{color:var(--color-danger, #f43f5e)}.type-404 .empty-state-icon i{color:var(--color-warning, #f59e0b);animation:glitch 2.5s linear infinite alternate}.type-offline .empty-state-icon i{color:var(--text-muted, #64748b);animation:pulse-signal 2s ease-in-out infinite}.type-500 .empty-state-icon i{color:var(--color-danger, #ef4444);animation:glitch 0.5s linear infinite alternate;animation-delay:2s}.type-no-results .empty-state-icon i{color:var(--text-muted, #6b7280)}.type-coming-soon .empty-state-icon i{color:var(--color-success, #3dcd58)}.type-maintenance .empty-state-icon i{color:var(--color-warning, #f59e0b);animation:rotate-slow 6s linear infinite}.type-onboarding .empty-state-icon i{color:var(--color-primary, #10b981);animation:fadeInUp 1s ease-out}.type-accomplishment .empty-state-icon i,.type-success .empty-state-icon i{color:var(--color-success, #10b981);animation:popOut 1.5s ease-out infinite alternate}.type-paywall .empty-state-icon i{color:var(--color-warning-hover, #d97706);animation:bounce 2s infinite}.type-no-messages .empty-state-icon i{color:var(--color-danger, #ec4899)}.type-no-notifications .empty-state-icon i{color:var(--color-danger, #f43f5e)}.type-no-favorites .empty-state-icon i{color:var(--color-danger, #ef4444)}.type-429 .empty-state-icon i{color:var(--color-primary, #6366f1);animation:pulse-signal 2s infinite}.type-418 .empty-state-icon i{color:var(--color-primary, #7c3aed)}.empty-state-image{margin-bottom:24px;max-width:300px}.empty-state-image img{width:100%;height:auto;object-fit:contain;border-radius:8px}.size-lg .empty-state-image{max-width:400px}.empty-state-illustration{margin-bottom:24px;position:relative;display:flex;justify-content:center;align-items:center}.empty-state-illustration .illustration-placeholder{width:120px;height:120px;background:linear-gradient(135deg, rgba(var(--color-success-rgb, 61, 205, 88), 0.1), rgba(var(--color-primary-rgb, 59, 130, 246), 0.1));border-radius:30% 70% 70% 30%/30% 30% 70% 70%;display:flex;align-items:center;justify-content:center;animation:morph 8s ease-in-out infinite;position:relative;overflow:hidden}.empty-state-illustration .illustration-placeholder i{font-size:48px;color:var(--primary-color, var(--color-primary, #10b981));z-index:2}.empty-state-illustration .illustration-placeholder .illustration-glow{position:absolute;width:100%;height:100%;background:radial-gradient(circle, rgba(var(--color-success-rgb, 61, 205, 88), 0.2) 0%, transparent 70%);animation:pulse 4s ease-in-out infinite}.empty-state-illustration img{max-width:100%;height:auto;border-radius:12px;animation:float 6s ease-in-out infinite}.empty-state-title{margin:0 0 12px 0;font-size:1.5rem;font-weight:600;color:var(--empty-state-title-color, var(--text-primary, #111827));line-height:1.3}.empty-state-message{margin:0 0 32px 0;font-size:1rem;color:var(--empty-state-message-color, var(--text-muted, #6b7280));line-height:1.6;max-width:100%}.empty-state-actions{display:flex;flex-direction:column;gap:16px;width:100%;max-width:400px;margin-bottom:24px}.empty-state-actions .simple-actions,.empty-state-actions .complex-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.empty-state-search{display:flex;align-items:center;gap:12px;background:var(--ui-color-surface-soft, rgba(0, 0, 0, 0.03));border:1px solid var(--ui-color-border, var(--border-default, #e5e7eb));padding:8px 16px;border-radius:12px;margin-bottom:8px;width:100%;transition:all 0.2s}.empty-state-search:focus-within{border-color:var(--color-primary, #10b981);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);background:var(--bg-primary, #ffffff)}.empty-state-search ui-icon{color:var(--text-muted, #6b7280)}.empty-state-search input{border:none;background:transparent;outline:none;font-size:0.9375rem;flex:1;color:inherit}.empty-state-timer{margin-bottom:16px;width:100%;text-align:center}.empty-state-timer .timer-text{font-size:0.85rem;color:var(--text-muted, #6b7280);font-weight:500;display:block;margin-bottom:8px}.empty-state-timer .timer-progress{height:4px;background:var(--bg-secondary, #f3f4f6);border-radius:2px;overflow:hidden}.empty-state-timer .timer-progress-bar{height:100%;background:var(--color-primary, #10b981);transition:width 1s linear}.empty-state-description{margin:-16px 0 32px 0;font-size:0.875rem;color:var(--text-muted, #9ca3af);max-width:80%;line-height:1.5}.action-button{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border:none;border-radius:8px;font-size:0.9375rem;font-weight:500;cursor:pointer;transition:all 0.2s ease;white-space:nowrap}.action-button i{font-size:1rem}.action-button.primary{background:var(--color-primary, #10b981);color:var(--text-standard, #ffffff)}.action-button.primary:hover{background:var(--color-primary-hover, #2563eb);transform:translateY(-1px);box-shadow:0 4px 12px rgba(var(--color-primary-rgb, 59, 130, 246), 0.3)}.action-button.primary:active{transform:translateY(0)}.action-button.primary.is-loading{opacity:0.8;cursor:wait;pointer-events:none}.action-button.primary.is-loading i{margin-right:8px}.action-button.secondary{background:var(--bg-secondary, #f3f4f6);color:var(--text-secondary, #374151);border:1px solid var(--border-default, #e5e7eb)}.action-button.secondary:hover{background:var(--bg-primary, #e5e7eb);border-color:var(--border-strong, #d1d5db)}.action-button.secondary:active{background:var(--bg-secondary, #d1d5db)}.action-button.text{background:transparent;color:var(--color-success, #3dcd58);padding:8px 16px}.action-button.text:hover{background:rgba(var(--color-success-rgb, 61, 205, 88), 0.1)}.action-button.text:active{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.15)}.size-sm .action-button{padding:8px 16px;font-size:0.875rem}.size-lg .action-button{padding:14px 28px;font-size:1rem}.empty-state-items{margin-bottom:24px;width:100%;max-width:400px}.items-title{margin:0 0 12px 0;font-size:0.875rem;font-weight:600;color:var(--text-muted, #6b7280);text-transform:uppercase;letter-spacing:0.05em}.items-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-primary, #f9fafb);border:1px solid var(--border-default, #e5e7eb);border-radius:8px;cursor:pointer;transition:all 0.2s ease}.item i{font-size:1rem;color:var(--text-muted, #6b7280);flex-shrink:0}.item span{font-size:0.9375rem;color:var(--text-secondary, #374151);flex:1}.item:hover{background:var(--bg-secondary, #f3f4f6);border-color:var(--border-strong, #d1d5db);transform:translateX(4px)}.item:active{background:var(--bg-primary, #e5e7eb)}.empty-state-back{align-self:flex-start;margin-bottom:24px}.back-button{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:transparent;border:none;border-radius:6px;color:var(--text-muted, #6b7280);font-size:0.9375rem;cursor:pointer;transition:all 0.2s ease}.back-button i{font-size:0.875rem}.back-button:hover{background:var(--bg-secondary, #f3f4f6);color:var(--text-secondary, #374151)}.back-button:active{background:var(--bg-primary, #e5e7eb)}@keyframes fadeInUp{from{opacity:0;transform:translateY(40px) scale(0.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes glitch{0%{transform:translate(0)}2%{transform:translate(-2px, 1.5px)}4%{transform:translate(-2px, -1.5px)}6%{transform:translate(2px, 1.5px)}8%{transform:translate(2px, -1.5px)}10%{transform:translate(0)}100%{transform:translate(0)}}@keyframes pulse-signal{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(0.92)}}@keyframes rotate-slow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes morph{0%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}50%{border-radius:50% 50% 20% 80%/25% 80% 20% 75%}100%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse{0%,100%{transform:scale(1);opacity:0.5}50%{transform:scale(1.2);opacity:0.8}}.confetti-active{position:relative;overflow:hidden}.confetti-active::before,.confetti-active::after{content:"🎉";position:absolute;font-size:2rem;animation:popOut 1s ease-out forwards;pointer-events:none;z-index:10}.confetti-active::before{left:10%;top:20%;animation-delay:0.1s}.confetti-active::after{right:10%;top:30%;animation-delay:0.3s}@keyframes popOut{0%{transform:scale(0) rotate(0deg);opacity:0}50%{transform:scale(1.5) rotate(15deg);opacity:1}100%{transform:scale(1.2) rotate(0deg);opacity:0;transform:translateY(-50px)}}::slotted([slot=custom-content]){margin:16px 0}::slotted([slot=footer]){margin-top:24px}@media (max-width: 640px){.empty-state-container{padding:32px 16px}.empty-state-container.size-lg{padding:48px 20px}.empty-state-icon i{font-size:48px !important}.empty-state-image{max-width:200px !important}.empty-state-title{font-size:1.25rem !important}.empty-state-message{font-size:0.875rem !important}.action-button{width:100%;justify-content:center}.simple-actions,.complex-actions{flex-direction:column;width:100%}}'}},[769,"ui-empty-state",{heading:[1],message:[1],type:[1],icon:[1],image:[1],imageAlt:[1,"image-alt"],iconColor:[1,"icon-color"],iconSize:[1,"icon-size"],variant:[1],size:[1],align:[1],rounded:[4],elevated:[4],fullHeight:[4,"full-height"],padding:[1],maxWidth:[1,"max-width"],compact:[4],loadingAction:[1,"loading-action"],illustration:[1],confetti:[4],description:[1],showSearch:[4,"show-search"],searchPlaceholder:[1,"search-placeholder"],searchValue:[1,"search-value"],retryDelay:[2,"retry-delay"],retryLabel:[1,"retry-label"],actions:[1],primaryAction:[1,"primary-action"],primaryActionIcon:[1,"primary-action-icon"],secondaryAction:[1,"secondary-action"],secondaryActionIcon:[1,"secondary-action-icon"],items:[1],itemsTitle:[1,"items-title"],showBackButton:[4,"show-back-button"],backButtonLabel:[1,"back-button-label"],animated:[4],customClass:[1,"custom-class"],currentRetryCount:[32]},void 0,{retryDelay:[{onRetryDelayChange:0}]}]),d=p,h=function(){"undefined"!=typeof customElements&&["ui-empty-state","ui-badge","ui-button","ui-icon","ui-input","ui-loader"].forEach((t=>{switch(t){case"ui-empty-state":customElements.get(r(t))||customElements.define(r(t),p);break;case"ui-badge":customElements.get(r(t))||n();break;case"ui-button":customElements.get(r(t))||s();break;case"ui-icon":customElements.get(r(t))||c();break;case"ui-input":customElements.get(r(t))||l();break;case"ui-loader":customElements.get(r(t))||m()}}))};export{d as UiEmptyState,h as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as i,createEvent as e,h as a,Host as o,transformTag as s}from"@stencil/core/internal/client";import{d as r
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as i,createEvent as e,h as a,Host as o,transformTag as s}from"@stencil/core/internal/client";import{d as r}from"./badge.js";import{d as n}from"./button.js";import{d as c}from"./icon.js";import{d as l}from"./loader.js";const d=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.uiFabActionClick=e(this,"uiFabActionClick",7)}icon;label;tooltip;disabled=!1;loading=!1;value;uiFabActionClick;handleClick=t=>{if(this.disabled||this.loading)return t.stopPropagation(),void t.preventDefault();this.uiFabActionClick.emit({value:void 0!==this.value?this.value:this.label||this.icon})};render(){return a(o,{key:"54c62f80c138da459a191d66095f74ca208dd4be",class:{"is-disabled":this.disabled,"is-loading":this.loading}},this.label&&a("div",{key:"a5a06749f3368721f8f81a37f965509a29cc8cb2",class:"fab-item-label","aria-hidden":"true"},this.label),a("ui-button",{key:"03acbcd688a921458b0a524c4c9df0def0a9dabf",variant:"primary",shape:"circle",class:"fab-item-trigger",disabled:this.disabled||this.loading,loading:this.loading,onClick:this.handleClick,ariaLabel:this.tooltip||this.label||this.icon,title:this.tooltip,icon:this.icon,iconOnly:!0,size:"sm"},!this.icon&&a("slot",{key:"2c39c767a078482a292e0ab6ca394896f491a03c",name:"icon"})))}static get style(){return".sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:flex;align-items:center;position:relative}.fab-item-trigger{width:var(--ui-fab-action-size, 40px);height:var(--ui-fab-action-size, 40px);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);outline:none;z-index:2}.fab-item-trigger:hover{transform:scale(1.1)}.fab-item-trigger:active{transform:scale(0.95)}:host(.is-disabled) .fab-item-trigger{opacity:0.5;cursor:not-allowed;pointer-events:none}.fab-item-label{position:absolute;background:rgba(0, 0, 0, 0.8);color:var(--text-standard, #ffffff);padding:4px 10px;border-radius:6px;font-size:13px;font-weight:500;white-space:nowrap;pointer-events:none;box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);right:calc(100% + 12px);opacity:1;transition:opacity 0.2s}:host-context(ui-fab.pos-bottom-left) .fab-item-label,:host-context(ui-fab.pos-top-left) .fab-item-label{right:auto;left:calc(100% + 12px)}.spinner{width:20px;height:20px;animation:rotate 2s linear infinite}.spinner .spinner-circle{stroke-dasharray:1, 200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35px}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124px}}"}},[769,"ui-fab-item",{icon:[1],label:[1],tooltip:[1],disabled:[4],loading:[4],value:[8]}]),p=d,m=function(){"undefined"!=typeof customElements&&["ui-fab-item","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-fab-item":customElements.get(s(t))||customElements.define(s(t),d);break;case"ui-badge":customElements.get(s(t))||r();break;case"ui-button":customElements.get(s(t))||n();break;case"ui-icon":customElements.get(s(t))||c();break;case"ui-loader":customElements.get(s(t))||l()}}))};export{p as UiFabItem,m as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as i,createEvent as e,h as a,Host as s,transformTag as o}from"@stencil/core/internal/client";import{d as n,a as r}from"./badge.js";import{d as l}from"./icon.js";import{d}from"./loader.js";const h=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.uiFabClick=e(this,"uiFabClick",7),this.uiFabOpen=e(this,"uiFabOpen",7),this.uiFabClose=e(this,"uiFabClose",7),this.uiFabToggle=e(this,"uiFabToggle",7),this.uiFabActionClick=e(this,"uiFabActionClick",7)}get el(){return this}isExpanded=!1;defaultOpen=!1;position="bottom-right";direction="top";variant="primary";size="md";type="standard";icon;label;disabled=!1;loading=!1;toggle=!1;isDraggable=!1;hideOnScroll=!1;showOnScrollUp=!1;offsetX=24;offsetY=24;zIndex=1e3;expandOnHover=!1;expandOnClick=!0;closeOnAction=!0;backdrop=!1;backdropClose=!0;persistent=!1;animation="scale";panel=!1;panelTitle;panelWidth="320px";panelHeight;panelMaxHeight="480px";isDragging=!1;isHidden=!1;currentX=0;currentY=0;uiFabClick;uiFabOpen;uiFabClose;uiFabToggle;uiFabActionClick;dragStartX=0;dragStartY=0;lastScrollY=0;internalOpen=!1;componentWillLoad(){this.internalOpen=this.defaultOpen||this.isExpanded,this.currentX=this.offsetX,this.currentY=this.offsetY}componentDidLoad(){(this.hideOnScroll||this.showOnScrollUp)&&(this.lastScrollY=window.scrollY)}openChanged(t){this.internalOpen=t,t?(this.uiFabOpen.emit(),this.calculateRadial()):this.uiFabClose.emit()}async openFab(){this.isExpanded=!0}async closeFab(){this.isExpanded=!1}async toggleFab(){this.isExpanded=!this.internalOpen,this.uiFabToggle.emit({isExpanded:this.internalOpen})}async show(){this.isHidden=!1}async hide(){this.isHidden=!0}handleScroll(){if(!this.hideOnScroll&&!this.showOnScrollUp)return;const t=window.scrollY,i=t>this.lastScrollY;this.showOnScrollUp&&!i&&t>100?this.isHidden=!1:this.hideOnScroll&&i&&t>100&&(this.isHidden=!0,this.internalOpen&&this.closeFab()),this.lastScrollY=t}handleKeyDown(t){this.disabled||this.loading||("Enter"===t.key||" "===t.key?(t.preventDefault(),this.handleClick(new MouseEvent("click"))):"Escape"===t.key&&this.internalOpen&&(this.closeFab(),this.focusTrigger()))}focusTrigger(){const t=this.el.shadowRoot?.querySelector(".fab-trigger");t&&t.focus()}handleClick=t=>{this.disabled||this.loading||("speed-dial"===this.type||this.toggle||this.panel?this.expandOnClick&&this.toggleFab():this.uiFabClick.emit(t))};handleBackdropClick=()=>{this.backdropClose&&this.internalOpen&&!this.persistent&&this.closeFab()};handleMouseEnter=()=>{!this.expandOnHover||this.disabled||this.loading||this.openFab()};handleMouseLeave=()=>{this.expandOnHover&&!this.persistent&&this.closeFab()};handlePointerDown=t=>{this.isDraggable&&!this.disabled&&(this.isDragging=!0,this.dragStartX=t.clientX,this.dragStartY=t.clientY,this.el.setPointerCapture(t.pointerId))};handlePointerMove=t=>{if(!this.isDragging||!this.isDraggable)return;const i=t.clientX-this.dragStartX,e=t.clientY-this.dragStartY;this.position.includes("right")?this.currentX-=i:this.position.includes("left")&&(this.currentX+=i),this.position.includes("bottom")?this.currentY-=e:this.position.includes("top")&&(this.currentY+=e),this.dragStartX=t.clientX,this.dragStartY=t.clientY};handlePointerUp=t=>{this.isDragging&&(this.isDragging=!1,this.el.releasePointerCapture(t.pointerId))};onActionClick(){this.closeOnAction&&this.internalOpen&&!this.persistent&&this.closeFab()}calculateRadial(){if("radial"!==this.direction)return;const t=Array.from(this.el.querySelectorAll("ui-fab-item"));if(!t.length)return;const i=80+Math.max(0,15*(t.length-4)),e=1===t.length?0:Math.min(120,90+Math.max(0,10*(t.length-3)))/(t.length-1);t.forEach(((a,s)=>{const o=e*s*(Math.PI/180);let n=Math.abs(Math.sin(o)*i),r=Math.abs(Math.cos(o)*i);if(this.position.includes("right")&&(n=-n),this.position.includes("bottom")&&(r=-r),this.position.includes("-center")){const e=Math.min(220,180+15*(t.length-3)),a=Math.PI/180*((1===t.length?0:e/(t.length-1))*s-e/2);n=Math.sin(a)*i,r=this.position.includes("bottom")?-Math.cos(a)*i:Math.cos(a)*i}if(this.position.includes("center-")){const e=Math.min(180,120+15*(t.length-3)),a=Math.PI/180*((1===t.length?0:e/(t.length-1))*s-e/2);r=Math.sin(a)*i,n=this.position.includes("right")?-Math.cos(a)*i:Math.cos(a)*i}a.style.setProperty("--radial-x",n+"px"),a.style.setProperty("--radial-y",r+"px")}))}render(){const t=!!("extended"===this.type||this.label&&"speed-dial"!==this.type),i="speed-dial"===this.type;return a(s,{key:"7e6f5d73427366ff17f1f5e65bd17f6835098b63",class:{"fab-container":!0,["pos-"+this.position]:!0,["dir-"+this.direction]:!0,["variant-"+this.variant]:!0,["size-"+this.size]:!0,["anim-"+this.animation]:!0,"is-open":this.internalOpen,"is-hidden":this.isHidden,"is-extended":t,"is-speed-dial":i,"is-dragging":this.isDragging,"is-disabled":this.disabled,"is-loading":this.loading},style:{"--fab-offset-x":this.currentX+"px","--fab-offset-y":this.currentY+"px","z-index":""+this.zIndex}},this.backdrop&&this.internalOpen&&a("div",{key:"f1256c22cd5f454ca9d17c3ebd30c0cdf541b491",class:"fab-backdrop",onClick:this.handleBackdropClick}),a("div",{key:"c6772712b949c61127a52722a7e0d2a85ec09f06",class:"fab-wrapper",onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},i&&a("div",{key:"0398eb0d055bb156268bcb3af06ca48c89b894a3",class:"fab-actions","aria-hidden":this.internalOpen?"false":"true"},a("slot",{key:"5cd5d9f5bc34719f89645cda401eb6d85db11449",name:"actions"})),this.panel&&a("div",{key:"d9075d5a11d5c4d0394e4d637f09f24dc03870af",class:{"fab-panel":!0,"has-header":!!this.panelTitle},role:"dialog","aria-hidden":this.internalOpen?"false":"true",style:{width:this.panelWidth,height:this.panelHeight,maxHeight:this.panelMaxHeight}},this.panelTitle&&a("div",{key:"3becbad472d14e38d2b3ab20e2ff4c34e0269e0f",class:"fab-panel-header"},a("span",{key:"b140b40024a609232de0a763654d03dd0f225a9b",class:"fab-panel-title"},this.panelTitle),a("ui-button",{key:"e72642cfa211273ef540eab5e293e950c0180415",variant:"ghost",class:"fab-panel-close",onClick:()=>this.closeFab(),ariaLabel:"Close panel",icon:"x",iconLibrary:"lucide",iconOnly:!0,size:"sm"})),a("div",{key:"f8006eb878ba30e0711f74633b4cd6e85c9f41bb",class:"fab-panel-body"},a("slot",{key:"35933e69377366b5405245f7f32df3201390066d",name:"panel"})),a("div",{key:"4332e87ae404c1cd4d4a5799f1f25d8a430df709",class:"fab-panel-footer"},a("slot",{key:"7dbbc44576c425495dd7cd8ba53f93a9b7ff1d6a",name:"panel-footer"}))),a("ui-button",{key:"e0459872b67bac7714d6eef306cf232253f3bfd1",variant:this.variant,shape:"extended"===this.type||this.label&&"speed-dial"!==this.type?"rounded":"circle",class:"fab-trigger",disabled:this.disabled||this.loading,loading:this.loading,ariaLabel:this.label||"Floating Action Button",onClick:this.handleClick,onPointerDown:this.handlePointerDown,onPointerMove:this.handlePointerMove,onPointerUp:this.handlePointerUp,onPointerCancel:this.handlePointerUp,label:t&&this.label?this.label:void 0,icon:this.icon,iconOnly:!t,size:"mini"===this.size?"sm":"lg"===this.size?"lg":"md"},i&&this.toggle&&this.internalOpen&&a("ui-icon",{key:"c001fc5d8906bb8aadab821856f181fa204e994a",slot:"icon",class:"fab-icon close-icon",name:"x",size:"mini"===this.size?"18":"24"}),!this.icon&&!t&&a("slot",{key:"73458b1312ff61bcf62fb97bf076c0684389cc57",name:"trigger"}))))}static get watchers(){return{isExpanded:[{openChanged:0}]}}static get style(){return".sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{--ui-fab-bg:var(--ui-primary, var(--color-success, #3dcd58));--ui-fab-color:var(--text-standard, #ffffff);--ui-fab-hover-bg:var(--ui-primary-hover, #2ebd4a);--ui-fab-size:56px;--ui-fab-radius:50%;--ui-fab-shadow:0 4px 12px rgba(0, 0, 0, 0.15);--ui-fab-zindex:1000;--ui-fab-gap:16px;--ui-fab-action-size:40px;--ui-fab-transition:all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);position:fixed;z-index:var(--ui-fab-zindex);display:flex;transition:transform 0.3s ease, opacity 0.3s ease;pointer-events:none;}:host(.is-hidden){opacity:0;transform:scale(0.8);pointer-events:none}:host(.pos-bottom-right){inset-block-end:var(--fab-offset-y);inset-inline-end:var(--fab-offset-x)}:host(.pos-bottom-left){inset-block-end:var(--fab-offset-y);inset-inline-start:var(--fab-offset-x)}:host(.pos-top-right){inset-block-start:var(--fab-offset-y);inset-inline-end:var(--fab-offset-x)}:host(.pos-top-left){inset-block-start:var(--fab-offset-y);inset-inline-start:var(--fab-offset-x)}:host(.pos-bottom-center){inset-block-end:var(--fab-offset-y);inset-inline-start:50%;transform:translateX(-50%)}:host(.pos-top-center){inset-block-start:var(--fab-offset-y);inset-inline-start:50%;transform:translateX(-50%)}:host(.pos-center-right){inset-block-start:50%;inset-inline-end:var(--fab-offset-x);transform:translateY(-50%)}:host(.pos-center-left){inset-block-start:50%;inset-inline-start:var(--fab-offset-x);transform:translateY(-50%)}:host(.size-mini){--ui-fab-size:40px}:host(.size-sm){--ui-fab-size:48px}:host(.size-md){--ui-fab-size:56px}:host(.size-lg){--ui-fab-size:64px}:host(.is-extended){--ui-fab-radius:28px}:host(.is-extended) .fab-trigger{width:auto;padding-inline:20px}:host(.variant-secondary){--ui-fab-bg:var(--color-primary, #6b7280);--ui-fab-hover-bg:var(--color-primary, #4b5563)}:host(.variant-tertiary){--ui-fab-bg:var(--bg-primary, #1f2937);--ui-fab-hover-bg:var(--bg-secondary, #111827)}:host(.variant-surface){--ui-fab-bg:var(--bg-primary, var(--text-standard, #ffffff));--ui-fab-color:var(--bg-secondary, var(--text-primary, #111827));--ui-fab-hover-bg:var(--bg-primary, #f9fafb)}:host(.variant-success){--ui-fab-bg:var(--color-success, #10b981);--ui-fab-hover-bg:var(--color-success-hover, #059669)}:host(.variant-danger){--ui-fab-bg:var(--color-danger, #ef4444);--ui-fab-hover-bg:var(--color-danger-hover, #dc2626)}:host(.variant-warning){--ui-fab-bg:var(--color-warning, #f59e0b);--ui-fab-hover-bg:var(--color-warning-hover, #d97706)}:host(.variant-info){--ui-fab-bg:var(--color-primary, #10b981);--ui-fab-hover-bg:var(--color-primary-hover, #2563eb)}.fab-wrapper{display:flex;pointer-events:auto;align-items:center;justify-content:center;position:relative}:host(.dir-up) .fab-wrapper{flex-direction:column-reverse}:host(.dir-down) .fab-wrapper{flex-direction:column}:host(.dir-left) .fab-wrapper{flex-direction:row-reverse}:host(.dir-right) .fab-wrapper{flex-direction:row}:host(.dir-radial) .fab-wrapper{flex-direction:column;}.fab-trigger{width:var(--ui-fab-size);height:var(--ui-fab-size);cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:var(--ui-fab-transition);outline:none;z-index:2;font-family:inherit}.fab-trigger:hover{transform:translateY(-2px)}.fab-trigger:active{transform:translateY(0) scale(0.95)}:host(.is-disabled) .fab-trigger{opacity:0.6;cursor:not-allowed;pointer-events:none}.fab-content{display:flex;align-items:center;justify-content:center;gap:8px;position:relative;height:100%}.fab-icon{transition:transform 0.3s ease, opacity 0.3s ease;display:flex;align-items:center;justify-content:center;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.close-icon{opacity:0;transform:translate(-50%, -50%) rotate(-90deg)}:host(.is-open) .primary-icon{opacity:0;transform:translate(-50%, -50%) rotate(90deg)}:host(.is-open) .close-icon{opacity:1;transform:translate(-50%, -50%) rotate(0deg)}.fab-label{font-weight:500;font-size:14px;letter-spacing:0.5px;white-space:nowrap}:host(.is-extended) .fab-icon{position:relative;transform:none;top:0;left:0}:host(.is-extended.is-open) .primary-icon{transform:rotate(90deg)}.fab-actions{display:flex;gap:12px;visibility:hidden;z-index:1;padding:var(--ui-fab-gap);position:relative}:host(.dir-up) .fab-actions{flex-direction:column-reverse;margin-block-end:-16px}:host(.dir-down) .fab-actions{flex-direction:column;margin-block-start:-16px}:host(.dir-left) .fab-actions{flex-direction:row-reverse;margin-inline-end:-16px}:host(.dir-right) .fab-actions{flex-direction:row;margin-inline-start:-16px}:host(.dir-radial) .fab-actions{display:block;position:absolute;left:50%;top:50%;width:0;height:0;padding:0}:host(.is-open) .fab-actions{visibility:visible}::slotted(ui-fab-item){opacity:0;transform:scale(0.5);transition:all 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);pointer-events:none}:host(.is-open) ::slotted(ui-fab-item){opacity:1;transform:scale(1);pointer-events:auto}:host(.dir-radial) ::slotted(ui-fab-item){position:absolute;inset-block-start:-20px;inset-inline-start:-20px}:host(.dir-radial.is-open) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.is-open) ::slotted(ui-fab-item:nth-child(1)){transition-delay:40ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(2)){transition-delay:80ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(3)){transition-delay:120ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(4)){transition-delay:160ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(5)){transition-delay:200ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(6)){transition-delay:240ms}:host(.anim-fade) ::slotted(ui-fab-item){transform:scale(1)}:host(.anim-slide-up) ::slotted(ui-fab-item){transform:translateY(20px)}:host(.is-open.anim-slide-up) ::slotted(ui-fab-item){transform:translateY(0)}:host(.anim-slide-down) ::slotted(ui-fab-item){transform:translateY(-20px)}:host(.is-open.anim-slide-down) ::slotted(ui-fab-item){transform:translateY(0)}:host(.anim-slide-left) ::slotted(ui-fab-item){transform:translateX(20px)}:host(.is-open.anim-slide-left) ::slotted(ui-fab-item){transform:translateX(0)}:host(.anim-slide-right) ::slotted(ui-fab-item){transform:translateX(-20px)}:host(.is-open.anim-slide-right) ::slotted(ui-fab-item){transform:translateX(0)}:host(.anim-rotate) ::slotted(ui-fab-item){transform:rotate(45deg) scale(0.5)}:host(.is-open.anim-rotate) ::slotted(ui-fab-item){transform:rotate(0deg) scale(1)}.spinner{width:24px;height:24px;animation:rotate 2s linear infinite}.spinner-circle{stroke-dasharray:1, 200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35px}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124px}}.fab-backdrop{position:fixed;inset:0;background:rgba(255, 255, 255, 0.7);backdrop-filter:blur(4px);z-index:0;pointer-events:auto}.fab-panel{position:absolute;background:var(--ui-surface, var(--bg-primary, #ffffff));border-radius:16px;box-shadow:0 10px 40px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);display:flex;flex-direction:column;min-width:200px;opacity:0;pointer-events:none;transform:scale(0.95);transition:opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);z-index:10;overflow:hidden;border:1px solid rgba(255, 255, 255, 0.1);backdrop-filter:blur(8px)}.fab-panel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid rgba(0, 0, 0, 0.05);background:rgba(0, 0, 0, 0.02)}.fab-panel-title{font-weight:700;font-size:14px;color:var(--text-primary, #1e293b);letter-spacing:-0.01em}.fab-panel-close{background:transparent;border:none;padding:4px;cursor:pointer;color:var(--text-muted, #64748b);display:flex;align-items:center;border-radius:6px;transition:all 0.2s}.fab-panel-close:hover{background:rgba(0, 0, 0, 0.05);color:var(--color-danger, #ef4444)}.fab-panel-body{flex:1;padding:16px;overflow-y:auto;min-height:0;scrollbar-width:thin}.fab-panel-body::-webkit-scrollbar{width:6px}.fab-panel-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:12px 16px;background:rgba(0, 0, 0, 0.015);border-top:1px solid rgba(0, 0, 0, 0.05)}:host(.is-open) .fab-panel{opacity:1;pointer-events:auto;transform:scale(1)}:host(.pos-bottom-right) .fab-panel{inset-block-end:calc(100% + 12px);inset-inline-end:0;transform-origin:bottom right}:host(.pos-bottom-left) .fab-panel{inset-block-end:calc(100% + 12px);inset-inline-start:0;transform-origin:bottom left}:host(.pos-bottom-center) .fab-panel{inset-block-end:calc(100% + 12px);inset-inline-start:50%;transform:translateX(-50%) scale(0.95);transform-origin:bottom center}:host(.pos-bottom-center.is-open) .fab-panel{transform:translateX(-50%) scale(1)}:host(.pos-top-right) .fab-panel{inset-block-start:calc(100% + 12px);inset-inline-end:0;transform-origin:top right}:host(.pos-top-left) .fab-panel{inset-block-start:calc(100% + 12px);inset-inline-start:0;transform-origin:top left}:host(.pos-top-center) .fab-panel{inset-block-start:calc(100% + 12px);inset-inline-start:50%;transform:translateX(-50%) scale(0.95);transform-origin:top center}:host(.pos-top-center.is-open) .fab-panel{transform:translateX(-50%) scale(1)}:host(.pos-center-right) .fab-panel{inset-inline-end:calc(100% + 12px);inset-block-start:50%;transform:translateY(-50%) scale(0.95);transform-origin:center right}:host(.pos-center-right.is-open) .fab-panel{transform:translateY(-50%) scale(1)}:host(.pos-center-left) .fab-panel{inset-inline-start:calc(100% + 12px);inset-block-start:50%;transform:translateY(-50%) scale(0.95);transform-origin:center left}:host(.pos-center-left.is-open) .fab-panel{transform:translateY(-50%) scale(1)}"}},[769,"ui-fab",{isExpanded:[1028,"is-expanded"],defaultOpen:[4,"default-open"],position:[1],direction:[1],variant:[1],size:[1],type:[1],icon:[1],label:[1],disabled:[4],loading:[4],toggle:[4],isDraggable:[4,"is-draggable"],hideOnScroll:[4,"hide-on-scroll"],showOnScrollUp:[4,"show-on-scroll-up"],offsetX:[2,"offset-x"],offsetY:[2,"offset-y"],zIndex:[2,"z-index"],expandOnHover:[4,"expand-on-hover"],expandOnClick:[4,"expand-on-click"],closeOnAction:[4,"close-on-action"],backdrop:[4],backdropClose:[4,"backdrop-close"],persistent:[4],animation:[1],panel:[4],panelTitle:[1,"panel-title"],panelWidth:[1,"panel-width"],panelHeight:[1,"panel-height"],panelMaxHeight:[1,"panel-max-height"],isDragging:[32],isHidden:[32],currentX:[32],currentY:[32],openFab:[64],closeFab:[64],toggleFab:[64],show:[64],hide:[64]},[[9,"scroll","handleScroll"],[0,"keydown","handleKeyDown"],[0,"uiFabActionClick","onActionClick"]],{isExpanded:[{openChanged:0}]}]),f=h,c=function(){"undefined"!=typeof customElements&&["ui-fab","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-fab":customElements.get(o(t))||customElements.define(o(t),h);break;case"ui-badge":customElements.get(o(t))||r();break;case"ui-button":customElements.get(o(t))||n();break;case"ui-icon":customElements.get(o(t))||l();break;case"ui-loader":customElements.get(o(t))||d()}}))};export{f as UiFab,c as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as a,createEvent as i,h as e,Host as s,transformTag as r}from"@stencil/core/internal/client";import{d as o}from"./badge.js";import{d as n}from"./button.js";import{d as l}from"./icon.js";import{d}from"./loader.js";const c=t(class extends a{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.uiFabClick=i(this,"uiFabClick",7),this.uiFabOpen=i(this,"uiFabOpen",7),this.uiFabClose=i(this,"uiFabClose",7),this.uiFabToggle=i(this,"uiFabToggle",7),this.uiFabActionClick=i(this,"uiFabActionClick",7)}get el(){return this}isExpanded=!1;defaultOpen=!1;position="bottom-right";direction="top";variant="primary";size="md";type="standard";icon;label;disabled=!1;loading=!1;toggle=!1;isDraggable=!1;hideOnScroll=!1;showOnScrollUp=!1;offsetX=24;offsetY=24;zIndex=1e3;expandOnHover=!1;expandOnClick=!0;closeOnAction=!0;backdrop=!1;backdropClose=!0;persistent=!1;animation="scale";panel=!1;panelTitle;panelWidth="320px";panelHeight;panelMaxHeight="480px";isDragging=!1;isHidden=!1;currentX=0;currentY=0;uiFabClick;uiFabOpen;uiFabClose;uiFabToggle;uiFabActionClick;dragStartX=0;dragStartY=0;lastScrollY=0;internalOpen=!1;componentWillLoad(){this.internalOpen=this.defaultOpen||this.isExpanded,this.currentX=this.offsetX,this.currentY=this.offsetY}componentDidLoad(){(this.hideOnScroll||this.showOnScrollUp)&&(this.lastScrollY=window.scrollY)}openChanged(t){this.internalOpen=t,t?(this.uiFabOpen.emit(),this.calculateRadial()):this.uiFabClose.emit()}async openFab(){this.isExpanded=!0}async closeFab(){this.isExpanded=!1}async toggleFab(){this.isExpanded=!this.internalOpen,this.uiFabToggle.emit({isExpanded:this.internalOpen})}async show(){this.isHidden=!1}async hide(){this.isHidden=!0}handleScroll(){if(!this.hideOnScroll&&!this.showOnScrollUp)return;const t=window.scrollY,a=t>this.lastScrollY;this.showOnScrollUp&&!a&&t>100?this.isHidden=!1:this.hideOnScroll&&a&&t>100&&(this.isHidden=!0,this.internalOpen&&this.closeFab()),this.lastScrollY=t}handleKeyDown(t){this.disabled||this.loading||("Enter"===t.key||" "===t.key?(t.preventDefault(),this.handleClick(new MouseEvent("click"))):"Escape"===t.key&&this.internalOpen&&(this.closeFab(),this.focusTrigger()))}focusTrigger(){const t=this.el.shadowRoot?.querySelector(".fab-trigger");t&&t.focus()}handleClick=t=>{this.disabled||this.loading||("speed-dial"===this.type||this.toggle||this.panel?this.expandOnClick&&this.toggleFab():this.uiFabClick.emit(t))};handleBackdropClick=()=>{this.backdropClose&&this.internalOpen&&!this.persistent&&this.closeFab()};handleMouseEnter=()=>{!this.expandOnHover||this.disabled||this.loading||this.openFab()};handleMouseLeave=()=>{this.expandOnHover&&!this.persistent&&this.closeFab()};handlePointerDown=t=>{this.isDraggable&&!this.disabled&&(this.isDragging=!0,this.dragStartX=t.clientX,this.dragStartY=t.clientY,this.el.setPointerCapture(t.pointerId))};handlePointerMove=t=>{if(!this.isDragging||!this.isDraggable)return;const a=t.clientX-this.dragStartX,i=t.clientY-this.dragStartY;this.position.includes("right")?this.currentX-=a:this.position.includes("left")&&(this.currentX+=a),this.position.includes("bottom")?this.currentY-=i:this.position.includes("top")&&(this.currentY+=i),this.dragStartX=t.clientX,this.dragStartY=t.clientY};handlePointerUp=t=>{this.isDragging&&(this.isDragging=!1,this.el.releasePointerCapture(t.pointerId))};onActionClick(){this.closeOnAction&&this.internalOpen&&!this.persistent&&this.closeFab()}calculateRadial(){if("radial"!==this.direction)return;const t=Array.from(this.el.querySelectorAll("ui-fab-item"));if(!t.length)return;const a=80+Math.max(0,15*(t.length-4)),i=1===t.length?0:Math.min(120,90+Math.max(0,10*(t.length-3)))/(t.length-1);t.forEach(((e,s)=>{const r=i*s*(Math.PI/180);let o=Math.abs(Math.sin(r)*a),n=Math.abs(Math.cos(r)*a);if(this.position.includes("right")&&(o=-o),this.position.includes("bottom")&&(n=-n),this.position.includes("-center")){const i=Math.min(220,180+15*(t.length-3)),e=Math.PI/180*((1===t.length?0:i/(t.length-1))*s-i/2);o=Math.sin(e)*a,n=this.position.includes("bottom")?-Math.cos(e)*a:Math.cos(e)*a}if(this.position.includes("center-")){const i=Math.min(180,120+15*(t.length-3)),e=Math.PI/180*((1===t.length?0:i/(t.length-1))*s-i/2);n=Math.sin(e)*a,o=this.position.includes("right")?-Math.cos(e)*a:Math.cos(e)*a}e.style.setProperty("--radial-x",o+"px"),e.style.setProperty("--radial-y",n+"px")}))}render(){const t=!!("extended"===this.type||this.label&&"speed-dial"!==this.type),a="speed-dial"===this.type;return e(s,{key:"2056e5c41d3a6ebe204bbca982113ec8ae5c0dfa",class:{"fab-container":!0,["pos-"+this.position]:!0,["dir-"+this.direction]:!0,["variant-"+this.variant]:!0,["size-"+this.size]:!0,["anim-"+this.animation]:!0,"is-open":this.internalOpen,"is-hidden":this.isHidden,"is-extended":t,"is-speed-dial":a,"is-dragging":this.isDragging,"is-disabled":this.disabled,"is-loading":this.loading},style:{"--fab-offset-x":this.currentX+"px","--fab-offset-y":this.currentY+"px","z-index":""+this.zIndex}},this.backdrop&&this.internalOpen&&e("div",{key:"d0993a33075927b666a925757291856f63d71eb1",class:"fab-backdrop",onClick:this.handleBackdropClick}),e("div",{key:"1d69ed0fc6c04e402b7dfd341baff775223f9128",class:"fab-wrapper",onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},a&&e("div",{key:"717016c38e78d1ef9c94aef1315282283444498c",class:"fab-actions","aria-hidden":this.internalOpen?"false":"true"},e("slot",{key:"b717c5c2675a521c69d5cdcb11fe1cfd9cec06b0",name:"actions"})),this.panel&&e("div",{key:"adfc6178e7902576e516ba90b0c1edad89156d50",class:{"fab-panel":!0,"has-header":!!this.panelTitle},role:"dialog","aria-hidden":this.internalOpen?"false":"true",style:{width:this.panelWidth,height:this.panelHeight,maxHeight:this.panelMaxHeight}},this.panelTitle&&e("div",{key:"d0b056953d16bd6dcce7ac78d9153602687a6497",class:"fab-panel-header"},e("span",{key:"0b390c0ce66e4d34a197d432e152314e3116412c",class:"fab-panel-title"},this.panelTitle),e("ui-button",{key:"f364d10c53e88e80362f275d971e105cfa627d4e",variant:"ghost",class:"fab-panel-close",onClick:()=>this.closeFab(),ariaLabel:"Close panel",icon:"x",iconLibrary:"lucide",iconOnly:!0,size:"sm"})),e("div",{key:"eca3d32bee8cdec393515d22987467c199f719ba",class:"fab-panel-body"},e("slot",{key:"4232e7d5a218c75adc0db989f77751461ad0e2b4",name:"panel"})),e("div",{key:"f072a59999d57c18ab911b6c845403771ca50a85",class:"fab-panel-footer"},e("slot",{key:"e952417e54ec61d9fe7e061bdafe0ffcf58d9a34",name:"panel-footer"}))),e("ui-button",{key:"0356b74a36eaf2cd3352bf430ce62077a7f3f0fa",variant:this.variant,shape:"extended"===this.type||this.label&&"speed-dial"!==this.type?"rounded":"circle",class:"fab-trigger",disabled:this.disabled||this.loading,loading:this.loading,ariaLabel:this.label||"Floating Action Button",onClick:this.handleClick,onPointerDown:this.handlePointerDown,onPointerMove:this.handlePointerMove,onPointerUp:this.handlePointerUp,onPointerCancel:this.handlePointerUp,label:t&&this.label?this.label:void 0,icon:this.icon,iconOnly:!t,size:"mini"===this.size?"sm":"lg"===this.size?"lg":"md"},a&&this.toggle&&this.internalOpen&&e("ui-icon",{key:"e5362af2ca1dfa33b0a87b598dc45ac70ccc5316",slot:"icon",class:"fab-icon close-icon",name:"x",size:"mini"===this.size?"18":"24"}),!this.icon&&!t&&e("slot",{key:"4e4f5c1eff9645abf60baba9a26e5564d6532741",name:"trigger"}))))}static get watchers(){return{isExpanded:[{openChanged:0}]}}static get style(){return".sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{--ui-fab-bg:var(--ui-primary, var(--color-success, #3dcd58));--ui-fab-color:var(--text-standard, #ffffff);--ui-fab-hover-bg:var(--ui-primary-hover, #2ebd4a);--ui-fab-size:56px;--ui-fab-radius:50%;--ui-fab-shadow:0 4px 12px rgba(0, 0, 0, 0.15);--ui-fab-zindex:1000;--ui-fab-gap:16px;--ui-fab-action-size:40px;--ui-fab-transition:all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);position:fixed;z-index:var(--ui-fab-zindex);display:flex;transition:transform 0.3s ease, opacity 0.3s ease;pointer-events:none;}:host(.is-hidden){opacity:0;transform:scale(0.8);pointer-events:none}:host(.pos-bottom-right){inset-block-end:var(--fab-offset-y);inset-inline-end:var(--fab-offset-x)}:host(.pos-bottom-left){inset-block-end:var(--fab-offset-y);inset-inline-start:var(--fab-offset-x)}:host(.pos-top-right){inset-block-start:var(--fab-offset-y);inset-inline-end:var(--fab-offset-x)}:host(.pos-top-left){inset-block-start:var(--fab-offset-y);inset-inline-start:var(--fab-offset-x)}:host(.pos-bottom-center){inset-block-end:var(--fab-offset-y);inset-inline-start:50%;transform:translateX(-50%)}:host(.pos-top-center){inset-block-start:var(--fab-offset-y);inset-inline-start:50%;transform:translateX(-50%)}:host(.pos-center-right){inset-block-start:50%;inset-inline-end:var(--fab-offset-x);transform:translateY(-50%)}:host(.pos-center-left){inset-block-start:50%;inset-inline-start:var(--fab-offset-x);transform:translateY(-50%)}:host(.size-mini){--ui-fab-size:40px}:host(.size-sm){--ui-fab-size:48px}:host(.size-md){--ui-fab-size:56px}:host(.size-lg){--ui-fab-size:64px}:host(.is-extended){--ui-fab-radius:28px}:host(.is-extended) .fab-trigger{width:auto;padding-inline:20px}:host(.variant-secondary){--ui-fab-bg:var(--color-primary, #6b7280);--ui-fab-hover-bg:var(--color-primary, #4b5563)}:host(.variant-tertiary){--ui-fab-bg:var(--bg-primary, #1f2937);--ui-fab-hover-bg:var(--bg-secondary, #111827)}:host(.variant-surface){--ui-fab-bg:var(--bg-primary, var(--text-standard, #ffffff));--ui-fab-color:var(--bg-secondary, var(--text-primary, #111827));--ui-fab-hover-bg:var(--bg-primary, #f9fafb)}:host(.variant-success){--ui-fab-bg:var(--color-success, #10b981);--ui-fab-hover-bg:var(--color-success-hover, #059669)}:host(.variant-danger){--ui-fab-bg:var(--color-danger, #ef4444);--ui-fab-hover-bg:var(--color-danger-hover, #dc2626)}:host(.variant-warning){--ui-fab-bg:var(--color-warning, #f59e0b);--ui-fab-hover-bg:var(--color-warning-hover, #d97706)}:host(.variant-info){--ui-fab-bg:var(--color-primary, #10b981);--ui-fab-hover-bg:var(--color-primary-hover, #2563eb)}.fab-wrapper{display:flex;pointer-events:auto;align-items:center;justify-content:center;position:relative}:host(.dir-top) .fab-wrapper{flex-direction:column-reverse}:host(.dir-bottom) .fab-wrapper{flex-direction:column}:host(.dir-left) .fab-wrapper{flex-direction:row-reverse}:host(.dir-right) .fab-wrapper{flex-direction:row}:host(.dir-radial) .fab-wrapper{flex-direction:column;}.fab-trigger{width:var(--ui-fab-size);height:var(--ui-fab-size);cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:var(--ui-fab-transition);outline:none;z-index:2;font-family:inherit}.fab-trigger:hover{transform:translateY(-2px)}.fab-trigger:active{transform:translateY(0) scale(0.95)}:host(.is-disabled) .fab-trigger{opacity:0.6;cursor:not-allowed;pointer-events:none}.fab-content{display:flex;align-items:center;justify-content:center;gap:8px;position:relative;height:100%}.fab-icon{transition:transform 0.3s ease, opacity 0.3s ease;display:flex;align-items:center;justify-content:center;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.close-icon{opacity:0;transform:translate(-50%, -50%) rotate(-90deg)}:host(.is-open) .primary-icon{opacity:0;transform:translate(-50%, -50%) rotate(90deg)}:host(.is-open) .close-icon{opacity:1;transform:translate(-50%, -50%) rotate(0deg)}.fab-label{font-weight:500;font-size:14px;letter-spacing:0.5px;white-space:nowrap}:host(.is-extended) .fab-icon{position:relative;transform:none;top:0;left:0}:host(.is-extended.is-open) .primary-icon{transform:rotate(90deg)}.fab-actions{display:flex;gap:12px;visibility:hidden;z-index:1;padding:var(--ui-fab-gap);position:relative}:host(.dir-top) .fab-actions{flex-direction:column-reverse;margin-block-end:-16px}:host(.dir-bottom) .fab-actions{flex-direction:column;margin-block-start:-16px}:host(.dir-left) .fab-actions{flex-direction:row-reverse;margin-inline-end:-16px}:host(.dir-right) .fab-actions{flex-direction:row;margin-inline-start:-16px}:host(.dir-radial) .fab-actions{display:block;position:absolute;left:50%;top:50%;width:0;height:0;padding:0}:host(.is-open) .fab-actions{visibility:visible}::slotted(ui-fab-item){opacity:0;transform:scale(0.5);transition:transform 0.24s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.2s ease;pointer-events:none;transform-origin:center}:host(.is-open) ::slotted(ui-fab-item){opacity:1;transform:scale(1);pointer-events:auto}:host(.dir-radial) ::slotted(ui-fab-item){position:absolute;inset-block-start:-20px;inset-inline-start:-20px;transform:translate(0, 0) scale(0.5)}:host(.dir-radial.is-open) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.is-open) ::slotted(ui-fab-item:nth-child(1)){transition-delay:40ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(2)){transition-delay:80ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(3)){transition-delay:120ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(4)){transition-delay:160ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(5)){transition-delay:200ms}:host(.is-open) ::slotted(ui-fab-item:nth-child(6)){transition-delay:240ms}:host(.anim-scale) ::slotted(ui-fab-item){transform:scale(0.35)}:host(.is-open.anim-scale) ::slotted(ui-fab-item){transform:scale(1)}:host(.anim-fade) ::slotted(ui-fab-item){transform:scale(1);opacity:0}:host(.is-open.anim-fade) ::slotted(ui-fab-item){transform:scale(1);opacity:1}:host(.anim-slide-up) ::slotted(ui-fab-item){transform:translateY(20px) scale(0.92)}:host(.is-open.anim-slide-up) ::slotted(ui-fab-item){transform:translateY(0) scale(1)}:host(.anim-slide-down) ::slotted(ui-fab-item){transform:translateY(-20px) scale(0.92)}:host(.is-open.anim-slide-down) ::slotted(ui-fab-item){transform:translateY(0) scale(1)}:host(.anim-slide-left) ::slotted(ui-fab-item){transform:translateX(20px) scale(0.92)}:host(.is-open.anim-slide-left) ::slotted(ui-fab-item){transform:translateX(0) scale(1)}:host(.anim-slide-right) ::slotted(ui-fab-item){transform:translateX(-20px) scale(0.92)}:host(.is-open.anim-slide-right) ::slotted(ui-fab-item){transform:translateX(0) scale(1)}:host(.anim-rotate) ::slotted(ui-fab-item){transform:rotate(-135deg) scale(0.35)}:host(.is-open.anim-rotate) ::slotted(ui-fab-item){transform:rotate(0deg) scale(1)}:host(.dir-radial.anim-fade) ::slotted(ui-fab-item){transform:translate(0, 0) scale(1)}:host(.dir-radial.is-open.anim-fade) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.dir-radial.anim-scale) ::slotted(ui-fab-item){transform:translate(calc(var(--radial-x, 0) * 0.45), calc(var(--radial-y, 0) * 0.45)) scale(0.35)}:host(.dir-radial.is-open.anim-scale) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.dir-radial.anim-slide-up) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), calc(var(--radial-y, 0) + 20px)) scale(0.92)}:host(.dir-radial.is-open.anim-slide-up) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.dir-radial.anim-slide-down) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), calc(var(--radial-y, 0) - 20px)) scale(0.92)}:host(.dir-radial.is-open.anim-slide-down) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.dir-radial.anim-slide-left) ::slotted(ui-fab-item){transform:translate(calc(var(--radial-x, 0) + 20px), var(--radial-y, 0)) scale(0.92)}:host(.dir-radial.is-open.anim-slide-left) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.dir-radial.anim-slide-right) ::slotted(ui-fab-item){transform:translate(calc(var(--radial-x, 0) - 20px), var(--radial-y, 0)) scale(0.92)}:host(.dir-radial.is-open.anim-slide-right) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) scale(1) !important}:host(.dir-radial.anim-rotate) ::slotted(ui-fab-item){transform:translate(calc(var(--radial-x, 0) * 0.65), calc(var(--radial-y, 0) * 0.65)) rotate(-135deg) scale(0.35)}:host(.dir-radial.is-open.anim-rotate) ::slotted(ui-fab-item){transform:translate(var(--radial-x, 0), var(--radial-y, 0)) rotate(0deg) scale(1) !important}.spinner{width:24px;height:24px;animation:rotate 2s linear infinite}.spinner-circle{stroke-dasharray:1, 200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35px}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124px}}.fab-backdrop{position:fixed;inset:0;background:rgba(255, 255, 255, 0.7);backdrop-filter:blur(4px);z-index:0;pointer-events:auto}.fab-panel{position:absolute;background:var(--ui-surface, var(--bg-primary, #ffffff));border-radius:16px;box-shadow:0 10px 40px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);display:flex;flex-direction:column;min-width:200px;opacity:0;pointer-events:none;transform:scale(0.95);transition:opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);z-index:10;overflow:hidden;border:1px solid rgba(255, 255, 255, 0.1);backdrop-filter:blur(8px)}.fab-panel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid rgba(0, 0, 0, 0.05);background:rgba(0, 0, 0, 0.02)}.fab-panel-title{font-weight:700;font-size:14px;color:var(--text-primary, #1e293b);letter-spacing:-0.01em}.fab-panel-close{background:transparent;border:none;padding:4px;cursor:pointer;color:var(--text-muted, #64748b);display:flex;align-items:center;border-radius:6px;transition:all 0.2s}.fab-panel-close:hover{background:rgba(0, 0, 0, 0.05);color:var(--color-danger, #ef4444)}.fab-panel-body{flex:1;padding:16px;overflow-y:auto;min-height:0;scrollbar-width:thin}.fab-panel-body::-webkit-scrollbar{width:6px}.fab-panel-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:12px 16px;background:rgba(0, 0, 0, 0.015);border-top:1px solid rgba(0, 0, 0, 0.05)}:host(.is-open) .fab-panel{opacity:1;pointer-events:auto;transform:scale(1)}:host(.pos-bottom-right) .fab-panel{inset-block-end:calc(100% + 12px);inset-inline-end:0;transform-origin:bottom right}:host(.pos-bottom-left) .fab-panel{inset-block-end:calc(100% + 12px);inset-inline-start:0;transform-origin:bottom left}:host(.pos-bottom-center) .fab-panel{inset-block-end:calc(100% + 12px);inset-inline-start:50%;transform:translateX(-50%) scale(0.95);transform-origin:bottom center}:host(.pos-bottom-center.is-open) .fab-panel{transform:translateX(-50%) scale(1)}:host(.pos-top-right) .fab-panel{inset-block-start:calc(100% + 12px);inset-inline-end:0;transform-origin:top right}:host(.pos-top-left) .fab-panel{inset-block-start:calc(100% + 12px);inset-inline-start:0;transform-origin:top left}:host(.pos-top-center) .fab-panel{inset-block-start:calc(100% + 12px);inset-inline-start:50%;transform:translateX(-50%) scale(0.95);transform-origin:top center}:host(.pos-top-center.is-open) .fab-panel{transform:translateX(-50%) scale(1)}:host(.pos-center-right) .fab-panel{inset-inline-end:calc(100% + 12px);inset-block-start:50%;transform:translateY(-50%) scale(0.95);transform-origin:center right}:host(.pos-center-right.is-open) .fab-panel{transform:translateY(-50%) scale(1)}:host(.pos-center-left) .fab-panel{inset-inline-start:calc(100% + 12px);inset-block-start:50%;transform:translateY(-50%) scale(0.95);transform-origin:center left}:host(.pos-center-left.is-open) .fab-panel{transform:translateY(-50%) scale(1)}"}},[769,"ui-fab",{isExpanded:[1028,"is-expanded"],defaultOpen:[4,"default-open"],position:[1],direction:[1],variant:[1],size:[1],type:[1],icon:[1],label:[1],disabled:[4],loading:[4],toggle:[4],isDraggable:[4,"is-draggable"],hideOnScroll:[4,"hide-on-scroll"],showOnScrollUp:[4,"show-on-scroll-up"],offsetX:[2,"offset-x"],offsetY:[2,"offset-y"],zIndex:[2,"z-index"],expandOnHover:[4,"expand-on-hover"],expandOnClick:[4,"expand-on-click"],closeOnAction:[4,"close-on-action"],backdrop:[4],backdropClose:[4,"backdrop-close"],persistent:[4],animation:[1],panel:[4],panelTitle:[1,"panel-title"],panelWidth:[1,"panel-width"],panelHeight:[1,"panel-height"],panelMaxHeight:[1,"panel-max-height"],isDragging:[32],isHidden:[32],currentX:[32],currentY:[32],openFab:[64],closeFab:[64],toggleFab:[64],show:[64],hide:[64]},[[9,"scroll","handleScroll"],[0,"keydown","handleKeyDown"],[0,"uiFabActionClick","onActionClick"]],{isExpanded:[{openChanged:0}]}]),f=c,h=function(){"undefined"!=typeof customElements&&["ui-fab","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-fab":customElements.get(r(t))||customElements.define(r(t),c);break;case"ui-badge":customElements.get(r(t))||o();break;case"ui-button":customElements.get(r(t))||n();break;case"ui-icon":customElements.get(r(t))||l();break;case"ui-loader":customElements.get(r(t))||d()}}))};export{f as UiFab,h as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as i,createEvent as a,h as s,Host as t,transformTag as o}from"@stencil/core/internal/client";import{d as r,a as l}from"./badge.js";import{d}from"./icon.js";import{d as n}from"./loader.js";const c=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.fileSelect=a(this,"fileSelect",7),this.fileRemove=a(this,"fileRemove",7),this.fileReject=a(this,"fileReject",7),this.uploadProgress=a(this,"uploadProgress",7),this.uploadSuccess=a(this,"uploadSuccess",7),this.allUploadsComplete=a(this,"allUploadsComplete",7)}disconnectedCallback(){Object.values(this.uploadIntervals).forEach((e=>clearInterval(e))),this.uploadIntervals={}}label="";helperText="";accept="";multiple=!1;maxSize=10485760;minSize=0;maxFiles=5;showPreview=!0;disabled=!1;variant="dropzone";uploadIcon="📁";rtl=!1;capture=!1;validateFileName=!0;fileNamePattern="";showValidateButton=!1;showUploadButton=!1;autoUpload=!0;autoCloseOnSuccess=!1;headerTitle="";isDragging=!1;files=[];errors=[];componentStatus="idle";uploadIntervals={};fileSelect;fileRemove;fileReject;uploadProgress;uploadSuccess;allUploadsComplete;inputRef;async removeInvalidFiles(){this.files=this.files.filter((e=>"error"!==e.status)),this.errors=[],this.fileSelect.emit(this.files)}async validate(){this.componentStatus="validating";let e=!0;const i=this.files.map((i=>"pending"!==i.status&&"validating"!==i.status?i:this.validateFile(i.file).length>0?(e=!1,{...i,status:"error"}):{...i,status:"pending"}));return this.files=[...i],await new Promise((e=>setTimeout(e,600))),this.componentStatus=e?"idle":"error",e}async upload(){if("uploading"===this.componentStatus)return;this.componentStatus="uploading";const e=this.files.filter((e=>"pending"===e.status||"error"===e.status));0!==e.length?e.forEach((e=>{this.startSimulation(e.name)})):this.componentStatus="idle"}async clear(){Object.values(this.uploadIntervals).forEach((e=>clearInterval(e))),this.uploadIntervals={},this.files=[],this.errors=[],this.componentStatus="idle"}formatSize(e){return e<1024?e+" B":e<1048576?(e/1024).toFixed(1)+" KB":(e/1048576).toFixed(1)+" MB"}getAcceptTokens(){return this.accept.split(",").map((e=>e.trim())).filter(Boolean)}matchesAcceptRule(e){const i=this.getAcceptTokens();if(0===i.length)return!0;const a=(e.type||"").toLowerCase(),s=e.name.toLowerCase();return i.some((e=>{const i=e.toLowerCase();return i.startsWith(".")?s.endsWith(i):i.endsWith("/*")?a.startsWith(i.slice(0,-1)):a===i}))}getFileNameValidationError(e){if(!this.validateFileName)return null;if(!e.trim())return{fileName:e,message:"A selected file is missing a valid name",rule:"invalid-name"};if(/[<>:"/\\|?*\u0000-\u001F]/.test(e))return{fileName:e,message:e+" contains invalid filename characters",rule:"invalid-name"};if(/[. ]$/.test(e))return{fileName:e,message:e+" cannot end with a space or period",rule:"invalid-name"};const i=e.replace(/\.[^/.]+$/,"");if(/^(con|prn|aux|nul|com[1-9]|lpt[1-9])$/i.test(i))return{fileName:e,message:e+" uses a reserved filename",rule:"reserved-name"};if(this.fileNamePattern)try{if(!RegExp(this.fileNamePattern).test(e))return{fileName:e,message:e+" does not match the required filename pattern",rule:"file-name-pattern"}}catch(e){}return null}validateFile(e){const i=[],a=this.getFileNameValidationError(e.name);return a&&i.push(a),this.minSize>0&&e.size<this.minSize&&i.push({fileName:e.name,message:`${e.name} is smaller than the minimum size (${this.formatSize(this.minSize)})`,rule:"min-size"}),e.size>this.maxSize&&i.push({fileName:e.name,message:`${e.name} exceeds max size (${this.formatSize(this.maxSize)})`,rule:"max-size"}),this.matchesAcceptRule(e)||i.push({fileName:e.name,message:e.name+" is not an accepted file type",rule:"accept"}),i}processFiles(e){const i=[],a=[],s=this.maxFiles-this.files.length;s<=0&&i.push({fileName:"",message:`You can upload up to ${this.maxFiles} files`,rule:"max-files"}),e.length>s&&s>0&&i.push({fileName:"",message:`Only ${s} more file${1===s?"":"s"} can be added`,rule:"max-files"}),Array.from(e).slice(0,s).forEach((e=>{const s=this.files.some((i=>i.name===e.name&&i.size===e.size)),t={name:e.name,size:e.size,type:e.type,file:e,status:"pending",progress:0};s&&(t.status="error",t.errorMessage=`Duplicate detected: "${e.name}"`,i.push({fileName:e.name,message:t.errorMessage,rule:"duplicate-file"})),0===e.size&&(t.status="error",t.errorMessage="File is empty (0 bytes)",i.push({fileName:e.name,message:t.errorMessage,rule:"empty-file"}));const o=this.validateFile(e);o.length>0&&"error"!==t.status&&(t.status="error",t.errorMessage=o[0].message,i.push(...o));const r=new FileReader;r.onload=e=>{t.dataUrl=e.target?.result,this.files=[...this.files]},e.type.startsWith("image/")&&r.readAsDataURL(e),a.push(t)})),this.errors=i.map((e=>e.message)),this.files=[...this.files,...a],this.autoUpload&&a.filter((e=>"pending"===e.status)).forEach((e=>this.startSimulation(e.name))),i.length>0&&this.fileReject.emit(i),this.fileSelect.emit(this.files)}handleDrop=e=>{e.preventDefault(),this.isDragging=!1,!this.disabled&&e.dataTransfer?.files&&this.processFiles(e.dataTransfer.files)};handlePaste=e=>{!this.disabled&&e.clipboardData?.files.length&&this.processFiles(e.clipboardData.files)};startSimulation(e){this.uploadIntervals[e]&&clearInterval(this.uploadIntervals[e]);const i=this.files.findIndex((i=>i.name===e));-1!==i&&(this.files[i].status="uploading",this.files=[...this.files],this.uploadIntervals[e]=setInterval((()=>{const i=this.files.findIndex((i=>i.name===e));if(-1===i)return void clearInterval(this.uploadIntervals[e]);const a=this.files[i].progress||0;if(a>=100)clearInterval(this.uploadIntervals[e]),delete this.uploadIntervals[e],this.files[i].status="success",this.files[i].progress=100,this.files=[...this.files],this.uploadSuccess.emit(this.files[i]),this.checkAllComplete();else{const s=Math.min(100,a+15*Math.random()+5);this.files[i].progress=s,this.files=[...this.files],this.uploadProgress.emit({fileName:e,progress:s})}}),400))}checkAllComplete(){this.files.every((e=>"success"===e.status||"error"===e.status))&&this.files.length>0&&(this.allUploadsComplete.emit(this.files),this.componentStatus="success",this.autoCloseOnSuccess&&setTimeout((()=>{this.clear()}),1500))}handleFileInput=e=>{const i=e.target;i.files&&this.processFiles(i.files),i.value=""};removeFile=e=>{const i=this.files[e];this.uploadIntervals[i.name]&&(clearInterval(this.uploadIntervals[i.name]),delete this.uploadIntervals[i.name]),this.files=this.files.filter(((i,a)=>a!==e)),this.fileRemove.emit(i.name),this.fileSelect.emit(this.files)};getIcon(e){return e.startsWith("image/")?"🖼️":"application/pdf"===e?"📄":e.includes("word")?"📝":e.includes("sheet")||e.includes("excel")?"📊":e.includes("zip")||e.includes("rar")?"🗜️":"📎"}render(){const e=!this.disabled&&this.files.length<this.maxFiles,i=this.files.length>0,a="uploading"===this.componentStatus,o="validating"===this.componentStatus,r=this.files.filter((e=>"error"!==e.status)).length,l=this.files.some((e=>"error"===e.status));return s(t,{key:"e023a6d860e04cbad81a073a3d921b4670644ea1",dir:this.rtl?"rtl":"ltr",onPaste:this.handlePaste,class:{"is-sideload":"sideload"===this.variant}},"sideload"===this.variant&&s("div",{key:"f0a9154a2d0fd3574b659674cf76f3a12f058d57",class:"fu-sideload-header"},s("div",{key:"83d0168bac94abaa64b8e97026c97fd8d2423ae3",class:"fu-header-title-row"},s("ui-icon",{key:"8387010b6ef439d6de023eb97eb18fc38d9aa06d",name:"upload-cloud",library:"lucide",size:"24px",color:"var(--color-primary, #10b981)"}),s("h2",{key:"a31a8e98afedd667a99090de154ee41565e7d6ca"},this.headerTitle||"Sideload Firmware"),s("ui-button",{key:"b6253491fe52f40256bc7160c5d7f127f56618f3",variant:"ghost",size:"md",iconOnly:!0,icon:"x",iconLibrary:"lucide",class:"fu-close-dialog"})),s("div",{key:"b1628a83b975aaf63a78fb4827eda5b723d7559e",class:{"fu-sideload-zone":!0,"is-dragging":this.isDragging},onDragOver:e=>{e.preventDefault(),this.isDragging=!0},onDragLeave:()=>this.isDragging=!1,onDrop:this.handleDrop,onClick:()=>e&&this.inputRef?.click()},s("ui-icon",{key:"438322e56615a49d5b59ce048a53baa70a378bbd",name:"upload",library:"lucide",size:"20px",color:"var(--color-primary, #10b981)"}),s("span",{key:"55635c6bdee2d0f6cdb76f6c631e43af00119c29"},"Drop more files or ",s("strong",{key:"38a4347b3acc9f226d8807513a13e896cc3988ab",class:"fu-browse-pill"},"Browse")))),this.label&&"sideload"!==this.variant&&s("label",{key:"8d7e1ab4892d62a638a0ac2a7ed3de49ea4db3a7",class:"fu-label"},this.label),"dropzone"===this.variant&&s("div",{key:"e3db150b83ca3874088a4f0ab4ff721d1eb8599a",class:{"fu-zone":!0,"fu-dragging":this.isDragging,"fu-disabled":this.disabled},onDragOver:e=>{e.preventDefault(),this.isDragging=!0},onDragLeave:()=>this.isDragging=!1,onDrop:this.handleDrop,onClick:()=>e&&this.inputRef?.click()},s("div",{key:"c067ae850850024015757974c5e881b1fc52cdd0",class:"fu-zone-icon"},this.uploadIcon),s("div",{key:"a438cded36e799c246e29bd636bc79c833246d2e",class:"fu-zone-title"},"Drag & drop files here"),s("div",{key:"952dd6afce21218fa9a3b9c1f7cb1a2854ab9f21",class:"fu-zone-sub"},"or ",s("span",{key:"5946db023c7713f63ff402082de612cfe27d79e1",class:"fu-zone-browse"},"browse files")),s("div",{key:"0b63680de4b4c3d99a985747efd1bdf2733b8c1a",class:"fu-zone-limit"},this.accept&&s("span",{key:"5c75daa15408bec904c57ee6f7e4af4ba09f56b7"},"Accepts: ",this.accept),s("span",{key:"34488fd0e8064650fcbc50672d9f4b40b56c3252"},"Max ",this.formatSize(this.maxSize)," · Up to ",this.maxFiles," files"))),("button"===this.variant||"compact"===this.variant)&&s("div",{key:"805a97dbff1ac3911e20d25d9feb5dc0e0254d90",class:"fu-trigger-row"},"button"===this.variant&&s("ui-button",{key:"54b3624ef218f5c5c8d62a4c5dc88fe24ddc9a27",variant:"primary",onClick:()=>e&&this.inputRef?.click(),disabled:this.disabled||a,label:this.label||"Select Files",icon:this.uploadIcon}),"compact"===this.variant&&s("div",{key:"3ebbfb44da248d985e86f48759772545de916d5d",class:{"fu-compact":!0,"fu-disabled":this.disabled},onClick:()=>e&&this.inputRef?.click()},s("span",{key:"39e88c85f57b10cec99d7c677689cd0402b8b5b0",class:"fu-compact-icon"},this.uploadIcon),s("span",{key:"41e011e8f46008ef0e803fcfe7bbecc55e7ddd98",class:"fu-compact-text"},this.label||"Choose file"),s("span",{key:"5f2c96e19c6ab3d715ffbd9d33fd49c507cda31b",class:"fu-compact-count"},this.files.length," / ",this.maxFiles)),(this.showValidateButton||this.showUploadButton)&&s("div",{key:"494128b8db00f33ab9d602b78c2c17c9374ddf0a",class:"fu-actions"},this.showValidateButton&&s("ui-button",{key:"470be75a0b9a69b8557f749c615f60848b045f7f",variant:"outline",size:"md",loading:o,disabled:a||this.disabled||!i,onClick:()=>this.validate(),label:"Validate"}),this.showUploadButton&&s("ui-button",{key:"14cea3a0039fe06e5a6eff5baf4ce1ffcee724ad",variant:"primary",size:"md",loading:a,disabled:o||this.disabled||!i,onClick:()=>this.upload(),label:"Upload All",icon:"upload",iconLibrary:"lucide"}))),"dropzone"===this.variant&&(this.showValidateButton||this.showUploadButton)&&s("div",{key:"aba1a4dc3bfffe9b2613719ce2ae876e10bd9aca",class:"fu-dropzone-actions"},s("span",{key:"f6bddf09dfb74057ee74aff7e82a38a999973e9c",class:"fu-status-text"},i?this.files.length+" file(s) selected":"No files selected"),s("div",{key:"e050caeb8ba45b9d2d0adeddf659b5a53abddf89",class:"fu-button-group"},this.showValidateButton&&s("ui-button",{key:"95b6ea727bbe7cad4a3ba6f10e1b3777393b4ca4",variant:"ghost",size:"md",loading:o,disabled:a||!i,onClick:()=>this.validate(),label:"Validate Files"}),this.showUploadButton&&s("ui-button",{key:"3d92daaa1f7d0bb85e1bf016fb53aa0f771c4510",variant:"primary",size:"md",loading:a,disabled:o||!i,onClick:()=>this.upload(),label:"Start Upload"}))),s("input",{key:"33eaf23068f5a8042b7e44ef8564f22860693395",ref:e=>this.inputRef=e,type:"file",class:"fu-input-hidden",accept:this.accept,multiple:this.multiple,capture:!0===this.capture?"environment":this.capture||void 0,onChange:this.handleFileInput}),this.errors.length>0&&"sideload"!==this.variant&&s("div",{key:"7c206fe6b3cd098262a1061e9abf88909c443fb2",class:"fu-errors"},this.errors.map((e=>s("div",{class:"fu-error"},"⚠ ",e)))),this.showPreview&&i&&s("div",{key:"36884700bc547826dfbfa32556a59e56ea0c9ff1",class:{"fu-file-list":!0,"is-sideload-list":"sideload"===this.variant}},"sideload"!==this.variant&&s("div",{key:"634011f23cba7105437851f7e969e98ee1e46c09",class:"fu-list-header"},"QUEUED FILES"),this.files.map(((e,i)=>{const t=e.progress||0,o=e.status,r="error"===o?"alert-triangle":"success"===o?"check-circle":"info",l="error"===o?"#f59e0b":"success"===o?"#10b981":"#3b82f6";return s("div",{class:{"fu-file-item":!0,["is-"+o]:!0},key:e.name+i},"sideload"===this.variant?s("ui-icon",{class:"fu-sideload-item-icon",name:r,library:"lucide",size:"24px",color:l}):e.type.startsWith("image/")&&e.dataUrl?s("img",{class:"fu-thumb",src:e.dataUrl,alt:e.name}):s("span",{class:"fu-file-icon"},this.getIcon(e.type)),s("div",{class:"fu-file-info"},s("div",{class:"fu-file-name-row"},s("span",{class:"fu-file-name"},e.name),s("span",{class:"fu-file-status"},"sideload"!==this.variant&&s("span",{class:"fu-status-label"},{pending:"Ready",validating:"Validating...",uploading:"Uploading...",success:"Complete",error:"Failed"}[o]),"success"===o&&s("ui-icon",{name:"check",library:"lucide",size:"14px",color:"#10b981"}),"error"===o&&"sideload"!==this.variant&&s("ui-icon",{name:"alert-circle",library:"lucide",size:"14px",color:"#ef4444"}),"uploading"===o&&s("span",{class:"fu-file-percent"},Math.round(t),"%"))),s("div",{class:"fu-file-meta"},s("span",{class:"fu-file-size"},this.formatSize(e.size)),e.errorMessage&&s("span",{class:"fu-item-error-msg"}," · ",e.errorMessage)),("uploading"===o||"success"===o)&&s("div",{class:"fu-progress-bar"},s("div",{class:"fu-progress-fill",style:{width:t+"%"}}))),s("ui-button",{variant:"ghost",size:"xxs",iconOnly:!0,class:"fu-remove",onClick:e=>{e.stopPropagation(),this.removeFile(i)},ariaLabel:"Remove",icon:"x-circle",iconLibrary:"lucide",iconSize:"18px",disabled:a&&"uploading"===o}))}))),"sideload"===this.variant&&s("div",{key:"ef71906dbefd987da6f7cf54dacb41528d8e7d4b",class:"fu-sideload-footer"},s("div",{key:"e5ce897412814293206de68572bce9fe93478fff",class:"fu-footer-actions-left"},l&&s("ui-button",{key:"40c336eb57ba23767800511d7f8a5525c3bb3a0f",variant:"ghost",size:"md",label:"Clean Queue",onClick:()=>this.removeInvalidFiles(),icon:"trash-2",iconLibrary:"lucide"})),s("div",{key:"31c7983a14455d24158aa3c7bb69b490f995968e",class:"fu-footer-actions-right"},s("ui-button",{key:"d9723f7193044a178473437cad30d2074d41b6b4",variant:"outline",label:"Cancel",onClick:()=>this.clear()}),s("ui-button",{key:"532aae5a83893629ee5d8186904286393183f5e7",variant:"primary",label:`Upload ${r} files`,disabled:0===r||a,loading:a,onClick:()=>this.upload(),icon:"upload",iconLibrary:"lucide"}))),this.helperText&&"sideload"!==this.variant&&s("div",{key:"6bd4941a135fbf542f3d9ca275847660424695d9",class:"fu-helper"},this.helperText))}static get style(){return".sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;font-family:inherit}:host(.is-sideload){background:white;border-radius:24px;overflow:hidden;box-shadow:0 10px 40px rgba(0, 0, 0, 0.12);border:1px solid #e5e7eb}.fu-label{display:block;font-size:13px;font-weight:600;color:var(--text-secondary, #374151);margin-bottom:6px}.fu-sideload-header{padding:32px 32px 16px 32px}.fu-header-title-row{display:flex;align-items:center;gap:16px;margin-bottom:24px}.fu-header-title-row h2{margin:0;font-size:28px;font-weight:500;color:#111827;flex:1}.fu-close-dialog{background:#ef4444 !important;color:white !important;border-radius:8px !important;width:36px;height:36px}.fu-sideload-zone{border:2px dashed #e5e7eb;border-radius:12px;padding:16px;display:flex;align-items:center;justify-content:center;gap:12px;cursor:pointer;background:#fdfdfd;transition:all 0.2s}.fu-sideload-zone:hover,.fu-sideload-zone.is-dragging{border-color:#10b981;background:#f0fdf4}.fu-sideload-zone span{font-size:15px;color:#4b5563}.fu-browse-pill{background:#10b981;color:white;padding:2px 12px;border-radius:20px;font-weight:600;margin-left:4px}.fu-zone{border:2px dashed var(--border-strong, #d1d5db);border-radius:14px;padding:40px 24px;text-align:center;cursor:pointer;background:var(--bg-primary, #fafafa);transition:border-color 0.2s, background 0.2s}.fu-zone:hover:not(.fu-disabled){border-color:var(--color-primary, #10b981);background:var(--bg-primary, #eff6ff)}.fu-zone.fu-dragging{border-color:var(--color-primary, #10b981);background:var(--bg-primary, #eff6ff);box-shadow:inset 0 0 0 3px rgba(var(--color-primary-rgb, 59, 130, 246), 0.2)}.fu-zone.fu-disabled{opacity:0.5;cursor:not-allowed}.fu-zone-icon{font-size:40px;margin-bottom:10px}.fu-file-list{display:flex;flex-direction:column;gap:12px;padding:16px 32px;max-height:400px;overflow-y:auto}.fu-file-list.is-sideload-list{padding:0 32px 32px 32px}.fu-file-item{display:flex;align-items:center;gap:16px;padding:14px 20px;border:1px solid #e5e7eb;border-radius:14px;background:white;transition:transform 0.2s}.fu-file-item.is-error{background:#fff1f2;border-color:#fecaca}.fu-sideload-item-icon{flex-shrink:0}.fu-file-info{flex:1;min-width:0}.fu-file-name{display:block;font-size:15px;font-weight:600;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fu-file-meta{font-size:13px;color:#6b7280;margin-top:2px}.fu-item-error-msg{color:#ef4444;font-weight:700;background:rgba(239, 68, 68, 0.08);padding:1px 6px;border-radius:4px}.fu-remove{color:#9ca3af !important}.fu-remove:hover{color:#ef4444 !important}.fu-sideload-footer{padding:24px 32px;background:#f9fafb;border-top:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between}.fu-footer-actions-right{display:flex;gap:12px}.fu-trigger-row{display:flex;align-items:center;gap:16px}.fu-actions{display:flex;gap:8px}.fu-progress-bar{height:6px;background:#e5e7eb;border-radius:3px;margin-top:10px;overflow:hidden}.fu-progress-fill{height:100%;background:#10b981;transition:width 0.3s ease}.fu-input-hidden{display:none}"}},[513,"ui-file-upload",{label:[1],helperText:[1,"helper-text"],accept:[1],multiple:[4],maxSize:[2,"max-size"],minSize:[2,"min-size"],maxFiles:[2,"max-files"],showPreview:[4,"show-preview"],disabled:[4],variant:[1],uploadIcon:[1,"upload-icon"],rtl:[4],capture:[8],validateFileName:[4,"validate-file-name"],fileNamePattern:[1,"file-name-pattern"],showValidateButton:[4,"show-validate-button"],showUploadButton:[4,"show-upload-button"],autoUpload:[4,"auto-upload"],autoCloseOnSuccess:[4,"auto-close-on-success"],headerTitle:[1,"header-title"],isDragging:[32],files:[32],errors:[32],componentStatus:[32],removeInvalidFiles:[64],validate:[64],upload:[64],clear:[64]}]),f=c,u=function(){"undefined"!=typeof customElements&&["ui-file-upload","ui-badge","ui-button","ui-icon","ui-loader"].forEach((e=>{switch(e){case"ui-file-upload":customElements.get(o(e))||customElements.define(o(e),c);break;case"ui-badge":customElements.get(o(e))||l();break;case"ui-button":customElements.get(o(e))||r();break;case"ui-icon":customElements.get(o(e))||d();break;case"ui-loader":customElements.get(o(e))||n()}}))};export{f as UiFileUpload,u as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as a,createEvent as t,h as o,Host as r,transformTag as i}from"@stencil/core/internal/client";import{d as s}from"./badge.js";import{d}from"./button.js";import{d as l}from"./icon.js";import{d as n}from"./loader.js";const u=e(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.fileSelect=t(this,"fileSelect",7),this.fileRemove=t(this,"fileRemove",7),this.fileReject=t(this,"fileReject",7),this.uploadProgress=t(this,"uploadProgress",7),this.uploadSuccess=t(this,"uploadSuccess",7),this.allUploadsComplete=t(this,"allUploadsComplete",7)}disconnectedCallback(){Object.values(this.uploadIntervals).forEach((e=>clearInterval(e))),this.uploadIntervals={}}label="";helperText="";accept="";multiple=!1;maxSize=10485760;minSize=0;maxFiles=5;showPreview=!0;disabled=!1;variant="dropzone";uploadIcon="";rtl=!1;capture=!1;validateFileName=!0;fileNamePattern="";showValidateButton=!1;showUploadButton=!1;autoUpload=!0;autoCloseOnSuccess=!1;directory=!1;headerTitle="";isDragging=!1;files=[];errors=[];componentStatus="idle";isQueueOpen=!1;previewFileIndex=-1;uploadIntervals={};fileSelect;fileRemove;fileReject;uploadProgress;uploadSuccess;allUploadsComplete;inputRef;async removeInvalidFiles(){this.files=this.files.filter((e=>"error"!==e.status)),this.errors=[],this.fileSelect.emit(this.files)}async validate(){this.componentStatus="validating";let e=!0;const a=this.files.map((a=>"pending"!==a.status&&"validating"!==a.status?a:this.validateFile(a.file).length>0?(e=!1,{...a,status:"error"}):{...a,status:"pending"}));return this.files=[...a],await new Promise((e=>setTimeout(e,600))),this.componentStatus=e?"idle":"error",e}async upload(){if("uploading"===this.componentStatus)return;this.componentStatus="uploading";const e=this.files.filter((e=>"pending"===e.status||"error"===e.status));0!==e.length?e.forEach((e=>{this.startSimulation(e.name)})):this.componentStatus="idle"}async clear(){Object.values(this.uploadIntervals).forEach((e=>clearInterval(e))),this.uploadIntervals={},this.files=[],this.errors=[],this.componentStatus="idle",this.isQueueOpen=!1,this.previewFileIndex=-1}formatSize(e){return e<1024?e+" B":e<1048576?(e/1024).toFixed(1)+" KB":(e/1048576).toFixed(1)+" MB"}getAcceptTokens(){return this.accept.split(",").map((e=>e.trim())).filter(Boolean)}matchesAcceptRule(e){const a=this.getAcceptTokens();if(0===a.length)return!0;const t=(e.type||"").toLowerCase(),o=e.name.toLowerCase();return a.some((e=>{const a=e.toLowerCase();return a.startsWith(".")?o.endsWith(a):a.endsWith("/*")?t.startsWith(a.slice(0,-1)):t===a}))}getFileNameValidationError(e){if(!this.validateFileName)return null;if(!e.trim())return{fileName:e,message:"A selected file is missing a valid name",rule:"invalid-name"};if(/[<>:"/\\|?*\u0000-\u001F]/.test(e))return{fileName:e,message:e+" contains invalid filename characters",rule:"invalid-name"};if(/[. ]$/.test(e))return{fileName:e,message:e+" cannot end with a space or period",rule:"invalid-name"};const a=e.replace(/\.[^/.]+$/,"");if(/^(con|prn|aux|nul|com[1-9]|lpt[1-9])$/i.test(a))return{fileName:e,message:e+" uses a reserved filename",rule:"reserved-name"};if(this.fileNamePattern)try{if(!RegExp(this.fileNamePattern).test(e))return{fileName:e,message:e+" does not match the required filename pattern",rule:"file-name-pattern"}}catch(e){}return null}validateFile(e){const a=[],t=this.getFileNameValidationError(e.name);return t&&a.push(t),0===e.size?(a.push({fileName:e.name,message:e.name+" is empty (0 KB) and cannot be uploaded",rule:"empty-file"}),a):(this.minSize>0&&e.size<this.minSize&&a.push({fileName:e.name,message:`${e.name} is smaller than the minimum size (${this.formatSize(this.minSize)})`,rule:"min-size"}),e.size>this.maxSize&&a.push({fileName:e.name,message:`${e.name} exceeds max size (${this.formatSize(this.maxSize)})`,rule:"max-size"}),this.matchesAcceptRule(e)||a.push({fileName:e.name,message:e.name+" is not an accepted file type",rule:"accept"}),a)}processFiles(e){const a=[],t=[],o=this.maxFiles-this.files.length;o<=0&&a.push({fileName:"",message:`You can upload up to ${this.maxFiles} files`,rule:"max-files"}),e.length>o&&o>0&&a.push({fileName:"",message:`Only ${o} more file${1===o?"":"s"} can be added`,rule:"max-files"}),Array.from(e).slice(0,o).forEach((e=>{const o=this.files.some((a=>a.name===e.name&&a.size===e.size)),r={name:e.name,size:e.size,type:e.type,file:e,status:"pending",progress:0};o&&(r.status="error",r.errorMessage=`Duplicate detected: "${e.name}"`,a.push({fileName:e.name,message:r.errorMessage,rule:"duplicate-file"}));const i=this.validateFile(e);i.length>0&&"error"!==r.status&&(r.status="error",r.errorMessage=i[0].message,a.push(...i));const s=new FileReader;s.onload=e=>{r.dataUrl=e.target?.result,this.files=[...this.files]},e.type.startsWith("image/")&&s.readAsDataURL(e),t.push(r)})),this.errors=a.map((e=>e.message)),this.files=[...this.files,...t],t.length>0&&"sideload"!==this.variant&&(this.isQueueOpen=!0),this.autoUpload&&t.filter((e=>"pending"===e.status)).forEach((e=>this.startSimulation(e.name))),a.length>0&&this.fileReject.emit(a),this.fileSelect.emit(this.files)}handleDrop=e=>{e.preventDefault(),this.isDragging=!1,!this.disabled&&e.dataTransfer?.files&&this.processFiles(e.dataTransfer.files)};handlePaste=e=>{!this.disabled&&e.clipboardData?.files.length&&this.processFiles(e.clipboardData.files)};startSimulation(e){this.uploadIntervals[e]&&clearInterval(this.uploadIntervals[e]);const a=this.files.findIndex((a=>a.name===e));-1!==a&&(this.files[a].status="uploading",this.files=[...this.files],this.uploadIntervals[e]=setInterval((()=>{const a=this.files.findIndex((a=>a.name===e));if(-1===a)return void clearInterval(this.uploadIntervals[e]);const t=this.files[a].progress||0;if(t>=100)clearInterval(this.uploadIntervals[e]),delete this.uploadIntervals[e],this.files[a].status="success",this.files[a].progress=100,this.files=[...this.files],this.uploadSuccess.emit(this.files[a]),this.checkAllComplete();else{const o=Math.min(100,t+15*Math.random()+5);this.files[a].progress=o,this.files=[...this.files],this.uploadProgress.emit({fileName:e,progress:o})}}),400))}checkAllComplete(){this.files.every((e=>"success"===e.status||"error"===e.status))&&this.files.length>0&&(this.allUploadsComplete.emit(this.files),this.componentStatus="success",this.autoCloseOnSuccess&&setTimeout((()=>{this.clear()}),1500))}handleFileInput=e=>{const a=e.target;a.files&&this.processFiles(a.files),a.value=""};removeFile=e=>{const a=this.files[e];this.uploadIntervals[a.name]&&(clearInterval(this.uploadIntervals[a.name]),delete this.uploadIntervals[a.name]),this.files=this.files.filter(((a,t)=>t!==e)),this.errors=this.errors.filter((e=>!e.includes(a.name))),this.files.length<this.maxFiles&&(this.errors=this.errors.filter((e=>!e.includes("more file")&&!e.includes("upload up to")))),0===this.files.length&&(this.errors=[]),this.fileRemove.emit(a.name),this.fileSelect.emit(this.files)};getFileIconStyles(e){const a=(e||"").toLowerCase();return a.startsWith("image/")?{icon:"image",bg:"rgba(168, 85, 247, 0.08)",color:"rgb(168, 85, 247)"}:"application/pdf"===a||a.includes("pdf")||a.includes("word")||a.includes("document")?{icon:"file-text",bg:"rgba(59, 130, 246, 0.08)",color:"rgb(59, 130, 246)"}:a.includes("sheet")||a.includes("excel")||a.includes("csv")||a.includes("spreadsheet")?{icon:"file-spreadsheet",bg:"rgba(16, 185, 129, 0.08)",color:"rgb(16, 185, 129)"}:a.includes("zip")||a.includes("rar")||a.includes("tar")||a.includes("compressed")||a.includes("7z")?{icon:"archive",bg:"rgba(245, 158, 11, 0.08)",color:"rgb(245, 158, 11)"}:a.startsWith("audio/")?{icon:"music",bg:"rgba(236, 72, 153, 0.08)",color:"rgb(236, 72, 153)"}:a.startsWith("video/")?{icon:"video",bg:"rgba(239, 68, 68, 0.08)",color:"rgb(239, 68, 68)"}:{icon:"file",bg:"rgba(107, 114, 128, 0.08)",color:"rgb(107, 114, 128)"}}renderUploadZoneIcon(e="40px"){return this.uploadIcon?/^[a-z0-9-]+$/.test(this.uploadIcon)?o("ui-icon",{name:this.uploadIcon,library:"lucide",size:e,color:"var(--color-primary, #10b981)"}):o("span",{class:"fu-upload-icon-text"},this.uploadIcon):o("ui-icon",{name:"upload-cloud",library:"lucide",size:e,color:"var(--color-primary, #10b981)"})}renderFileRow(e,a,t){const r=e.progress||0,i=e.status,{icon:s,bg:d,color:l}=this.getFileIconStyles(e.type),n="error"===i?"alert-triangle":s,u="error"===i?"rgba(239, 68, 68, 0.08)":d,c="error"===i?"rgb(239, 68, 68)":l;return o("div",{class:{"fu-file-item":!0,["is-"+i]:!0,"is-clickable":!0},key:e.name+a,onClick:()=>{this.previewFileIndex=a},title:"Click to preview"},o("div",{class:"fu-file-icon-wrapper",style:{backgroundColor:u}},o("ui-icon",{name:n,library:"lucide",size:"20px",color:c})),o("div",{class:"fu-file-info"},o("div",{class:"fu-file-name-row"},o("span",{class:"fu-file-name",title:e.name},e.name),o("span",{class:"fu-file-status"},"success"===i&&o("span",{class:"fu-status-badge is-success"},o("ui-icon",{name:"check",library:"lucide",size:"12px",color:"#10b981"}),o("span",null,"Done")),"uploading"===i&&o("span",{class:"fu-status-badge is-uploading"},o("span",{class:"fu-spinner-dot"}),o("span",null,Math.round(r),"%")),"pending"===i&&o("span",{class:"fu-status-badge is-pending"},o("span",null,"Ready")),"validating"===i&&o("span",{class:"fu-status-badge is-validating"},o("span",null,"Validating…")),"error"===i&&o("span",{class:"fu-status-badge is-error"},o("span",null,"Failed")))),o("div",{class:"fu-file-meta"},o("span",{class:"fu-file-size"},this.formatSize(e.size)),"error"===i&&e.errorMessage&&o("span",{class:"fu-file-error-msg"},o("ui-icon",{name:"alert-circle",library:"lucide",size:"12px",color:"currentColor"}),o("span",null,e.errorMessage))),"uploading"===i&&o("div",{class:"fu-progress-bar"},o("div",{class:"fu-progress-fill",style:{width:r+"%"}}))),o("ui-button",{variant:"ghost",size:"xxs",iconOnly:!0,class:"fu-remove",onClick:e=>{e.stopPropagation(),this.removeFile(a)},ariaLabel:"Remove",icon:"x",iconLibrary:"lucide",iconSize:"16px",disabled:t&&"uploading"===i}))}renderQueueDialog(){if(!this.isQueueOpen||"sideload"===this.variant)return null;const e=this.files.length>0,a="uploading"===this.componentStatus,t="validating"===this.componentStatus,r=this.files.filter((e=>"error"!==e.status)).length,i=this.files.filter((e=>"pending"===e.status)).length,s=this.files.filter((e=>"success"===e.status)).length,d=this.files.filter((e=>"pending"===e.status||"uploading"===e.status)).length,l=this.files.filter((e=>"error"===e.status)).length,n=l>0,u=e&&this.files.every((e=>"success"===e.status)),c=!this.disabled&&this.files.length<this.maxFiles,f=!this.autoUpload||this.showUploadButton,h=f&&!u,b=()=>{this.isQueueOpen=!1,this.files=this.files.filter((e=>"success"!==e.status)),0===this.files.length&&(this.componentStatus="idle",this.errors=[],this.previewFileIndex=-1)};return o("div",{class:"fu-queue-backdrop",onClick:b},o("div",{class:{"fu-queue-dialog":!0,"fu-queue-dialog--manual":f},onClick:e=>e.stopPropagation(),role:"dialog","aria-modal":"true","aria-label":"Upload Queue"},o("div",{class:"fu-queue-header"},o("div",{class:"fu-queue-title"},o("ui-icon",{name:"upload-cloud",library:"lucide",size:"18px",color:"var(--color-primary, #10b981)"}),o("span",null,"Upload Queue"),o("span",{class:"fu-queue-count-pill"},this.files.length," file",1!==this.files.length?"s":"")),o("div",{class:"fu-queue-header-right"},o("span",{class:"fu-upload-mode-badge "+(f?"is-manual":"is-auto")},o("ui-icon",{name:f?"hand":"zap",library:"lucide",size:"11px",color:"currentColor"}),f?"Manual upload":"Auto upload"),o("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"x",iconLibrary:"lucide",onClick:b,ariaLabel:"Close dialog"}))),f&&i>0&&!a&&!u&&o("div",{class:"fu-queue-manual-banner"},o("ui-icon",{name:"mouse-pointer-click",library:"lucide",size:"14px",color:"#6366f1"}),o("span",null,i," file",1!==i?"s":""," ready — click ",o("strong",null,"Upload")," when ready.")),this.errors.length>0&&o("div",{class:"fu-queue-errors"},this.errors.map((e=>o("div",{class:"fu-queue-error-item"},o("ui-icon",{name:"alert-triangle",library:"lucide",size:"14px",color:"#ef4444"}),o("span",null,e))))),e&&o("div",{class:"fu-queue-summary"},s>0&&o("span",{class:"fu-queue-summary-stat"},o("span",{class:"fu-qs-dot success"}),s," done"),d>0&&o("span",{class:"fu-queue-summary-stat"},o("span",{class:"fu-qs-dot pending"}),d," pending"),n&&o("span",{class:"fu-queue-summary-stat"},o("span",{class:"fu-qs-dot error"}),l," failed"),this.autoUpload&&a&&o("span",{class:"fu-queue-summary-stat is-auto"},o("span",{class:"fu-spinner-dot"})," Uploading..."),u&&o("span",{class:"fu-queue-summary-stat is-complete"},o("ui-icon",{name:"check-circle",library:"lucide",size:"13px",color:"#10b981"})," All done")),o("div",{class:"fu-queue-list"},!e&&o("div",{class:"fu-queue-empty"},o("ui-icon",{name:"inbox",library:"lucide",size:"32px",color:"var(--text-muted, #9ca3af)"}),o("span",null,"No files in queue")),this.files.map(((e,t)=>this.renderFileRow(e,t,a)))),o("div",{class:"fu-queue-footer"},o("div",{class:"fu-queue-footer-left"},c&&o("ui-button",{variant:"ghost",size:"sm",label:"Add more",icon:"plus",iconLibrary:"lucide",disabled:a,onClick:()=>this.inputRef?.click()}),n&&o("ui-button",{variant:"ghost",size:"sm",label:"Remove failed",icon:"trash-2",iconLibrary:"lucide",onClick:()=>this.removeInvalidFiles()})),o("div",{class:"fu-queue-footer-right"},!a&&!u&&o("ui-button",{variant:"outline",size:"sm",label:"Cancel all",onClick:()=>this.clear()}),this.showValidateButton&&o("ui-button",{variant:"outline",size:"sm",label:"Validate",loading:t,disabled:a||!e,onClick:()=>this.validate()}),h&&o("ui-button",{variant:"primary",size:"sm",label:a?"Uploading...":`Upload ${i>0?i:r} file${1!==(i||r)?"s":""}`,icon:a?"loader":"upload",iconLibrary:"lucide",loading:a,disabled:t||0===r,onClick:()=>this.upload()}),u&&o("ui-button",{variant:"primary",size:"sm",icon:"check",iconLibrary:"lucide",label:"Done",onClick:b})))))}renderPreviewDialog(){const e=this.previewFileIndex;if(e<0||e>=this.files.length)return null;const a=this.files[e],t=a.progress||0,r=a.status,i="uploading"===r,s=a.type?.startsWith("image/")&&!!a.dataUrl,{icon:d,bg:l,color:n}=this.getFileIconStyles(a.type),u="error"===r?"alert-triangle":d,c="error"===r?"rgba(239, 68, 68, 0.08)":l,f="error"===r?"rgb(239, 68, 68)":n,h=()=>{this.previewFileIndex=-1};return o("div",{class:"fu-dialog-backdrop",onClick:h},o("div",{class:"fu-dialog",onClick:e=>e.stopPropagation(),role:"dialog","aria-modal":"true","aria-label":"File details: "+a.name},o("div",{class:"fu-dialog-header"},o("div",{class:"fu-dialog-title"},o("ui-icon",{name:"file-search",library:"lucide",size:"18px",color:"var(--color-primary, #10b981)"}),o("span",null,"File Details")),o("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"x",iconLibrary:"lucide",onClick:h,ariaLabel:"Close"})),o("div",{class:"fu-dialog-preview"},s?o("img",{class:"fu-dialog-image",src:a.dataUrl,alt:a.name}):o("div",{class:"fu-dialog-file-icon",style:{backgroundColor:c}},o("ui-icon",{name:u,library:"lucide",size:"48px",color:f}))),o("div",{class:"fu-dialog-info"},o("div",{class:"fu-dialog-name",title:a.name},a.name),o("div",{class:"fu-dialog-meta"},o("span",{class:"fu-dialog-meta-item"},o("ui-icon",{name:"hard-drive",library:"lucide",size:"13px",color:"currentColor"}),this.formatSize(a.size)),o("span",{class:"fu-dialog-meta-item"},o("ui-icon",{name:"tag",library:"lucide",size:"13px",color:"currentColor"}),a.type||"Unknown type")),o("div",{class:"fu-dialog-status-row"},"success"===r&&o("span",{class:"fu-dialog-badge is-success"},o("ui-icon",{name:"check-circle",library:"lucide",size:"14px",color:"currentColor"}),"Uploaded successfully"),"uploading"===r&&o("span",{class:"fu-dialog-badge is-uploading"},o("span",{class:"fu-spinner-dot"}),"Uploading… ",Math.round(t),"%"),"pending"===r&&o("span",{class:"fu-dialog-badge is-pending"},o("ui-icon",{name:"clock",library:"lucide",size:"14px",color:"currentColor"}),"Ready to upload"),"error"===r&&o("span",{class:"fu-dialog-badge is-error"},o("ui-icon",{name:"alert-circle",library:"lucide",size:"14px",color:"currentColor"}),a.errorMessage||"Upload failed"),"validating"===r&&o("span",{class:"fu-dialog-badge is-validating"},o("span",{class:"fu-spinner-dot"}),"Validating…")),("uploading"===r||"success"===r)&&o("div",{class:"fu-dialog-progress"},o("div",{class:"fu-dialog-progress-fill",style:{width:t+"%"}}))),o("div",{class:"fu-dialog-footer"},o("ui-button",{variant:"ghost",size:"sm",label:"Remove file",icon:"trash-2",iconLibrary:"lucide",disabled:i,onClick:()=>{this.removeFile(e),h()}}),o("div",{style:{flex:"1"}}),o("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"chevron-left",iconLibrary:"lucide",disabled:0===e,ariaLabel:"Previous file",onClick:()=>{this.previewFileIndex=e-1}}),o("span",{class:"fu-dialog-nav-count"},e+1," / ",this.files.length),o("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"chevron-right",iconLibrary:"lucide",disabled:e===this.files.length-1,ariaLabel:"Next file",onClick:()=>{this.previewFileIndex=e+1}}),o("ui-button",{variant:"primary",size:"sm",label:"Close",onClick:h}))))}render(){const e=!this.disabled&&this.files.length<this.maxFiles,a=this.files.length>0,t="uploading"===this.componentStatus,i=this.files.filter((e=>"error"!==e.status)).length;return o(r,{key:"d3152c915742132400c8c4bb67d9e3b89d54b632",dir:this.rtl?"rtl":"ltr",onPaste:this.handlePaste,class:{"is-sideload":"sideload"===this.variant}},"sideload"===this.variant&&o("div",{key:"dd3fe148a8860b4b9b1ef9e47358bdd46dd64a21",class:"fu-sideload-header"},o("div",{key:"0f170379a0ea0c797a6c05819af167de7c2dafed",class:"fu-header-title-row"},o("ui-icon",{key:"6b0b71f7e01651f33efaf6a2a3421367b71b47cc",name:"upload-cloud",library:"lucide",size:"24px",color:"var(--color-primary, #10b981)"}),o("h2",{key:"a4330e9cb9973cdb61ed42f65dc5a374c371d8f2"},this.headerTitle||"Sideload Firmware"),o("ui-button",{key:"2dd90814fbaa9f636c1a0f24f126ab9b31583d66",variant:"ghost",size:"md",iconOnly:!0,icon:"x",iconLibrary:"lucide",class:"fu-close-dialog"})),o("div",{key:"234c9679585087721a30df197ae8c0f3739b5c94",class:{"fu-sideload-zone":!0,"is-dragging":this.isDragging},onDragOver:e=>{e.preventDefault(),this.isDragging=!0},onDragLeave:()=>this.isDragging=!1,onDrop:this.handleDrop,onClick:()=>e&&this.inputRef?.click()},o("ui-icon",{key:"303cf7a91a182a42aa288519ba933854ffe63b94",name:"upload",library:"lucide",size:"20px",color:"var(--color-primary, #10b981)"}),o("span",{key:"d3c193b6e528ff43ce0f4ebd7959cfb0ae78b220"},"Drop more files or ",o("strong",{key:"373cba75237e24b8b6a4e384129cf9543d5cf30e",class:"fu-browse-pill"},"Browse")))),"sideload"===this.variant&&a&&o("div",{key:"e6b1e6370a769387ec8b75954e34847f93e37e05",class:"fu-file-list is-sideload-list"},this.files.map(((e,a)=>this.renderFileRow(e,a,t)))),"sideload"===this.variant&&o("div",{key:"f4d122874935aeff0dfee060c91d6299234cee5e",class:"fu-sideload-footer"},o("div",{key:"4e98b7d2bf5fa02766414def762e070d378eb98e",class:"fu-footer-actions-left"},this.files.some((e=>"error"===e.status))&&o("ui-button",{key:"a2cf99cb5992794930f97f559918a1ad02d05288",variant:"ghost",size:"md",label:"Clean Queue",icon:"trash-2",iconLibrary:"lucide",onClick:()=>this.removeInvalidFiles()})),o("div",{key:"5425b0d9c59a85e6113ab43ca1c03757bc78845b",class:"fu-footer-actions-right"},o("ui-button",{key:"c0ef12d4bd32b4eede664130f1cc662abbf1e83f",variant:"outline",label:"Cancel",onClick:()=>this.clear()}),o("ui-button",{key:"293aac09dfda74ea69b8d8ea1082ad25786ca62f",variant:"primary",label:`Upload ${i} files`,disabled:0===i||t,loading:t,onClick:()=>this.upload(),icon:"upload",iconLibrary:"lucide"}))),"sideload"!==this.variant&&o("div",{key:"ad83c062093c5992ca2f02e1b5bd11483e43f1fd"},this.label&&o("label",{key:"9b807a8af85d1fc282375a47d565b1a52d31e207",class:"fu-label"},this.label),"dropzone"===this.variant&&o("div",{key:"376d617761e2d03b3fbed7a0fa27da05a6acd1f7",class:{"fu-zone":!0,"fu-dragging":this.isDragging,"fu-disabled":this.disabled,"fu-zone-has-files":a},onDragOver:e=>{e.preventDefault(),this.isDragging=!0},onDragLeave:()=>this.isDragging=!1,onDrop:this.handleDrop,onClick:()=>e&&this.inputRef?.click()},o("div",{key:"7df435796b000ddc2af9590115ecd96d8c365bcc",class:"fu-zone-icon"},this.renderUploadZoneIcon("40px")),o("div",{key:"9cd1d88570d13b1535286a5133aa673eb56473d8",class:"fu-zone-title"},"Drag & drop files here"),o("div",{key:"82adc9f84981437ed9d1f619ad9f5b52be0a645b",class:"fu-zone-sub"},"or ",o("span",{key:"0f1f65b55b58aca3eec0d8b3667c9ebeffdc29d3",class:"fu-zone-browse"},"browse files")),o("div",{key:"b9a9021442ec5bc8e3309a51cadd2af5cb193c08",class:"fu-zone-limit"},this.accept&&o("span",{key:"12217ab2c6ce5955f966ab627740aabf114484c8"},"Accepts: ",this.accept),o("span",{key:"5ffd8530aed30321eff0c8e01c6104e2626e0476"},"Max ",this.formatSize(this.maxSize)," · Up to ",this.maxFiles," files")),a&&o("div",{key:"4d155a2c4b6516743b7ee38d2ddcc5c20d3c1089",class:"fu-zone-queue-badge",onClick:e=>{e.stopPropagation(),this.isQueueOpen=!0}},o("ui-icon",{key:"4e9d11d3444c799a6c54efbe8c3ef894be451809",name:"layers",library:"lucide",size:"14px",color:"#10b981"}),o("span",{key:"8e52407087416f63933efb6288be0e8899f06391"},this.files.length," file",1!==this.files.length?"s":""," queued"),o("span",{key:"374fbd52cbe323bea13a0749af95050030891dc4",class:"fu-zone-queue-view"},"View Queue →"))),("button"===this.variant||"compact"===this.variant||"inline"===this.variant)&&o("div",{key:"c7b031b7b628d8972fd72ab903e5324f7946fc8c",class:"fu-trigger-row"},"button"===this.variant&&o("ui-button",{key:"25a4cdca35f3c1047683825991c36335fbc0166d",variant:"primary",onClick:()=>e&&this.inputRef?.click(),disabled:this.disabled||t,label:this.label||"Select Files",icon:this.uploadIcon||"upload-cloud",iconLibrary:"lucide"}),"compact"===this.variant&&o("div",{key:"9eb1ef83a2814e814730e42c175b612cdc4f2cd8",class:{"fu-compact":!0,"fu-disabled":this.disabled},onClick:()=>e&&this.inputRef?.click()},o("span",{key:"a68573fcfc5a820a46c9b8c832ffd4ceec155651",class:"fu-compact-icon"},this.renderUploadZoneIcon("18px")),o("span",{key:"5f8c2a40cbceb3f6f10bbb4481284836e476975e",class:"fu-compact-text"},this.label||"Choose file"),o("span",{key:"ae53043e7f6dbc27bc42bde8e2bf9d7870591718",class:"fu-compact-count"},this.files.length," / ",this.maxFiles)),"inline"===this.variant&&o("button",{key:"49e94c27db6aa2b0a9eb56150abed00769a45ba2",class:{"fu-inline-trigger":!0,"fu-inline-disabled":this.disabled,"fu-inline-active":a},disabled:this.disabled,onClick:()=>e&&this.inputRef?.click(),type:"button",title:this.label||"Upload files"},o("span",{key:"148d06eb63c8df50ba268c5165fd12fb525c238e",class:"fu-inline-icon"},this.renderUploadZoneIcon("16px")),o("span",{key:"ba271f05d6d8e0b3c9419bc1e7bd367e0f7adf0d",class:"fu-inline-label"},this.label||"Upload files"),a&&o("span",{key:"d7ad2159e8e33facc99edc0926d46939c2864fb4",class:"fu-inline-badge",onClick:e=>{e.stopPropagation(),this.isQueueOpen=!0}},this.files.length)),a&&"inline"!==this.variant&&o("button",{key:"bd4a50a142bac3d136c0de7221ce15fe078628fd",class:"fu-view-queue-btn",onClick:()=>{this.isQueueOpen=!0}},o("ui-icon",{key:"71083c82786b219595cf9d8b5738848da048c0b9",name:"layers",library:"lucide",size:"14px",color:"currentColor"}),this.files.length," file",1!==this.files.length?"s":""," queued")),this.helperText&&o("div",{key:"ecc66b684f1e28a0f886faeee45b274b613f36a5",class:"fu-helper"},this.helperText)),o("input",{key:"3e50fac523ae8a776f4468782a079d8a4206ac45",ref:e=>{this.inputRef=e,e&&(this.directory?e.setAttribute("webkitdirectory",""):e.removeAttribute("webkitdirectory"))},type:"file",class:"fu-input-hidden",accept:this.accept,multiple:this.multiple||this.directory,capture:!0===this.capture?"environment":this.capture||void 0,onChange:this.handleFileInput}),this.renderQueueDialog(),this.renderPreviewDialog())}static get style(){return'@charset "UTF-8";.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;font-family:inherit}:host(.is-sideload){background:var(--bg-primary, white);border-radius:24px;overflow:hidden;box-shadow:0 10px 40px rgba(0, 0, 0, 0.12);border:1px solid var(--border-default, #e5e7eb)}.fu-label{display:block;font-size:13px;font-weight:600;color:var(--text-secondary, #374151);margin-bottom:6px}.fu-sideload-header{padding:32px 32px 16px 32px}.fu-header-title-row{display:flex;align-items:center;gap:16px;margin-bottom:24px}.fu-header-title-row h2{margin:0;font-size:28px;font-weight:500;color:var(--text-primary, #111827);flex:1}.fu-close-dialog{background:#ef4444 !important;color:white !important;border-radius:8px !important;width:36px;height:36px}.fu-sideload-zone{border:2px dashed var(--border-strong, #e5e7eb);border-radius:12px;padding:16px;display:flex;align-items:center;justify-content:center;gap:12px;cursor:pointer;background:var(--bg-secondary, #fdfdfd);transition:all 0.2s}.fu-sideload-zone:hover,.fu-sideload-zone.is-dragging{border-color:var(--color-primary, #10b981);background:rgba(16, 185, 129, 0.05)}.fu-sideload-zone span{font-size:15px;color:var(--text-secondary, #4b5563)}.fu-browse-pill{background:#10b981;color:white;padding:2px 12px;border-radius:20px;font-weight:600;margin-left:4px}.fu-zone{border:2px dashed var(--border-strong, #d1d5db);border-radius:14px;padding:40px 24px;text-align:center;cursor:pointer;background:var(--bg-primary, #fafafa);transition:border-color 0.2s, background 0.2s}.fu-zone:hover:not(.fu-disabled){border-color:var(--color-primary, #10b981);background:var(--bg-primary, #eff6ff)}.fu-zone.fu-dragging{border-color:var(--color-primary, #10b981);background:var(--bg-primary, #eff6ff);box-shadow:inset 0 0 0 3px rgba(var(--color-primary-rgb, 59, 130, 246), 0.2)}.fu-zone.fu-disabled{opacity:0.5;cursor:not-allowed}.fu-zone-icon{font-size:40px;margin-bottom:10px}.fu-file-list{display:flex;flex-direction:column;gap:10px;padding:16px 32px;max-height:400px;overflow-y:auto}.fu-file-list.is-sideload-list{padding:0 32px 32px 32px}.fu-file-item{display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--border-default, #e5e7eb);border-radius:12px;background:var(--bg-primary, white);transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);box-shadow:0 1px 3px rgba(0, 0, 0, 0.02)}.fu-file-item:hover{border-color:var(--border-strong, #d1d5db);box-shadow:0 4px 12px rgba(0, 0, 0, 0.05)}.fu-file-item.is-error{background:var(--bg-primary, #fff1f2);border-color:#fecaca}.fu-file-item.is-error:hover{border-color:var(--color-error, #ef4444)}.fu-file-item.is-success{border-color:var(--color-success, #10b981);background:var(--bg-primary, #fcfdfc)}.fu-file-item.is-success:hover{border-color:var(--color-success, #10b981)}.fu-file-icon-wrapper{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.2s}.fu-file-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.fu-file-name-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.fu-file-name{font-size:14px;font-weight:500;color:var(--text-primary, #111827);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.fu-file-status{flex-shrink:0}.fu-status-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:12px;text-transform:uppercase;letter-spacing:0.05em}.fu-status-badge.is-success{background:rgba(16, 185, 129, 0.08);color:#10b981}.fu-status-badge.is-uploading{background:rgba(59, 130, 246, 0.08);color:#3b82f6}.fu-status-badge.is-pending{background:rgba(107, 114, 128, 0.08);color:#6b7280}.fu-status-badge.is-validating{background:rgba(245, 158, 11, 0.08);color:#f59e0b}.fu-status-badge.is-error{background:rgba(239, 68, 68, 0.08);color:#ef4444}.fu-spinner-dot{width:6px;height:6px;background:currentColor;border-radius:50%;animation:fu-pulse 1.2s infinite ease-in-out}@keyframes fu-pulse{0%,100%{transform:scale(0.6);opacity:0.5}50%{transform:scale(1.2);opacity:1}}.fu-file-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-secondary, #6b7280)}.fu-file-size{font-weight:500}.fu-file-error-msg{color:#ef4444;font-weight:500;display:inline-flex;align-items:center;gap:4px;animation:fu-shake 0.3s ease-in-out}@keyframes fu-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}.fu-remove{color:#9ca3af !important;opacity:0.8;transition:all 0.2s !important}.fu-remove:hover{color:#ef4444 !important;opacity:1;transform:scale(1.05)}.fu-sideload-footer{padding:24px 32px;background:var(--bg-secondary, #f9fafb);border-top:1px solid var(--border-default, #e5e7eb);display:flex;align-items:center;justify-content:space-between}.fu-footer-actions-right{display:flex;gap:12px}.fu-trigger-row{display:flex;align-items:center;gap:16px}.fu-actions{display:flex;gap:8px}.fu-progress-bar{height:6px;background:#e5e7eb;border-radius:3px;margin-top:10px;overflow:hidden}.fu-progress-fill{height:100%;background:#10b981;transition:width 0.3s ease}.fu-input-hidden{display:none}.fu-file-item.is-clickable{cursor:pointer}.fu-file-item.is-clickable:hover{background:var(--bg-secondary, #f9fafb);border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--border-default, #e5e7eb)}.fu-zone-has-files{border-color:var(--color-primary, #10b981)}.fu-zone-queue-badge{display:inline-flex;align-items:center;gap:6px;margin-top:12px;padding:6px 14px;background:rgba(16, 185, 129, 0.1);border:1.5px solid rgba(16, 185, 129, 0.35);border-radius:20px;font-size:13px;font-weight:600;color:var(--color-primary-text, #047857);cursor:pointer;transition:background 0.15s, box-shadow 0.15s;z-index:1}.fu-zone-queue-badge:hover{background:rgba(16, 185, 129, 0.18);box-shadow:0 0 0 3px rgba(16, 185, 129, 0.15)}.fu-zone-queue-view{opacity:0.75;font-weight:700;margin-left:2px}.fu-view-queue-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:var(--bg-secondary, #f3f4f6);border:1.5px solid var(--border-default, #e5e7eb);border-radius:20px;font-size:13px;font-weight:600;color:var(--text-primary, #374151);cursor:pointer;transition:background 0.15s, border-color 0.15s, color 0.15s}.fu-view-queue-btn:hover{background:rgba(16, 185, 129, 0.08);border-color:var(--color-primary, #10b981);color:var(--color-primary-text, #047857)}.fu-queue-backdrop{position:fixed;inset:0;z-index:99998;background:rgba(0, 0, 0, 0.45);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:fu-fade-in 0.15s ease}.fu-queue-dialog{background:var(--bg-primary, #ffffff);border-radius:20px;width:min(560px, 100vw - 32px);max-height:min(88dvh, 88vh, 680px);display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.06);overflow:clip;animation:fu-dialog-in 0.18s cubic-bezier(0.34, 1.56, 0.64, 1)}.fu-queue-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid var(--border-default, #e5e7eb);flex-shrink:0}.fu-queue-header-right{display:flex;align-items:center;gap:8px}.fu-upload-mode-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:0.01em}.fu-upload-mode-badge.is-auto{background:rgba(16, 185, 129, 0.1);color:var(--color-primary-text, #047857);border:1px solid rgba(16, 185, 129, 0.25)}.fu-upload-mode-badge.is-manual{background:rgba(99, 102, 241, 0.1);color:#4f46e5;border:1px solid rgba(99, 102, 241, 0.25)}.fu-queue-manual-banner{display:flex;align-items:center;gap:8px;padding:10px 20px;background:rgba(99, 102, 241, 0.06);border-bottom:1px solid rgba(99, 102, 241, 0.15);font-size:13px;color:var(--text-secondary, #4b5563);flex-shrink:0}.fu-queue-manual-banner strong{color:#4f46e5;font-weight:700}.fu-queue-dialog--manual .fu-queue-footer{background:rgba(99, 102, 241, 0.03)}.fu-upload-icon-text{font-size:36px;line-height:1}.fu-inline-trigger{display:inline-flex;align-items:center;gap:7px;padding:6px 12px 6px 9px;background:transparent;border:1.5px solid var(--border-default, #e2e8f0);border-radius:8px;cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;color:var(--text-primary, #374151);transition:background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;position:relative;white-space:nowrap;user-select:none}.fu-inline-trigger:hover:not(.fu-inline-disabled){background:var(--bg-secondary, #f1f5f9);border-color:var(--color-primary, #10b981);color:var(--color-primary, #10b981);box-shadow:0 0 0 3px rgba(16, 185, 129, 0.1)}.fu-inline-trigger:active:not(.fu-inline-disabled){background:rgba(16, 185, 129, 0.08);box-shadow:none}.fu-inline-trigger.fu-inline-active{border-color:var(--color-primary, #10b981);color:var(--color-primary, #10b981);background:rgba(16, 185, 129, 0.05)}.fu-inline-trigger.fu-inline-disabled{opacity:0.45;cursor:not-allowed}.fu-inline-icon{display:inline-flex;align-items:center;flex-shrink:0}.fu-inline-label{line-height:1.2}.fu-inline-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:20px;background:var(--color-primary, #10b981);color:#fff;font-size:10px;font-weight:800;line-height:1;cursor:pointer;transition:background 0.15s, transform 0.15s}.fu-inline-badge:hover{background:#059669;transform:scale(1.1)}.fu-queue-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700;color:var(--text-primary, #111827)}.fu-queue-count-pill{padding:2px 10px;border-radius:20px;background:rgba(16, 185, 129, 0.12);color:var(--color-primary-text, #047857);font-size:12px;font-weight:700;border:1px solid rgba(16, 185, 129, 0.3)}.fu-queue-errors{padding:10px 20px;border-bottom:1px solid rgba(239, 68, 68, 0.25);background:rgba(254, 242, 242, 0.8);display:flex;flex-direction:column;gap:6px;flex-shrink:0;max-height:120px;overflow-y:auto}.fu-queue-error-item{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#ef4444}.fu-queue-summary{display:flex;align-items:center;gap:16px;padding:8px 20px;border-bottom:1px solid var(--border-default, #e5e7eb);background:var(--bg-secondary, #f9fafb);flex-shrink:0;flex-wrap:wrap}.fu-queue-summary-stat{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--text-secondary, #6b7280)}.fu-queue-summary-stat.is-auto{color:#3b82f6}.fu-queue-summary-stat.is-complete{color:#10b981}.fu-qs-dot{width:8px;height:8px;border-radius:50%}.fu-qs-dot.success{background:#10b981}.fu-qs-dot.pending{background:#6366f1}.fu-qs-dot.error{background:#ef4444}.fu-queue-list{flex:1;min-height:0;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:10px}.fu-queue-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:40px 0;color:var(--text-muted, #9ca3af);font-size:14px;font-weight:500}.fu-queue-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 20px 18px;border-top:1px solid var(--border-default, #e5e7eb);background:var(--bg-secondary, #f9fafb);flex-shrink:0;position:relative;z-index:1}.fu-queue-footer-left,.fu-queue-footer-right{display:flex;align-items:center;gap:8px}.fu-dialog-backdrop{position:fixed;inset:0;z-index:99999;background:rgba(0, 0, 0, 0.45);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;animation:fu-fade-in 0.15s ease}@keyframes fu-fade-in{from{opacity:0}to{opacity:1}}.fu-dialog{background:var(--bg-primary, #ffffff);border-radius:18px;width:min(480px, 100vw - 32px);max-height:min(90vh, 640px);display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.06);overflow:hidden;animation:fu-dialog-in 0.18s cubic-bezier(0.34, 1.56, 0.64, 1)}@keyframes fu-dialog-in{from{opacity:0;transform:scale(0.92) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.fu-dialog-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid var(--border-default, #e5e7eb)}.fu-dialog-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--text-primary, #111827)}.fu-dialog-preview{background:var(--bg-secondary, #f8fafc);border-bottom:1px solid var(--border-default, #e5e7eb);display:flex;align-items:center;justify-content:center;min-height:180px;max-height:260px;overflow:hidden;padding:16px}.fu-dialog-image{max-width:100%;max-height:228px;object-fit:contain;border-radius:8px;box-shadow:0 4px 16px rgba(0, 0, 0, 0.1)}.fu-dialog-file-icon{width:96px;height:96px;border-radius:20px;display:flex;align-items:center;justify-content:center}.fu-dialog-info{padding:20px 24px 16px;display:flex;flex-direction:column;gap:10px;flex:1;overflow-y:auto}.fu-dialog-name{font-size:15px;font-weight:700;color:var(--text-primary, #111827);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fu-dialog-meta{display:flex;gap:16px;flex-wrap:wrap}.fu-dialog-meta-item{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--text-secondary, #6b7280);font-weight:500}.fu-dialog-status-row{display:flex}.fu-dialog-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:700}.fu-dialog-badge.is-success{background:rgba(16, 185, 129, 0.1);color:#10b981}.fu-dialog-badge.is-error{background:rgba(239, 68, 68, 0.1);color:#ef4444}.fu-dialog-badge.is-pending{background:rgba(99, 102, 241, 0.1);color:#6366f1}.fu-dialog-badge.is-uploading{background:rgba(59, 130, 246, 0.1);color:#3b82f6}.fu-dialog-badge.is-validating{background:rgba(245, 158, 11, 0.1);color:#f59e0b}.fu-dialog-progress{height:6px;background:var(--border-default, #e5e7eb);border-radius:3px;overflow:hidden;margin-top:4px}.fu-dialog-progress-fill{height:100%;background:var(--color-primary, #10b981);border-radius:3px;transition:width 0.4s ease}.fu-dialog-footer{display:flex;align-items:center;gap:8px;padding:12px 20px 16px;border-top:1px solid var(--border-default, #e5e7eb)}.fu-dialog-nav-count{font-size:12px;font-weight:600;color:var(--text-secondary, #6b7280);min-width:40px;text-align:center}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-backdrop,:host-context(.dark) .fu-dialog-backdrop,:host-context([data-theme=dark]) .fu-queue-backdrop,:host-context([data-theme=dark]) .fu-dialog-backdrop,:host(.dark) .fu-queue-backdrop,:host(.dark) .fu-dialog-backdrop,:host([data-theme=dark]) .fu-queue-backdrop,:host([data-theme=dark]) .fu-dialog-backdrop{background:rgba(0, 0, 0, 0.65);backdrop-filter:blur(6px)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-dialog,:host-context(.dark) .fu-dialog,:host-context([data-theme=dark]) .fu-queue-dialog,:host-context([data-theme=dark]) .fu-dialog,:host(.dark) .fu-queue-dialog,:host(.dark) .fu-dialog,:host([data-theme=dark]) .fu-queue-dialog,:host([data-theme=dark]) .fu-dialog{background:var(--bg-primary, #1e293b);box-shadow:0 24px 64px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.08)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-inline-trigger,:host-context([data-theme=dark]) .fu-inline-trigger,:host(.dark) .fu-inline-trigger,:host([data-theme=dark]) .fu-inline-trigger{border-color:var(--border-default, #334155);color:var(--text-primary, #e2e8f0)}:host-context(.dark) .fu-inline-trigger:hover:not(.fu-inline-disabled),:host-context([data-theme=dark]) .fu-inline-trigger:hover:not(.fu-inline-disabled),:host(.dark) .fu-inline-trigger:hover:not(.fu-inline-disabled),:host([data-theme=dark]) .fu-inline-trigger:hover:not(.fu-inline-disabled){background:rgba(255, 255, 255, 0.06);border-color:var(--color-primary, #10b981);color:#34d399;box-shadow:0 0 0 3px rgba(16, 185, 129, 0.12)}:host-context(.dark) .fu-inline-trigger.fu-inline-active,:host-context([data-theme=dark]) .fu-inline-trigger.fu-inline-active,:host(.dark) .fu-inline-trigger.fu-inline-active,:host([data-theme=dark]) .fu-inline-trigger.fu-inline-active{border-color:#34d399;color:#34d399;background:rgba(52, 211, 153, 0.06)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-upload-mode-badge.is-auto,:host-context([data-theme=dark]) .fu-upload-mode-badge.is-auto,:host(.dark) .fu-upload-mode-badge.is-auto,:host([data-theme=dark]) .fu-upload-mode-badge.is-auto{background:rgba(16, 185, 129, 0.15);color:#34d399;border-color:rgba(52, 211, 153, 0.3)}:host-context(.dark) .fu-upload-mode-badge.is-manual,:host-context([data-theme=dark]) .fu-upload-mode-badge.is-manual,:host(.dark) .fu-upload-mode-badge.is-manual,:host([data-theme=dark]) .fu-upload-mode-badge.is-manual{background:rgba(99, 102, 241, 0.15);color:#a5b4fc;border-color:rgba(165, 180, 252, 0.3)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-manual-banner,:host-context([data-theme=dark]) .fu-queue-manual-banner,:host(.dark) .fu-queue-manual-banner,:host([data-theme=dark]) .fu-queue-manual-banner{background:rgba(99, 102, 241, 0.08);border-bottom-color:rgba(99, 102, 241, 0.2);color:var(--text-secondary, #94a3b8)}:host-context(.dark) .fu-queue-manual-banner strong,:host-context([data-theme=dark]) .fu-queue-manual-banner strong,:host(.dark) .fu-queue-manual-banner strong,:host([data-theme=dark]) .fu-queue-manual-banner strong{color:#a5b4fc}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-header,:host-context(.dark) .fu-dialog-header,:host-context([data-theme=dark]) .fu-queue-header,:host-context([data-theme=dark]) .fu-dialog-header,:host(.dark) .fu-queue-header,:host(.dark) .fu-dialog-header,:host([data-theme=dark]) .fu-queue-header,:host([data-theme=dark]) .fu-dialog-header{border-bottom-color:var(--border-default, #334155)}:host-context(.dark) .fu-queue-title,:host-context(.dark) .fu-dialog-title,:host-context([data-theme=dark]) .fu-queue-title,:host-context([data-theme=dark]) .fu-dialog-title,:host(.dark) .fu-queue-title,:host(.dark) .fu-dialog-title,:host([data-theme=dark]) .fu-queue-title,:host([data-theme=dark]) .fu-dialog-title{color:var(--text-primary, #f1f5f9)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-count-pill,:host-context([data-theme=dark]) .fu-queue-count-pill,:host(.dark) .fu-queue-count-pill,:host([data-theme=dark]) .fu-queue-count-pill{background:rgba(16, 185, 129, 0.18);color:#34d399;border-color:rgba(52, 211, 153, 0.3)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-errors,:host-context([data-theme=dark]) .fu-queue-errors,:host(.dark) .fu-queue-errors,:host([data-theme=dark]) .fu-queue-errors{background:rgba(239, 68, 68, 0.1);border-bottom-color:rgba(239, 68, 68, 0.25)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-summary,:host-context([data-theme=dark]) .fu-queue-summary,:host(.dark) .fu-queue-summary,:host([data-theme=dark]) .fu-queue-summary{background:var(--bg-secondary, #0f172a);border-bottom-color:var(--border-default, #334155)}:host-context(.dark) .fu-queue-summary-stat,:host-context([data-theme=dark]) .fu-queue-summary-stat,:host(.dark) .fu-queue-summary-stat,:host([data-theme=dark]) .fu-queue-summary-stat{color:var(--text-secondary, #94a3b8)}:host-context(.dark) .fu-queue-summary-stat.is-auto,:host-context([data-theme=dark]) .fu-queue-summary-stat.is-auto,:host(.dark) .fu-queue-summary-stat.is-auto,:host([data-theme=dark]) .fu-queue-summary-stat.is-auto{color:#93c5fd}:host-context(.dark) .fu-queue-summary-stat.is-complete,:host-context([data-theme=dark]) .fu-queue-summary-stat.is-complete,:host(.dark) .fu-queue-summary-stat.is-complete,:host([data-theme=dark]) .fu-queue-summary-stat.is-complete{color:#34d399}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-list,:host-context([data-theme=dark]) .fu-queue-list,:host(.dark) .fu-queue-list,:host([data-theme=dark]) .fu-queue-list{scrollbar-color:var(--border-default, #334155) transparent;scrollbar-width:thin}:host-context(.dark) .fu-queue-empty,:host-context([data-theme=dark]) .fu-queue-empty,:host(.dark) .fu-queue-empty,:host([data-theme=dark]) .fu-queue-empty{color:var(--text-muted, #64748b)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-file-item,:host-context([data-theme=dark]) .fu-file-item,:host(.dark) .fu-file-item,:host([data-theme=dark]) .fu-file-item{border-bottom-color:var(--border-default, #1e293b)}:host-context(.dark) .fu-file-item.is-clickable:hover,:host-context([data-theme=dark]) .fu-file-item.is-clickable:hover,:host(.dark) .fu-file-item.is-clickable:hover,:host([data-theme=dark]) .fu-file-item.is-clickable:hover{background:rgba(255, 255, 255, 0.05);box-shadow:inset 0 0 0 1.5px var(--border-default, #334155)}:host-context(.dark) .fu-file-name,:host-context([data-theme=dark]) .fu-file-name,:host(.dark) .fu-file-name,:host([data-theme=dark]) .fu-file-name{color:var(--text-primary, #f1f5f9)}:host-context(.dark) .fu-file-meta,:host-context([data-theme=dark]) .fu-file-meta,:host(.dark) .fu-file-meta,:host([data-theme=dark]) .fu-file-meta{color:var(--text-secondary, #94a3b8)}:host-context(.dark) .fu-file-error-msg,:host-context([data-theme=dark]) .fu-file-error-msg,:host(.dark) .fu-file-error-msg,:host([data-theme=dark]) .fu-file-error-msg{color:#f87171}:host-context(.dark) .fu-remove,:host-context([data-theme=dark]) .fu-remove,:host(.dark) .fu-remove,:host([data-theme=dark]) .fu-remove{color:#64748b !important}:host-context(.dark) .fu-remove:hover,:host-context([data-theme=dark]) .fu-remove:hover,:host(.dark) .fu-remove:hover,:host([data-theme=dark]) .fu-remove:hover{color:#f87171 !important}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-queue-footer,:host-context([data-theme=dark]) .fu-queue-footer,:host(.dark) .fu-queue-footer,:host([data-theme=dark]) .fu-queue-footer{background:var(--bg-secondary, #0f172a);border-top-color:var(--border-default, #334155)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-status-badge.is-success,:host-context([data-theme=dark]) .fu-status-badge.is-success,:host(.dark) .fu-status-badge.is-success,:host([data-theme=dark]) .fu-status-badge.is-success{background:rgba(16, 185, 129, 0.15);color:#34d399}:host-context(.dark) .fu-status-badge.is-error,:host-context([data-theme=dark]) .fu-status-badge.is-error,:host(.dark) .fu-status-badge.is-error,:host([data-theme=dark]) .fu-status-badge.is-error{background:rgba(239, 68, 68, 0.15);color:#f87171}:host-context(.dark) .fu-status-badge.is-pending,:host-context([data-theme=dark]) .fu-status-badge.is-pending,:host(.dark) .fu-status-badge.is-pending,:host([data-theme=dark]) .fu-status-badge.is-pending{background:rgba(99, 102, 241, 0.15);color:#a5b4fc}:host-context(.dark) .fu-status-badge.is-uploading,:host-context([data-theme=dark]) .fu-status-badge.is-uploading,:host(.dark) .fu-status-badge.is-uploading,:host([data-theme=dark]) .fu-status-badge.is-uploading{background:rgba(59, 130, 246, 0.15);color:#93c5fd}:host-context(.dark) .fu-status-badge.is-validating,:host-context([data-theme=dark]) .fu-status-badge.is-validating,:host(.dark) .fu-status-badge.is-validating,:host([data-theme=dark]) .fu-status-badge.is-validating{background:rgba(245, 158, 11, 0.15);color:#fcd34d}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-dialog-preview,:host-context([data-theme=dark]) .fu-dialog-preview,:host(.dark) .fu-dialog-preview,:host([data-theme=dark]) .fu-dialog-preview{background:var(--bg-secondary, #0f172a);border-bottom-color:var(--border-default, #334155)}:host-context(.dark) .fu-dialog-image,:host-context([data-theme=dark]) .fu-dialog-image,:host(.dark) .fu-dialog-image,:host([data-theme=dark]) .fu-dialog-image{box-shadow:0 4px 24px rgba(0, 0, 0, 0.4)}:host-context(.dark) .fu-dialog-name,:host-context([data-theme=dark]) .fu-dialog-name,:host(.dark) .fu-dialog-name,:host([data-theme=dark]) .fu-dialog-name{color:var(--text-primary, #f1f5f9)}:host-context(.dark) .fu-dialog-meta-item,:host-context([data-theme=dark]) .fu-dialog-meta-item,:host(.dark) .fu-dialog-meta-item,:host([data-theme=dark]) .fu-dialog-meta-item{color:var(--text-secondary, #94a3b8)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-dialog-badge.is-success,:host-context([data-theme=dark]) .fu-dialog-badge.is-success,:host(.dark) .fu-dialog-badge.is-success,:host([data-theme=dark]) .fu-dialog-badge.is-success{background:rgba(16, 185, 129, 0.15);color:#34d399}:host-context(.dark) .fu-dialog-badge.is-error,:host-context([data-theme=dark]) .fu-dialog-badge.is-error,:host(.dark) .fu-dialog-badge.is-error,:host([data-theme=dark]) .fu-dialog-badge.is-error{background:rgba(239, 68, 68, 0.15);color:#f87171}:host-context(.dark) .fu-dialog-badge.is-pending,:host-context([data-theme=dark]) .fu-dialog-badge.is-pending,:host(.dark) .fu-dialog-badge.is-pending,:host([data-theme=dark]) .fu-dialog-badge.is-pending{background:rgba(99, 102, 241, 0.15);color:#a5b4fc}:host-context(.dark) .fu-dialog-badge.is-uploading,:host-context([data-theme=dark]) .fu-dialog-badge.is-uploading,:host(.dark) .fu-dialog-badge.is-uploading,:host([data-theme=dark]) .fu-dialog-badge.is-uploading{background:rgba(59, 130, 246, 0.15);color:#93c5fd}:host-context(.dark) .fu-dialog-badge.is-validating,:host-context([data-theme=dark]) .fu-dialog-badge.is-validating,:host(.dark) .fu-dialog-badge.is-validating,:host([data-theme=dark]) .fu-dialog-badge.is-validating{background:rgba(245, 158, 11, 0.15);color:#fcd34d}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-progress-bar,:host-context(.dark) .fu-dialog-progress,:host-context([data-theme=dark]) .fu-progress-bar,:host-context([data-theme=dark]) .fu-dialog-progress,:host(.dark) .fu-progress-bar,:host(.dark) .fu-dialog-progress,:host([data-theme=dark]) .fu-progress-bar,:host([data-theme=dark]) .fu-dialog-progress{background:rgba(255, 255, 255, 0.08)}:host-context(.dark) .fu-dialog-footer,:host-context([data-theme=dark]) .fu-dialog-footer,:host(.dark) .fu-dialog-footer,:host([data-theme=dark]) .fu-dialog-footer{border-top-color:var(--border-default, #334155)}:host-context(.dark) .fu-dialog-nav-count,:host-context([data-theme=dark]) .fu-dialog-nav-count,:host(.dark) .fu-dialog-nav-count,:host([data-theme=dark]) .fu-dialog-nav-count{color:var(--text-secondary, #94a3b8)}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-zone-queue-badge,:host-context([data-theme=dark]) .fu-zone-queue-badge,:host(.dark) .fu-zone-queue-badge,:host([data-theme=dark]) .fu-zone-queue-badge{background:rgba(16, 185, 129, 0.12);border-color:rgba(52, 211, 153, 0.3);color:#34d399}:host-context(.dark) .fu-zone-queue-badge:hover,:host-context([data-theme=dark]) .fu-zone-queue-badge:hover,:host(.dark) .fu-zone-queue-badge:hover,:host([data-theme=dark]) .fu-zone-queue-badge:hover{background:rgba(16, 185, 129, 0.22)}:host-context(.dark) .fu-view-queue-btn,:host-context([data-theme=dark]) .fu-view-queue-btn,:host(.dark) .fu-view-queue-btn,:host([data-theme=dark]) .fu-view-queue-btn{background:var(--bg-secondary, #1e293b);border-color:var(--border-default, #334155);color:var(--text-primary, #f1f5f9)}:host-context(.dark) .fu-view-queue-btn:hover,:host-context([data-theme=dark]) .fu-view-queue-btn:hover,:host(.dark) .fu-view-queue-btn:hover,:host([data-theme=dark]) .fu-view-queue-btn:hover{background:rgba(16, 185, 129, 0.1);border-color:#34d399;color:#34d399}:host-context(.dark),:host-context([data-theme=dark]),:host(.dark),:host([data-theme=dark]){}:host-context(.dark) .fu-zone-has-files,:host-context([data-theme=dark]) .fu-zone-has-files,:host(.dark) .fu-zone-has-files,:host([data-theme=dark]) .fu-zone-has-files{background:rgba(16, 185, 129, 0.05)}@media (prefers-color-scheme: dark){.fu-queue-backdrop,.fu-dialog-backdrop{background:rgba(0, 0, 0, 0.65);backdrop-filter:blur(6px)}.fu-queue-dialog,.fu-dialog{background:var(--bg-primary, #1e293b);box-shadow:0 24px 64px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.08)}.fu-inline-trigger{border-color:var(--border-default, #334155);color:var(--text-primary, #e2e8f0)}.fu-inline-trigger:hover:not(.fu-inline-disabled){background:rgba(255, 255, 255, 0.06);border-color:var(--color-primary, #10b981);color:#34d399;box-shadow:0 0 0 3px rgba(16, 185, 129, 0.12)}.fu-inline-trigger.fu-inline-active{border-color:#34d399;color:#34d399;background:rgba(52, 211, 153, 0.06)}.fu-upload-mode-badge.is-auto{background:rgba(16, 185, 129, 0.15);color:#34d399;border-color:rgba(52, 211, 153, 0.3)}.fu-upload-mode-badge.is-manual{background:rgba(99, 102, 241, 0.15);color:#a5b4fc;border-color:rgba(165, 180, 252, 0.3)}.fu-queue-manual-banner{background:rgba(99, 102, 241, 0.08);border-bottom-color:rgba(99, 102, 241, 0.2);color:var(--text-secondary, #94a3b8)}.fu-queue-manual-banner strong{color:#a5b4fc}.fu-queue-header,.fu-dialog-header{border-bottom-color:var(--border-default, #334155)}.fu-queue-title,.fu-dialog-title{color:var(--text-primary, #f1f5f9)}.fu-queue-count-pill{background:rgba(16, 185, 129, 0.18);color:#34d399;border-color:rgba(52, 211, 153, 0.3)}.fu-queue-errors{background:rgba(239, 68, 68, 0.1);border-bottom-color:rgba(239, 68, 68, 0.25)}.fu-queue-summary{background:var(--bg-secondary, #0f172a);border-bottom-color:var(--border-default, #334155)}.fu-queue-summary-stat{color:var(--text-secondary, #94a3b8)}.fu-queue-summary-stat.is-auto{color:#93c5fd}.fu-queue-summary-stat.is-complete{color:#34d399}.fu-queue-list{scrollbar-color:var(--border-default, #334155) transparent;scrollbar-width:thin}.fu-queue-empty{color:var(--text-muted, #64748b)}.fu-file-item{border-bottom-color:var(--border-default, #1e293b)}.fu-file-item.is-clickable:hover{background:rgba(255, 255, 255, 0.05);box-shadow:inset 0 0 0 1.5px var(--border-default, #334155)}.fu-file-name{color:var(--text-primary, #f1f5f9)}.fu-file-meta{color:var(--text-secondary, #94a3b8)}.fu-file-error-msg{color:#f87171}.fu-remove{color:#64748b !important}.fu-remove:hover{color:#f87171 !important}.fu-queue-footer{background:var(--bg-secondary, #0f172a);border-top-color:var(--border-default, #334155)}.fu-status-badge.is-success{background:rgba(16, 185, 129, 0.15);color:#34d399}.fu-status-badge.is-error{background:rgba(239, 68, 68, 0.15);color:#f87171}.fu-status-badge.is-pending{background:rgba(99, 102, 241, 0.15);color:#a5b4fc}.fu-status-badge.is-uploading{background:rgba(59, 130, 246, 0.15);color:#93c5fd}.fu-status-badge.is-validating{background:rgba(245, 158, 11, 0.15);color:#fcd34d}.fu-dialog-preview{background:var(--bg-secondary, #0f172a);border-bottom-color:var(--border-default, #334155)}.fu-dialog-image{box-shadow:0 4px 24px rgba(0, 0, 0, 0.4)}.fu-dialog-name{color:var(--text-primary, #f1f5f9)}.fu-dialog-meta-item{color:var(--text-secondary, #94a3b8)}.fu-dialog-badge.is-success{background:rgba(16, 185, 129, 0.15);color:#34d399}.fu-dialog-badge.is-error{background:rgba(239, 68, 68, 0.15);color:#f87171}.fu-dialog-badge.is-pending{background:rgba(99, 102, 241, 0.15);color:#a5b4fc}.fu-dialog-badge.is-uploading{background:rgba(59, 130, 246, 0.15);color:#93c5fd}.fu-dialog-badge.is-validating{background:rgba(245, 158, 11, 0.15);color:#fcd34d}.fu-progress-bar,.fu-dialog-progress{background:rgba(255, 255, 255, 0.08)}.fu-dialog-footer{border-top-color:var(--border-default, #334155)}.fu-dialog-nav-count{color:var(--text-secondary, #94a3b8)}.fu-zone-queue-badge{background:rgba(16, 185, 129, 0.12);border-color:rgba(52, 211, 153, 0.3);color:#34d399}.fu-zone-queue-badge:hover{background:rgba(16, 185, 129, 0.22)}.fu-view-queue-btn{background:var(--bg-secondary, #1e293b);border-color:var(--border-default, #334155);color:var(--text-primary, #f1f5f9)}.fu-view-queue-btn:hover{background:rgba(16, 185, 129, 0.1);border-color:#34d399;color:#34d399}.fu-zone-has-files{background:rgba(16, 185, 129, 0.05)}}'}},[513,"ui-file-upload",{label:[1],helperText:[1,"helper-text"],accept:[1],multiple:[4],maxSize:[2,"max-size"],minSize:[2,"min-size"],maxFiles:[2,"max-files"],showPreview:[4,"show-preview"],disabled:[4],variant:[1],uploadIcon:[1,"upload-icon"],rtl:[4],capture:[8],validateFileName:[4,"validate-file-name"],fileNamePattern:[1,"file-name-pattern"],showValidateButton:[4,"show-validate-button"],showUploadButton:[4,"show-upload-button"],autoUpload:[4,"auto-upload"],autoCloseOnSuccess:[4,"auto-close-on-success"],directory:[4],headerTitle:[1,"header-title"],isDragging:[32],files:[32],errors:[32],componentStatus:[32],isQueueOpen:[32],previewFileIndex:[32],removeInvalidFiles:[64],validate:[64],upload:[64],clear:[64]}]),c=u,f=function(){"undefined"!=typeof customElements&&["ui-file-upload","ui-badge","ui-button","ui-icon","ui-loader"].forEach((e=>{switch(e){case"ui-file-upload":customElements.get(i(e))||customElements.define(i(e),u);break;case"ui-badge":customElements.get(i(e))||s();break;case"ui-button":customElements.get(i(e))||d();break;case"ui-icon":customElements.get(i(e))||l();break;case"ui-loader":customElements.get(i(e))||n()}}))};export{c as UiFileUpload,f as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as i,createEvent as a,h as n,transformTag as o}from"@stencil/core/internal/client";import{d as e}from"./icon.js";import{d as l}from"./loader.js";const r=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.navItemClick=a(this,"navItemClick",7)}items=[];activeId;variant="default";size="md";align="start";scrollable=!1;showDivider=!1;fullWidth=!1;displayAs="buttons";iconLibrary="default";navItemClick;scrollLeft=0;canScrollLeft=!1;canScrollRight=!1;navRef;parseItems(){if("string"==typeof this.items)try{return JSON.parse(this.items)}catch(t){return console.error("Failed to parse items JSON:",t),[]}return this.items}handleItemClick=(t,i)=>{t.disabled?i.preventDefault():(t.href||i.preventDefault(),this.activeId=t.id,this.navItemClick.emit(t))};handleScroll=()=>{if(!this.navRef)return;const{scrollLeft:t,scrollWidth:i,clientWidth:a}=this.navRef;this.scrollLeft=t,this.canScrollLeft=t>0,this.canScrollRight=t<i-a-1};scrollToDirection=t=>{this.navRef&&this.navRef.scrollTo({left:"left"===t?this.navRef.scrollLeft-200:this.navRef.scrollLeft+200,behavior:"smooth"})};componentDidLoad(){this.scrollable&&this.navRef&&this.handleScroll()}render(){const t=this.parseItems(),i={"horizontal-nav-container":!0,scrollable:this.scrollable},a={"horizontal-nav":!0,["variant-"+this.variant]:!0,["size-"+this.size]:!0,["align-"+this.align]:!0,"full-width":this.fullWidth,"with-divider":this.showDivider,["display-"+this.displayAs]:!0};return n("div",{key:"fbcf314495c91cb99bc90db33029196edfdb63a2",class:i},this.scrollable&&this.canScrollLeft&&n("button",{key:"f8de2c214e9d6f5b2a98c8f15dd11d21590e21bc",class:"scroll-button left",onClick:()=>this.scrollToDirection("left"),"aria-label":"Scroll left"},n("svg",{key:"f578cf8f8051944b9d172fb4d6b97e23e0534e1a",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},n("polyline",{key:"dc8225738c6d416bff540136ce13421bf92ab06d",points:"15 18 9 12 15 6"}))),n("nav",{key:"3296d5d35db2f5447bbf0081e4a2670e65b25046",class:a,ref:t=>this.navRef=t,onScroll:this.handleScroll},n("ul",{key:"66db7520e79ced35998900fb72abe09ac99b15c1",class:"nav-list"},t.map((t=>this.renderItem(t))))),this.scrollable&&this.canScrollRight&&n("button",{key:"bdf0b40342ff2c07a541258a4cda3310dfa07c5e",class:"scroll-button right",onClick:()=>this.scrollToDirection("right"),"aria-label":"Scroll right"},n("svg",{key:"6cd30d589d60113d2e3cccda8d6c3f7914d23750",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},n("polyline",{key:"02dcff53f897c9dff39369fc1b9c48cd06cb5365",points:"9 18 15 12 9 6"}))))}renderItem(t){const i={"nav-item":!0,active:t.active||t.id===this.activeId,disabled:t.disabled},a=n("span",{class:"nav-item-content"},t.icon&&n("span",{class:"nav-icon"},n("ui-icon",{name:t.icon,library:t.iconLibrary||this.iconLibrary,size:"1.2em"})),n("span",{class:"nav-label"},t.label),t.badge&&n("span",{class:"nav-badge"},t.badge));return n("li",{key:t.id,class:"nav-list-item"},t.href&&!t.disabled?n("a",{href:t.href,class:i,onClick:i=>this.handleItemClick(t,i)},a):n("button",{class:i,disabled:t.disabled,onClick:i=>this.handleItemClick(t,i)},a))}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%}.horizontal-nav-container{position:relative;display:flex;align-items:center;width:100%}.horizontal-nav-container.scrollable .horizontal-nav{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.horizontal-nav-container.scrollable .horizontal-nav::-webkit-scrollbar{display:none}.horizontal-nav{display:flex;width:100%;background-color:#ffffff;border-radius:8px;padding:4px}.nav-list{display:flex;list-style:none;margin:0;padding:0;gap:4px;width:100%}.horizontal-nav.full-width .nav-list{flex:1}.horizontal-nav.full-width .nav-list-item{flex:1}.horizontal-nav.full-width .nav-item{width:100%;justify-content:center}.horizontal-nav.align-start .nav-list{justify-content:flex-start}.horizontal-nav.align-center .nav-list{justify-content:center}.horizontal-nav.align-end .nav-list{justify-content:flex-end}.horizontal-nav.align-space-between .nav-list{justify-content:space-between}.nav-list-item{display:flex}.nav-item{display:flex;align-items:center;gap:8px;padding:8px 16px;background:none;border:none;border-radius:6px;color:#64748b;text-decoration:none;font-weight:500;cursor:pointer;transition:all 0.2s ease;white-space:nowrap;font-size:14px;position:relative}.horizontal-nav.size-sm .nav-item{padding:6px 12px;font-size:12px;gap:6px}.horizontal-nav.size-md .nav-item{padding:8px 16px;font-size:14px;gap:8px}.horizontal-nav.size-lg .nav-item{padding:10px 20px;font-size:16px;gap:10px}.horizontal-nav.variant-default .nav-item:hover:not(.disabled):not(.active){background-color:#f1f5f9;color:#475569}.horizontal-nav.variant-default .nav-item.active{background-color:#eff6ff;color:#3b82f6}.horizontal-nav.variant-pills .nav-item{border-radius:20px}.horizontal-nav.variant-pills .nav-item:hover:not(.disabled):not(.active){background-color:#f1f5f9;color:#475569}.horizontal-nav.variant-pills .nav-item.active{background-color:#3b82f6;color:white}.horizontal-nav.variant-underline{background-color:transparent;border-bottom:1px solid #e2e8f0;border-radius:0;padding:0}.horizontal-nav.variant-underline .nav-item{border-radius:0;padding-bottom:12px;margin-bottom:-1px}.horizontal-nav.variant-underline .nav-item::after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:transparent;transition:background-color 0.2s ease}.horizontal-nav.variant-underline .nav-item:hover:not(.disabled):not(.active){color:#475569}.horizontal-nav.variant-underline .nav-item:hover:not(.disabled):not(.active)::after{background-color:#cbd5e1}.horizontal-nav.variant-underline .nav-item.active{color:#3b82f6}.horizontal-nav.variant-underline .nav-item.active::after{background-color:#3b82f6}.horizontal-nav.variant-segmented{background-color:#f1f5f9;border-radius:8px;padding:4px}.horizontal-nav.variant-segmented .nav-item{background-color:transparent}.horizontal-nav.variant-segmented .nav-item:hover:not(.disabled):not(.active){background-color:rgba(255, 255, 255, 0.5)}.horizontal-nav.variant-segmented .nav-item.active{background-color:white;color:#1e293b;box-shadow:0 1px 3px rgba(0, 0, 0, 0.1)}.nav-item.disabled{opacity:0.4;cursor:not-allowed}.nav-item-content{display:flex;align-items:center;gap:inherit}.nav-icon{display:inline-flex;align-items:center;font-size:1.1em;line-height:1}.nav-icon svg{width:1em;height:1em;fill:currentColor}.nav-label{line-height:1}.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;background-color:#ef4444;color:white;font-size:11px;font-weight:600;border-radius:10px;line-height:1}.nav-item.active .nav-badge{background-color:#dc2626}.horizontal-nav.with-divider .nav-list-item:not(:last-child)::after{content:"";width:1px;height:20px;background-color:#e2e8f0;margin:auto 4px}.scroll-button{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:white;border:1px solid #e2e8f0;border-radius:50%;cursor:pointer;z-index:10;box-shadow:0 2px 4px rgba(0, 0, 0, 0.1);transition:all 0.2s ease}.scroll-button:hover{background-color:#f8fafc;border-color:#cbd5e1}.scroll-button.left{left:4px}.scroll-button.right{right:4px}.scroll-button svg{width:16px;height:16px;color:#64748b}.horizontal-nav.display-list{padding:0;background:transparent}.horizontal-nav.display-list .nav-list{flex-direction:column;gap:0}.horizontal-nav.display-list .nav-list-item{width:100%;border-bottom:1px solid #e5e7eb}.horizontal-nav.display-list .nav-list-item:last-child{border-bottom:none}.horizontal-nav.display-list .nav-item{width:100%;padding:12px 16px;border-radius:0;justify-content:flex-start;background-color:#ffffff}.horizontal-nav.display-list .nav-item:hover{background-color:#f9fafb}.horizontal-nav.display-list .nav-item.active{background-color:#eff6ff;border-left:3px solid #3b82f6;padding-left:13px}.horizontal-nav.display-list.variant-pills .nav-item,.horizontal-nav.display-list.variant-underline .nav-item,.horizontal-nav.display-list.variant-segmented .nav-item{border-radius:0}.horizontal-nav.display-list.variant-pills .nav-item.active{background-color:#eff6ff}.horizontal-nav.display-list.size-sm .nav-item{padding:8px 12px}.horizontal-nav.display-list.size-sm .nav-item.active{padding-left:9px}.horizontal-nav.display-list.size-lg .nav-item{padding:16px 20px}.horizontal-nav.display-list.size-lg .nav-item.active{padding-left:17px}@media (max-width: 640px){.horizontal-nav.size-md .nav-item{padding:6px 12px;font-size:13px}.horizontal-nav.size-lg .nav-item{padding:8px 16px;font-size:14px}}'}},[513,"ui-horizontal-nav",{items:[1],activeId:[1025,"active-id"],variant:[1],size:[1],align:[1],scrollable:[4],showDivider:[4,"show-divider"],fullWidth:[4,"full-width"],displayAs:[1,"display-as"],iconLibrary:[1,"icon-library"],scrollLeft:[32],canScrollLeft:[32],canScrollRight:[32]}]),s=r,d=function(){"undefined"!=typeof customElements&&["ui-horizontal-nav","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-horizontal-nav":customElements.get(o(t))||customElements.define(o(t),r);break;case"ui-icon":customElements.get(o(t))||e();break;case"ui-loader":customElements.get(o(t))||l()}}))};export{s as UiHorizontalNav,d as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as i,createEvent as a,h as n,transformTag as o}from"@stencil/core/internal/client";import{d as e}from"./icon.js";import{d as r}from"./loader.js";const l=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.navItemClick=a(this,"navItemClick",7)}items=[];activeId;variant="default";size="md";align="start";scrollable=!1;showDivider=!1;fullWidth=!1;displayAs="buttons";iconLibrary="default";navItemClick;scrollLeft=0;canScrollLeft=!1;canScrollRight=!1;navRef;parseItems(){if("string"==typeof this.items)try{return JSON.parse(this.items)}catch(t){return console.error("Failed to parse items JSON:",t),[]}return this.items}handleItemClick=(t,i)=>{t.disabled?i.preventDefault():(t.href||i.preventDefault(),this.activeId=t.id,this.navItemClick.emit(t))};handleScroll=()=>{if(!this.navRef)return;const{scrollLeft:t,scrollWidth:i,clientWidth:a}=this.navRef;this.scrollLeft=t,this.canScrollLeft=t>0,this.canScrollRight=t<i-a-1};scrollToDirection=t=>{this.navRef&&this.navRef.scrollTo({left:"left"===t?this.navRef.scrollLeft-200:this.navRef.scrollLeft+200,behavior:"smooth"})};componentDidLoad(){this.scrollable&&this.navRef&&this.handleScroll()}render(){const t=this.parseItems(),i={"horizontal-nav-container":!0,scrollable:this.scrollable},a={"horizontal-nav":!0,["variant-"+this.variant]:!0,["size-"+this.size]:!0,["align-"+this.align]:!0,"full-width":this.fullWidth,"with-divider":this.showDivider,["display-"+this.displayAs]:!0};return n("div",{key:"fbcf314495c91cb99bc90db33029196edfdb63a2",class:i},this.scrollable&&this.canScrollLeft&&n("button",{key:"f8de2c214e9d6f5b2a98c8f15dd11d21590e21bc",class:"scroll-button left",onClick:()=>this.scrollToDirection("left"),"aria-label":"Scroll left"},n("svg",{key:"f578cf8f8051944b9d172fb4d6b97e23e0534e1a",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},n("polyline",{key:"dc8225738c6d416bff540136ce13421bf92ab06d",points:"15 18 9 12 15 6"}))),n("nav",{key:"3296d5d35db2f5447bbf0081e4a2670e65b25046",class:a,ref:t=>this.navRef=t,onScroll:this.handleScroll},n("ul",{key:"66db7520e79ced35998900fb72abe09ac99b15c1",class:"nav-list"},t.map((t=>this.renderItem(t))))),this.scrollable&&this.canScrollRight&&n("button",{key:"bdf0b40342ff2c07a541258a4cda3310dfa07c5e",class:"scroll-button right",onClick:()=>this.scrollToDirection("right"),"aria-label":"Scroll right"},n("svg",{key:"6cd30d589d60113d2e3cccda8d6c3f7914d23750",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},n("polyline",{key:"02dcff53f897c9dff39369fc1b9c48cd06cb5365",points:"9 18 15 12 9 6"}))))}renderItem(t){const i={"nav-item":!0,active:t.active||t.id===this.activeId,disabled:t.disabled},a=n("span",{class:"nav-item-content"},t.icon&&n("span",{class:"nav-icon"},n("ui-icon",{name:t.icon,library:t.iconLibrary||this.iconLibrary,size:"1.2em"})),n("span",{class:"nav-label"},t.label),t.badge&&n("span",{class:"nav-badge"},t.badge));return n("li",{key:t.id,class:"nav-list-item"},t.href&&!t.disabled?n("a",{href:t.href,class:i,onClick:i=>this.handleItemClick(t,i)},a):n("button",{class:i,disabled:t.disabled,onClick:i=>this.handleItemClick(t,i)},a))}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%}.horizontal-nav-container{position:relative;display:flex;align-items:center;width:100%}.horizontal-nav-container.scrollable .horizontal-nav{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.horizontal-nav-container.scrollable .horizontal-nav::-webkit-scrollbar{display:none}.horizontal-nav{display:flex;width:100%;background-color:#ffffff;border-radius:8px;padding:4px}.nav-list{display:flex;list-style:none;margin:0;padding:0;gap:4px;width:100%}.horizontal-nav.full-width .nav-list{flex:1}.horizontal-nav.full-width .nav-list-item{flex:1}.horizontal-nav.full-width .nav-item{width:100%;justify-content:center}.horizontal-nav.align-start .nav-list{justify-content:flex-start}.horizontal-nav.align-center .nav-list{justify-content:center}.horizontal-nav.align-end .nav-list{justify-content:flex-end}.horizontal-nav.align-space-between .nav-list{justify-content:space-between}.nav-list-item{display:flex}.nav-item{display:flex;align-items:center;gap:8px;padding:8px 16px;background:none;border:none;border-radius:6px;color:#64748b;text-decoration:none;font-weight:500;cursor:pointer;transition:all 0.2s ease;white-space:nowrap;font-size:14px;position:relative}.horizontal-nav.size-sm .nav-item{padding:6px 12px;font-size:12px;gap:6px}.horizontal-nav.size-md .nav-item{padding:8px 16px;font-size:14px;gap:8px}.horizontal-nav.size-lg .nav-item{padding:10px 20px;font-size:16px;gap:10px}.horizontal-nav.variant-default .nav-item:hover:not(.disabled):not(.active){background-color:#f1f5f9;color:#475569}.horizontal-nav.variant-default .nav-item.active{background-color:var(--color-primary-subtle, rgba(59, 130, 246, 0.1));color:var(--color-primary, #3b82f6)}.horizontal-nav.variant-pills .nav-item{border-radius:20px}.horizontal-nav.variant-pills .nav-item:hover:not(.disabled):not(.active){background-color:#f1f5f9;color:#475569}.horizontal-nav.variant-pills .nav-item.active{background-color:var(--color-primary, #3b82f6);color:var(--text-inverse, white)}.horizontal-nav.variant-underline{background-color:transparent;border-bottom:1px solid #e2e8f0;border-radius:0;padding:0}.horizontal-nav.variant-underline .nav-item{border-radius:0;padding-bottom:12px;margin-bottom:-1px}.horizontal-nav.variant-underline .nav-item::after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:transparent;transition:background-color 0.2s ease}.horizontal-nav.variant-underline .nav-item:hover:not(.disabled):not(.active){color:#475569}.horizontal-nav.variant-underline .nav-item:hover:not(.disabled):not(.active)::after{background-color:#cbd5e1}.horizontal-nav.variant-underline .nav-item.active{color:var(--color-primary, #3b82f6)}.horizontal-nav.variant-underline .nav-item.active::after{background-color:var(--color-primary, #3b82f6)}.horizontal-nav.variant-segmented{background-color:#f1f5f9;border-radius:8px;padding:4px}.horizontal-nav.variant-segmented .nav-item{background-color:transparent}.horizontal-nav.variant-segmented .nav-item:hover:not(.disabled):not(.active){background-color:rgba(255, 255, 255, 0.5)}.horizontal-nav.variant-segmented .nav-item.active{background-color:white;color:#1e293b;box-shadow:0 1px 3px rgba(0, 0, 0, 0.1)}.nav-item.disabled{opacity:0.4;cursor:not-allowed}.nav-item-content{display:flex;align-items:center;gap:inherit}.nav-icon{display:inline-flex;align-items:center;font-size:1.1em;line-height:1}.nav-icon svg{width:1em;height:1em;fill:currentColor}.nav-label{line-height:1}.nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;background-color:#ef4444;color:white;font-size:11px;font-weight:600;border-radius:10px;line-height:1}.nav-item.active .nav-badge{background-color:#dc2626}.horizontal-nav.with-divider .nav-list-item:not(:last-child)::after{content:"";width:1px;height:20px;background-color:#e2e8f0;margin:auto 4px}.scroll-button{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:white;border:1px solid #e2e8f0;border-radius:50%;cursor:pointer;z-index:10;box-shadow:0 2px 4px rgba(0, 0, 0, 0.1);transition:all 0.2s ease}.scroll-button:hover{background-color:#f8fafc;border-color:#cbd5e1}.scroll-button.left{left:4px}.scroll-button.right{right:4px}.scroll-button svg{width:16px;height:16px;color:#64748b}.horizontal-nav.display-list{padding:0;background:transparent}.horizontal-nav.display-list .nav-list{flex-direction:column;gap:0}.horizontal-nav.display-list .nav-list-item{width:100%;border-bottom:1px solid #e5e7eb}.horizontal-nav.display-list .nav-list-item:last-child{border-bottom:none}.horizontal-nav.display-list .nav-item{width:100%;padding:12px 16px;border-radius:0;justify-content:flex-start;background-color:#ffffff}.horizontal-nav.display-list .nav-item:hover{background-color:#f9fafb}.horizontal-nav.display-list .nav-item.active{background-color:var(--color-primary-subtle, rgba(59, 130, 246, 0.1));border-left:3px solid var(--color-primary, #3b82f6);padding-left:13px}.horizontal-nav.display-list.variant-pills .nav-item,.horizontal-nav.display-list.variant-underline .nav-item,.horizontal-nav.display-list.variant-segmented .nav-item{border-radius:0}.horizontal-nav.display-list.variant-pills .nav-item.active{background-color:var(--color-primary-subtle, rgba(59, 130, 246, 0.1))}.horizontal-nav.display-list.size-sm .nav-item{padding:8px 12px}.horizontal-nav.display-list.size-sm .nav-item.active{padding-left:9px}.horizontal-nav.display-list.size-lg .nav-item{padding:16px 20px}.horizontal-nav.display-list.size-lg .nav-item.active{padding-left:17px}@media (max-width: 640px){.horizontal-nav.size-md .nav-item{padding:6px 12px;font-size:13px}.horizontal-nav.size-lg .nav-item{padding:8px 16px;font-size:14px}}'}},[513,"ui-horizontal-nav",{items:[1],activeId:[1025,"active-id"],variant:[1],size:[1],align:[1],scrollable:[4],showDivider:[4,"show-divider"],fullWidth:[4,"full-width"],displayAs:[1,"display-as"],iconLibrary:[1,"icon-library"],scrollLeft:[32],canScrollLeft:[32],canScrollRight:[32]}]),s=l,d=function(){"undefined"!=typeof customElements&&["ui-horizontal-nav","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-horizontal-nav":customElements.get(o(t))||customElements.define(o(t),l);break;case"ui-icon":customElements.get(o(t))||e();break;case"ui-loader":customElements.get(o(t))||r()}}))};export{s as UiHorizontalNav,d as defineCustomElement}
|