aeico-components 0.1.5 → 0.1.7
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/LICENSE +21 -0
- package/README.md +0 -0
- package/dist/chunks/action-button.cjs +296 -0
- package/dist/chunks/action-button.cjs.map +1 -0
- package/dist/chunks/action-button.js +297 -0
- package/dist/chunks/action-button.js.map +1 -0
- package/dist/chunks/alert.cjs +26 -32
- package/dist/chunks/alert.cjs.map +1 -1
- package/dist/chunks/alert.js +27 -33
- package/dist/chunks/alert.js.map +1 -1
- package/dist/chunks/badge.cjs +2 -2
- package/dist/chunks/badge.cjs.map +1 -1
- package/dist/chunks/badge.js +3 -3
- package/dist/chunks/badge.js.map +1 -1
- package/dist/chunks/breadcrumb-item.cjs +9 -9
- package/dist/chunks/breadcrumb-item.cjs.map +1 -1
- package/dist/chunks/breadcrumb-item.js +10 -10
- package/dist/chunks/breadcrumb-item.js.map +1 -1
- package/dist/chunks/button-group.cjs +1 -1
- package/dist/chunks/button-group.cjs.map +1 -1
- package/dist/chunks/button-group.js +2 -2
- package/dist/chunks/button-group.js.map +1 -1
- package/dist/chunks/button.cjs +40 -51
- package/dist/chunks/button.cjs.map +1 -1
- package/dist/chunks/button.js +41 -52
- package/dist/chunks/button.js.map +1 -1
- package/dist/chunks/card.cjs +2 -2
- package/dist/chunks/card.cjs.map +1 -1
- package/dist/chunks/card.js +3 -3
- package/dist/chunks/card.js.map +1 -1
- package/dist/chunks/checkbox.cjs +18 -5
- package/dist/chunks/checkbox.cjs.map +1 -1
- package/dist/chunks/checkbox.js +18 -5
- package/dist/chunks/checkbox.js.map +1 -1
- package/dist/chunks/color.cjs +1 -1
- package/dist/chunks/color.js +1 -1
- package/dist/chunks/copy-button.cjs +171 -0
- package/dist/chunks/copy-button.cjs.map +1 -0
- package/dist/chunks/copy-button.js +172 -0
- package/dist/chunks/copy-button.js.map +1 -0
- package/dist/chunks/detail-group.cjs +65 -0
- package/dist/chunks/detail-group.cjs.map +1 -0
- package/dist/chunks/detail-group.js +66 -0
- package/dist/chunks/detail-group.js.map +1 -0
- package/dist/chunks/detail.cjs +7 -4
- package/dist/chunks/detail.cjs.map +1 -1
- package/dist/chunks/detail.js +8 -5
- package/dist/chunks/detail.js.map +1 -1
- package/dist/chunks/dialog.cjs +2 -2
- package/dist/chunks/dialog.cjs.map +1 -1
- package/dist/chunks/dialog.js +3 -3
- package/dist/chunks/dialog.js.map +1 -1
- package/dist/chunks/divider.cjs +2 -2
- package/dist/chunks/divider.cjs.map +1 -1
- package/dist/chunks/divider.js +3 -3
- package/dist/chunks/divider.js.map +1 -1
- package/dist/chunks/drawer.cjs +180 -0
- package/dist/chunks/drawer.cjs.map +1 -0
- package/dist/chunks/drawer.js +181 -0
- package/dist/chunks/drawer.js.map +1 -0
- package/dist/chunks/dropdown-button.cjs +10 -11
- package/dist/chunks/dropdown-button.cjs.map +1 -1
- package/dist/chunks/dropdown-button.js +14 -15
- package/dist/chunks/dropdown-button.js.map +1 -1
- package/dist/chunks/icon.cjs +57 -11
- package/dist/chunks/icon.cjs.map +1 -1
- package/dist/chunks/icon.js +58 -12
- package/dist/chunks/icon.js.map +1 -1
- package/dist/chunks/menu.cjs +396 -0
- package/dist/chunks/menu.cjs.map +1 -0
- package/dist/chunks/menu.js +397 -0
- package/dist/chunks/menu.js.map +1 -0
- package/dist/chunks/navbar.cjs +2 -2
- package/dist/chunks/navbar.cjs.map +1 -1
- package/dist/chunks/navbar.js +3 -3
- package/dist/chunks/navbar.js.map +1 -1
- package/dist/chunks/number-input.cjs +110 -0
- package/dist/chunks/number-input.cjs.map +1 -0
- package/dist/chunks/number-input.js +111 -0
- package/dist/chunks/number-input.js.map +1 -0
- package/dist/chunks/pagination.cjs +475 -0
- package/dist/chunks/pagination.cjs.map +1 -0
- package/dist/chunks/pagination.js +476 -0
- package/dist/chunks/pagination.js.map +1 -0
- package/dist/chunks/progress-bar.cjs +101 -0
- package/dist/chunks/progress-bar.cjs.map +1 -0
- package/dist/chunks/progress-bar.js +102 -0
- package/dist/chunks/progress-bar.js.map +1 -0
- package/dist/chunks/radio.cjs +11 -7
- package/dist/chunks/radio.cjs.map +1 -1
- package/dist/chunks/radio.js +11 -7
- package/dist/chunks/radio.js.map +1 -1
- package/dist/chunks/select.cjs +97 -66
- package/dist/chunks/select.cjs.map +1 -1
- package/dist/chunks/select.js +97 -66
- package/dist/chunks/select.js.map +1 -1
- package/dist/chunks/size.cjs +1 -1
- package/dist/chunks/size.js +1 -1
- package/dist/chunks/slider.cjs +35 -75
- package/dist/chunks/slider.cjs.map +1 -1
- package/dist/chunks/slider.js +35 -75
- package/dist/chunks/slider.js.map +1 -1
- package/dist/chunks/spinner.cjs +102 -0
- package/dist/chunks/spinner.cjs.map +1 -0
- package/dist/chunks/spinner.js +103 -0
- package/dist/chunks/spinner.js.map +1 -0
- package/dist/chunks/switch.cjs +110 -16
- package/dist/chunks/switch.cjs.map +1 -1
- package/dist/chunks/switch.js +111 -17
- package/dist/chunks/switch.js.map +1 -1
- package/dist/chunks/tab-panel.cjs +14 -5
- package/dist/chunks/tab-panel.cjs.map +1 -1
- package/dist/chunks/tab-panel.js +15 -6
- package/dist/chunks/tab-panel.js.map +1 -1
- package/dist/chunks/tag.cjs +2 -2
- package/dist/chunks/tag.cjs.map +1 -1
- package/dist/chunks/tag.js +3 -3
- package/dist/chunks/tag.js.map +1 -1
- package/dist/chunks/text-input.cjs +11 -16
- package/dist/chunks/text-input.cjs.map +1 -1
- package/dist/chunks/text-input.js +11 -16
- package/dist/chunks/text-input.js.map +1 -1
- package/dist/chunks/textarea.cjs +137 -0
- package/dist/chunks/textarea.cjs.map +1 -0
- package/dist/chunks/textarea.js +138 -0
- package/dist/chunks/textarea.js.map +1 -0
- package/dist/chunks/tooltip.cjs +292 -0
- package/dist/chunks/tooltip.cjs.map +1 -0
- package/dist/chunks/tooltip.js +293 -0
- package/dist/chunks/tooltip.js.map +1 -0
- package/dist/chunks/tree.cjs +468 -0
- package/dist/chunks/tree.cjs.map +1 -0
- package/dist/chunks/tree.js +469 -0
- package/dist/chunks/tree.js.map +1 -0
- package/dist/chunks/variables.cjs +273 -249
- package/dist/chunks/variables.cjs.map +1 -1
- package/dist/chunks/variables.js +273 -249
- package/dist/chunks/variables.js.map +1 -1
- package/dist/copy-button.cjs +6 -0
- package/dist/copy-button.cjs.map +1 -0
- package/dist/copy-button.js +6 -0
- package/dist/copy-button.js.map +1 -0
- package/dist/detail-group.cjs +6 -0
- package/dist/detail-group.cjs.map +1 -0
- package/dist/detail-group.js +6 -0
- package/dist/detail-group.js.map +1 -0
- package/dist/drawer.cjs +6 -0
- package/dist/drawer.cjs.map +1 -0
- package/dist/drawer.js +6 -0
- package/dist/drawer.js.map +1 -0
- package/dist/dropdown.js +4 -4
- package/dist/index.cjs +24 -99
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +41 -116
- package/dist/index.js.map +1 -1
- package/dist/menu.cjs +6 -0
- package/dist/menu.cjs.map +1 -0
- package/dist/menu.js +6 -0
- package/dist/menu.js.map +1 -0
- package/dist/number-input.cjs +6 -0
- package/dist/number-input.cjs.map +1 -0
- package/dist/number-input.js +6 -0
- package/dist/number-input.js.map +1 -0
- package/dist/pagination.cjs +6 -0
- package/dist/pagination.cjs.map +1 -0
- package/dist/pagination.js +6 -0
- package/dist/pagination.js.map +1 -0
- package/dist/progress-bar.cjs +6 -0
- package/dist/progress-bar.cjs.map +1 -0
- package/dist/progress-bar.js +6 -0
- package/dist/progress-bar.js.map +1 -0
- package/dist/select.cjs +2 -2
- package/dist/select.cjs.map +1 -1
- package/dist/select.js +3 -3
- package/dist/select.js.map +1 -1
- package/dist/spinner.cjs +6 -0
- package/dist/spinner.cjs.map +1 -0
- package/dist/spinner.js +6 -0
- package/dist/spinner.js.map +1 -0
- package/dist/textarea.cjs +5 -0
- package/dist/textarea.cjs.map +1 -0
- package/dist/textarea.js +5 -0
- package/dist/textarea.js.map +1 -0
- package/dist/tooltip.cjs +6 -0
- package/dist/tooltip.cjs.map +1 -0
- package/dist/tooltip.js +6 -0
- package/dist/tooltip.js.map +1 -0
- package/dist/tree.cjs +6 -0
- package/dist/tree.cjs.map +1 -0
- package/dist/tree.js +6 -0
- package/dist/tree.js.map +1 -0
- package/dist/types/aeico-field.d.ts +52 -0
- package/dist/types/alert/alert.d.ts +1 -0
- package/dist/types/card/defines.d.ts +1 -1
- package/dist/types/copy-button/copy-button.d.ts +32 -0
- package/dist/types/copy-button/defines.d.ts +1 -0
- package/dist/types/copy-button/index.d.ts +3 -0
- package/dist/types/detail/defines.d.ts +2 -1
- package/dist/types/detail/detail.d.ts +3 -1
- package/dist/types/detail/index.d.ts +1 -1
- package/dist/types/detail-group/detail-group.d.ts +39 -0
- package/dist/types/detail-group/index.d.ts +2 -0
- package/dist/types/drawer/defines.d.ts +1 -0
- package/dist/types/drawer/drawer.d.ts +31 -0
- package/dist/types/drawer/index.d.ts +3 -0
- package/dist/types/icon/built-in-icons.d.ts +1 -0
- package/dist/types/icon/defines.d.ts +5 -1
- package/dist/types/icon/icon.d.ts +1 -0
- package/dist/types/icon/index.d.ts +1 -1
- package/dist/types/icon/registry.d.ts +8 -0
- package/dist/types/index.d.ts +17 -0
- package/dist/types/menu/defines.d.ts +15 -0
- package/dist/types/menu/index.d.ts +5 -0
- package/dist/types/menu/menu-item.d.ts +63 -0
- package/dist/types/menu/menu.d.ts +34 -0
- package/dist/types/number-input/index.d.ts +2 -0
- package/dist/types/number-input/number-input.d.ts +35 -0
- package/dist/types/pagination/defines.d.ts +2 -0
- package/dist/types/pagination/index.d.ts +3 -0
- package/dist/types/pagination/pagination.d.ts +77 -0
- package/dist/types/select/select.d.ts +2 -2
- package/dist/types/spinner/defines.d.ts +3 -0
- package/dist/types/spinner/index.d.ts +3 -0
- package/dist/types/spinner/spinner.d.ts +35 -0
- package/dist/types/switch/defines.d.ts +1 -0
- package/dist/types/switch/switch.d.ts +8 -4
- package/dist/types/tabs/defines.d.ts +1 -0
- package/dist/types/tabs/tabs.d.ts +3 -0
- package/dist/types/text-input/text-input.d.ts +0 -4
- package/dist/types/textarea/index.d.ts +1 -0
- package/dist/types/textarea/textarea.d.ts +26 -0
- package/dist/types/tooltip/defines.d.ts +2 -0
- package/dist/types/tooltip/index.d.ts +4 -0
- package/dist/types/tooltip/tooltip.d.ts +48 -0
- package/dist/types/tree/defines.d.ts +23 -0
- package/dist/types/tree/index.d.ts +5 -0
- package/dist/types/tree/tree-item.d.ts +54 -0
- package/dist/types/tree/tree.d.ts +64 -0
- package/package.json +5 -5
- package/src/aeico-field.ts +142 -7
- package/src/alert/alert.ts +3 -2
- package/src/card/defines.ts +1 -1
- package/src/checkbox/checkbox.ts +17 -2
- package/src/copy-button/copy-button.ts +150 -0
- package/src/copy-button/defines.ts +5 -0
- package/src/copy-button/index.ts +3 -0
- package/src/detail/defines.ts +2 -1
- package/src/detail/detail.ts +5 -1
- package/src/detail/index.ts +1 -1
- package/src/detail-group/detail-group.ts +104 -0
- package/src/detail-group/index.ts +2 -0
- package/src/drawer/defines.ts +1 -0
- package/src/drawer/drawer.ts +157 -0
- package/src/drawer/index.ts +3 -0
- package/src/icon/built-in-icons.ts +21 -0
- package/src/icon/defines.ts +6 -1
- package/src/icon/icon.ts +29 -10
- package/src/icon/index.ts +1 -1
- package/src/icon/registry.ts +23 -1
- package/src/index.ts +30 -0
- package/src/menu/defines.ts +17 -0
- package/src/menu/index.ts +5 -0
- package/src/menu/menu-item.ts +315 -0
- package/src/menu/menu.ts +81 -0
- package/src/number-input/index.ts +2 -0
- package/src/number-input/number-input.ts +137 -0
- package/src/pagination/defines.ts +2 -0
- package/src/pagination/index.ts +3 -0
- package/src/pagination/pagination.ts +310 -0
- package/src/radio-group/radio-group.ts +11 -4
- package/src/select/select.ts +111 -70
- package/src/slider/slider.ts +9 -2
- package/src/spinner/defines.ts +12 -0
- package/src/spinner/index.ts +3 -0
- package/src/spinner/spinner.ts +81 -0
- package/src/styles/color.css +91 -91
- package/src/styles/components/action-button.css +37 -0
- package/src/styles/components/alert.css +22 -28
- package/src/styles/components/badge.css +13 -20
- package/src/styles/components/breadcrumb-item.css +7 -7
- package/src/styles/components/button.css +39 -50
- package/src/styles/components/card.css +45 -30
- package/src/styles/components/checkbox.css +9 -36
- package/src/styles/components/copy-button.css +108 -0
- package/src/styles/components/detail-group.css +10 -0
- package/src/styles/components/detail.css +56 -35
- package/src/styles/components/dialog.css +11 -11
- package/src/styles/components/divider.css +3 -3
- package/src/styles/components/drawer.css +152 -0
- package/src/styles/components/dropdown-item.css +7 -8
- package/src/styles/components/dropdown.css +3 -4
- package/src/styles/components/field-label.css +120 -0
- package/src/styles/components/icon-button.css +25 -36
- package/src/styles/components/icon.css +1 -1
- package/src/styles/components/menu-item.css +167 -0
- package/src/styles/components/menu.css +17 -0
- package/src/styles/components/navbar.css +16 -16
- package/src/styles/components/number-input.css +158 -0
- package/src/styles/components/pagination.css +205 -0
- package/src/styles/components/progress-bar.css +2 -3
- package/src/styles/components/radio-group.css +69 -106
- package/src/styles/components/select-option.css +5 -5
- package/src/styles/components/select.css +30 -69
- package/src/styles/components/slider.css +26 -71
- package/src/styles/components/spinner.css +78 -0
- package/src/styles/components/switch.css +64 -27
- package/src/styles/components/tab-panel.css +1 -1
- package/src/styles/components/tab.css +4 -5
- package/src/styles/components/tabs.css +49 -1
- package/src/styles/components/tag.css +14 -21
- package/src/styles/components/text-input.css +17 -64
- package/src/styles/components/textarea.css +66 -0
- package/src/styles/components/tooltip.css +102 -0
- package/src/styles/components/tree-item.css +152 -0
- package/src/styles/components/tree.css +10 -0
- package/src/styles/layout.css +457 -25
- package/src/styles/radius.css +10 -0
- package/src/styles/size.css +7 -7
- package/src/styles/variables.css +271 -247
- package/src/switch/defines.ts +1 -0
- package/src/switch/switch.ts +61 -12
- package/src/tabs/defines.ts +1 -0
- package/src/tabs/tabs.ts +12 -0
- package/src/text-input/text-input.ts +10 -15
- package/src/textarea/index.ts +1 -0
- package/src/textarea/textarea.ts +107 -0
- package/src/tooltip/defines.ts +11 -0
- package/src/tooltip/index.ts +4 -0
- package/src/tooltip/tooltip.ts +183 -0
- package/src/tree/defines.ts +26 -0
- package/src/tree/index.ts +5 -0
- package/src/tree/tree-item.ts +258 -0
- package/src/tree/tree.ts +237 -0
- package/dist/chunks/aeico-field.cjs +0 -179
- package/dist/chunks/aeico-field.cjs.map +0 -1
- package/dist/chunks/aeico-field.js +0 -180
- package/dist/chunks/aeico-field.js.map +0 -1
|
@@ -2,20 +2,19 @@
|
|
|
2
2
|
const aeicoComponent = require("./aeico-component.cjs");
|
|
3
3
|
const aeico = require("aeico");
|
|
4
4
|
const variables = require("./variables.cjs");
|
|
5
|
-
const style$1 = ":host {\n display: inline-block;\n position: relative;\n\n --dropdown-z-index: 1000;\n --dropdown-bg: var(--surface-overlay, #fff);\n --dropdown-border: 1px solid var(--color-border, rgba(0, 0, 0, 0.12));\n --dropdown-
|
|
5
|
+
const style$1 = ":host {\n display: inline-block;\n position: relative;\n\n --dropdown-z-index: 1000;\n --dropdown-bg: var(--ae-surface-overlay, #fff);\n --dropdown-border: 1px solid var(--ae-color-border, rgba(0, 0, 0, 0.12));\n --dropdown-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n --dropdown-min-width: 10rem;\n --dropdown-padding: 0.25rem 0;\n}\n\n.trigger-wrapper {\n display: flex;\n align-items: stretch;\n height: 100%;\n}\n\n/* Internal trigger rendered when `label` prop is set.\n Uses --dropdown-trigger-* variables. Context components (e.g. ae-navbar)\n map their own tokens to these variables via ::slotted(ae-dropdown). */\n.trigger-label {\n display: inline-flex;\n align-items: center;\n height: var(--dropdown-trigger-height, auto);\n padding: 0 var(--dropdown-trigger-padding-x, 0.75rem);\n color: var(--dropdown-trigger-color, inherit);\n background: var(--dropdown-trigger-bg, none);\n border: none;\n border-radius: var(--dropdown-trigger-radius, 0);\n -webkit-appearance: none;\n appearance: none;\n cursor: pointer;\n font: inherit;\n font-size: var(--dropdown-trigger-font-size, inherit);\n white-space: nowrap;\n transition: color 0.15s ease, background-color 0.15s ease;\n outline-offset: 2px;\n}\n\n.trigger-label:hover {\n color: var(--dropdown-trigger-hover-color, inherit);\n background-color: var(--dropdown-trigger-hover-bg, transparent);\n}\n\n:host([disabled]) .trigger-label {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n/* Bootstrap-style CSS border caret — shadow DOM only, no global injection needed */\n.ae-dropdown-arrow {\n display: inline-block;\n width: 0;\n height: 0;\n margin-left: 0.3em;\n vertical-align: 0.2em;\n flex-shrink: 0;\n}\n.ae-dropdown-arrow--bottom {\n border-top: 0.35em solid;\n border-right: 0.35em solid transparent;\n border-left: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--top {\n border-bottom: 0.35em solid;\n border-right: 0.35em solid transparent;\n border-left: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--right {\n border-left: 0.35em solid;\n border-top: 0.35em solid transparent;\n border-bottom: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--left {\n border-right: 0.35em solid;\n border-top: 0.35em solid transparent;\n border-bottom: 0.35em solid transparent;\n}\n\n.panel {\n display: none;\n position: absolute;\n z-index: var(--dropdown-z-index);\n background: var(--dropdown-bg);\n border: var(--dropdown-border);\n border-radius: var(--ae-border-radius, var(--ae-radius-md));\n box-shadow: var(--dropdown-shadow);\n min-width: var(--dropdown-min-width);\n padding: var(--dropdown-padding);\n box-sizing: border-box;\n /* Prevent panel from being wider than viewport */\n max-width: calc(100vw - 16px);\n}\n\n.panel.open {\n display: block;\n}\n\n/* placement variants */\n.panel.placement-bottom-start {\n top: 100%;\n left: 0;\n margin-top: 4px;\n}\n\n.panel.placement-bottom-end {\n top: 100%;\n right: 0;\n margin-top: 4px;\n}\n\n.panel.placement-bottom {\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n margin-top: 4px;\n}\n\n.panel.placement-top-start {\n bottom: 100%;\n left: 0;\n margin-bottom: 4px;\n}\n\n.panel.placement-top-end {\n bottom: 100%;\n right: 0;\n margin-bottom: 4px;\n}\n\n.panel.placement-top {\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n margin-bottom: 4px;\n}\n\n/* right placements */\n.panel.placement-right-start {\n top: 0;\n left: 100%;\n margin-left: 4px;\n}\n\n.panel.placement-right-end {\n bottom: 0;\n left: 100%;\n margin-left: 4px;\n}\n\n.panel.placement-right {\n top: 50%;\n left: 100%;\n transform: translateY(-50%);\n margin-left: 4px;\n}\n\n/* left placements */\n.panel.placement-left-start {\n top: 0;\n right: 100%;\n margin-right: 4px;\n}\n\n.panel.placement-left-end {\n bottom: 0;\n right: 100%;\n margin-right: 4px;\n}\n\n.panel.placement-left {\n top: 50%;\n right: 100%;\n transform: translateY(-50%);\n margin-right: 4px;\n}\n";
|
|
6
6
|
const style = `:host {
|
|
7
7
|
display: block;
|
|
8
8
|
|
|
9
9
|
--dropdown-item-padding: 0.5rem 0.875rem;
|
|
10
10
|
--dropdown-item-bg: transparent;
|
|
11
|
-
--dropdown-item-bg-hover: var(--surface-raised, rgba(0, 0, 0, 0.05));
|
|
12
|
-
--dropdown-item-bg-active: var(--surface-raised-active, rgba(0, 0, 0, 0.1));
|
|
13
|
-
--dropdown-item-color: var(--color-text-main, inherit);
|
|
14
|
-
--dropdown-item-color-disabled: var(--color-text-disabled, rgba(0, 0, 0, 0.35));
|
|
11
|
+
--dropdown-item-bg-hover: var(--ae-surface-raised, rgba(0, 0, 0, 0.05));
|
|
12
|
+
--dropdown-item-bg-active: var(--ae-surface-raised-active, rgba(0, 0, 0, 0.1));
|
|
13
|
+
--dropdown-item-color: var(--ae-color-text-main, inherit);
|
|
14
|
+
--dropdown-item-color-disabled: var(--ae-color-text-disabled, rgba(0, 0, 0, 0.35));
|
|
15
15
|
--dropdown-item-font-size: 0.9375rem;
|
|
16
16
|
--dropdown-item-gap: 0.5rem;
|
|
17
17
|
--dropdown-item-transition: background 0.1s;
|
|
18
|
-
--dropdown-item-border-radius: var(--ae-radius-sm, 4px);
|
|
19
18
|
}
|
|
20
19
|
|
|
21
20
|
.item {
|
|
@@ -29,7 +28,7 @@ const style = `:host {
|
|
|
29
28
|
color: var(--dropdown-item-color);
|
|
30
29
|
background: var(--dropdown-item-bg);
|
|
31
30
|
border: none;
|
|
32
|
-
border-radius: var(--
|
|
31
|
+
border-radius: var(--ae-border-radius, var(--ae-radius-sm));
|
|
33
32
|
text-align: left;
|
|
34
33
|
text-decoration: none;
|
|
35
34
|
cursor: pointer;
|
|
@@ -50,7 +49,7 @@ const style = `:host {
|
|
|
50
49
|
|
|
51
50
|
.item:focus-visible {
|
|
52
51
|
background: var(--dropdown-item-bg-hover);
|
|
53
|
-
outline: 2px solid var(--color-primary, #0e639c);
|
|
52
|
+
outline: 2px solid var(--ae-color-primary, #0e639c);
|
|
54
53
|
outline-offset: -2px;
|
|
55
54
|
}
|
|
56
55
|
|
|
@@ -65,7 +64,7 @@ const style = `:host {
|
|
|
65
64
|
/* Active item — current selection, current route, etc. */
|
|
66
65
|
:host([active]) .item {
|
|
67
66
|
background: var(--dropdown-item-bg-selected, rgba(0, 0, 0, 0.06));
|
|
68
|
-
color: var(--dropdown-item-color-active, var(--color-primary, #0e639c));
|
|
67
|
+
color: var(--dropdown-item-color-active, var(--ae-color-primary, #0e639c));
|
|
69
68
|
font-weight: 500;
|
|
70
69
|
}
|
|
71
70
|
|
|
@@ -224,7 +223,7 @@ __decorateElement$2(_init$2, 4, "checked", _checked_dec, DropdownItem, _checked)
|
|
|
224
223
|
__decorateElement$2(_init$2, 4, "active", _active_dec, DropdownItem, _active);
|
|
225
224
|
__decoratorMetadata$2(_init$2, DropdownItem);
|
|
226
225
|
__publicField$2(DropdownItem, "tagName", "dropdown-item");
|
|
227
|
-
__publicField$2(DropdownItem, "styles", [variables.
|
|
226
|
+
__publicField$2(DropdownItem, "styles", [variables.variables, style]);
|
|
228
227
|
DropdownItem.register();
|
|
229
228
|
var __create$1 = Object.create;
|
|
230
229
|
var __defProp$1 = Object.defineProperty;
|
|
@@ -399,7 +398,7 @@ __decorateElement$1(_init$1, 4, "disabled", _disabled_dec$1, Dropdown, _disabled
|
|
|
399
398
|
__decorateElement$1(_init$1, 4, "label", _label_dec, Dropdown, _label);
|
|
400
399
|
__decoratorMetadata$1(_init$1, Dropdown);
|
|
401
400
|
__publicField$1(Dropdown, "tagName", "dropdown");
|
|
402
|
-
__publicField$1(Dropdown, "styles", [variables.
|
|
401
|
+
__publicField$1(Dropdown, "styles", [variables.variables, style$1]);
|
|
403
402
|
Dropdown.register();
|
|
404
403
|
var __create = Object.create;
|
|
405
404
|
var __defProp = Object.defineProperty;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-button.cjs","sources":["../../src/dropdown/dropdown-item.ts","../../src/dropdown/dropdown.ts","../../src/dropdown/dropdown-button.ts"],"sourcesContent":["import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport style from '../styles/components/dropdown-item.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport { prop } from 'aeico';\n// Ensure ae-icon is registered when icons are used\nimport '../icon/icon';\n\n/**\n * Dropdown menu item — used as a direct child of `<ae-dropdown>`.\n *\n * Renders as a `<button>` by default, or as an `<a>` anchor when `href` is set.\n * Use `<ae-icon>` inside to add icons, and CSS `color` / `--dropdown-item-color`\n * to apply danger or custom colours.\n *\n * @example\n * ```html\n * <ae-dropdown-item value=\"edit\"><ae-icon name=\"edit\"></ae-icon>Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" style=\"--dropdown-item-color:var(--color-danger)\">Delete</ae-dropdown-item>\n * <ae-dropdown-item href=\"/profile\">Profile</ae-dropdown-item>\n * ```\n */\nclass DropdownItem extends AeicoComponent {\n static tagName = 'dropdown-item';\n\n /** Value emitted in the `select` event detail on the parent dropdown. */\n @prop({ type: String })\n accessor value: string | undefined;\n\n /** Disables the item — it becomes non-interactive and visually dimmed. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * When set, the item renders as an `<a>` anchor element instead of a\n * `<button>`. Useful for navigation items.\n */\n @prop({ type: String })\n accessor href: string | undefined;\n\n /**\n * When `type=\"checkbox\"`, the item behaves as a toggle: each click flips\n * `checked` and includes the new state in the `select` event detail.\n */\n @prop({ type: String })\n accessor type: 'checkbox' | undefined;\n\n /**\n * Whether the item is checked. Only meaningful when `type=\"checkbox\"`.\n * Reflects as the `checked` attribute.\n */\n @prop({ type: Boolean })\n accessor checked: boolean = false;\n\n /**\n * Marks the item as the currently active/selected option (e.g. current route,\n * current sort order). Purely visual — applies a highlighted background and\n * accent colour.\n */\n @prop({ type: Boolean })\n accessor active: boolean = false;\n\n protected static styles = [variables, style];\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('click', this._handleClick);\n this.setAttribute('role', 'menuitem');\n }\n\n private _handleClick = (e: Event): void => {\n if (this.disabled) {\n e.preventDefault();\n e.stopPropagation();\n\n return;\n }\n if (this.type === 'checkbox') {\n this.checked = !this.checked;\n }\n const label = this.textContent?.trim() ?? '';\n this.dispatchEvent(\n new CustomEvent('_item-select', {\n bubbles: true,\n composed: true,\n detail: { value: this.value ?? '', label, checked: this.checked },\n }),\n );\n };\n\n protected render() {\n const isCheckbox = this.type === 'checkbox';\n const sharedProps = {\n part: 'item',\n className: 'item',\n 'aria-checked': isCheckbox ? String(this.checked) : undefined,\n };\n return html(({ button, a, span, slot }) => {\n const children = () => {\n if (isCheckbox) span({ className: 'check-indicator', 'aria-hidden': 'true' });\n slot();\n };\n if (this.href) {\n a(\n {\n ...sharedProps,\n href: this.disabled ? undefined : this.href,\n 'aria-disabled': this.disabled || undefined,\n },\n children,\n );\n } else {\n button(\n {\n ...sharedProps,\n type: 'button',\n disabled: this.disabled,\n },\n children,\n );\n }\n });\n }\n}\n\nDropdownItem.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-item': DropdownItem;\n }\n}\n\nexport default DropdownItem;\nexport type DropdownItemProps = InferProps<typeof DropdownItem>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport style from '../styles/components/dropdown.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport type { DropdownPlacement } from './defines';\n// Ensure ae-dropdown-item is registered when this module is used\nimport './dropdown-item';\n\n/**\n * Dropdown component — renders a floating menu panel anchored to a trigger slot.\n *\n * The trigger is provided via `slot=\"trigger\"` (typically an `<ae-button>`).\n * Menu items are provided as `<ae-dropdown-item>` default-slot children.\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is clicked\n *\n * @example\n * ```html\n * <ae-dropdown>\n * <ae-button slot=\"trigger\">Actions</ae-button>\n * <ae-dropdown-item value=\"edit\" icon=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" danger icon=\"trash\">Delete</ae-dropdown-item>\n * </ae-dropdown>\n * ```\n *\n * @example\n * ```html\n * <!-- Inside ae-navbar -->\n * <ae-navbar>\n * <a slot=\"brand\" href=\"/\">MyApp</a>\n * <ae-dropdown slot=\"end\">\n * <ae-button slot=\"trigger\" variant=\"outlined\" size=\"sm\">User</ae-button>\n * <ae-dropdown-item href=\"/profile\" icon=\"user\">Profile</ae-dropdown-item>\n * <ae-dropdown-item value=\"logout\" danger>Sign out</ae-dropdown-item>\n * </ae-dropdown>\n * </ae-navbar>\n * ```\n */\nclass Dropdown extends AeicoComponent {\n static tagName = 'dropdown';\n\n protected static styles = [variables, style];\n\n /**\n * Position of the panel relative to the trigger.\n * Defaults to `'bottom-start'` (left-aligned, below trigger).\n */\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n /**\n * Whether the dropdown panel is visible. Reflects as the `open` attribute.\n * Can be used for controlled open/close state.\n */\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n /**\n * When `true` (default), clicking a menu item automatically closes the panel.\n */\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n /** Disables the trigger and prevents opening. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * Optional label text. When set, `ae-dropdown` renders its own trigger button\n * in the shadow DOM (no `slot=\"trigger\"` needed). Inherits `--ae-navbar-link-*`\n * CSS variables so it automatically matches navbar link styles.\n */\n @prop({ type: String })\n accessor label: string = '';\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n\n this.listen('_item-select', this._handleItemSelect as EventListener);\n this.listen('keydown', this._handleKeydown as EventListener);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._closePanel();\n }\n };\n document.addEventListener('click', this._outsideClickHandler);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this._outsideClickHandler) {\n document.removeEventListener('click', this._outsideClickHandler);\n this._outsideClickHandler = null;\n }\n }\n\n /** Opens the dropdown panel. */\n show(): void {\n if (this.disabled || this.open) return;\n this.open = true;\n this.emit('open');\n }\n\n /** Closes the dropdown panel. */\n hide(): void {\n if (!this.open) return;\n this.open = false;\n this.emit('close');\n }\n\n /** Toggles the dropdown panel open/closed. */\n toggle(): void {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n private _closePanel(): void {\n if (this.open) this.hide();\n }\n\n // Called via declarative @click on the trigger-wrapper div inside the shadow DOM.\n // Events from slotted trigger content bubble through the shadow DOM slot path,\n // so this fires for trigger clicks only — not for panel item clicks.\n private _handleTriggerClick = (): void => {\n this.toggle();\n };\n\n private _handleItemSelect = (e: CustomEvent): void => {\n this.emit('select', { detail: e.detail });\n if (this.closeOnSelect) {\n this._closePanel();\n }\n };\n\n private _handleKeydown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape' && this.open) {\n e.stopPropagation();\n this._closePanel();\n }\n };\n\n protected render() {\n const placementClass = `placement-${this.placement}`;\n const hasLabel = !!this.label;\n const dir = this.placement.split('-')[0];\n return html(({ div, slot, button, span }) => {\n div(\n {\n className: 'trigger-wrapper',\n 'aria-haspopup': 'menu',\n 'aria-expanded': String(this.open),\n '@click': this.disabled ? undefined : this._handleTriggerClick,\n },\n () => {\n if (hasLabel) {\n button(\n {\n className: 'trigger-label',\n type: 'button',\n disabled: this.disabled || undefined,\n },\n () => {\n span({ text: this.label });\n span({\n className: `ae-dropdown-arrow ae-dropdown-arrow--${dir}`,\n 'aria-hidden': 'true',\n });\n },\n );\n } else {\n slot({ name: 'trigger' });\n }\n },\n );\n div(\n {\n part: 'panel',\n className: { panel: true, open: this.open, [placementClass]: true },\n role: 'menu',\n },\n () => {\n slot();\n },\n );\n });\n }\n}\n\nDropdown.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown': Dropdown;\n }\n}\n\nexport default Dropdown;\nexport type DropdownProps = InferProps<typeof Dropdown>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from '../button/defines';\nimport type { DropdownPlacement } from './defines';\nimport type Dropdown from './dropdown';\nimport './dropdown';\nimport '../button/button';\n\n/**\n * DropdownButton — a pre-composed trigger + dropdown panel.\n *\n * Renders an `ae-button`-styled trigger with a built-in chevron,\n * and a floating panel for `<ae-dropdown-item>` children.\n * Accepts the same `variant`, `color`, `size`, and `disabled` props\n * as `ae-button`, making it a drop-in inside `ae-button-group`.\n *\n * @example\n * ```html\n * <ae-dropdown-button variant=\"outlined\" color=\"primary\">\n * Actions\n * <ae-dropdown-item value=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\">Delete</ae-dropdown-item>\n * </ae-dropdown-button>\n *\n * <!-- Inside ae-button-group -->\n * <ae-button-group compact color=\"primary\">\n * <ae-button>Save</ae-button>\n * <ae-dropdown-button placement=\"bottom-end\">\n * <ae-dropdown-item value=\"draft\">Save as draft</ae-dropdown-item>\n * <ae-dropdown-item value=\"template\">Save as template</ae-dropdown-item>\n * </ae-dropdown-button>\n * </ae-button-group>\n * ```\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is selected\n */\nclass DropdownButton extends AeicoComponent {\n static tagName = 'dropdown-button';\n\n // ae-button and ae-dropdown each carry their own shadow DOM styles.\n // Only the host display is set here so button-group compact layout works.\n protected static styles = [\n ':host { display: inline-block; }',\n '.caret { display: inline-block; width: 0; height: 0; margin-left: 0.3em; vertical-align: 0.2em; flex-shrink: 0; }',\n '.caret--bottom { border-top: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--top { border-bottom: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--right { border-left: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n '.caret--left { border-right: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n ];\n\n @prop({ type: String })\n accessor variant: ButtonVariant = 'filled';\n\n @prop({ type: String })\n accessor color: ButtonColor = 'default';\n\n @prop({ type: String })\n accessor size: ButtonSize = 'md';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n private _dropdownEl: Dropdown | null = null;\n\n show(): void {\n if (this.disabled) return;\n this._dropdownEl?.show();\n }\n hide(): void {\n this._dropdownEl?.hide();\n }\n toggle(): void {\n if (this.disabled) return;\n this._dropdownEl?.toggle();\n }\n\n get open(): boolean {\n return this._dropdownEl?.open ?? false;\n }\n\n protected render() {\n const dir = this.placement.split('-')[0];\n return html(({ aeDropdown, aeButton, slot, span }) => {\n this._dropdownEl = aeDropdown(\n {\n placement: this.placement,\n 'close-on-select': this.closeOnSelect,\n },\n () => {\n aeButton(\n {\n slot: 'trigger',\n variant: this.variant,\n color: this.color,\n size: this.size,\n disabled: this.disabled || undefined,\n },\n () => {\n slot({ name: 'label' });\n span({ className: `caret caret--${dir}`, 'aria-hidden': 'true' });\n },\n );\n slot();\n },\n );\n });\n }\n}\n\nDropdownButton.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-button': DropdownButton;\n }\n}\n\nexport default DropdownButton;\nexport type DropdownButtonProps = InferProps<typeof DropdownButton>;\n"],"names":["_disabled_dec","_a","_init","_disabled","prop","__privateAdd","__runInitializers","__publicField","html","__decoratorStart","__decorateElement","__decoratorMetadata","variables","_closeOnSelect_dec","_placement_dec","_placement","_closeOnSelect","AeicoComponent","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,aAAA,cAAA,WAAA,WAAAA,iBAAA,YAAAC,MAAAC,SAAA,QAAAC,aAAA,OAAA,OAAA,UAAA;AAuBA,MAAM,sBAAqBF,sCAIzB,aAAA,CAACG,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAItBJ,kBAAA,CAACI,WAAK,EAAE,MAAM,SAAS,CAAA,GAOvB,aAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,IAOtB,YAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAOtB,eAAA,CAACA,WAAK,EAAE,MAAM,SAAS,CAAA,GAQvB,eAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,IArCEH,MAAe;AAAA,EAA1C,cAAA;AAAA,UAAA,GAAA,SAAA;AAKEI,mBAAA,MAAS,QAATC,oBAAAJ,SAAA,GAAA,IAAA,CAAA,GAAAI,oBAAAJ,SAAA,IAAA,IAAA;AAIAG,mBAAA,MAASF,aAAoBG,oBAA7BJ,SAAA,IAAA,MAA6B,KAAA,CAAA,GAA7BI,oBAAAJ,SAAA,IAAA,IAAA;AAOAG,mBAAA,MAAS,OAATC,oBAAAJ,SAAA,IAAA,IAAA,CAAA,GAAAI,oBAAAJ,SAAA,IAAA,IAAA;AAOAG,mBAAA,MAAS,OAATC,oBAAAJ,SAAA,IAAA,IAAA,CAAA,GAAAI,oBAAAJ,SAAA,IAAA,IAAA;AAOAG,mBAAA,MAAS,UAAmBC,oBAA5BJ,SAAA,IAAA,MAA4B,KAAA,CAAA,GAA5BI,oBAAAJ,SAAA,IAAA,IAAA;AAQAG,mBAAA,MAAS,SAAkBC,oBAA3BJ,SAAA,IAAA,MAA2B,KAAA,CAAA,GAA3BI,oBAAAJ,SAAA,IAAA,IAAA;AAUAK,oBAAA,MAAQ,gBAAe,CAAC,MAAmB;;AACzC,UAAI,KAAK,UAAU;AACjB,UAAE,eAAA;AACF,UAAE,gBAAA;AAEF;AAAA,MACF;AACA,UAAI,KAAK,SAAS,YAAY;AAC5B,aAAK,UAAU,CAAC,KAAK;AAAA,MACvB;AACA,YAAM,UAAQN,MAAA,KAAK,gBAAL,gBAAAA,IAAkB,WAAU;AAC1C,WAAK;AAAA,QACH,IAAI,YAAY,gBAAgB;AAAA,UAC9B,SAAS;AAAA,UACT,UAAU;AAAA,UACV,QAAQ,EAAE,OAAO,KAAK,SAAS,IAAI,OAAO,SAAS,KAAK,QAAA;AAAA,QAAQ,CACjE;AAAA,MAAA;AAAA,IAEL,CAAA;AAAA,EAAA;AAAA,EAxBA,oBAAoB;AAClB,UAAM,kBAAA;AACN,SAAK,OAAO,SAAS,KAAK,YAAY;AACtC,SAAK,aAAa,QAAQ,UAAU;AAAA,EACtC;AAAA,EAsBU,SAAS;AACjB,UAAM,aAAa,KAAK,SAAS;AACjC,UAAM,cAAc;AAAA,MAClB,MAAM;AAAA,MACN,WAAW;AAAA,MACX,gBAAgB,aAAa,OAAO,KAAK,OAAO,IAAI;AAAA,IAAA;AAEtD,WAAOO,MAAAA,KAAK,CAAC,EAAE,QAAQ,GAAG,MAAM,WAAW;AACzC,YAAM,WAAW,MAAM;AACrB,YAAI,WAAY,MAAK,EAAE,WAAW,mBAAmB,eAAe,QAAQ;AAC5E,aAAA;AAAA,MACF;AACA,UAAI,KAAK,MAAM;AACb;AAAA,UACE;AAAA,YACE,GAAG;AAAA,YACH,MAAM,KAAK,WAAW,SAAY,KAAK;AAAA,YACvC,iBAAiB,KAAK,YAAY;AAAA,UAAA;AAAA,UAEpC;AAAA,QAAA;AAAA,MAEJ,OAAO;AACL;AAAA,UACE;AAAA,YACE,GAAG;AAAA,YACH,MAAM;AAAA,YACN,UAAU,KAAK;AAAA,UAAA;AAAA,UAEjB;AAAA,QAAA;AAAA,MAEJ;AAAA,IACF,CAAC;AAAA,EACH;AACF;AArGAN,UAAAO,mBAAAR,IAAA;AAKW,SAAA,oBAAA,QAAA;AAIAE,cAAA,oBAAA,QAAA;AAOA,QAAA,oBAAA,QAAA;AAOA,QAAA,oBAAA,QAAA;AAOA,WAAA,oBAAA,QAAA;AAQA,UAAA,oBAAA,QAAA;AAjCTO,oBAAAR,SAAA,GAAS,SADT,YAJI,cAKK,MAAA;AAITQ,oBAAAR,SAAA,GAAS,YADTF,iBARI,cASKG,WAAA;AAOTO,oBAAAR,SAAA,GAAS,QADT,WAfI,cAgBK,KAAA;AAOTQ,oBAAAR,SAAA,GAAS,QADT,WAtBI,cAuBK,KAAA;AAOTQ,oBAAAR,SAAA,GAAS,WADT,cA7BI,cA8BK,QAAA;AAQTQ,oBAAAR,SAAA,GAAS,UADT,aArCI,cAsCK,OAAA;AAtCXS,sBAAAT,SAAM,YAAA;AACJK,gBADI,cACG,WAAU,eAAA;AAuCjBA,gBAxCI,cAwCa,UAAS,CAACK,UAAAA,gBAAW,KAAK,CAAA;AA+D7C,aAAa,SAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9Hb,IAAA,YAAAZ,iBAAAa,sBAAA,WAAAC,kBAAAb,MAAAC,SAAAa,cAAA,OAAAC,kBAAAb,aAAA;AA2CA,MAAM,kBAAiBF,OAAAgB,+BASrBH,mBAAA,CAACV,WAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAOtB,YAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,SAAS,IAMvBS,uBAAA,CAACT,MAAAA,KAAK,EAAE,MAAM,SAAS,CAAA,GAIvBJ,kBAAA,CAACI,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAQvB,cAACA,WAAK,EAAE,MAAM,OAAA,CAAQ,IAlCDH,MAAe;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA;AAUEI,mBAAA,MAASU,cAA+BT,oBAAxCJ,SAAA,GAAA,MAAwC,cAAA,CAAA,GAAxCI,oBAAAJ,SAAA,IAAA,IAAA;AAOAG,mBAAA,MAAS,OAAgBC,oBAAzBJ,SAAA,IAAA,MAAyB,KAAA,CAAA,GAAzBI,oBAAAJ,SAAA,IAAA,IAAA;AAMAG,mBAAA,MAASW,kBAAyBV,oBAAlCJ,SAAA,IAAA,MAAkC,IAAA,CAAA,GAAlCI,oBAAAJ,SAAA,IAAA,IAAA;AAIAG,mBAAA,MAASF,aAAoBG,oBAA7BJ,SAAA,IAAA,MAA6B,KAAA,CAAA,GAA7BI,oBAAAJ,SAAA,IAAA,IAAA;AAQAG,mBAAA,MAAS,QAAgBC,oBAAzBJ,SAAA,IAAA,MAAyB,EAAA,CAAA,GAAzBI,oBAAAJ,SAAA,IAAA,IAAA;AAEAK,oBAAA,MAAQ,wBAAyD,IAAA;AAwDjEA,oBAAA,MAAQ,uBAAsB,MAAY;AACxC,WAAK,OAAA;AAAA,IACP,CAAA;AAEAA,oBAAA,MAAQ,qBAAoB,CAAC,MAAyB;AACpD,WAAK,KAAK,UAAU,EAAE,QAAQ,EAAE,QAAQ;AACxC,UAAI,KAAK,eAAe;AACtB,aAAK,YAAA;AAAA,MACP;AAAA,IACF,CAAA;AAEAA,oBAAA,MAAQ,kBAAiB,CAAC,MAA2B;AACnD,UAAI,EAAE,QAAQ,YAAY,KAAK,MAAM;AACnC,UAAE,gBAAA;AACF,aAAK,YAAA;AAAA,MACP;AAAA,IACF,CAAA;AAAA,EAAA;AAAA,EAtEA,oBAAoB;AAClB,UAAM,kBAAA;AAEN,SAAK,OAAO,gBAAgB,KAAK,iBAAkC;AACnE,SAAK,OAAO,WAAW,KAAK,cAA+B;AAE3D,SAAK,uBAAuB,CAAC,MAAkB;AAC7C,UAAI,CAAC,KAAK,KAAM;AAChB,YAAM,OAAO,EAAE,aAAA;AACf,UAAI,CAAC,KAAK,SAAS,IAAI,GAAG;AACxB,aAAK,YAAA;AAAA,MACP;AAAA,IACF;AACA,aAAS,iBAAiB,SAAS,KAAK,oBAAoB;AAAA,EAC9D;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA;AACN,QAAI,KAAK,sBAAsB;AAC7B,eAAS,oBAAoB,SAAS,KAAK,oBAAoB;AAC/D,WAAK,uBAAuB;AAAA,IAC9B;AAAA,EACF;AAAA;AAAA,EAGA,OAAa;AACX,QAAI,KAAK,YAAY,KAAK,KAAM;AAChC,SAAK,OAAO;AACZ,SAAK,KAAK,MAAM;AAAA,EAClB;AAAA;AAAA,EAGA,OAAa;AACX,QAAI,CAAC,KAAK,KAAM;AAChB,SAAK,OAAO;AACZ,SAAK,KAAK,OAAO;AAAA,EACnB;AAAA;AAAA,EAGA,SAAe;AACb,QAAI,KAAK,MAAM;AACb,WAAK,KAAA;AAAA,IACP,OAAO;AACL,WAAK,KAAA;AAAA,IACP;AAAA,EACF;AAAA,EAEQ,cAAoB;AAC1B,QAAI,KAAK,KAAM,MAAK,KAAA;AAAA,EACtB;AAAA,EAuBU,SAAS;AACjB,UAAM,iBAAiB,aAAa,KAAK,SAAS;AAClD,UAAM,WAAW,CAAC,CAAC,KAAK;AACxB,UAAM,MAAM,KAAK,UAAU,MAAM,GAAG,EAAE,CAAC;AACvC,WAAOC,MAAAA,KAAK,CAAC,EAAE,KAAK,MAAM,QAAQ,WAAW;AAC3C;AAAA,QACE;AAAA,UACE,WAAW;AAAA,UACX,iBAAiB;AAAA,UACjB,iBAAiB,OAAO,KAAK,IAAI;AAAA,UACjC,UAAU,KAAK,WAAW,SAAY,KAAK;AAAA,QAAA;AAAA,QAE7C,MAAM;AACJ,cAAI,UAAU;AACZ;AAAA,cACE;AAAA,gBACE,WAAW;AAAA,gBACX,MAAM;AAAA,gBACN,UAAU,KAAK,YAAY;AAAA,cAAA;AAAA,cAE7B,MAAM;AACJ,qBAAK,EAAE,MAAM,KAAK,MAAA,CAAO;AACzB,qBAAK;AAAA,kBACH,WAAW,wCAAwC,GAAG;AAAA,kBACtD,eAAe;AAAA,gBAAA,CAChB;AAAA,cACH;AAAA,YAAA;AAAA,UAEJ,OAAO;AACL,iBAAK,EAAE,MAAM,WAAW;AAAA,UAC1B;AAAA,QACF;AAAA,MAAA;AAEF;AAAA,QACE;AAAA,UACE,MAAM;AAAA,UACN,WAAW,EAAE,OAAO,MAAM,MAAM,KAAK,MAAM,CAAC,cAAc,GAAG,KAAA;AAAA,UAC7D,MAAM;AAAA,QAAA;AAAA,QAER,MAAM;AACJ,eAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ,CAAC;AAAA,EACH;AACF;AA5JAN,UAAAO,mBAAAR,IAAA;AAUWc,eAAA,oBAAA,QAAA;AAOA,QAAA,oBAAA,QAAA;AAMAC,mBAAA,oBAAA,QAAA;AAIAb,cAAA,oBAAA,QAAA;AAQA,SAAA,oBAAA,QAAA;AAzBTO,oBAAAR,SAAA,GAAS,aADTY,kBATI,UAUKC,YAAA;AAOTL,oBAAAR,SAAA,GAAS,QADT,WAhBI,UAiBK,KAAA;AAMTQ,oBAAAR,SAAA,GAAS,iBADTW,sBAtBI,UAuBKG,gBAAA;AAITN,oBAAAR,SAAA,GAAS,YADTF,iBA1BI,UA2BKG,WAAA;AAQTO,oBAAAR,SAAA,GAAS,SADT,YAlCI,UAmCK,MAAA;AAnCXS,sBAAAT,SAAM,QAAA;AACJK,gBADI,UACG,WAAU,UAAA;AAEjBA,gBAHI,UAGa,UAAS,CAACK,UAAAA,gBAAWM,OAAK,CAAA;AA2J7C,SAAS,SAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzMT,IAAA,oBAAA,gBAAA,eAAA,WAAA,YAAA,cAAA,IAAA,OAAA,UAAA,QAAA,OAAA,WAAA,YAAA;AAyCA,MAAM,wBAAuB,oCAc3B,eAAA,CAACd,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,aAAA,CAACA,WAAK,EAAE,MAAM,QAAQ,CAAA,GAGtB,aAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,IAGtB,gBAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAGvB,iBAAA,CAACA,WAAK,EAAE,MAAM,QAAQ,CAAA,GAGtB,sBAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,IA7BI,IAAe;AAAA,EAA5C,cAAA;AAAA,UAAA,GAAA,SAAA;AAeE,iBAAA,MAAS,UAAyB,kBAAlC,OAAA,GAAA,MAAkC,QAAA,CAAA,GAAlC,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,QAAqB,kBAA9B,OAAA,IAAA,MAA8B,SAAA,CAAA,GAA9B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,OAAmB,kBAA5B,OAAA,IAAA,MAA4B,IAAA,CAAA,GAA5B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,WAAoB,kBAA7B,OAAA,IAAA,MAA6B,KAAA,CAAA,GAA7B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,YAA+B,kBAAxC,OAAA,IAAA,MAAwC,cAAA,CAAA,GAAxC,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,gBAAyB,kBAAlC,OAAA,IAAA,MAAkC,IAAA,CAAA,GAAlC,kBAAA,OAAA,IAAA,IAAA;AAEA,kBAAA,MAAQ,eAA+B,IAAA;AAAA,EAAA;AAAA,EAEvC,OAAa;;AACX,QAAI,KAAK,SAAU;AACnB,KAAAH,MAAA,KAAK,gBAAL,gBAAAA,IAAkB;AAAA,EACpB;AAAA,EACA,OAAa;;AACX,KAAAA,MAAA,KAAK,gBAAL,gBAAAA,IAAkB;AAAA,EACpB;AAAA,EACA,SAAe;;AACb,QAAI,KAAK,SAAU;AACnB,KAAAA,MAAA,KAAK,gBAAL,gBAAAA,IAAkB;AAAA,EACpB;AAAA,EAEA,IAAI,OAAgB;;AAClB,aAAOA,MAAA,KAAK,gBAAL,gBAAAA,IAAkB,SAAQ;AAAA,EACnC;AAAA,EAEU,SAAS;AACjB,UAAM,MAAM,KAAK,UAAU,MAAM,GAAG,EAAE,CAAC;AACvC,WAAOO,MAAAA,KAAK,CAAC,EAAE,YAAY,UAAU,MAAM,WAAW;AACpD,WAAK,cAAc;AAAA,QACjB;AAAA,UACE,WAAW,KAAK;AAAA,UAChB,mBAAmB,KAAK;AAAA,QAAA;AAAA,QAE1B,MAAM;AACJ;AAAA,YACE;AAAA,cACE,MAAM;AAAA,cACN,SAAS,KAAK;AAAA,cACd,OAAO,KAAK;AAAA,cACZ,MAAM,KAAK;AAAA,cACX,UAAU,KAAK,YAAY;AAAA,YAAA;AAAA,YAE7B,MAAM;AACJ,mBAAK,EAAE,MAAM,SAAS;AACtB,mBAAK,EAAE,WAAW,gBAAgB,GAAG,IAAI,eAAe,QAAQ;AAAA,YAClE;AAAA,UAAA;AAEF,eAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ,CAAC;AAAA,EACH;AACF;AA7EA,QAAA,iBAAA,EAAA;AAeW,WAAA,oBAAA,QAAA;AAGA,SAAA,oBAAA,QAAA;AAGA,QAAA,oBAAA,QAAA;AAGA,YAAA,oBAAA,QAAA;AAGA,aAAA,oBAAA,QAAA;AAGA,iBAAA,oBAAA,QAAA;AAfT,kBAAA,OAAA,GAAS,WADT,cAdI,gBAeK,QAAA;AAGT,kBAAA,OAAA,GAAS,SADT,YAjBI,gBAkBK,MAAA;AAGT,kBAAA,OAAA,GAAS,QADT,WApBI,gBAqBK,KAAA;AAGT,kBAAA,OAAA,GAAS,YADT,eAvBI,gBAwBK,SAAA;AAGT,kBAAA,OAAA,GAAS,aADT,gBA1BI,gBA2BK,UAAA;AAGT,kBAAA,OAAA,GAAS,iBADT,oBA7BI,gBA8BK,cAAA;AA9BX,oBAAA,OAAM,cAAA;AACJ,cADI,gBACG,WAAU,iBAAA;AAIjB,cALI,gBAKa,UAAS;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAA;AAmEF,eAAe,SAAA;;;;"}
|
|
1
|
+
{"version":3,"file":"dropdown-button.cjs","sources":["../../src/dropdown/dropdown-item.ts","../../src/dropdown/dropdown.ts","../../src/dropdown/dropdown-button.ts"],"sourcesContent":["import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport style from '../styles/components/dropdown-item.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport { prop } from 'aeico';\n// Ensure ae-icon is registered when icons are used\nimport '../icon/icon';\n\n/**\n * Dropdown menu item — used as a direct child of `<ae-dropdown>`.\n *\n * Renders as a `<button>` by default, or as an `<a>` anchor when `href` is set.\n * Use `<ae-icon>` inside to add icons, and CSS `color` / `--dropdown-item-color`\n * to apply danger or custom colours.\n *\n * @example\n * ```html\n * <ae-dropdown-item value=\"edit\"><ae-icon name=\"edit\"></ae-icon>Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" style=\"--dropdown-item-color:var(--color-danger)\">Delete</ae-dropdown-item>\n * <ae-dropdown-item href=\"/profile\">Profile</ae-dropdown-item>\n * ```\n */\nclass DropdownItem extends AeicoComponent {\n static tagName = 'dropdown-item';\n\n /** Value emitted in the `select` event detail on the parent dropdown. */\n @prop({ type: String })\n accessor value: string | undefined;\n\n /** Disables the item — it becomes non-interactive and visually dimmed. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * When set, the item renders as an `<a>` anchor element instead of a\n * `<button>`. Useful for navigation items.\n */\n @prop({ type: String })\n accessor href: string | undefined;\n\n /**\n * When `type=\"checkbox\"`, the item behaves as a toggle: each click flips\n * `checked` and includes the new state in the `select` event detail.\n */\n @prop({ type: String })\n accessor type: 'checkbox' | undefined;\n\n /**\n * Whether the item is checked. Only meaningful when `type=\"checkbox\"`.\n * Reflects as the `checked` attribute.\n */\n @prop({ type: Boolean })\n accessor checked: boolean = false;\n\n /**\n * Marks the item as the currently active/selected option (e.g. current route,\n * current sort order). Purely visual — applies a highlighted background and\n * accent colour.\n */\n @prop({ type: Boolean })\n accessor active: boolean = false;\n\n protected static styles = [variables, style];\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('click', this._handleClick);\n this.setAttribute('role', 'menuitem');\n }\n\n private _handleClick = (e: Event): void => {\n if (this.disabled) {\n e.preventDefault();\n e.stopPropagation();\n\n return;\n }\n if (this.type === 'checkbox') {\n this.checked = !this.checked;\n }\n const label = this.textContent?.trim() ?? '';\n this.dispatchEvent(\n new CustomEvent('_item-select', {\n bubbles: true,\n composed: true,\n detail: { value: this.value ?? '', label, checked: this.checked },\n }),\n );\n };\n\n protected render() {\n const isCheckbox = this.type === 'checkbox';\n const sharedProps = {\n part: 'item',\n className: 'item',\n 'aria-checked': isCheckbox ? String(this.checked) : undefined,\n };\n return html(({ button, a, span, slot }) => {\n const children = () => {\n if (isCheckbox) span({ className: 'check-indicator', 'aria-hidden': 'true' });\n slot();\n };\n if (this.href) {\n a(\n {\n ...sharedProps,\n href: this.disabled ? undefined : this.href,\n 'aria-disabled': this.disabled || undefined,\n },\n children,\n );\n } else {\n button(\n {\n ...sharedProps,\n type: 'button',\n disabled: this.disabled,\n },\n children,\n );\n }\n });\n }\n}\n\nDropdownItem.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-item': DropdownItem;\n }\n}\n\nexport default DropdownItem;\nexport type DropdownItemProps = InferProps<typeof DropdownItem>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport style from '../styles/components/dropdown.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport type { DropdownPlacement } from './defines';\n// Ensure ae-dropdown-item is registered when this module is used\nimport './dropdown-item';\n\n/**\n * Dropdown component — renders a floating menu panel anchored to a trigger slot.\n *\n * The trigger is provided via `slot=\"trigger\"` (typically an `<ae-button>`).\n * Menu items are provided as `<ae-dropdown-item>` default-slot children.\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is clicked\n *\n * @example\n * ```html\n * <ae-dropdown>\n * <ae-button slot=\"trigger\">Actions</ae-button>\n * <ae-dropdown-item value=\"edit\" icon=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" danger icon=\"trash\">Delete</ae-dropdown-item>\n * </ae-dropdown>\n * ```\n *\n * @example\n * ```html\n * <!-- Inside ae-navbar -->\n * <ae-navbar>\n * <a slot=\"brand\" href=\"/\">MyApp</a>\n * <ae-dropdown slot=\"end\">\n * <ae-button slot=\"trigger\" variant=\"outlined\" size=\"sm\">User</ae-button>\n * <ae-dropdown-item href=\"/profile\" icon=\"user\">Profile</ae-dropdown-item>\n * <ae-dropdown-item value=\"logout\" danger>Sign out</ae-dropdown-item>\n * </ae-dropdown>\n * </ae-navbar>\n * ```\n */\nclass Dropdown extends AeicoComponent {\n static tagName = 'dropdown';\n\n protected static styles = [variables, style];\n\n /**\n * Position of the panel relative to the trigger.\n * Defaults to `'bottom-start'` (left-aligned, below trigger).\n */\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n /**\n * Whether the dropdown panel is visible. Reflects as the `open` attribute.\n * Can be used for controlled open/close state.\n */\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n /**\n * When `true` (default), clicking a menu item automatically closes the panel.\n */\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n /** Disables the trigger and prevents opening. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * Optional label text. When set, `ae-dropdown` renders its own trigger button\n * in the shadow DOM (no `slot=\"trigger\"` needed). Inherits `--ae-navbar-link-*`\n * CSS variables so it automatically matches navbar link styles.\n */\n @prop({ type: String })\n accessor label: string = '';\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n\n this.listen('_item-select', this._handleItemSelect as EventListener);\n this.listen('keydown', this._handleKeydown as EventListener);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._closePanel();\n }\n };\n document.addEventListener('click', this._outsideClickHandler);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this._outsideClickHandler) {\n document.removeEventListener('click', this._outsideClickHandler);\n this._outsideClickHandler = null;\n }\n }\n\n /** Opens the dropdown panel. */\n show(): void {\n if (this.disabled || this.open) return;\n this.open = true;\n this.emit('open');\n }\n\n /** Closes the dropdown panel. */\n hide(): void {\n if (!this.open) return;\n this.open = false;\n this.emit('close');\n }\n\n /** Toggles the dropdown panel open/closed. */\n toggle(): void {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n private _closePanel(): void {\n if (this.open) this.hide();\n }\n\n // Called via declarative @click on the trigger-wrapper div inside the shadow DOM.\n // Events from slotted trigger content bubble through the shadow DOM slot path,\n // so this fires for trigger clicks only — not for panel item clicks.\n private _handleTriggerClick = (): void => {\n this.toggle();\n };\n\n private _handleItemSelect = (e: CustomEvent): void => {\n this.emit('select', { detail: e.detail });\n if (this.closeOnSelect) {\n this._closePanel();\n }\n };\n\n private _handleKeydown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape' && this.open) {\n e.stopPropagation();\n this._closePanel();\n }\n };\n\n protected render() {\n const placementClass = `placement-${this.placement}`;\n const hasLabel = !!this.label;\n const dir = this.placement.split('-')[0];\n return html(({ div, slot, button, span }) => {\n div(\n {\n className: 'trigger-wrapper',\n 'aria-haspopup': 'menu',\n 'aria-expanded': String(this.open),\n '@click': this.disabled ? undefined : this._handleTriggerClick,\n },\n () => {\n if (hasLabel) {\n button(\n {\n className: 'trigger-label',\n type: 'button',\n disabled: this.disabled || undefined,\n },\n () => {\n span({ text: this.label });\n span({\n className: `ae-dropdown-arrow ae-dropdown-arrow--${dir}`,\n 'aria-hidden': 'true',\n });\n },\n );\n } else {\n slot({ name: 'trigger' });\n }\n },\n );\n div(\n {\n part: 'panel',\n className: { panel: true, open: this.open, [placementClass]: true },\n role: 'menu',\n },\n () => {\n slot();\n },\n );\n });\n }\n}\n\nDropdown.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown': Dropdown;\n }\n}\n\nexport default Dropdown;\nexport type DropdownProps = InferProps<typeof Dropdown>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from '../button/defines';\nimport type { DropdownPlacement } from './defines';\nimport type Dropdown from './dropdown';\nimport './dropdown';\nimport '../button/button';\n\n/**\n * DropdownButton — a pre-composed trigger + dropdown panel.\n *\n * Renders an `ae-button`-styled trigger with a built-in chevron,\n * and a floating panel for `<ae-dropdown-item>` children.\n * Accepts the same `variant`, `color`, `size`, and `disabled` props\n * as `ae-button`, making it a drop-in inside `ae-button-group`.\n *\n * @example\n * ```html\n * <ae-dropdown-button variant=\"outlined\" color=\"primary\">\n * Actions\n * <ae-dropdown-item value=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\">Delete</ae-dropdown-item>\n * </ae-dropdown-button>\n *\n * <!-- Inside ae-button-group -->\n * <ae-button-group compact color=\"primary\">\n * <ae-button>Save</ae-button>\n * <ae-dropdown-button placement=\"bottom-end\">\n * <ae-dropdown-item value=\"draft\">Save as draft</ae-dropdown-item>\n * <ae-dropdown-item value=\"template\">Save as template</ae-dropdown-item>\n * </ae-dropdown-button>\n * </ae-button-group>\n * ```\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is selected\n */\nclass DropdownButton extends AeicoComponent {\n static tagName = 'dropdown-button';\n\n // ae-button and ae-dropdown each carry their own shadow DOM styles.\n // Only the host display is set here so button-group compact layout works.\n protected static styles = [\n ':host { display: inline-block; }',\n '.caret { display: inline-block; width: 0; height: 0; margin-left: 0.3em; vertical-align: 0.2em; flex-shrink: 0; }',\n '.caret--bottom { border-top: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--top { border-bottom: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--right { border-left: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n '.caret--left { border-right: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n ];\n\n @prop({ type: String })\n accessor variant: ButtonVariant = 'filled';\n\n @prop({ type: String })\n accessor color: ButtonColor = 'default';\n\n @prop({ type: String })\n accessor size: ButtonSize = 'md';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n private _dropdownEl: Dropdown | null = null;\n\n show(): void {\n if (this.disabled) return;\n this._dropdownEl?.show();\n }\n hide(): void {\n this._dropdownEl?.hide();\n }\n toggle(): void {\n if (this.disabled) return;\n this._dropdownEl?.toggle();\n }\n\n get open(): boolean {\n return this._dropdownEl?.open ?? false;\n }\n\n protected render() {\n const dir = this.placement.split('-')[0];\n return html(({ aeDropdown, aeButton, slot, span }) => {\n this._dropdownEl = aeDropdown(\n {\n placement: this.placement,\n 'close-on-select': this.closeOnSelect,\n },\n () => {\n aeButton(\n {\n slot: 'trigger',\n variant: this.variant,\n color: this.color,\n size: this.size,\n disabled: this.disabled || undefined,\n },\n () => {\n slot({ name: 'label' });\n span({ className: `caret caret--${dir}`, 'aria-hidden': 'true' });\n },\n );\n slot();\n },\n );\n });\n }\n}\n\nDropdownButton.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-button': DropdownButton;\n }\n}\n\nexport default DropdownButton;\nexport type DropdownButtonProps = InferProps<typeof DropdownButton>;\n"],"names":["_disabled_dec","_a","_init","_disabled","prop","__privateAdd","__runInitializers","__publicField","html","__decoratorStart","__decorateElement","__decoratorMetadata","variables","_closeOnSelect_dec","_placement_dec","_placement","_closeOnSelect","AeicoComponent","style"],"mappings":"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"}
|
|
@@ -1,20 +1,19 @@
|
|
|
1
1
|
import { A as AeicoComponent } from "./aeico-component.js";
|
|
2
2
|
import { prop, html } from "aeico";
|
|
3
|
-
import {
|
|
4
|
-
const style$1 = ":host {\n display: inline-block;\n position: relative;\n\n --dropdown-z-index: 1000;\n --dropdown-bg: var(--surface-overlay, #fff);\n --dropdown-border: 1px solid var(--color-border, rgba(0, 0, 0, 0.12));\n --dropdown-
|
|
3
|
+
import { v as variables } from "./variables.js";
|
|
4
|
+
const style$1 = ":host {\n display: inline-block;\n position: relative;\n\n --dropdown-z-index: 1000;\n --dropdown-bg: var(--ae-surface-overlay, #fff);\n --dropdown-border: 1px solid var(--ae-color-border, rgba(0, 0, 0, 0.12));\n --dropdown-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n --dropdown-min-width: 10rem;\n --dropdown-padding: 0.25rem 0;\n}\n\n.trigger-wrapper {\n display: flex;\n align-items: stretch;\n height: 100%;\n}\n\n/* Internal trigger rendered when `label` prop is set.\n Uses --dropdown-trigger-* variables. Context components (e.g. ae-navbar)\n map their own tokens to these variables via ::slotted(ae-dropdown). */\n.trigger-label {\n display: inline-flex;\n align-items: center;\n height: var(--dropdown-trigger-height, auto);\n padding: 0 var(--dropdown-trigger-padding-x, 0.75rem);\n color: var(--dropdown-trigger-color, inherit);\n background: var(--dropdown-trigger-bg, none);\n border: none;\n border-radius: var(--dropdown-trigger-radius, 0);\n -webkit-appearance: none;\n appearance: none;\n cursor: pointer;\n font: inherit;\n font-size: var(--dropdown-trigger-font-size, inherit);\n white-space: nowrap;\n transition: color 0.15s ease, background-color 0.15s ease;\n outline-offset: 2px;\n}\n\n.trigger-label:hover {\n color: var(--dropdown-trigger-hover-color, inherit);\n background-color: var(--dropdown-trigger-hover-bg, transparent);\n}\n\n:host([disabled]) .trigger-label {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n/* Bootstrap-style CSS border caret — shadow DOM only, no global injection needed */\n.ae-dropdown-arrow {\n display: inline-block;\n width: 0;\n height: 0;\n margin-left: 0.3em;\n vertical-align: 0.2em;\n flex-shrink: 0;\n}\n.ae-dropdown-arrow--bottom {\n border-top: 0.35em solid;\n border-right: 0.35em solid transparent;\n border-left: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--top {\n border-bottom: 0.35em solid;\n border-right: 0.35em solid transparent;\n border-left: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--right {\n border-left: 0.35em solid;\n border-top: 0.35em solid transparent;\n border-bottom: 0.35em solid transparent;\n}\n.ae-dropdown-arrow--left {\n border-right: 0.35em solid;\n border-top: 0.35em solid transparent;\n border-bottom: 0.35em solid transparent;\n}\n\n.panel {\n display: none;\n position: absolute;\n z-index: var(--dropdown-z-index);\n background: var(--dropdown-bg);\n border: var(--dropdown-border);\n border-radius: var(--ae-border-radius, var(--ae-radius-md));\n box-shadow: var(--dropdown-shadow);\n min-width: var(--dropdown-min-width);\n padding: var(--dropdown-padding);\n box-sizing: border-box;\n /* Prevent panel from being wider than viewport */\n max-width: calc(100vw - 16px);\n}\n\n.panel.open {\n display: block;\n}\n\n/* placement variants */\n.panel.placement-bottom-start {\n top: 100%;\n left: 0;\n margin-top: 4px;\n}\n\n.panel.placement-bottom-end {\n top: 100%;\n right: 0;\n margin-top: 4px;\n}\n\n.panel.placement-bottom {\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n margin-top: 4px;\n}\n\n.panel.placement-top-start {\n bottom: 100%;\n left: 0;\n margin-bottom: 4px;\n}\n\n.panel.placement-top-end {\n bottom: 100%;\n right: 0;\n margin-bottom: 4px;\n}\n\n.panel.placement-top {\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n margin-bottom: 4px;\n}\n\n/* right placements */\n.panel.placement-right-start {\n top: 0;\n left: 100%;\n margin-left: 4px;\n}\n\n.panel.placement-right-end {\n bottom: 0;\n left: 100%;\n margin-left: 4px;\n}\n\n.panel.placement-right {\n top: 50%;\n left: 100%;\n transform: translateY(-50%);\n margin-left: 4px;\n}\n\n/* left placements */\n.panel.placement-left-start {\n top: 0;\n right: 100%;\n margin-right: 4px;\n}\n\n.panel.placement-left-end {\n bottom: 0;\n right: 100%;\n margin-right: 4px;\n}\n\n.panel.placement-left {\n top: 50%;\n right: 100%;\n transform: translateY(-50%);\n margin-right: 4px;\n}\n";
|
|
5
5
|
const style = `:host {
|
|
6
6
|
display: block;
|
|
7
7
|
|
|
8
8
|
--dropdown-item-padding: 0.5rem 0.875rem;
|
|
9
9
|
--dropdown-item-bg: transparent;
|
|
10
|
-
--dropdown-item-bg-hover: var(--surface-raised, rgba(0, 0, 0, 0.05));
|
|
11
|
-
--dropdown-item-bg-active: var(--surface-raised-active, rgba(0, 0, 0, 0.1));
|
|
12
|
-
--dropdown-item-color: var(--color-text-main, inherit);
|
|
13
|
-
--dropdown-item-color-disabled: var(--color-text-disabled, rgba(0, 0, 0, 0.35));
|
|
10
|
+
--dropdown-item-bg-hover: var(--ae-surface-raised, rgba(0, 0, 0, 0.05));
|
|
11
|
+
--dropdown-item-bg-active: var(--ae-surface-raised-active, rgba(0, 0, 0, 0.1));
|
|
12
|
+
--dropdown-item-color: var(--ae-color-text-main, inherit);
|
|
13
|
+
--dropdown-item-color-disabled: var(--ae-color-text-disabled, rgba(0, 0, 0, 0.35));
|
|
14
14
|
--dropdown-item-font-size: 0.9375rem;
|
|
15
15
|
--dropdown-item-gap: 0.5rem;
|
|
16
16
|
--dropdown-item-transition: background 0.1s;
|
|
17
|
-
--dropdown-item-border-radius: var(--ae-radius-sm, 4px);
|
|
18
17
|
}
|
|
19
18
|
|
|
20
19
|
.item {
|
|
@@ -28,7 +27,7 @@ const style = `:host {
|
|
|
28
27
|
color: var(--dropdown-item-color);
|
|
29
28
|
background: var(--dropdown-item-bg);
|
|
30
29
|
border: none;
|
|
31
|
-
border-radius: var(--
|
|
30
|
+
border-radius: var(--ae-border-radius, var(--ae-radius-sm));
|
|
32
31
|
text-align: left;
|
|
33
32
|
text-decoration: none;
|
|
34
33
|
cursor: pointer;
|
|
@@ -49,7 +48,7 @@ const style = `:host {
|
|
|
49
48
|
|
|
50
49
|
.item:focus-visible {
|
|
51
50
|
background: var(--dropdown-item-bg-hover);
|
|
52
|
-
outline: 2px solid var(--color-primary, #0e639c);
|
|
51
|
+
outline: 2px solid var(--ae-color-primary, #0e639c);
|
|
53
52
|
outline-offset: -2px;
|
|
54
53
|
}
|
|
55
54
|
|
|
@@ -64,7 +63,7 @@ const style = `:host {
|
|
|
64
63
|
/* Active item — current selection, current route, etc. */
|
|
65
64
|
:host([active]) .item {
|
|
66
65
|
background: var(--dropdown-item-bg-selected, rgba(0, 0, 0, 0.06));
|
|
67
|
-
color: var(--dropdown-item-color-active, var(--color-primary, #0e639c));
|
|
66
|
+
color: var(--dropdown-item-color-active, var(--ae-color-primary, #0e639c));
|
|
68
67
|
font-weight: 500;
|
|
69
68
|
}
|
|
70
69
|
|
|
@@ -223,7 +222,7 @@ __decorateElement$2(_init$2, 4, "checked", _checked_dec, DropdownItem, _checked)
|
|
|
223
222
|
__decorateElement$2(_init$2, 4, "active", _active_dec, DropdownItem, _active);
|
|
224
223
|
__decoratorMetadata$2(_init$2, DropdownItem);
|
|
225
224
|
__publicField$2(DropdownItem, "tagName", "dropdown-item");
|
|
226
|
-
__publicField$2(DropdownItem, "styles", [
|
|
225
|
+
__publicField$2(DropdownItem, "styles", [variables, style]);
|
|
227
226
|
DropdownItem.register();
|
|
228
227
|
var __create$1 = Object.create;
|
|
229
228
|
var __defProp$1 = Object.defineProperty;
|
|
@@ -398,7 +397,7 @@ __decorateElement$1(_init$1, 4, "disabled", _disabled_dec$1, Dropdown, _disabled
|
|
|
398
397
|
__decorateElement$1(_init$1, 4, "label", _label_dec, Dropdown, _label);
|
|
399
398
|
__decoratorMetadata$1(_init$1, Dropdown);
|
|
400
399
|
__publicField$1(Dropdown, "tagName", "dropdown");
|
|
401
|
-
__publicField$1(Dropdown, "styles", [
|
|
400
|
+
__publicField$1(Dropdown, "styles", [variables, style$1]);
|
|
402
401
|
Dropdown.register();
|
|
403
402
|
var __create = Object.create;
|
|
404
403
|
var __defProp = Object.defineProperty;
|
|
@@ -528,8 +527,8 @@ __publicField(DropdownButton, "styles", [
|
|
|
528
527
|
]);
|
|
529
528
|
DropdownButton.register();
|
|
530
529
|
export {
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
530
|
+
Dropdown as D,
|
|
531
|
+
DropdownButton as a,
|
|
532
|
+
DropdownItem as b
|
|
534
533
|
};
|
|
535
534
|
//# sourceMappingURL=dropdown-button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-button.js","sources":["../../src/dropdown/dropdown-item.ts","../../src/dropdown/dropdown.ts","../../src/dropdown/dropdown-button.ts"],"sourcesContent":["import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport style from '../styles/components/dropdown-item.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport { prop } from 'aeico';\n// Ensure ae-icon is registered when icons are used\nimport '../icon/icon';\n\n/**\n * Dropdown menu item — used as a direct child of `<ae-dropdown>`.\n *\n * Renders as a `<button>` by default, or as an `<a>` anchor when `href` is set.\n * Use `<ae-icon>` inside to add icons, and CSS `color` / `--dropdown-item-color`\n * to apply danger or custom colours.\n *\n * @example\n * ```html\n * <ae-dropdown-item value=\"edit\"><ae-icon name=\"edit\"></ae-icon>Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" style=\"--dropdown-item-color:var(--color-danger)\">Delete</ae-dropdown-item>\n * <ae-dropdown-item href=\"/profile\">Profile</ae-dropdown-item>\n * ```\n */\nclass DropdownItem extends AeicoComponent {\n static tagName = 'dropdown-item';\n\n /** Value emitted in the `select` event detail on the parent dropdown. */\n @prop({ type: String })\n accessor value: string | undefined;\n\n /** Disables the item — it becomes non-interactive and visually dimmed. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * When set, the item renders as an `<a>` anchor element instead of a\n * `<button>`. Useful for navigation items.\n */\n @prop({ type: String })\n accessor href: string | undefined;\n\n /**\n * When `type=\"checkbox\"`, the item behaves as a toggle: each click flips\n * `checked` and includes the new state in the `select` event detail.\n */\n @prop({ type: String })\n accessor type: 'checkbox' | undefined;\n\n /**\n * Whether the item is checked. Only meaningful when `type=\"checkbox\"`.\n * Reflects as the `checked` attribute.\n */\n @prop({ type: Boolean })\n accessor checked: boolean = false;\n\n /**\n * Marks the item as the currently active/selected option (e.g. current route,\n * current sort order). Purely visual — applies a highlighted background and\n * accent colour.\n */\n @prop({ type: Boolean })\n accessor active: boolean = false;\n\n protected static styles = [variables, style];\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('click', this._handleClick);\n this.setAttribute('role', 'menuitem');\n }\n\n private _handleClick = (e: Event): void => {\n if (this.disabled) {\n e.preventDefault();\n e.stopPropagation();\n\n return;\n }\n if (this.type === 'checkbox') {\n this.checked = !this.checked;\n }\n const label = this.textContent?.trim() ?? '';\n this.dispatchEvent(\n new CustomEvent('_item-select', {\n bubbles: true,\n composed: true,\n detail: { value: this.value ?? '', label, checked: this.checked },\n }),\n );\n };\n\n protected render() {\n const isCheckbox = this.type === 'checkbox';\n const sharedProps = {\n part: 'item',\n className: 'item',\n 'aria-checked': isCheckbox ? String(this.checked) : undefined,\n };\n return html(({ button, a, span, slot }) => {\n const children = () => {\n if (isCheckbox) span({ className: 'check-indicator', 'aria-hidden': 'true' });\n slot();\n };\n if (this.href) {\n a(\n {\n ...sharedProps,\n href: this.disabled ? undefined : this.href,\n 'aria-disabled': this.disabled || undefined,\n },\n children,\n );\n } else {\n button(\n {\n ...sharedProps,\n type: 'button',\n disabled: this.disabled,\n },\n children,\n );\n }\n });\n }\n}\n\nDropdownItem.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-item': DropdownItem;\n }\n}\n\nexport default DropdownItem;\nexport type DropdownItemProps = InferProps<typeof DropdownItem>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport style from '../styles/components/dropdown.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport type { DropdownPlacement } from './defines';\n// Ensure ae-dropdown-item is registered when this module is used\nimport './dropdown-item';\n\n/**\n * Dropdown component — renders a floating menu panel anchored to a trigger slot.\n *\n * The trigger is provided via `slot=\"trigger\"` (typically an `<ae-button>`).\n * Menu items are provided as `<ae-dropdown-item>` default-slot children.\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is clicked\n *\n * @example\n * ```html\n * <ae-dropdown>\n * <ae-button slot=\"trigger\">Actions</ae-button>\n * <ae-dropdown-item value=\"edit\" icon=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" danger icon=\"trash\">Delete</ae-dropdown-item>\n * </ae-dropdown>\n * ```\n *\n * @example\n * ```html\n * <!-- Inside ae-navbar -->\n * <ae-navbar>\n * <a slot=\"brand\" href=\"/\">MyApp</a>\n * <ae-dropdown slot=\"end\">\n * <ae-button slot=\"trigger\" variant=\"outlined\" size=\"sm\">User</ae-button>\n * <ae-dropdown-item href=\"/profile\" icon=\"user\">Profile</ae-dropdown-item>\n * <ae-dropdown-item value=\"logout\" danger>Sign out</ae-dropdown-item>\n * </ae-dropdown>\n * </ae-navbar>\n * ```\n */\nclass Dropdown extends AeicoComponent {\n static tagName = 'dropdown';\n\n protected static styles = [variables, style];\n\n /**\n * Position of the panel relative to the trigger.\n * Defaults to `'bottom-start'` (left-aligned, below trigger).\n */\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n /**\n * Whether the dropdown panel is visible. Reflects as the `open` attribute.\n * Can be used for controlled open/close state.\n */\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n /**\n * When `true` (default), clicking a menu item automatically closes the panel.\n */\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n /** Disables the trigger and prevents opening. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * Optional label text. When set, `ae-dropdown` renders its own trigger button\n * in the shadow DOM (no `slot=\"trigger\"` needed). Inherits `--ae-navbar-link-*`\n * CSS variables so it automatically matches navbar link styles.\n */\n @prop({ type: String })\n accessor label: string = '';\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n\n this.listen('_item-select', this._handleItemSelect as EventListener);\n this.listen('keydown', this._handleKeydown as EventListener);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._closePanel();\n }\n };\n document.addEventListener('click', this._outsideClickHandler);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this._outsideClickHandler) {\n document.removeEventListener('click', this._outsideClickHandler);\n this._outsideClickHandler = null;\n }\n }\n\n /** Opens the dropdown panel. */\n show(): void {\n if (this.disabled || this.open) return;\n this.open = true;\n this.emit('open');\n }\n\n /** Closes the dropdown panel. */\n hide(): void {\n if (!this.open) return;\n this.open = false;\n this.emit('close');\n }\n\n /** Toggles the dropdown panel open/closed. */\n toggle(): void {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n private _closePanel(): void {\n if (this.open) this.hide();\n }\n\n // Called via declarative @click on the trigger-wrapper div inside the shadow DOM.\n // Events from slotted trigger content bubble through the shadow DOM slot path,\n // so this fires for trigger clicks only — not for panel item clicks.\n private _handleTriggerClick = (): void => {\n this.toggle();\n };\n\n private _handleItemSelect = (e: CustomEvent): void => {\n this.emit('select', { detail: e.detail });\n if (this.closeOnSelect) {\n this._closePanel();\n }\n };\n\n private _handleKeydown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape' && this.open) {\n e.stopPropagation();\n this._closePanel();\n }\n };\n\n protected render() {\n const placementClass = `placement-${this.placement}`;\n const hasLabel = !!this.label;\n const dir = this.placement.split('-')[0];\n return html(({ div, slot, button, span }) => {\n div(\n {\n className: 'trigger-wrapper',\n 'aria-haspopup': 'menu',\n 'aria-expanded': String(this.open),\n '@click': this.disabled ? undefined : this._handleTriggerClick,\n },\n () => {\n if (hasLabel) {\n button(\n {\n className: 'trigger-label',\n type: 'button',\n disabled: this.disabled || undefined,\n },\n () => {\n span({ text: this.label });\n span({\n className: `ae-dropdown-arrow ae-dropdown-arrow--${dir}`,\n 'aria-hidden': 'true',\n });\n },\n );\n } else {\n slot({ name: 'trigger' });\n }\n },\n );\n div(\n {\n part: 'panel',\n className: { panel: true, open: this.open, [placementClass]: true },\n role: 'menu',\n },\n () => {\n slot();\n },\n );\n });\n }\n}\n\nDropdown.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown': Dropdown;\n }\n}\n\nexport default Dropdown;\nexport type DropdownProps = InferProps<typeof Dropdown>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from '../button/defines';\nimport type { DropdownPlacement } from './defines';\nimport type Dropdown from './dropdown';\nimport './dropdown';\nimport '../button/button';\n\n/**\n * DropdownButton — a pre-composed trigger + dropdown panel.\n *\n * Renders an `ae-button`-styled trigger with a built-in chevron,\n * and a floating panel for `<ae-dropdown-item>` children.\n * Accepts the same `variant`, `color`, `size`, and `disabled` props\n * as `ae-button`, making it a drop-in inside `ae-button-group`.\n *\n * @example\n * ```html\n * <ae-dropdown-button variant=\"outlined\" color=\"primary\">\n * Actions\n * <ae-dropdown-item value=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\">Delete</ae-dropdown-item>\n * </ae-dropdown-button>\n *\n * <!-- Inside ae-button-group -->\n * <ae-button-group compact color=\"primary\">\n * <ae-button>Save</ae-button>\n * <ae-dropdown-button placement=\"bottom-end\">\n * <ae-dropdown-item value=\"draft\">Save as draft</ae-dropdown-item>\n * <ae-dropdown-item value=\"template\">Save as template</ae-dropdown-item>\n * </ae-dropdown-button>\n * </ae-button-group>\n * ```\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is selected\n */\nclass DropdownButton extends AeicoComponent {\n static tagName = 'dropdown-button';\n\n // ae-button and ae-dropdown each carry their own shadow DOM styles.\n // Only the host display is set here so button-group compact layout works.\n protected static styles = [\n ':host { display: inline-block; }',\n '.caret { display: inline-block; width: 0; height: 0; margin-left: 0.3em; vertical-align: 0.2em; flex-shrink: 0; }',\n '.caret--bottom { border-top: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--top { border-bottom: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--right { border-left: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n '.caret--left { border-right: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n ];\n\n @prop({ type: String })\n accessor variant: ButtonVariant = 'filled';\n\n @prop({ type: String })\n accessor color: ButtonColor = 'default';\n\n @prop({ type: String })\n accessor size: ButtonSize = 'md';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n private _dropdownEl: Dropdown | null = null;\n\n show(): void {\n if (this.disabled) return;\n this._dropdownEl?.show();\n }\n hide(): void {\n this._dropdownEl?.hide();\n }\n toggle(): void {\n if (this.disabled) return;\n this._dropdownEl?.toggle();\n }\n\n get open(): boolean {\n return this._dropdownEl?.open ?? false;\n }\n\n protected render() {\n const dir = this.placement.split('-')[0];\n return html(({ aeDropdown, aeButton, slot, span }) => {\n this._dropdownEl = aeDropdown(\n {\n placement: this.placement,\n 'close-on-select': this.closeOnSelect,\n },\n () => {\n aeButton(\n {\n slot: 'trigger',\n variant: this.variant,\n color: this.color,\n size: this.size,\n disabled: this.disabled || undefined,\n },\n () => {\n slot({ name: 'label' });\n span({ className: `caret caret--${dir}`, 'aria-hidden': 'true' });\n },\n );\n slot();\n },\n );\n });\n }\n}\n\nDropdownButton.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-button': DropdownButton;\n }\n}\n\nexport default DropdownButton;\nexport type DropdownButtonProps = InferProps<typeof DropdownButton>;\n"],"names":["_disabled_dec","_a","_init","_disabled","__privateAdd","__runInitializers","__publicField","__decoratorStart","__decorateElement","__decoratorMetadata","variables","_closeOnSelect_dec","_placement_dec","_placement","_closeOnSelect","style"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdown-button.js","sources":["../../src/dropdown/dropdown-item.ts","../../src/dropdown/dropdown.ts","../../src/dropdown/dropdown-button.ts"],"sourcesContent":["import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport style from '../styles/components/dropdown-item.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport { prop } from 'aeico';\n// Ensure ae-icon is registered when icons are used\nimport '../icon/icon';\n\n/**\n * Dropdown menu item — used as a direct child of `<ae-dropdown>`.\n *\n * Renders as a `<button>` by default, or as an `<a>` anchor when `href` is set.\n * Use `<ae-icon>` inside to add icons, and CSS `color` / `--dropdown-item-color`\n * to apply danger or custom colours.\n *\n * @example\n * ```html\n * <ae-dropdown-item value=\"edit\"><ae-icon name=\"edit\"></ae-icon>Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" style=\"--dropdown-item-color:var(--color-danger)\">Delete</ae-dropdown-item>\n * <ae-dropdown-item href=\"/profile\">Profile</ae-dropdown-item>\n * ```\n */\nclass DropdownItem extends AeicoComponent {\n static tagName = 'dropdown-item';\n\n /** Value emitted in the `select` event detail on the parent dropdown. */\n @prop({ type: String })\n accessor value: string | undefined;\n\n /** Disables the item — it becomes non-interactive and visually dimmed. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * When set, the item renders as an `<a>` anchor element instead of a\n * `<button>`. Useful for navigation items.\n */\n @prop({ type: String })\n accessor href: string | undefined;\n\n /**\n * When `type=\"checkbox\"`, the item behaves as a toggle: each click flips\n * `checked` and includes the new state in the `select` event detail.\n */\n @prop({ type: String })\n accessor type: 'checkbox' | undefined;\n\n /**\n * Whether the item is checked. Only meaningful when `type=\"checkbox\"`.\n * Reflects as the `checked` attribute.\n */\n @prop({ type: Boolean })\n accessor checked: boolean = false;\n\n /**\n * Marks the item as the currently active/selected option (e.g. current route,\n * current sort order). Purely visual — applies a highlighted background and\n * accent colour.\n */\n @prop({ type: Boolean })\n accessor active: boolean = false;\n\n protected static styles = [variables, style];\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('click', this._handleClick);\n this.setAttribute('role', 'menuitem');\n }\n\n private _handleClick = (e: Event): void => {\n if (this.disabled) {\n e.preventDefault();\n e.stopPropagation();\n\n return;\n }\n if (this.type === 'checkbox') {\n this.checked = !this.checked;\n }\n const label = this.textContent?.trim() ?? '';\n this.dispatchEvent(\n new CustomEvent('_item-select', {\n bubbles: true,\n composed: true,\n detail: { value: this.value ?? '', label, checked: this.checked },\n }),\n );\n };\n\n protected render() {\n const isCheckbox = this.type === 'checkbox';\n const sharedProps = {\n part: 'item',\n className: 'item',\n 'aria-checked': isCheckbox ? String(this.checked) : undefined,\n };\n return html(({ button, a, span, slot }) => {\n const children = () => {\n if (isCheckbox) span({ className: 'check-indicator', 'aria-hidden': 'true' });\n slot();\n };\n if (this.href) {\n a(\n {\n ...sharedProps,\n href: this.disabled ? undefined : this.href,\n 'aria-disabled': this.disabled || undefined,\n },\n children,\n );\n } else {\n button(\n {\n ...sharedProps,\n type: 'button',\n disabled: this.disabled,\n },\n children,\n );\n }\n });\n }\n}\n\nDropdownItem.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-item': DropdownItem;\n }\n}\n\nexport default DropdownItem;\nexport type DropdownItemProps = InferProps<typeof DropdownItem>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport style from '../styles/components/dropdown.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport type { DropdownPlacement } from './defines';\n// Ensure ae-dropdown-item is registered when this module is used\nimport './dropdown-item';\n\n/**\n * Dropdown component — renders a floating menu panel anchored to a trigger slot.\n *\n * The trigger is provided via `slot=\"trigger\"` (typically an `<ae-button>`).\n * Menu items are provided as `<ae-dropdown-item>` default-slot children.\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is clicked\n *\n * @example\n * ```html\n * <ae-dropdown>\n * <ae-button slot=\"trigger\">Actions</ae-button>\n * <ae-dropdown-item value=\"edit\" icon=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\" danger icon=\"trash\">Delete</ae-dropdown-item>\n * </ae-dropdown>\n * ```\n *\n * @example\n * ```html\n * <!-- Inside ae-navbar -->\n * <ae-navbar>\n * <a slot=\"brand\" href=\"/\">MyApp</a>\n * <ae-dropdown slot=\"end\">\n * <ae-button slot=\"trigger\" variant=\"outlined\" size=\"sm\">User</ae-button>\n * <ae-dropdown-item href=\"/profile\" icon=\"user\">Profile</ae-dropdown-item>\n * <ae-dropdown-item value=\"logout\" danger>Sign out</ae-dropdown-item>\n * </ae-dropdown>\n * </ae-navbar>\n * ```\n */\nclass Dropdown extends AeicoComponent {\n static tagName = 'dropdown';\n\n protected static styles = [variables, style];\n\n /**\n * Position of the panel relative to the trigger.\n * Defaults to `'bottom-start'` (left-aligned, below trigger).\n */\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n /**\n * Whether the dropdown panel is visible. Reflects as the `open` attribute.\n * Can be used for controlled open/close state.\n */\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n /**\n * When `true` (default), clicking a menu item automatically closes the panel.\n */\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n /** Disables the trigger and prevents opening. */\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n /**\n * Optional label text. When set, `ae-dropdown` renders its own trigger button\n * in the shadow DOM (no `slot=\"trigger\"` needed). Inherits `--ae-navbar-link-*`\n * CSS variables so it automatically matches navbar link styles.\n */\n @prop({ type: String })\n accessor label: string = '';\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n\n this.listen('_item-select', this._handleItemSelect as EventListener);\n this.listen('keydown', this._handleKeydown as EventListener);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._closePanel();\n }\n };\n document.addEventListener('click', this._outsideClickHandler);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n if (this._outsideClickHandler) {\n document.removeEventListener('click', this._outsideClickHandler);\n this._outsideClickHandler = null;\n }\n }\n\n /** Opens the dropdown panel. */\n show(): void {\n if (this.disabled || this.open) return;\n this.open = true;\n this.emit('open');\n }\n\n /** Closes the dropdown panel. */\n hide(): void {\n if (!this.open) return;\n this.open = false;\n this.emit('close');\n }\n\n /** Toggles the dropdown panel open/closed. */\n toggle(): void {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n private _closePanel(): void {\n if (this.open) this.hide();\n }\n\n // Called via declarative @click on the trigger-wrapper div inside the shadow DOM.\n // Events from slotted trigger content bubble through the shadow DOM slot path,\n // so this fires for trigger clicks only — not for panel item clicks.\n private _handleTriggerClick = (): void => {\n this.toggle();\n };\n\n private _handleItemSelect = (e: CustomEvent): void => {\n this.emit('select', { detail: e.detail });\n if (this.closeOnSelect) {\n this._closePanel();\n }\n };\n\n private _handleKeydown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape' && this.open) {\n e.stopPropagation();\n this._closePanel();\n }\n };\n\n protected render() {\n const placementClass = `placement-${this.placement}`;\n const hasLabel = !!this.label;\n const dir = this.placement.split('-')[0];\n return html(({ div, slot, button, span }) => {\n div(\n {\n className: 'trigger-wrapper',\n 'aria-haspopup': 'menu',\n 'aria-expanded': String(this.open),\n '@click': this.disabled ? undefined : this._handleTriggerClick,\n },\n () => {\n if (hasLabel) {\n button(\n {\n className: 'trigger-label',\n type: 'button',\n disabled: this.disabled || undefined,\n },\n () => {\n span({ text: this.label });\n span({\n className: `ae-dropdown-arrow ae-dropdown-arrow--${dir}`,\n 'aria-hidden': 'true',\n });\n },\n );\n } else {\n slot({ name: 'trigger' });\n }\n },\n );\n div(\n {\n part: 'panel',\n className: { panel: true, open: this.open, [placementClass]: true },\n role: 'menu',\n },\n () => {\n slot();\n },\n );\n });\n }\n}\n\nDropdown.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown': Dropdown;\n }\n}\n\nexport default Dropdown;\nexport type DropdownProps = InferProps<typeof Dropdown>;\n","import AeicoComponent from '../aeico-component';\nimport type { InferProps } from 'aeico';\nimport { html } from 'aeico';\nimport { prop } from 'aeico';\nimport type { ButtonColor, ButtonSize, ButtonVariant } from '../button/defines';\nimport type { DropdownPlacement } from './defines';\nimport type Dropdown from './dropdown';\nimport './dropdown';\nimport '../button/button';\n\n/**\n * DropdownButton — a pre-composed trigger + dropdown panel.\n *\n * Renders an `ae-button`-styled trigger with a built-in chevron,\n * and a floating panel for `<ae-dropdown-item>` children.\n * Accepts the same `variant`, `color`, `size`, and `disabled` props\n * as `ae-button`, making it a drop-in inside `ae-button-group`.\n *\n * @example\n * ```html\n * <ae-dropdown-button variant=\"outlined\" color=\"primary\">\n * Actions\n * <ae-dropdown-item value=\"edit\">Edit</ae-dropdown-item>\n * <ae-dropdown-item value=\"delete\">Delete</ae-dropdown-item>\n * </ae-dropdown-button>\n *\n * <!-- Inside ae-button-group -->\n * <ae-button-group compact color=\"primary\">\n * <ae-button>Save</ae-button>\n * <ae-dropdown-button placement=\"bottom-end\">\n * <ae-dropdown-item value=\"draft\">Save as draft</ae-dropdown-item>\n * <ae-dropdown-item value=\"template\">Save as template</ae-dropdown-item>\n * </ae-dropdown-button>\n * </ae-button-group>\n * ```\n *\n * Emits:\n * - `open` — when the panel opens\n * - `close` — when the panel closes\n * - `select` — `{ detail: { value, label } }` when a menu item is selected\n */\nclass DropdownButton extends AeicoComponent {\n static tagName = 'dropdown-button';\n\n // ae-button and ae-dropdown each carry their own shadow DOM styles.\n // Only the host display is set here so button-group compact layout works.\n protected static styles = [\n ':host { display: inline-block; }',\n '.caret { display: inline-block; width: 0; height: 0; margin-left: 0.3em; vertical-align: 0.2em; flex-shrink: 0; }',\n '.caret--bottom { border-top: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--top { border-bottom: 0.35em solid; border-right: 0.35em solid transparent; border-left: 0.35em solid transparent; }',\n '.caret--right { border-left: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n '.caret--left { border-right: 0.35em solid; border-top: 0.35em solid transparent; border-bottom: 0.35em solid transparent; }',\n ];\n\n @prop({ type: String })\n accessor variant: ButtonVariant = 'filled';\n\n @prop({ type: String })\n accessor color: ButtonColor = 'default';\n\n @prop({ type: String })\n accessor size: ButtonSize = 'md';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor placement: DropdownPlacement = 'bottom-start';\n\n @prop({ type: Boolean })\n accessor closeOnSelect: boolean = true;\n\n private _dropdownEl: Dropdown | null = null;\n\n show(): void {\n if (this.disabled) return;\n this._dropdownEl?.show();\n }\n hide(): void {\n this._dropdownEl?.hide();\n }\n toggle(): void {\n if (this.disabled) return;\n this._dropdownEl?.toggle();\n }\n\n get open(): boolean {\n return this._dropdownEl?.open ?? false;\n }\n\n protected render() {\n const dir = this.placement.split('-')[0];\n return html(({ aeDropdown, aeButton, slot, span }) => {\n this._dropdownEl = aeDropdown(\n {\n placement: this.placement,\n 'close-on-select': this.closeOnSelect,\n },\n () => {\n aeButton(\n {\n slot: 'trigger',\n variant: this.variant,\n color: this.color,\n size: this.size,\n disabled: this.disabled || undefined,\n },\n () => {\n slot({ name: 'label' });\n span({ className: `caret caret--${dir}`, 'aria-hidden': 'true' });\n },\n );\n slot();\n },\n );\n });\n }\n}\n\nDropdownButton.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-dropdown-button': DropdownButton;\n }\n}\n\nexport default DropdownButton;\nexport type DropdownButtonProps = InferProps<typeof DropdownButton>;\n"],"names":["_disabled_dec","_a","_init","_disabled","__privateAdd","__runInitializers","__publicField","__decoratorStart","__decorateElement","__decoratorMetadata","_closeOnSelect_dec","_placement_dec","_placement","_closeOnSelect","style"],"mappings":"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"}
|
package/dist/chunks/icon.cjs
CHANGED
|
@@ -7,16 +7,33 @@ const aeico = require("aeico");
|
|
|
7
7
|
const variables = require("./variables.cjs");
|
|
8
8
|
const size = require("./size.cjs");
|
|
9
9
|
const color = require("./color.cjs");
|
|
10
|
-
const style = ":host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n width: 1em;\n height: 1em;\n color: inherit;\n flex-shrink: 0;\n line-height: 0;\n vertical-align: middle;\n}\n\n:host([color]) {\n color: var(--color-solid);\n}\n\n.icon-svg {\n display: block;\n width: 100%;\n height: 100%;\n fill: var(--icon-fill, currentColor);\n stroke: var(--icon-stroke, none);\n stroke-width: var(--icon-stroke-width, 2);\n stroke-linecap: var(--icon-stroke-linecap, round);\n stroke-linejoin: var(--icon-stroke-linejoin, round);\n pointer-events: none;\n overflow: visible;\n}\n";
|
|
10
|
+
const style = ":host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n width: 1em;\n height: 1em;\n color: inherit;\n flex-shrink: 0;\n line-height: 0;\n vertical-align: middle;\n}\n\n:host([color]) {\n color: var(--ae-color-solid);\n}\n\n.icon-svg {\n display: block;\n width: 100%;\n height: 100%;\n fill: var(--icon-fill, currentColor);\n stroke: var(--icon-stroke, none);\n stroke-width: var(--icon-stroke-width, 2);\n stroke-linecap: var(--icon-stroke-linecap, round);\n stroke-linejoin: var(--icon-stroke-linejoin, round);\n pointer-events: none;\n overflow: visible;\n}\n";
|
|
11
11
|
const defaultViewBox = "0 0 24 24";
|
|
12
12
|
class IconRegistry {
|
|
13
|
+
/** Register user icons. Always takes priority over built-in icons. */
|
|
13
14
|
static add(icons) {
|
|
14
15
|
for (const [name, data] of Object.entries(icons)) {
|
|
15
16
|
if (typeof data === "string") {
|
|
16
|
-
this._icons.set(name, {
|
|
17
|
+
this._icons.set(name, { paths: data, viewBox: defaultViewBox });
|
|
17
18
|
} else {
|
|
18
19
|
this._icons.set(name, data);
|
|
19
20
|
}
|
|
21
|
+
this._builtInKeys.delete(name);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Register built-in icons provided by the library.
|
|
26
|
+
* A built-in icon will NOT overwrite an icon already registered by the user.
|
|
27
|
+
*/
|
|
28
|
+
static addBuiltIn(icons) {
|
|
29
|
+
for (const [name, data] of Object.entries(icons)) {
|
|
30
|
+
if (this._icons.has(name) && !this._builtInKeys.has(name)) continue;
|
|
31
|
+
if (typeof data === "string") {
|
|
32
|
+
this._icons.set(name, { paths: data, viewBox: defaultViewBox });
|
|
33
|
+
} else {
|
|
34
|
+
this._icons.set(name, data);
|
|
35
|
+
}
|
|
36
|
+
this._builtInKeys.add(name);
|
|
20
37
|
}
|
|
21
38
|
}
|
|
22
39
|
static get(name) {
|
|
@@ -27,6 +44,19 @@ class IconRegistry {
|
|
|
27
44
|
}
|
|
28
45
|
}
|
|
29
46
|
__publicField(IconRegistry, "_icons", /* @__PURE__ */ new Map());
|
|
47
|
+
/** Names registered via addBuiltIn — can be overridden by user add() calls */
|
|
48
|
+
__publicField(IconRegistry, "_builtInKeys", /* @__PURE__ */ new Set());
|
|
49
|
+
IconRegistry.addBuiltIn({
|
|
50
|
+
copy: "M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z",
|
|
51
|
+
check: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z",
|
|
52
|
+
"chevron-left": "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z",
|
|
53
|
+
"chevron-right": "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z",
|
|
54
|
+
"chevron-up": "M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z",
|
|
55
|
+
"chevron-down": "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z",
|
|
56
|
+
"chevrons-left": "M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z",
|
|
57
|
+
"chevrons-right": "M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z",
|
|
58
|
+
close: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
|
|
59
|
+
});
|
|
30
60
|
class Icon extends aeicoComponent.AeicoComponent {
|
|
31
61
|
render() {
|
|
32
62
|
const def = this.name ? IconRegistry.get(this.name) : void 0;
|
|
@@ -36,18 +66,26 @@ class Icon extends aeicoComponent.AeicoComponent {
|
|
|
36
66
|
} else {
|
|
37
67
|
this.style.removeProperty("font-size");
|
|
38
68
|
}
|
|
39
|
-
|
|
40
|
-
const
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
this.
|
|
44
|
-
this.
|
|
69
|
+
if (!def) return;
|
|
70
|
+
const { paths } = def;
|
|
71
|
+
const isMultiPath = Array.isArray(paths);
|
|
72
|
+
if (!isMultiPath) {
|
|
73
|
+
const useStroke = this.stroke ?? (this.strokeWidth !== void 0 ? true : def.stroke ?? false);
|
|
74
|
+
const useStrokeWidth = this.strokeWidth ?? def.strokeWidth ?? 2;
|
|
75
|
+
if (useStroke) {
|
|
76
|
+
this.style.setProperty("--icon-fill", "none");
|
|
77
|
+
this.style.setProperty("--icon-stroke", "currentColor");
|
|
78
|
+
this.style.setProperty("--icon-stroke-width", String(useStrokeWidth));
|
|
79
|
+
} else {
|
|
80
|
+
this.style.removeProperty("--icon-fill");
|
|
81
|
+
this.style.removeProperty("--icon-stroke");
|
|
82
|
+
this.style.removeProperty("--icon-stroke-width");
|
|
83
|
+
}
|
|
45
84
|
} else {
|
|
46
85
|
this.style.removeProperty("--icon-fill");
|
|
47
86
|
this.style.removeProperty("--icon-stroke");
|
|
48
87
|
this.style.removeProperty("--icon-stroke-width");
|
|
49
88
|
}
|
|
50
|
-
if (!def) return;
|
|
51
89
|
return aeico.html(({ svg, path }) => {
|
|
52
90
|
svg(
|
|
53
91
|
{
|
|
@@ -57,7 +95,15 @@ class Icon extends aeicoComponent.AeicoComponent {
|
|
|
57
95
|
xmlns: aeicoComponent.SVG_NS
|
|
58
96
|
},
|
|
59
97
|
() => {
|
|
60
|
-
|
|
98
|
+
if (typeof paths === "string") {
|
|
99
|
+
path({ d: paths });
|
|
100
|
+
} else {
|
|
101
|
+
for (const p of paths) {
|
|
102
|
+
const attrs = { d: p.d };
|
|
103
|
+
if (p.fill) attrs.style = { fill: p.fill };
|
|
104
|
+
path(attrs);
|
|
105
|
+
}
|
|
106
|
+
}
|
|
61
107
|
}
|
|
62
108
|
);
|
|
63
109
|
});
|
|
@@ -71,7 +117,7 @@ __publicField(Icon, "props", {
|
|
|
71
117
|
stroke: { type: Boolean },
|
|
72
118
|
strokeWidth: { type: Number }
|
|
73
119
|
});
|
|
74
|
-
__publicField(Icon, "styles", [variables.
|
|
120
|
+
__publicField(Icon, "styles", [variables.variables, size.sizeCSS, color.colorCSS, style]);
|
|
75
121
|
Icon.register();
|
|
76
122
|
exports.Icon = Icon;
|
|
77
123
|
exports.IconRegistry = IconRegistry;
|
package/dist/chunks/icon.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.cjs","sources":["../../src/icon/defines.ts","../../src/icon/registry.ts","../../src/icon/icon.ts"],"sourcesContent":["export type IconSize = '3xs' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport type IconColor =\n | 'default'\n | 'primary'\n | 'secondary'\n | 'success'\n | 'danger'\n | 'warning'\n | 'info';\n\nexport interface IconDefinition {\n
|
|
1
|
+
{"version":3,"file":"icon.cjs","sources":["../../src/icon/defines.ts","../../src/icon/registry.ts","../../src/icon/built-in-icons.ts","../../src/icon/icon.ts"],"sourcesContent":["export type IconSize = '3xs' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;\n\nexport type IconColor =\n | 'default'\n | 'primary'\n | 'secondary'\n | 'success'\n | 'danger'\n | 'warning'\n | 'info';\n\nexport interface IconPathDef {\n d: string;\n fill?: string;\n}\n\nexport interface IconDefinition {\n paths: string | IconPathDef[];\n viewBox?: string;\n stroke?: boolean;\n strokeWidth?: number;\n}\n\nexport const defaultViewBox = '0 0 24 24';\n\nexport type IconRegistryData = Record<string, string | IconDefinition>;\n","import { IconDefinition, IconRegistryData, defaultViewBox } from './defines';\n\nclass IconRegistry {\n private static _icons: Map<string, IconDefinition> = new Map();\n /** Names registered via addBuiltIn — can be overridden by user add() calls */\n private static _builtInKeys: Set<string> = new Set();\n\n /** Register user icons. Always takes priority over built-in icons. */\n static add(icons: IconRegistryData) {\n for (const [name, data] of Object.entries(icons)) {\n if (typeof data === 'string') {\n this._icons.set(name, { paths: data, viewBox: defaultViewBox });\n } else {\n this._icons.set(name, data);\n }\n // Mark as user-defined (removes built-in status)\n this._builtInKeys.delete(name);\n }\n }\n\n /**\n * Register built-in icons provided by the library.\n * A built-in icon will NOT overwrite an icon already registered by the user.\n */\n static addBuiltIn(icons: IconRegistryData) {\n for (const [name, data] of Object.entries(icons)) {\n // Skip if the user has already registered this icon\n if (this._icons.has(name) && !this._builtInKeys.has(name)) continue;\n if (typeof data === 'string') {\n this._icons.set(name, { paths: data, viewBox: defaultViewBox });\n } else {\n this._icons.set(name, data);\n }\n this._builtInKeys.add(name);\n }\n }\n\n static get(name: string): IconDefinition | undefined {\n return this._icons.get(name);\n }\n\n static has(name: string): boolean {\n return this._icons.has(name);\n }\n}\n\nexport default IconRegistry;\n","/**\n * Built-in system icons used internally by aeico components.\n * These are pre-registered so components work out of the box.\n * Users can override any of them by calling IconRegistry.add({ 'name': '...' }).\n *\n * All paths use the Material Design 24×24 viewBox.\n */\nimport IconRegistry from './registry';\n\nIconRegistry.addBuiltIn({\n copy: 'M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z',\n check: 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z',\n 'chevron-left': 'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z',\n 'chevron-right': 'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z',\n 'chevron-up': 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n 'chevron-down': 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n 'chevrons-left': 'M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z',\n 'chevrons-right': 'M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z',\n close:\n 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n});\n","import type { InferProps, Props } from 'aeico';\nimport { SVG_NS } from '../utils';\nimport AeicoComponent from '../aeico-component';\nimport { html } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport colorCSS from '../styles/color.css?inline';\nimport style from '../styles/components/icon.css?inline';\nimport type { IconSize, IconColor } from './defines';\nimport { defaultViewBox } from './defines';\nimport IconRegistry from './registry';\nimport './built-in-icons';\n\nclass Icon extends AeicoComponent {\n static tagName = 'icon';\n\n static props: Props = {\n name: { type: String },\n size: { type: String },\n color: { type: String },\n stroke: { type: Boolean },\n strokeWidth: { type: Number },\n };\n\n declare name?: string;\n declare size?: IconSize;\n declare color?: IconColor;\n declare stroke?: boolean;\n declare strokeWidth?: number;\n\n protected static styles = [styleVariables, sizeCSS, colorCSS, style];\n\n protected render() {\n const def = this.name ? IconRegistry.get(this.name) : undefined;\n\n // Numeric size: set font-size directly (string sizes are handled by size.css)\n const numericSize = Number(this.size);\n if (this.size !== undefined && !isNaN(numericSize) && numericSize > 0) {\n this.style.setProperty('font-size', `${numericSize}px`);\n } else {\n this.style.removeProperty('font-size');\n }\n\n if (!def) return;\n\n const { paths } = def;\n const isMultiPath = Array.isArray(paths);\n\n // Stroke CSS variables only apply in single-path mode (component props)\n if (!isMultiPath) {\n const useStroke =\n this.stroke ?? (this.strokeWidth !== undefined ? true : (def.stroke ?? false));\n const useStrokeWidth = this.strokeWidth ?? def.strokeWidth ?? 2;\n\n if (useStroke) {\n this.style.setProperty('--icon-fill', 'none');\n this.style.setProperty('--icon-stroke', 'currentColor');\n this.style.setProperty('--icon-stroke-width', String(useStrokeWidth));\n } else {\n this.style.removeProperty('--icon-fill');\n this.style.removeProperty('--icon-stroke');\n this.style.removeProperty('--icon-stroke-width');\n }\n } else {\n this.style.removeProperty('--icon-fill');\n this.style.removeProperty('--icon-stroke');\n this.style.removeProperty('--icon-stroke-width');\n }\n\n return html(({ svg, path }) => {\n svg(\n {\n className: 'icon-svg',\n viewBox: def.viewBox ?? defaultViewBox,\n 'aria-hidden': 'true',\n xmlns: SVG_NS,\n },\n () => {\n if (typeof paths === 'string') {\n path({ d: paths });\n } else {\n for (const p of paths) {\n const attrs: Record<string, unknown> = { d: p.d };\n if (p.fill) attrs.style = { fill: p.fill };\n path(attrs);\n }\n }\n },\n );\n });\n }\n}\n\nIcon.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-icon': Icon;\n }\n}\n\nexport default Icon;\nexport type IconProps = InferProps<typeof Icon>;\n"],"names":["AeicoComponent","html","SVG_NS","styleVariables","sizeCSS","colorCSS"],"mappings":"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"}
|