aeico-components 0.1.6 → 0.1.8
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/README.md +0 -0
- package/dist/alert.cjs +637 -4
- package/dist/alert.cjs.map +7 -1
- package/dist/alert.js +575 -3
- package/dist/alert.js.map +7 -1
- package/dist/badge.cjs +573 -4
- package/dist/badge.cjs.map +7 -1
- package/dist/badge.js +510 -3
- package/dist/badge.js.map +7 -1
- package/dist/breadcrumb.cjs +709 -5
- package/dist/breadcrumb.cjs.map +7 -1
- package/dist/breadcrumb.js +644 -4
- package/dist/breadcrumb.js.map +7 -1
- package/dist/button-group.cjs +546 -4
- package/dist/button-group.cjs.map +7 -1
- package/dist/button-group.js +489 -3
- package/dist/button-group.js.map +7 -1
- package/dist/button.cjs +834 -4
- package/dist/button.cjs.map +7 -1
- package/dist/button.js +771 -3
- package/dist/button.js.map +7 -1
- package/dist/card.cjs +574 -4
- package/dist/card.cjs.map +7 -1
- package/dist/card.js +516 -3
- package/dist/card.js.map +7 -1
- package/dist/checkbox.cjs +867 -4
- package/dist/checkbox.cjs.map +7 -1
- package/dist/checkbox.js +794 -3
- package/dist/checkbox.js.map +7 -1
- package/dist/copy-button.cjs +1046 -4
- package/dist/copy-button.cjs.map +7 -1
- package/dist/copy-button.js +969 -3
- package/dist/copy-button.js.map +7 -1
- package/dist/detail-group.cjs +533 -0
- package/dist/detail-group.cjs.map +7 -0
- package/dist/detail-group.js +477 -0
- package/dist/detail-group.js.map +7 -0
- package/dist/detail.cjs +627 -4
- package/dist/detail.cjs.map +7 -1
- package/dist/detail.js +569 -3
- package/dist/detail.js.map +7 -1
- package/dist/dialog.cjs +738 -4
- package/dist/dialog.cjs.map +7 -1
- package/dist/dialog.js +665 -3
- package/dist/dialog.js.map +7 -1
- package/dist/divider.cjs +558 -4
- package/dist/divider.cjs.map +7 -1
- package/dist/divider.js +502 -3
- package/dist/divider.js.map +7 -1
- package/dist/drawer.cjs +818 -4
- package/dist/drawer.cjs.map +7 -1
- package/dist/drawer.js +749 -3
- package/dist/drawer.js.map +7 -1
- package/dist/dropdown.cjs +1396 -5
- package/dist/dropdown.cjs.map +7 -1
- package/dist/dropdown.js +1316 -4
- package/dist/dropdown.js.map +7 -1
- package/dist/icon-button.cjs +999 -4
- package/dist/icon-button.cjs.map +7 -1
- package/dist/icon-button.js +930 -3
- package/dist/icon-button.js.map +7 -1
- package/dist/icon.cjs +613 -4
- package/dist/icon.cjs.map +7 -1
- package/dist/icon.js +547 -3
- package/dist/icon.js.map +7 -1
- package/dist/index.cjs +6484 -188
- package/dist/index.cjs.map +7 -1
- package/dist/index.js +6095 -147
- package/dist/index.js.map +7 -1
- package/dist/menu.cjs +841 -4
- package/dist/menu.cjs.map +7 -1
- package/dist/menu.js +785 -3
- package/dist/menu.js.map +7 -1
- package/dist/navbar.cjs +622 -4
- package/dist/navbar.cjs.map +7 -1
- package/dist/navbar.js +564 -3
- package/dist/navbar.js.map +7 -1
- package/dist/number-input.cjs +887 -0
- package/dist/number-input.cjs.map +7 -0
- package/dist/number-input.js +820 -0
- package/dist/number-input.js.map +7 -0
- package/dist/pagination.cjs +1099 -4
- package/dist/pagination.cjs.map +7 -1
- package/dist/pagination.js +1029 -3
- package/dist/pagination.js.map +7 -1
- package/dist/progress-bar.cjs +581 -4
- package/dist/progress-bar.cjs.map +7 -1
- package/dist/progress-bar.js +525 -3
- package/dist/progress-bar.js.map +7 -1
- package/dist/radio-group.cjs +973 -5
- package/dist/radio-group.cjs.map +7 -1
- package/dist/radio-group.js +899 -4
- package/dist/radio-group.js.map +7 -1
- package/dist/select.cjs +1242 -45
- package/dist/select.cjs.map +7 -1
- package/dist/select.js +1159 -44
- package/dist/select.js.map +7 -1
- package/dist/slider.cjs +1420 -4
- package/dist/slider.cjs.map +7 -1
- package/dist/slider.js +1351 -3
- package/dist/slider.js.map +7 -1
- package/dist/spinner.cjs +587 -4
- package/dist/spinner.cjs.map +7 -1
- package/dist/spinner.js +528 -3
- package/dist/spinner.js.map +7 -1
- package/dist/styles/layout.cjs +1 -0
- package/dist/styles/layout.js +1 -0
- package/dist/styles/radius.cjs +1 -0
- package/dist/styles/radius.js +1 -0
- package/dist/styles/variables.cjs +1 -0
- package/dist/styles/variables.js +1 -0
- package/dist/switch.cjs +1092 -4
- package/dist/switch.cjs.map +7 -1
- package/dist/switch.js +1013 -3
- package/dist/switch.js.map +7 -1
- package/dist/tabs.cjs +660 -6
- package/dist/tabs.cjs.map +7 -1
- package/dist/tabs.js +591 -5
- package/dist/tabs.js.map +7 -1
- package/dist/tag.cjs +591 -3
- package/dist/tag.cjs.map +7 -1
- package/dist/tag.js +532 -2
- package/dist/tag.js.map +7 -1
- package/dist/text-input.cjs +829 -4
- package/dist/text-input.cjs.map +7 -1
- package/dist/text-input.js +761 -3
- package/dist/text-input.js.map +7 -1
- package/dist/textarea.cjs +914 -3
- package/dist/textarea.cjs.map +7 -1
- package/dist/textarea.js +854 -2
- package/dist/textarea.js.map +7 -1
- package/dist/tooltip.cjs +764 -4
- package/dist/tooltip.cjs.map +7 -1
- package/dist/tooltip.js +711 -3
- package/dist/tooltip.js.map +7 -1
- package/dist/tree.cjs +1059 -4
- package/dist/tree.cjs.map +7 -1
- package/dist/tree.js +985 -3
- package/dist/tree.js.map +7 -1
- package/dist/types/card/defines.d.ts +1 -1
- package/dist/types/detail/defines.d.ts +1 -1
- package/dist/types/dialog/dialog.d.ts +1 -0
- package/dist/types/drawer/drawer.d.ts +2 -0
- package/dist/types/icon/defines.d.ts +7 -1
- package/dist/types/icon/index.d.ts +1 -1
- package/dist/types/menu/defines.d.ts +1 -0
- package/dist/types/menu/menu-item.d.ts +1 -0
- package/dist/types/menu/menu.d.ts +1 -0
- package/dist/types/styles/layout.d.ts +2 -0
- package/dist/types/styles/radius.d.ts +2 -0
- package/dist/types/styles/variables.d.ts +2 -0
- package/dist/types/tabs/defines.d.ts +1 -0
- package/dist/types/tabs/tabs.d.ts +3 -0
- package/package.json +31 -7
- package/src/alert/alert.ts +3 -3
- package/src/badge/badge.ts +4 -4
- package/src/breadcrumb/breadcrumb-item.ts +2 -2
- package/src/breadcrumb/breadcrumb.ts +3 -3
- package/src/button/button.ts +4 -4
- package/src/button-group/button-group.ts +8 -9
- package/src/card/card.ts +3 -3
- package/src/card/defines.ts +1 -1
- package/src/checkbox/checkbox.ts +6 -6
- package/src/copy-button/copy-button.ts +13 -9
- package/src/detail/defines.ts +1 -1
- package/src/detail/detail.ts +3 -3
- package/src/detail-group/detail-group.ts +2 -2
- package/src/dialog/dialog.ts +15 -14
- package/src/divider/divider.ts +3 -3
- package/src/drawer/drawer.ts +28 -11
- package/src/dropdown/dropdown-item.ts +2 -2
- package/src/dropdown/dropdown.ts +2 -2
- package/src/icon/defines.ts +8 -1
- package/src/icon/icon.ts +32 -14
- package/src/icon/index.ts +1 -1
- package/src/icon/registry.ts +2 -2
- package/src/menu/defines.ts +1 -0
- package/src/menu/menu-item.ts +14 -4
- package/src/menu/menu.ts +5 -2
- package/src/navbar/navbar.ts +3 -3
- package/src/number-input/number-input.ts +5 -5
- package/src/pagination/pagination.ts +3 -3
- package/src/progress-bar/progress-bar.ts +3 -3
- package/src/radio-group/radio-group.ts +12 -8
- package/src/select/select-option.ts +2 -2
- package/src/select/select.ts +5 -5
- package/src/slider/slider.ts +6 -6
- package/src/spinner/spinner.ts +4 -4
- package/src/styles/color.css +91 -91
- package/src/styles/components/action-button.css +12 -12
- 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-group.css +2 -0
- package/src/styles/components/button.css +39 -50
- package/src/styles/components/card.css +69 -30
- package/src/styles/components/checkbox.css +22 -16
- package/src/styles/components/copy-button.css +22 -33
- package/src/styles/components/detail.css +51 -39
- package/src/styles/components/dialog.css +11 -11
- package/src/styles/components/divider.css +3 -3
- package/src/styles/components/drawer.css +59 -27
- package/src/styles/components/dropdown-item.css +7 -8
- package/src/styles/components/dropdown.css +3 -4
- package/src/styles/components/field-label.css +13 -13
- package/src/styles/components/icon-button.css +25 -36
- package/src/styles/components/icon.css +1 -1
- package/src/styles/components/menu-item.css +13 -8
- package/src/styles/components/navbar.css +23 -44
- package/src/styles/components/number-input.css +27 -36
- package/src/styles/components/pagination.css +31 -31
- package/src/styles/components/progress-bar.css +2 -3
- package/src/styles/components/radio-group.css +88 -83
- package/src/styles/components/select-option.css +5 -5
- package/src/styles/components/select.css +21 -33
- package/src/styles/components/slider.css +56 -34
- package/src/styles/components/spinner.css +7 -9
- package/src/styles/components/switch.css +21 -19
- package/src/styles/components/tab.css +4 -5
- package/src/styles/components/tabs.css +48 -1
- package/src/styles/components/tag.css +14 -21
- package/src/styles/components/text-input.css +13 -22
- package/src/styles/components/textarea.css +12 -21
- package/src/styles/components/tooltip.css +4 -5
- package/src/styles/components/tree-item.css +12 -12
- package/src/styles/layout.css +5 -2
- package/src/styles/radius.css +25 -0
- package/src/styles/size.css +7 -7
- package/src/styles/variables.css +271 -247
- package/src/switch/switch.ts +6 -6
- package/src/tabs/defines.ts +1 -0
- package/src/tabs/tab-panel.ts +1 -1
- package/src/tabs/tab.ts +1 -1
- package/src/tabs/tabs.ts +14 -2
- package/src/tag/tag.ts +4 -4
- package/src/text-input/text-input.ts +5 -5
- package/src/textarea/textarea.ts +5 -5
- package/src/tooltip/tooltip.ts +2 -2
- package/src/tree/tree-item.ts +2 -2
- package/src/tree/tree.ts +2 -2
- package/dist/chunks/action-button.cjs +0 -296
- package/dist/chunks/action-button.cjs.map +0 -1
- package/dist/chunks/action-button.js +0 -297
- package/dist/chunks/action-button.js.map +0 -1
- package/dist/chunks/aeico-component.cjs +0 -17
- package/dist/chunks/aeico-component.cjs.map +0 -1
- package/dist/chunks/aeico-component.js +0 -18
- package/dist/chunks/aeico-component.js.map +0 -1
- package/dist/chunks/alert.cjs +0 -170
- package/dist/chunks/alert.cjs.map +0 -1
- package/dist/chunks/alert.js +0 -171
- package/dist/chunks/alert.js.map +0 -1
- package/dist/chunks/badge.cjs +0 -85
- package/dist/chunks/badge.cjs.map +0 -1
- package/dist/chunks/badge.js +0 -86
- package/dist/chunks/badge.js.map +0 -1
- package/dist/chunks/breadcrumb-item.cjs +0 -261
- package/dist/chunks/breadcrumb-item.cjs.map +0 -1
- package/dist/chunks/breadcrumb-item.js +0 -262
- package/dist/chunks/breadcrumb-item.js.map +0 -1
- package/dist/chunks/button-group.cjs +0 -79
- package/dist/chunks/button-group.cjs.map +0 -1
- package/dist/chunks/button-group.js +0 -80
- package/dist/chunks/button-group.js.map +0 -1
- package/dist/chunks/button.cjs +0 -348
- package/dist/chunks/button.cjs.map +0 -1
- package/dist/chunks/button.js +0 -349
- package/dist/chunks/button.js.map +0 -1
- package/dist/chunks/card.cjs +0 -93
- package/dist/chunks/card.cjs.map +0 -1
- package/dist/chunks/card.js +0 -94
- package/dist/chunks/card.js.map +0 -1
- package/dist/chunks/checkbox.cjs +0 -86
- package/dist/chunks/checkbox.cjs.map +0 -1
- package/dist/chunks/checkbox.js +0 -87
- package/dist/chunks/checkbox.js.map +0 -1
- package/dist/chunks/color.cjs +0 -4
- package/dist/chunks/color.cjs.map +0 -1
- package/dist/chunks/color.js +0 -5
- package/dist/chunks/color.js.map +0 -1
- package/dist/chunks/copy-button.cjs +0 -168
- package/dist/chunks/copy-button.cjs.map +0 -1
- package/dist/chunks/copy-button.js +0 -169
- package/dist/chunks/copy-button.js.map +0 -1
- package/dist/chunks/detail.cjs +0 -146
- package/dist/chunks/detail.cjs.map +0 -1
- package/dist/chunks/detail.js +0 -147
- package/dist/chunks/detail.js.map +0 -1
- package/dist/chunks/dialog.cjs +0 -117
- package/dist/chunks/dialog.cjs.map +0 -1
- package/dist/chunks/dialog.js +0 -118
- package/dist/chunks/dialog.js.map +0 -1
- package/dist/chunks/divider.cjs +0 -80
- package/dist/chunks/divider.cjs.map +0 -1
- package/dist/chunks/divider.js +0 -81
- package/dist/chunks/divider.js.map +0 -1
- package/dist/chunks/drawer.cjs +0 -180
- package/dist/chunks/drawer.cjs.map +0 -1
- package/dist/chunks/drawer.js +0 -181
- package/dist/chunks/drawer.js.map +0 -1
- package/dist/chunks/dropdown-button.cjs +0 -534
- package/dist/chunks/dropdown-button.cjs.map +0 -1
- package/dist/chunks/dropdown-button.js +0 -535
- package/dist/chunks/dropdown-button.js.map +0 -1
- package/dist/chunks/icon-button.cjs +0 -35
- package/dist/chunks/icon-button.cjs.map +0 -1
- package/dist/chunks/icon-button.js +0 -36
- package/dist/chunks/icon-button.js.map +0 -1
- package/dist/chunks/icon.cjs +0 -108
- package/dist/chunks/icon.cjs.map +0 -1
- package/dist/chunks/icon.js +0 -109
- package/dist/chunks/icon.js.map +0 -1
- package/dist/chunks/menu.cjs +0 -396
- package/dist/chunks/menu.cjs.map +0 -1
- package/dist/chunks/menu.js +0 -397
- package/dist/chunks/menu.js.map +0 -1
- package/dist/chunks/navbar.cjs +0 -142
- package/dist/chunks/navbar.cjs.map +0 -1
- package/dist/chunks/navbar.js +0 -143
- package/dist/chunks/navbar.js.map +0 -1
- package/dist/chunks/pagination.cjs +0 -475
- package/dist/chunks/pagination.cjs.map +0 -1
- package/dist/chunks/pagination.js +0 -476
- package/dist/chunks/pagination.js.map +0 -1
- package/dist/chunks/progress-bar.cjs +0 -101
- package/dist/chunks/progress-bar.cjs.map +0 -1
- package/dist/chunks/progress-bar.js +0 -102
- package/dist/chunks/progress-bar.js.map +0 -1
- package/dist/chunks/radio.cjs +0 -185
- package/dist/chunks/radio.cjs.map +0 -1
- package/dist/chunks/radio.js +0 -186
- package/dist/chunks/radio.js.map +0 -1
- package/dist/chunks/select.cjs +0 -381
- package/dist/chunks/select.cjs.map +0 -1
- package/dist/chunks/select.js +0 -382
- package/dist/chunks/select.js.map +0 -1
- package/dist/chunks/size.cjs +0 -4
- package/dist/chunks/size.cjs.map +0 -1
- package/dist/chunks/size.js +0 -5
- package/dist/chunks/size.js.map +0 -1
- package/dist/chunks/slider.cjs +0 -611
- package/dist/chunks/slider.cjs.map +0 -1
- package/dist/chunks/slider.js +0 -612
- package/dist/chunks/slider.js.map +0 -1
- package/dist/chunks/spinner.cjs +0 -102
- package/dist/chunks/spinner.cjs.map +0 -1
- package/dist/chunks/spinner.js +0 -103
- package/dist/chunks/spinner.js.map +0 -1
- package/dist/chunks/switch.cjs +0 -167
- package/dist/chunks/switch.cjs.map +0 -1
- package/dist/chunks/switch.js +0 -168
- package/dist/chunks/switch.js.map +0 -1
- package/dist/chunks/tab-panel.cjs +0 -165
- package/dist/chunks/tab-panel.cjs.map +0 -1
- package/dist/chunks/tab-panel.js +0 -166
- package/dist/chunks/tab-panel.js.map +0 -1
- package/dist/chunks/tag.cjs +0 -108
- package/dist/chunks/tag.cjs.map +0 -1
- package/dist/chunks/tag.js +0 -109
- package/dist/chunks/tag.js.map +0 -1
- package/dist/chunks/text-input.cjs +0 -54
- package/dist/chunks/text-input.cjs.map +0 -1
- package/dist/chunks/text-input.js +0 -55
- package/dist/chunks/text-input.js.map +0 -1
- package/dist/chunks/textarea.cjs +0 -137
- package/dist/chunks/textarea.cjs.map +0 -1
- package/dist/chunks/textarea.js +0 -138
- package/dist/chunks/textarea.js.map +0 -1
- package/dist/chunks/tooltip.cjs +0 -293
- package/dist/chunks/tooltip.cjs.map +0 -1
- package/dist/chunks/tooltip.js +0 -294
- package/dist/chunks/tooltip.js.map +0 -1
- package/dist/chunks/tree.cjs +0 -468
- package/dist/chunks/tree.cjs.map +0 -1
- package/dist/chunks/tree.js +0 -469
- package/dist/chunks/tree.js.map +0 -1
- package/dist/chunks/variables.cjs +0 -372
- package/dist/chunks/variables.cjs.map +0 -1
- package/dist/chunks/variables.js +0 -373
- package/dist/chunks/variables.js.map +0 -1
package/dist/chunks/tooltip.cjs
DELETED
|
@@ -1,293 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const variables = require("./variables.cjs");
|
|
3
|
-
const aeicoComponent = require("./aeico-component.cjs");
|
|
4
|
-
const aeico = require("aeico");
|
|
5
|
-
const tooltipStyle = `:host {
|
|
6
|
-
display: inline-flex;
|
|
7
|
-
position: relative;
|
|
8
|
-
vertical-align: middle;
|
|
9
|
-
|
|
10
|
-
--ae-tooltip-z-index: 1000;
|
|
11
|
-
--ae-tooltip-bg: var(--dark, #343a40);
|
|
12
|
-
--ae-tooltip-color: #fff;
|
|
13
|
-
--ae-tooltip-padding: 0.3125rem 0.625rem;
|
|
14
|
-
--ae-tooltip-font-size: 0.8125rem;
|
|
15
|
-
--ae-tooltip-border-radius: 4px;
|
|
16
|
-
--ae-tooltip-arrow-size: 5px;
|
|
17
|
-
--ae-tooltip-gap: 6px;
|
|
18
|
-
--ae-tooltip-max-width: 20rem;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
:host-context([theme="dark"]) {
|
|
22
|
-
--ae-tooltip-bg: var(--light, #f8f9fa);
|
|
23
|
-
--ae-tooltip-color: var(--dark, #343a40);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.tooltip-panel {
|
|
27
|
-
display: none;
|
|
28
|
-
position: fixed;
|
|
29
|
-
z-index: var(--ae-tooltip-z-index);
|
|
30
|
-
background: var(--ae-tooltip-bg);
|
|
31
|
-
color: var(--ae-tooltip-color);
|
|
32
|
-
padding: var(--ae-tooltip-padding);
|
|
33
|
-
font-size: var(--ae-tooltip-font-size);
|
|
34
|
-
font-family: inherit;
|
|
35
|
-
border-radius: var(--ae-tooltip-border-radius);
|
|
36
|
-
line-height: 1.4;
|
|
37
|
-
white-space: nowrap;
|
|
38
|
-
max-width: var(--ae-tooltip-max-width);
|
|
39
|
-
pointer-events: none;
|
|
40
|
-
box-sizing: border-box;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
:host([open]) .tooltip-panel {
|
|
44
|
-
display: block;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
/* Arrow */
|
|
48
|
-
.tooltip-panel::after {
|
|
49
|
-
content: '';
|
|
50
|
-
position: absolute;
|
|
51
|
-
border: var(--ae-tooltip-arrow-size) solid transparent;
|
|
52
|
-
pointer-events: none;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.placement-top::after,
|
|
56
|
-
.placement-top-start::after,
|
|
57
|
-
.placement-top-end::after {
|
|
58
|
-
top: 100%;
|
|
59
|
-
border-top-color: var(--ae-tooltip-bg);
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.placement-top::after {
|
|
63
|
-
left: 50%;
|
|
64
|
-
transform: translateX(-50%);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
.placement-top-start::after {
|
|
68
|
-
left: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
.placement-top-end::after {
|
|
72
|
-
right: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.placement-bottom::after,
|
|
76
|
-
.placement-bottom-start::after,
|
|
77
|
-
.placement-bottom-end::after {
|
|
78
|
-
bottom: 100%;
|
|
79
|
-
border-bottom-color: var(--ae-tooltip-bg);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
.placement-bottom::after {
|
|
83
|
-
left: 50%;
|
|
84
|
-
transform: translateX(-50%);
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
.placement-bottom-start::after {
|
|
88
|
-
left: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.placement-bottom-end::after {
|
|
92
|
-
right: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.placement-left::after {
|
|
96
|
-
left: 100%;
|
|
97
|
-
top: 50%;
|
|
98
|
-
transform: translateY(-50%);
|
|
99
|
-
border-left-color: var(--ae-tooltip-bg);
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
.placement-right::after {
|
|
103
|
-
right: 100%;
|
|
104
|
-
top: 50%;
|
|
105
|
-
transform: translateY(-50%);
|
|
106
|
-
border-right-color: var(--ae-tooltip-bg);
|
|
107
|
-
}
|
|
108
|
-
`;
|
|
109
|
-
var __create = Object.create;
|
|
110
|
-
var __defProp = Object.defineProperty;
|
|
111
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
112
|
-
var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
|
|
113
|
-
var __typeError = (msg) => {
|
|
114
|
-
throw TypeError(msg);
|
|
115
|
-
};
|
|
116
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
117
|
-
var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
|
|
118
|
-
var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
|
|
119
|
-
var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
|
|
120
|
-
var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
|
|
121
|
-
var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
|
|
122
|
-
var __runInitializers = (array, flags, self, value) => {
|
|
123
|
-
for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
|
|
124
|
-
return value;
|
|
125
|
-
};
|
|
126
|
-
var __decorateElement = (array, flags, name, decorators, target, extra) => {
|
|
127
|
-
var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
|
|
128
|
-
var j = array.length + 1, key = __decoratorStrings[k + 5];
|
|
129
|
-
var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
|
|
130
|
-
var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
|
|
131
|
-
return __privateGet(this, extra);
|
|
132
|
-
}, set [name](x) {
|
|
133
|
-
return __privateSet(this, extra, x);
|
|
134
|
-
} }, name));
|
|
135
|
-
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
136
|
-
ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
|
|
137
|
-
{
|
|
138
|
-
ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
|
|
139
|
-
access.get = (x) => x[name];
|
|
140
|
-
access.set = (x, y) => x[name] = y;
|
|
141
|
-
}
|
|
142
|
-
it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
|
|
143
|
-
if (it === void 0) __expectFn(it) && (desc[key] = it);
|
|
144
|
-
else if (typeof it !== "object" || it === null) __typeError("Object expected");
|
|
145
|
-
else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
|
|
146
|
-
}
|
|
147
|
-
return desc && __defProp(target, name, desc), target;
|
|
148
|
-
};
|
|
149
|
-
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
150
|
-
var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
|
|
151
|
-
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
|
|
152
|
-
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
153
|
-
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
|
|
154
|
-
var _open_dec, _trigger_dec, _disabled_dec, _placement_dec, _content_dec, _a, _init, _content, _placement, _disabled, _trigger, _open;
|
|
155
|
-
class Tooltip extends (_a = aeicoComponent.AeicoComponent, _content_dec = [aeico.prop({ type: String })], _placement_dec = [aeico.prop({ type: String })], _disabled_dec = [aeico.prop({ type: Boolean })], _trigger_dec = [aeico.prop({ type: String })], _open_dec = [aeico.prop({ type: Boolean })], _a) {
|
|
156
|
-
constructor() {
|
|
157
|
-
super(...arguments);
|
|
158
|
-
__privateAdd(this, _content, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
|
|
159
|
-
__privateAdd(this, _placement, __runInitializers(_init, 12, this, "top")), __runInitializers(_init, 15, this);
|
|
160
|
-
__privateAdd(this, _disabled, __runInitializers(_init, 16, this, false)), __runInitializers(_init, 19, this);
|
|
161
|
-
__privateAdd(this, _trigger, __runInitializers(_init, 20, this, "hover")), __runInitializers(_init, 23, this);
|
|
162
|
-
__privateAdd(this, _open, __runInitializers(_init, 24, this, false)), __runInitializers(_init, 27, this);
|
|
163
|
-
__publicField(this, "_outsideClickHandler", null);
|
|
164
|
-
__publicField(this, "_handleMouseEnter", () => {
|
|
165
|
-
if (this.trigger !== "hover") return;
|
|
166
|
-
if (this.disabled) return;
|
|
167
|
-
this.open = true;
|
|
168
|
-
});
|
|
169
|
-
__publicField(this, "_handleMouseLeave", () => {
|
|
170
|
-
if (this.trigger !== "hover") return;
|
|
171
|
-
this.open = false;
|
|
172
|
-
});
|
|
173
|
-
__publicField(this, "_handleFocusin", () => {
|
|
174
|
-
if (this.trigger !== "hover") return;
|
|
175
|
-
if (this.disabled) return;
|
|
176
|
-
this.open = true;
|
|
177
|
-
});
|
|
178
|
-
__publicField(this, "_handleFocusout", () => {
|
|
179
|
-
if (this.trigger !== "hover") return;
|
|
180
|
-
this.open = false;
|
|
181
|
-
});
|
|
182
|
-
__publicField(this, "_handleClick", () => {
|
|
183
|
-
if (this.trigger !== "click") return;
|
|
184
|
-
if (this.disabled) return;
|
|
185
|
-
this.open = !this.open;
|
|
186
|
-
});
|
|
187
|
-
}
|
|
188
|
-
connectedCallback() {
|
|
189
|
-
super.connectedCallback();
|
|
190
|
-
this.listen("mouseenter", this._handleMouseEnter);
|
|
191
|
-
this.listen("mouseleave", this._handleMouseLeave);
|
|
192
|
-
this.listen("focusin", this._handleFocusin);
|
|
193
|
-
this.listen("focusout", this._handleFocusout);
|
|
194
|
-
this.listen("click", this._handleClick);
|
|
195
|
-
this._outsideClickHandler = (e) => {
|
|
196
|
-
if (!this.open) return;
|
|
197
|
-
if (!e.composedPath().includes(this)) this.open = false;
|
|
198
|
-
};
|
|
199
|
-
document.addEventListener("click", this._outsideClickHandler);
|
|
200
|
-
}
|
|
201
|
-
disconnectedCallback() {
|
|
202
|
-
super.disconnectedCallback();
|
|
203
|
-
if (this._outsideClickHandler) {
|
|
204
|
-
document.removeEventListener("click", this._outsideClickHandler);
|
|
205
|
-
this._outsideClickHandler = null;
|
|
206
|
-
}
|
|
207
|
-
}
|
|
208
|
-
_updatePosition() {
|
|
209
|
-
var _a2;
|
|
210
|
-
const panel = (_a2 = this.shadowRoot) == null ? void 0 : _a2.querySelector(".tooltip-panel");
|
|
211
|
-
if (!panel) return;
|
|
212
|
-
const host = this.getBoundingClientRect();
|
|
213
|
-
const panelRect = panel.getBoundingClientRect();
|
|
214
|
-
const gap = 6;
|
|
215
|
-
const pw = panelRect.width;
|
|
216
|
-
const ph = panelRect.height;
|
|
217
|
-
let top;
|
|
218
|
-
let left;
|
|
219
|
-
switch (this.placement) {
|
|
220
|
-
case "top-start":
|
|
221
|
-
top = host.top - ph - gap;
|
|
222
|
-
left = host.left;
|
|
223
|
-
break;
|
|
224
|
-
case "top-end":
|
|
225
|
-
top = host.top - ph - gap;
|
|
226
|
-
left = host.right - pw;
|
|
227
|
-
break;
|
|
228
|
-
case "bottom":
|
|
229
|
-
top = host.bottom + gap;
|
|
230
|
-
left = host.left + host.width / 2 - pw / 2;
|
|
231
|
-
break;
|
|
232
|
-
case "bottom-start":
|
|
233
|
-
top = host.bottom + gap;
|
|
234
|
-
left = host.left;
|
|
235
|
-
break;
|
|
236
|
-
case "bottom-end":
|
|
237
|
-
top = host.bottom + gap;
|
|
238
|
-
left = host.right - pw;
|
|
239
|
-
break;
|
|
240
|
-
case "left":
|
|
241
|
-
top = host.top + host.height / 2 - ph / 2;
|
|
242
|
-
left = host.left - pw - gap;
|
|
243
|
-
break;
|
|
244
|
-
case "right":
|
|
245
|
-
top = host.top + host.height / 2 - ph / 2;
|
|
246
|
-
left = host.right + gap;
|
|
247
|
-
break;
|
|
248
|
-
default:
|
|
249
|
-
top = host.top - ph - gap;
|
|
250
|
-
left = host.left + host.width / 2 - pw / 2;
|
|
251
|
-
}
|
|
252
|
-
panel.style.top = `${top}px`;
|
|
253
|
-
panel.style.left = `${left}px`;
|
|
254
|
-
}
|
|
255
|
-
onUpdated(changedProps) {
|
|
256
|
-
if (changedProps.has("open") && this.open) {
|
|
257
|
-
this._updatePosition();
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
render() {
|
|
261
|
-
return aeico.html(({ div, span, slot }) => {
|
|
262
|
-
slot();
|
|
263
|
-
div(
|
|
264
|
-
{
|
|
265
|
-
className: `tooltip-panel placement-${this.placement ?? "top"}`,
|
|
266
|
-
role: "tooltip",
|
|
267
|
-
"aria-hidden": String(!this.open)
|
|
268
|
-
},
|
|
269
|
-
() => {
|
|
270
|
-
slot({ name: "tooltip" }, () => {
|
|
271
|
-
span({ textContent: this.content ?? "" });
|
|
272
|
-
});
|
|
273
|
-
}
|
|
274
|
-
);
|
|
275
|
-
});
|
|
276
|
-
}
|
|
277
|
-
}
|
|
278
|
-
_init = __decoratorStart(_a);
|
|
279
|
-
_content = /* @__PURE__ */ new WeakMap();
|
|
280
|
-
_placement = /* @__PURE__ */ new WeakMap();
|
|
281
|
-
_disabled = /* @__PURE__ */ new WeakMap();
|
|
282
|
-
_trigger = /* @__PURE__ */ new WeakMap();
|
|
283
|
-
_open = /* @__PURE__ */ new WeakMap();
|
|
284
|
-
__decorateElement(_init, 4, "content", _content_dec, Tooltip, _content);
|
|
285
|
-
__decorateElement(_init, 4, "placement", _placement_dec, Tooltip, _placement);
|
|
286
|
-
__decorateElement(_init, 4, "disabled", _disabled_dec, Tooltip, _disabled);
|
|
287
|
-
__decorateElement(_init, 4, "trigger", _trigger_dec, Tooltip, _trigger);
|
|
288
|
-
__decorateElement(_init, 4, "open", _open_dec, Tooltip, _open);
|
|
289
|
-
__decoratorMetadata(_init, Tooltip);
|
|
290
|
-
__publicField(Tooltip, "styles", [variables.variables, tooltipStyle]);
|
|
291
|
-
Tooltip.register();
|
|
292
|
-
exports.Tooltip = Tooltip;
|
|
293
|
-
//# sourceMappingURL=tooltip.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.cjs","sources":["../../src/tooltip/tooltip.ts"],"sourcesContent":["import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport tooltipStyle from '../styles/components/tooltip.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html, prop } from 'aeico';\nimport type { TooltipPlacement, TooltipTrigger } from './defines';\n\n/**\n * Tooltip Component\n *\n * A floating label that appears on hover or focus around its trigger content.\n * Wrap any element in `<ae-tooltip>` and provide content via the `content`\n * attribute (plain text) or the `tooltip` named slot (rich HTML).\n *\n * @example\n * ```html\n * <ae-tooltip content=\"Save file\">\n * <ae-button>Save</ae-button>\n * </ae-tooltip>\n *\n * <ae-tooltip placement=\"bottom-start\">\n * <span slot=\"tooltip\"><strong>Bold</strong> tip</span>\n * <ae-icon-button name=\"info\"></ae-icon-button>\n * </ae-tooltip>\n * ```\n */\nclass Tooltip extends AeicoComponent {\n protected static styles = [styleVariables, tooltipStyle];\n\n @prop({ type: String })\n accessor content: string | undefined;\n\n @prop({ type: String })\n accessor placement: TooltipPlacement = 'top';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor trigger: TooltipTrigger = 'hover';\n\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('mouseenter', this._handleMouseEnter);\n this.listen('mouseleave', this._handleMouseLeave);\n this.listen('focusin', this._handleFocusin);\n this.listen('focusout', this._handleFocusout);\n this.listen('click', this._handleClick);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n if (!e.composedPath().includes(this)) this.open = false;\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 private _handleMouseEnter = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleMouseLeave = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleFocusin = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleFocusout = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleClick = () => {\n if (this.trigger !== 'click') return;\n if (this.disabled) return;\n this.open = !this.open;\n };\n\n private _updatePosition() {\n const panel = this.shadowRoot?.querySelector<HTMLElement>('.tooltip-panel');\n if (!panel) return;\n\n const host = this.getBoundingClientRect();\n const panelRect = panel.getBoundingClientRect();\n const gap = 6; // Match --ae-tooltip-gap: 6px\n const pw = panelRect.width;\n const ph = panelRect.height;\n\n let top: number;\n let left: number;\n\n switch (this.placement) {\n case 'top-start':\n top = host.top - ph - gap;\n left = host.left;\n break;\n case 'top-end':\n top = host.top - ph - gap;\n left = host.right - pw;\n break;\n case 'bottom':\n top = host.bottom + gap;\n left = host.left + host.width / 2 - pw / 2;\n break;\n case 'bottom-start':\n top = host.bottom + gap;\n left = host.left;\n break;\n case 'bottom-end':\n top = host.bottom + gap;\n left = host.right - pw;\n break;\n case 'left':\n top = host.top + host.height / 2 - ph / 2;\n left = host.left - pw - gap;\n break;\n case 'right':\n top = host.top + host.height / 2 - ph / 2;\n left = host.right + gap;\n break;\n default: // 'top'\n top = host.top - ph - gap;\n left = host.left + host.width / 2 - pw / 2;\n }\n\n panel.style.top = `${top}px`;\n panel.style.left = `${left}px`;\n }\n\n protected onUpdated(changedProps: Map<string, unknown>) {\n if (changedProps.has('open') && this.open) {\n this._updatePosition();\n }\n }\n\n protected render() {\n return html(({ div, span, slot }) => {\n slot();\n div(\n {\n className: `tooltip-panel placement-${this.placement ?? 'top'}`,\n role: 'tooltip',\n 'aria-hidden': String(!this.open),\n },\n () => {\n slot({ name: 'tooltip' }, () => {\n span({ textContent: this.content ?? '' });\n });\n },\n );\n });\n }\n}\n\nTooltip.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-tooltip': Tooltip;\n }\n}\n\nexport type TooltipProps = InferProps<typeof Tooltip>;\nexport default Tooltip;\n"],"names":["AeicoComponent","prop","_a","html","styleVariables"],"mappings":"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"}
|
package/dist/chunks/tooltip.js
DELETED
|
@@ -1,294 +0,0 @@
|
|
|
1
|
-
import { v as variables } from "./variables.js";
|
|
2
|
-
import { A as AeicoComponent } from "./aeico-component.js";
|
|
3
|
-
import { prop, html } from "aeico";
|
|
4
|
-
const tooltipStyle = `:host {
|
|
5
|
-
display: inline-flex;
|
|
6
|
-
position: relative;
|
|
7
|
-
vertical-align: middle;
|
|
8
|
-
|
|
9
|
-
--ae-tooltip-z-index: 1000;
|
|
10
|
-
--ae-tooltip-bg: var(--dark, #343a40);
|
|
11
|
-
--ae-tooltip-color: #fff;
|
|
12
|
-
--ae-tooltip-padding: 0.3125rem 0.625rem;
|
|
13
|
-
--ae-tooltip-font-size: 0.8125rem;
|
|
14
|
-
--ae-tooltip-border-radius: 4px;
|
|
15
|
-
--ae-tooltip-arrow-size: 5px;
|
|
16
|
-
--ae-tooltip-gap: 6px;
|
|
17
|
-
--ae-tooltip-max-width: 20rem;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
:host-context([theme="dark"]) {
|
|
21
|
-
--ae-tooltip-bg: var(--light, #f8f9fa);
|
|
22
|
-
--ae-tooltip-color: var(--dark, #343a40);
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
.tooltip-panel {
|
|
26
|
-
display: none;
|
|
27
|
-
position: fixed;
|
|
28
|
-
z-index: var(--ae-tooltip-z-index);
|
|
29
|
-
background: var(--ae-tooltip-bg);
|
|
30
|
-
color: var(--ae-tooltip-color);
|
|
31
|
-
padding: var(--ae-tooltip-padding);
|
|
32
|
-
font-size: var(--ae-tooltip-font-size);
|
|
33
|
-
font-family: inherit;
|
|
34
|
-
border-radius: var(--ae-tooltip-border-radius);
|
|
35
|
-
line-height: 1.4;
|
|
36
|
-
white-space: nowrap;
|
|
37
|
-
max-width: var(--ae-tooltip-max-width);
|
|
38
|
-
pointer-events: none;
|
|
39
|
-
box-sizing: border-box;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
:host([open]) .tooltip-panel {
|
|
43
|
-
display: block;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
/* Arrow */
|
|
47
|
-
.tooltip-panel::after {
|
|
48
|
-
content: '';
|
|
49
|
-
position: absolute;
|
|
50
|
-
border: var(--ae-tooltip-arrow-size) solid transparent;
|
|
51
|
-
pointer-events: none;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
.placement-top::after,
|
|
55
|
-
.placement-top-start::after,
|
|
56
|
-
.placement-top-end::after {
|
|
57
|
-
top: 100%;
|
|
58
|
-
border-top-color: var(--ae-tooltip-bg);
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
.placement-top::after {
|
|
62
|
-
left: 50%;
|
|
63
|
-
transform: translateX(-50%);
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
.placement-top-start::after {
|
|
67
|
-
left: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
.placement-top-end::after {
|
|
71
|
-
right: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
.placement-bottom::after,
|
|
75
|
-
.placement-bottom-start::after,
|
|
76
|
-
.placement-bottom-end::after {
|
|
77
|
-
bottom: 100%;
|
|
78
|
-
border-bottom-color: var(--ae-tooltip-bg);
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.placement-bottom::after {
|
|
82
|
-
left: 50%;
|
|
83
|
-
transform: translateX(-50%);
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
.placement-bottom-start::after {
|
|
87
|
-
left: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
.placement-bottom-end::after {
|
|
91
|
-
right: calc(var(--ae-tooltip-arrow-size) * 2);
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
.placement-left::after {
|
|
95
|
-
left: 100%;
|
|
96
|
-
top: 50%;
|
|
97
|
-
transform: translateY(-50%);
|
|
98
|
-
border-left-color: var(--ae-tooltip-bg);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
.placement-right::after {
|
|
102
|
-
right: 100%;
|
|
103
|
-
top: 50%;
|
|
104
|
-
transform: translateY(-50%);
|
|
105
|
-
border-right-color: var(--ae-tooltip-bg);
|
|
106
|
-
}
|
|
107
|
-
`;
|
|
108
|
-
var __create = Object.create;
|
|
109
|
-
var __defProp = Object.defineProperty;
|
|
110
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
111
|
-
var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
|
|
112
|
-
var __typeError = (msg) => {
|
|
113
|
-
throw TypeError(msg);
|
|
114
|
-
};
|
|
115
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
116
|
-
var __decoratorStart = (base) => [, , , __create((base == null ? void 0 : base[__knownSymbol("metadata")]) ?? null)];
|
|
117
|
-
var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
|
|
118
|
-
var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
|
|
119
|
-
var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
|
|
120
|
-
var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
|
|
121
|
-
var __runInitializers = (array, flags, self, value) => {
|
|
122
|
-
for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
|
|
123
|
-
return value;
|
|
124
|
-
};
|
|
125
|
-
var __decorateElement = (array, flags, name, decorators, target, extra) => {
|
|
126
|
-
var fn, it, done, ctx, access, k = flags & 7, s = false, p = false;
|
|
127
|
-
var j = array.length + 1, key = __decoratorStrings[k + 5];
|
|
128
|
-
var initializers = array[j - 1] = [], extraInitializers = array[j] || (array[j] = []);
|
|
129
|
-
var desc = (target = target.prototype, __getOwnPropDesc({ get [name]() {
|
|
130
|
-
return __privateGet(this, extra);
|
|
131
|
-
}, set [name](x) {
|
|
132
|
-
return __privateSet(this, extra, x);
|
|
133
|
-
} }, name));
|
|
134
|
-
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
135
|
-
ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
|
|
136
|
-
{
|
|
137
|
-
ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
|
|
138
|
-
access.get = (x) => x[name];
|
|
139
|
-
access.set = (x, y) => x[name] = y;
|
|
140
|
-
}
|
|
141
|
-
it = (0, decorators[i])({ get: desc.get, set: desc.set }, ctx), done._ = 1;
|
|
142
|
-
if (it === void 0) __expectFn(it) && (desc[key] = it);
|
|
143
|
-
else if (typeof it !== "object" || it === null) __typeError("Object expected");
|
|
144
|
-
else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
|
|
145
|
-
}
|
|
146
|
-
return desc && __defProp(target, name, desc), target;
|
|
147
|
-
};
|
|
148
|
-
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
149
|
-
var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
|
|
150
|
-
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
|
|
151
|
-
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
152
|
-
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
|
|
153
|
-
var _open_dec, _trigger_dec, _disabled_dec, _placement_dec, _content_dec, _a, _init, _content, _placement, _disabled, _trigger, _open;
|
|
154
|
-
class Tooltip extends (_a = AeicoComponent, _content_dec = [prop({ type: String })], _placement_dec = [prop({ type: String })], _disabled_dec = [prop({ type: Boolean })], _trigger_dec = [prop({ type: String })], _open_dec = [prop({ type: Boolean })], _a) {
|
|
155
|
-
constructor() {
|
|
156
|
-
super(...arguments);
|
|
157
|
-
__privateAdd(this, _content, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
|
|
158
|
-
__privateAdd(this, _placement, __runInitializers(_init, 12, this, "top")), __runInitializers(_init, 15, this);
|
|
159
|
-
__privateAdd(this, _disabled, __runInitializers(_init, 16, this, false)), __runInitializers(_init, 19, this);
|
|
160
|
-
__privateAdd(this, _trigger, __runInitializers(_init, 20, this, "hover")), __runInitializers(_init, 23, this);
|
|
161
|
-
__privateAdd(this, _open, __runInitializers(_init, 24, this, false)), __runInitializers(_init, 27, this);
|
|
162
|
-
__publicField(this, "_outsideClickHandler", null);
|
|
163
|
-
__publicField(this, "_handleMouseEnter", () => {
|
|
164
|
-
if (this.trigger !== "hover") return;
|
|
165
|
-
if (this.disabled) return;
|
|
166
|
-
this.open = true;
|
|
167
|
-
});
|
|
168
|
-
__publicField(this, "_handleMouseLeave", () => {
|
|
169
|
-
if (this.trigger !== "hover") return;
|
|
170
|
-
this.open = false;
|
|
171
|
-
});
|
|
172
|
-
__publicField(this, "_handleFocusin", () => {
|
|
173
|
-
if (this.trigger !== "hover") return;
|
|
174
|
-
if (this.disabled) return;
|
|
175
|
-
this.open = true;
|
|
176
|
-
});
|
|
177
|
-
__publicField(this, "_handleFocusout", () => {
|
|
178
|
-
if (this.trigger !== "hover") return;
|
|
179
|
-
this.open = false;
|
|
180
|
-
});
|
|
181
|
-
__publicField(this, "_handleClick", () => {
|
|
182
|
-
if (this.trigger !== "click") return;
|
|
183
|
-
if (this.disabled) return;
|
|
184
|
-
this.open = !this.open;
|
|
185
|
-
});
|
|
186
|
-
}
|
|
187
|
-
connectedCallback() {
|
|
188
|
-
super.connectedCallback();
|
|
189
|
-
this.listen("mouseenter", this._handleMouseEnter);
|
|
190
|
-
this.listen("mouseleave", this._handleMouseLeave);
|
|
191
|
-
this.listen("focusin", this._handleFocusin);
|
|
192
|
-
this.listen("focusout", this._handleFocusout);
|
|
193
|
-
this.listen("click", this._handleClick);
|
|
194
|
-
this._outsideClickHandler = (e) => {
|
|
195
|
-
if (!this.open) return;
|
|
196
|
-
if (!e.composedPath().includes(this)) this.open = false;
|
|
197
|
-
};
|
|
198
|
-
document.addEventListener("click", this._outsideClickHandler);
|
|
199
|
-
}
|
|
200
|
-
disconnectedCallback() {
|
|
201
|
-
super.disconnectedCallback();
|
|
202
|
-
if (this._outsideClickHandler) {
|
|
203
|
-
document.removeEventListener("click", this._outsideClickHandler);
|
|
204
|
-
this._outsideClickHandler = null;
|
|
205
|
-
}
|
|
206
|
-
}
|
|
207
|
-
_updatePosition() {
|
|
208
|
-
var _a2;
|
|
209
|
-
const panel = (_a2 = this.shadowRoot) == null ? void 0 : _a2.querySelector(".tooltip-panel");
|
|
210
|
-
if (!panel) return;
|
|
211
|
-
const host = this.getBoundingClientRect();
|
|
212
|
-
const panelRect = panel.getBoundingClientRect();
|
|
213
|
-
const gap = 6;
|
|
214
|
-
const pw = panelRect.width;
|
|
215
|
-
const ph = panelRect.height;
|
|
216
|
-
let top;
|
|
217
|
-
let left;
|
|
218
|
-
switch (this.placement) {
|
|
219
|
-
case "top-start":
|
|
220
|
-
top = host.top - ph - gap;
|
|
221
|
-
left = host.left;
|
|
222
|
-
break;
|
|
223
|
-
case "top-end":
|
|
224
|
-
top = host.top - ph - gap;
|
|
225
|
-
left = host.right - pw;
|
|
226
|
-
break;
|
|
227
|
-
case "bottom":
|
|
228
|
-
top = host.bottom + gap;
|
|
229
|
-
left = host.left + host.width / 2 - pw / 2;
|
|
230
|
-
break;
|
|
231
|
-
case "bottom-start":
|
|
232
|
-
top = host.bottom + gap;
|
|
233
|
-
left = host.left;
|
|
234
|
-
break;
|
|
235
|
-
case "bottom-end":
|
|
236
|
-
top = host.bottom + gap;
|
|
237
|
-
left = host.right - pw;
|
|
238
|
-
break;
|
|
239
|
-
case "left":
|
|
240
|
-
top = host.top + host.height / 2 - ph / 2;
|
|
241
|
-
left = host.left - pw - gap;
|
|
242
|
-
break;
|
|
243
|
-
case "right":
|
|
244
|
-
top = host.top + host.height / 2 - ph / 2;
|
|
245
|
-
left = host.right + gap;
|
|
246
|
-
break;
|
|
247
|
-
default:
|
|
248
|
-
top = host.top - ph - gap;
|
|
249
|
-
left = host.left + host.width / 2 - pw / 2;
|
|
250
|
-
}
|
|
251
|
-
panel.style.top = `${top}px`;
|
|
252
|
-
panel.style.left = `${left}px`;
|
|
253
|
-
}
|
|
254
|
-
onUpdated(changedProps) {
|
|
255
|
-
if (changedProps.has("open") && this.open) {
|
|
256
|
-
this._updatePosition();
|
|
257
|
-
}
|
|
258
|
-
}
|
|
259
|
-
render() {
|
|
260
|
-
return html(({ div, span, slot }) => {
|
|
261
|
-
slot();
|
|
262
|
-
div(
|
|
263
|
-
{
|
|
264
|
-
className: `tooltip-panel placement-${this.placement ?? "top"}`,
|
|
265
|
-
role: "tooltip",
|
|
266
|
-
"aria-hidden": String(!this.open)
|
|
267
|
-
},
|
|
268
|
-
() => {
|
|
269
|
-
slot({ name: "tooltip" }, () => {
|
|
270
|
-
span({ textContent: this.content ?? "" });
|
|
271
|
-
});
|
|
272
|
-
}
|
|
273
|
-
);
|
|
274
|
-
});
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
_init = __decoratorStart(_a);
|
|
278
|
-
_content = /* @__PURE__ */ new WeakMap();
|
|
279
|
-
_placement = /* @__PURE__ */ new WeakMap();
|
|
280
|
-
_disabled = /* @__PURE__ */ new WeakMap();
|
|
281
|
-
_trigger = /* @__PURE__ */ new WeakMap();
|
|
282
|
-
_open = /* @__PURE__ */ new WeakMap();
|
|
283
|
-
__decorateElement(_init, 4, "content", _content_dec, Tooltip, _content);
|
|
284
|
-
__decorateElement(_init, 4, "placement", _placement_dec, Tooltip, _placement);
|
|
285
|
-
__decorateElement(_init, 4, "disabled", _disabled_dec, Tooltip, _disabled);
|
|
286
|
-
__decorateElement(_init, 4, "trigger", _trigger_dec, Tooltip, _trigger);
|
|
287
|
-
__decorateElement(_init, 4, "open", _open_dec, Tooltip, _open);
|
|
288
|
-
__decoratorMetadata(_init, Tooltip);
|
|
289
|
-
__publicField(Tooltip, "styles", [variables, tooltipStyle]);
|
|
290
|
-
Tooltip.register();
|
|
291
|
-
export {
|
|
292
|
-
Tooltip as T
|
|
293
|
-
};
|
|
294
|
-
//# sourceMappingURL=tooltip.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.js","sources":["../../src/tooltip/tooltip.ts"],"sourcesContent":["import type { InferProps } from 'aeico';\nimport styleVariables from '../styles/variables.css?inline';\nimport tooltipStyle from '../styles/components/tooltip.css?inline';\nimport AeicoComponent from '../aeico-component';\nimport { html, prop } from 'aeico';\nimport type { TooltipPlacement, TooltipTrigger } from './defines';\n\n/**\n * Tooltip Component\n *\n * A floating label that appears on hover or focus around its trigger content.\n * Wrap any element in `<ae-tooltip>` and provide content via the `content`\n * attribute (plain text) or the `tooltip` named slot (rich HTML).\n *\n * @example\n * ```html\n * <ae-tooltip content=\"Save file\">\n * <ae-button>Save</ae-button>\n * </ae-tooltip>\n *\n * <ae-tooltip placement=\"bottom-start\">\n * <span slot=\"tooltip\"><strong>Bold</strong> tip</span>\n * <ae-icon-button name=\"info\"></ae-icon-button>\n * </ae-tooltip>\n * ```\n */\nclass Tooltip extends AeicoComponent {\n protected static styles = [styleVariables, tooltipStyle];\n\n @prop({ type: String })\n accessor content: string | undefined;\n\n @prop({ type: String })\n accessor placement: TooltipPlacement = 'top';\n\n @prop({ type: Boolean })\n accessor disabled: boolean = false;\n\n @prop({ type: String })\n accessor trigger: TooltipTrigger = 'hover';\n\n @prop({ type: Boolean })\n accessor open: boolean = false;\n\n private _outsideClickHandler: ((e: MouseEvent) => void) | null = null;\n\n connectedCallback() {\n super.connectedCallback();\n this.listen('mouseenter', this._handleMouseEnter);\n this.listen('mouseleave', this._handleMouseLeave);\n this.listen('focusin', this._handleFocusin);\n this.listen('focusout', this._handleFocusout);\n this.listen('click', this._handleClick);\n\n this._outsideClickHandler = (e: MouseEvent) => {\n if (!this.open) return;\n if (!e.composedPath().includes(this)) this.open = false;\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 private _handleMouseEnter = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleMouseLeave = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleFocusin = () => {\n if (this.trigger !== 'hover') return;\n if (this.disabled) return;\n this.open = true;\n };\n\n private _handleFocusout = () => {\n if (this.trigger !== 'hover') return;\n this.open = false;\n };\n\n private _handleClick = () => {\n if (this.trigger !== 'click') return;\n if (this.disabled) return;\n this.open = !this.open;\n };\n\n private _updatePosition() {\n const panel = this.shadowRoot?.querySelector<HTMLElement>('.tooltip-panel');\n if (!panel) return;\n\n const host = this.getBoundingClientRect();\n const panelRect = panel.getBoundingClientRect();\n const gap = 6; // Match --ae-tooltip-gap: 6px\n const pw = panelRect.width;\n const ph = panelRect.height;\n\n let top: number;\n let left: number;\n\n switch (this.placement) {\n case 'top-start':\n top = host.top - ph - gap;\n left = host.left;\n break;\n case 'top-end':\n top = host.top - ph - gap;\n left = host.right - pw;\n break;\n case 'bottom':\n top = host.bottom + gap;\n left = host.left + host.width / 2 - pw / 2;\n break;\n case 'bottom-start':\n top = host.bottom + gap;\n left = host.left;\n break;\n case 'bottom-end':\n top = host.bottom + gap;\n left = host.right - pw;\n break;\n case 'left':\n top = host.top + host.height / 2 - ph / 2;\n left = host.left - pw - gap;\n break;\n case 'right':\n top = host.top + host.height / 2 - ph / 2;\n left = host.right + gap;\n break;\n default: // 'top'\n top = host.top - ph - gap;\n left = host.left + host.width / 2 - pw / 2;\n }\n\n panel.style.top = `${top}px`;\n panel.style.left = `${left}px`;\n }\n\n protected onUpdated(changedProps: Map<string, unknown>) {\n if (changedProps.has('open') && this.open) {\n this._updatePosition();\n }\n }\n\n protected render() {\n return html(({ div, span, slot }) => {\n slot();\n div(\n {\n className: `tooltip-panel placement-${this.placement ?? 'top'}`,\n role: 'tooltip',\n 'aria-hidden': String(!this.open),\n },\n () => {\n slot({ name: 'tooltip' }, () => {\n span({ textContent: this.content ?? '' });\n });\n },\n );\n });\n }\n}\n\nTooltip.register();\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ae-tooltip': Tooltip;\n }\n}\n\nexport type TooltipProps = InferProps<typeof Tooltip>;\nexport default Tooltip;\n"],"names":["_a","styleVariables"],"mappings":"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"}
|