@francofantomius/material-components 1.0.2 → 1.1.1

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.
Files changed (168) hide show
  1. package/CHANGELOG.md +49 -0
  2. package/README.md +41 -9
  3. package/custom-elements.json +19060 -9017
  4. package/dist/chunks/account-menu-Dau0UHTl.js +1290 -0
  5. package/dist/chunks/account-menu-Dau0UHTl.js.map +1 -0
  6. package/dist/chunks/app-drawer-Du1ePzxZ.js +903 -0
  7. package/dist/chunks/app-drawer-Du1ePzxZ.js.map +1 -0
  8. package/dist/chunks/bottom-sheet-q79BBYAj.js +402 -0
  9. package/dist/chunks/bottom-sheet-q79BBYAj.js.map +1 -0
  10. package/dist/chunks/{button-B4TSZ7Sl.js → button-D2vn7kJ8.js} +9 -8
  11. package/dist/chunks/button-D2vn7kJ8.js.map +1 -0
  12. package/dist/chunks/button-group-CNqvJx1n.js +143 -0
  13. package/dist/chunks/button-group-CNqvJx1n.js.map +1 -0
  14. package/dist/chunks/carousel-item-BG6kjjjk.js +371 -0
  15. package/dist/chunks/carousel-item-BG6kjjjk.js.map +1 -0
  16. package/dist/chunks/date-picker-DJeHi4w-.js +777 -0
  17. package/dist/chunks/date-picker-DJeHi4w-.js.map +1 -0
  18. package/dist/chunks/fab-menu.css-3pu930sZ.js +320 -0
  19. package/dist/chunks/fab-menu.css-3pu930sZ.js.map +1 -0
  20. package/dist/chunks/{icon-button-BdSc7eot.js → icon-button-BQz73GLa.js} +2 -2
  21. package/dist/chunks/icon-button-BQz73GLa.js.map +1 -0
  22. package/dist/chunks/loading-indicator-CvWnZr9o.js +193 -0
  23. package/dist/chunks/loading-indicator-CvWnZr9o.js.map +1 -0
  24. package/dist/chunks/menu-item-BBSp5Cqc.js +390 -0
  25. package/dist/chunks/menu-item-BBSp5Cqc.js.map +1 -0
  26. package/dist/chunks/navigation-bar-item-C9DfOEzg.js +397 -0
  27. package/dist/chunks/navigation-bar-item-C9DfOEzg.js.map +1 -0
  28. package/dist/chunks/navigation-rail-item-6pdhNHJK.js +357 -0
  29. package/dist/chunks/navigation-rail-item-6pdhNHJK.js.map +1 -0
  30. package/dist/chunks/{search-bar-TXnqJ-gd.js → search-bar-fUD0qU2P.js} +22 -4
  31. package/dist/chunks/search-bar-fUD0qU2P.js.map +1 -0
  32. package/dist/chunks/segmented-button-B0BvGSQ7.js +265 -0
  33. package/dist/chunks/segmented-button-B0BvGSQ7.js.map +1 -0
  34. package/dist/chunks/side-sheet-S2w081AK.js +360 -0
  35. package/dist/chunks/side-sheet-S2w081AK.js.map +1 -0
  36. package/dist/chunks/slider-D-mnO8yQ.js +450 -0
  37. package/dist/chunks/slider-D-mnO8yQ.js.map +1 -0
  38. package/dist/chunks/split-button-DUfjukQY.js +450 -0
  39. package/dist/chunks/split-button-DUfjukQY.js.map +1 -0
  40. package/dist/chunks/{table-aRTYzDyE.js → table-CqHnneAj.js} +2 -2
  41. package/dist/chunks/{table-aRTYzDyE.js.map → table-CqHnneAj.js.map} +1 -1
  42. package/dist/chunks/time-picker-CZnb2sWz.js +785 -0
  43. package/dist/chunks/time-picker-CZnb2sWz.js.map +1 -0
  44. package/dist/chunks/toolbar-DXVQbQKJ.js +271 -0
  45. package/dist/chunks/toolbar-DXVQbQKJ.js.map +1 -0
  46. package/dist/chunks/tooltip-CE7JMHMu.js +398 -0
  47. package/dist/chunks/tooltip-CE7JMHMu.js.map +1 -0
  48. package/dist/components/account-menu/account-menu.js +8 -0
  49. package/dist/components/app-drawer/app-drawer.js +9 -0
  50. package/dist/components/bottom-sheet/bottom-sheet.css.d.ts +2 -0
  51. package/dist/components/bottom-sheet/bottom-sheet.css.d.ts.map +1 -0
  52. package/dist/components/bottom-sheet/bottom-sheet.d.ts +69 -0
  53. package/dist/components/bottom-sheet/bottom-sheet.d.ts.map +1 -0
  54. package/dist/components/bottom-sheet/bottom-sheet.js +4 -0
  55. package/dist/components/button/button.css.d.ts.map +1 -1
  56. package/dist/components/button/button.js +1 -1
  57. package/dist/components/button-group/button-group.css.d.ts +2 -0
  58. package/dist/components/button-group/button-group.css.d.ts.map +1 -0
  59. package/dist/components/button-group/button-group.d.ts +28 -0
  60. package/dist/components/button-group/button-group.d.ts.map +1 -0
  61. package/dist/components/button-group/button-group.js +4 -0
  62. package/dist/components/carousel/carousel-item.d.ts +33 -0
  63. package/dist/components/carousel/carousel-item.d.ts.map +1 -0
  64. package/dist/components/carousel/carousel-item.js +4 -0
  65. package/dist/components/carousel/carousel.css.d.ts +3 -0
  66. package/dist/components/carousel/carousel.css.d.ts.map +1 -0
  67. package/dist/components/carousel/carousel.d.ts +81 -0
  68. package/dist/components/carousel/carousel.d.ts.map +1 -0
  69. package/dist/components/carousel/carousel.js +284 -0
  70. package/dist/components/carousel/carousel.js.map +1 -0
  71. package/dist/components/date-picker/date-picker.css.d.ts +2 -0
  72. package/dist/components/date-picker/date-picker.css.d.ts.map +1 -0
  73. package/dist/components/date-picker/date-picker.d.ts +59 -0
  74. package/dist/components/date-picker/date-picker.d.ts.map +1 -0
  75. package/dist/components/date-picker/date-picker.js +4 -0
  76. package/dist/components/fab-menu/fab-menu-item.d.ts +35 -0
  77. package/dist/components/fab-menu/fab-menu-item.d.ts.map +1 -0
  78. package/dist/components/fab-menu/fab-menu-item.js +93 -0
  79. package/dist/components/fab-menu/fab-menu-item.js.map +1 -0
  80. package/dist/components/fab-menu/fab-menu.css.d.ts +3 -0
  81. package/dist/components/fab-menu/fab-menu.css.d.ts.map +1 -0
  82. package/dist/components/fab-menu/fab-menu.d.ts +72 -0
  83. package/dist/components/fab-menu/fab-menu.d.ts.map +1 -0
  84. package/dist/components/fab-menu/fab-menu.js +148 -0
  85. package/dist/components/fab-menu/fab-menu.js.map +1 -0
  86. package/dist/components/icon-button/icon-button.js +1 -1
  87. package/dist/components/loading-indicator/loading-indicator.css.d.ts +2 -0
  88. package/dist/components/loading-indicator/loading-indicator.css.d.ts.map +1 -0
  89. package/dist/components/loading-indicator/loading-indicator.d.ts +48 -0
  90. package/dist/components/loading-indicator/loading-indicator.d.ts.map +1 -0
  91. package/dist/components/loading-indicator/loading-indicator.js +4 -0
  92. package/dist/components/menu/menu-item.d.ts +41 -0
  93. package/dist/components/menu/menu-item.d.ts.map +1 -0
  94. package/dist/components/menu/menu-item.js +4 -0
  95. package/dist/components/menu/menu.css.d.ts +3 -0
  96. package/dist/components/menu/menu.css.d.ts.map +1 -0
  97. package/dist/components/menu/menu.d.ts +91 -0
  98. package/dist/components/menu/menu.d.ts.map +1 -0
  99. package/dist/components/menu/menu.js +205 -0
  100. package/dist/components/menu/menu.js.map +1 -0
  101. package/dist/components/navigation-bar/navigation-bar-item.d.ts +49 -0
  102. package/dist/components/navigation-bar/navigation-bar-item.d.ts.map +1 -0
  103. package/dist/components/navigation-bar/navigation-bar-item.js +5 -0
  104. package/dist/components/navigation-bar/navigation-bar.css.d.ts +3 -0
  105. package/dist/components/navigation-bar/navigation-bar.css.d.ts.map +1 -0
  106. package/dist/components/navigation-bar/navigation-bar.d.ts +50 -0
  107. package/dist/components/navigation-bar/navigation-bar.d.ts.map +1 -0
  108. package/dist/components/navigation-bar/navigation-bar.js +150 -0
  109. package/dist/components/navigation-bar/navigation-bar.js.map +1 -0
  110. package/dist/components/navigation-rail/navigation-rail-item.d.ts +36 -0
  111. package/dist/components/navigation-rail/navigation-rail-item.d.ts.map +1 -0
  112. package/dist/components/navigation-rail/navigation-rail-item.js +5 -0
  113. package/dist/components/navigation-rail/navigation-rail.css.d.ts +3 -0
  114. package/dist/components/navigation-rail/navigation-rail.css.d.ts.map +1 -0
  115. package/dist/components/navigation-rail/navigation-rail.d.ts +43 -0
  116. package/dist/components/navigation-rail/navigation-rail.d.ts.map +1 -0
  117. package/dist/components/navigation-rail/navigation-rail.js +121 -0
  118. package/dist/components/navigation-rail/navigation-rail.js.map +1 -0
  119. package/dist/components/search-bar/search-bar.css.d.ts.map +1 -1
  120. package/dist/components/search-bar/search-bar.js +1 -1
  121. package/dist/components/segmented-button/segmented-button.css.d.ts +3 -0
  122. package/dist/components/segmented-button/segmented-button.css.d.ts.map +1 -0
  123. package/dist/components/segmented-button/segmented-button.d.ts +40 -0
  124. package/dist/components/segmented-button/segmented-button.d.ts.map +1 -0
  125. package/dist/components/segmented-button/segmented-button.js +5 -0
  126. package/dist/components/side-sheet/side-sheet.css.d.ts +2 -0
  127. package/dist/components/side-sheet/side-sheet.css.d.ts.map +1 -0
  128. package/dist/components/side-sheet/side-sheet.d.ts +57 -0
  129. package/dist/components/side-sheet/side-sheet.d.ts.map +1 -0
  130. package/dist/components/side-sheet/side-sheet.js +4 -0
  131. package/dist/components/slider/slider.css.d.ts +2 -0
  132. package/dist/components/slider/slider.css.d.ts.map +1 -0
  133. package/dist/components/slider/slider.d.ts +51 -0
  134. package/dist/components/slider/slider.d.ts.map +1 -0
  135. package/dist/components/slider/slider.js +4 -0
  136. package/dist/components/split-button/split-button.css.d.ts +2 -0
  137. package/dist/components/split-button/split-button.css.d.ts.map +1 -0
  138. package/dist/components/split-button/split-button.d.ts +89 -0
  139. package/dist/components/split-button/split-button.d.ts.map +1 -0
  140. package/dist/components/split-button/split-button.js +4 -0
  141. package/dist/components/table/table.js +1 -1
  142. package/dist/components/time-picker/time-picker.css.d.ts +2 -0
  143. package/dist/components/time-picker/time-picker.css.d.ts.map +1 -0
  144. package/dist/components/time-picker/time-picker.d.ts +87 -0
  145. package/dist/components/time-picker/time-picker.d.ts.map +1 -0
  146. package/dist/components/time-picker/time-picker.js +4 -0
  147. package/dist/components/toolbar/toolbar.css.d.ts +2 -0
  148. package/dist/components/toolbar/toolbar.css.d.ts.map +1 -0
  149. package/dist/components/toolbar/toolbar.d.ts +53 -0
  150. package/dist/components/toolbar/toolbar.d.ts.map +1 -0
  151. package/dist/components/toolbar/toolbar.js +4 -0
  152. package/dist/components/tooltip/tooltip.css.d.ts +2 -0
  153. package/dist/components/tooltip/tooltip.css.d.ts.map +1 -0
  154. package/dist/components/tooltip/tooltip.d.ts +89 -0
  155. package/dist/components/tooltip/tooltip.d.ts.map +1 -0
  156. package/dist/components/tooltip/tooltip.js +4 -0
  157. package/dist/index.d.ts +21 -0
  158. package/dist/index.d.ts.map +1 -1
  159. package/dist/index.js +148 -2263
  160. package/dist/tokens/index.js +4 -2
  161. package/dist/tokens/index.js.map +1 -1
  162. package/dist/tokens/theme.css.d.ts.map +1 -1
  163. package/llms.txt +919 -0
  164. package/package.json +97 -1
  165. package/dist/chunks/button-B4TSZ7Sl.js.map +0 -1
  166. package/dist/chunks/icon-button-BdSc7eot.js.map +0 -1
  167. package/dist/chunks/search-bar-TXnqJ-gd.js.map +0 -1
  168. package/dist/index.js.map +0 -1
@@ -0,0 +1,205 @@
1
+ import { n as c, t as n } from "../../chunks/decorate-DXuynaiA.js";
2
+ import { n as g, t as y } from "../../chunks/menu-item-BBSp5Cqc.js";
3
+ import { html as d, nothing as v } from "lit";
4
+ import { customElement as E, property as o, query as b, queryAssignedElements as u } from "lit/decorators.js";
5
+ var i = class extends c {
6
+ constructor(...e) {
7
+ super(...e), this.open = !1, this.anchor = null, this.positioning = "absolute", this.placement = "bottom-start", this.alignment = "start", this.xOffset = 0, this.yOffset = 4, this.quick = !1, this.stayOpenOnFocusout = !1, this.dense = !1, this.ariaLabelText = "Menu", this.noTrigger = !1, this._anchorElement = null, this.handlePositionUpdate = () => {
8
+ this.open && this.updatePosition();
9
+ }, this.handleDocumentClick = (t) => {
10
+ if (!this.open) return;
11
+ const s = t.composedPath();
12
+ s.includes(this) || this._anchorElement && s.includes(this._anchorElement) || typeof this.anchor == "string" && this.anchorElement && s.includes(this.anchorElement) || this.close();
13
+ }, this.handleWindowKeyDown = (t) => {
14
+ this.open && t.key === "Escape" && (t.preventDefault(), t.stopPropagation(), this.close(), this.anchorElement?.focus());
15
+ }, this.handleSurfaceKeyDown = (t) => {
16
+ const s = this.getItems(!0);
17
+ if (s.length === 0) return;
18
+ let a = null;
19
+ try {
20
+ a = document.activeElement;
21
+ } catch {
22
+ a = null;
23
+ }
24
+ const r = s.findIndex((l) => l === a || l.contains(a));
25
+ switch (t.key) {
26
+ case "ArrowDown":
27
+ t.preventDefault(), s[r >= 0 && r < s.length - 1 ? r + 1 : 0]?.focus();
28
+ break;
29
+ case "ArrowUp":
30
+ t.preventDefault(), s[r > 0 ? r - 1 : s.length - 1]?.focus();
31
+ break;
32
+ case "Home":
33
+ t.preventDefault(), s[0]?.focus();
34
+ break;
35
+ case "End":
36
+ t.preventDefault(), s[s.length - 1]?.focus();
37
+ break;
38
+ case "Tab":
39
+ this.stayOpenOnFocusout || this.close();
40
+ }
41
+ }, this.handleItemSelection = (t) => {
42
+ const s = t.detail;
43
+ this.emitEvent("select", s), s?.keepOpen || this.close();
44
+ }, this.handleTriggerClick = (t) => {
45
+ t.stopPropagation(), this.toggle();
46
+ };
47
+ }
48
+ static {
49
+ this.styles = [c.styles, g];
50
+ }
51
+ get anchorElement() {
52
+ if (this._anchorElement) return this._anchorElement;
53
+ if (this.anchor instanceof HTMLElement) return this.anchor;
54
+ if (typeof this.anchor == "string" && this.anchor.length > 0) {
55
+ const e = this.getRootNode().getElementById?.(this.anchor) || document.getElementById(this.anchor);
56
+ if (e) return e;
57
+ }
58
+ return this.assignedTriggers && this.assignedTriggers.length > 0 ? this.assignedTriggers[0] ?? null : null;
59
+ }
60
+ set anchorElement(e) {
61
+ this._anchorElement = e, this.requestUpdate();
62
+ }
63
+ connectedCallback() {
64
+ super.connectedCallback(), window.addEventListener("keydown", this.handleWindowKeyDown), document.addEventListener("pointerdown", this.handleDocumentClick), window.addEventListener("resize", this.handlePositionUpdate), window.addEventListener("scroll", this.handlePositionUpdate, !0), this.addEventListener("item-click", this.handleItemSelection), this.addEventListener("menu-item-click", this.handleItemSelection);
65
+ }
66
+ disconnectedCallback() {
67
+ super.disconnectedCallback(), window.removeEventListener("keydown", this.handleWindowKeyDown), document.removeEventListener("pointerdown", this.handleDocumentClick), window.removeEventListener("resize", this.handlePositionUpdate), window.removeEventListener("scroll", this.handlePositionUpdate, !0), this.removeEventListener("item-click", this.handleItemSelection), this.removeEventListener("menu-item-click", this.handleItemSelection);
68
+ }
69
+ updated(e) {
70
+ super.updated(e), e.has("open") && (this.open ? (this.emitEvent("open"), this.updatePosition(), setTimeout(() => {
71
+ this.focusFirstItem();
72
+ }, 16)) : this.emitEvent("close")), e.has("dense") && this.updateDenseProp();
73
+ }
74
+ updateDenseProp() {
75
+ const e = this.getItems(!1);
76
+ for (const t of e) t instanceof y && (t.dense = this.dense);
77
+ }
78
+ updatePosition() {
79
+ if (!this.menuSurfaceElement) return;
80
+ const e = this.anchorElement;
81
+ if (!e) {
82
+ this.applyRelativePlacement();
83
+ return;
84
+ }
85
+ if (!this.contains(e) || this.positioning === "fixed") {
86
+ const t = e.getBoundingClientRect(), s = this.menuSurfaceElement;
87
+ s.classList.add("is-fixed");
88
+ let a = 0, r = 0;
89
+ const l = this.placement, f = l.startsWith("top"), p = l.endsWith("end") || this.alignment === "end";
90
+ f ? a = t.top - this.yOffset - (s.offsetHeight || 0) : a = t.bottom + this.yOffset, p ? r = t.right - (s.offsetWidth || 0) + this.xOffset : r = t.left + this.xOffset;
91
+ const h = 8, m = window.innerWidth - (s.offsetWidth || 112) - h;
92
+ r = Math.max(h, Math.min(r, m)), s.style.top = `${a}px`, s.style.left = `${r}px`, s.style.right = "auto", s.style.bottom = "auto";
93
+ } else this.applyRelativePlacement();
94
+ }
95
+ applyRelativePlacement() {
96
+ if (!this.menuSurfaceElement) return;
97
+ const e = this.menuSurfaceElement;
98
+ e.classList.remove("is-fixed");
99
+ const t = this.placement.startsWith("top"), s = this.placement.endsWith("end") || this.alignment === "end";
100
+ t ? (e.style.top = "auto", e.style.bottom = `calc(100% + ${this.yOffset}px)`) : (e.style.top = `calc(100% + ${this.yOffset}px)`, e.style.bottom = "auto"), s ? (e.style.left = "auto", e.style.right = `${-this.xOffset}px`) : (e.style.left = `${this.xOffset}px`, e.style.right = "auto");
101
+ }
102
+ show() {
103
+ this.open || (this.open = !0);
104
+ }
105
+ close() {
106
+ this.open && (this.open = !1);
107
+ }
108
+ toggle() {
109
+ this.open = !this.open;
110
+ }
111
+ getItems(e = !1) {
112
+ const t = Array.from(this.querySelectorAll("md-menu-item"));
113
+ return e ? t.filter((s) => !s.disabled && !s.hasAttribute("disabled")) : t;
114
+ }
115
+ focusFirstItem() {
116
+ const e = this.getItems(!0);
117
+ e.length > 0 ? e[0].focus() : this.menuSurfaceElement && this.menuSurfaceElement.focus();
118
+ }
119
+ focusLastItem() {
120
+ const e = this.getItems(!0);
121
+ e.length > 0 && e[e.length - 1].focus();
122
+ }
123
+ focusItemAtIndex(e) {
124
+ const t = this.getItems(!0);
125
+ e >= 0 && e < t.length && t[e].focus();
126
+ }
127
+ render() {
128
+ const e = this.noTrigger ? v : d`
129
+ <div class="trigger-wrapper" @click=${this.handleTriggerClick}>
130
+ <slot name="trigger"></slot>
131
+ </div>
132
+ `;
133
+ return d`
134
+ <div class="backdrop" @click=${() => this.close()}></div>
135
+
136
+ ${e}
137
+
138
+ <div
139
+ class="menu-surface"
140
+ role="menu"
141
+ tabindex="-1"
142
+ aria-label=${this.ariaLabelText}
143
+ aria-hidden=${this.open ? "false" : "true"}
144
+ @keydown=${this.handleSurfaceKeyDown}
145
+ >
146
+ <slot @slotchange=${this.updateDenseProp}></slot>
147
+ </div>
148
+ `;
149
+ }
150
+ };
151
+ n([o({
152
+ type: Boolean,
153
+ reflect: !0
154
+ })], i.prototype, "open", void 0);
155
+ n([o({ attribute: !1 })], i.prototype, "anchor", void 0);
156
+ n([o({
157
+ type: String,
158
+ reflect: !0
159
+ })], i.prototype, "positioning", void 0);
160
+ n([o({
161
+ type: String,
162
+ reflect: !0
163
+ })], i.prototype, "placement", void 0);
164
+ n([o({
165
+ type: String,
166
+ reflect: !0
167
+ })], i.prototype, "alignment", void 0);
168
+ n([o({
169
+ type: Number,
170
+ attribute: "x-offset"
171
+ })], i.prototype, "xOffset", void 0);
172
+ n([o({
173
+ type: Number,
174
+ attribute: "y-offset"
175
+ })], i.prototype, "yOffset", void 0);
176
+ n([o({
177
+ type: Boolean,
178
+ reflect: !0
179
+ })], i.prototype, "quick", void 0);
180
+ n([o({
181
+ type: Boolean,
182
+ attribute: "stay-open-on-focusout"
183
+ })], i.prototype, "stayOpenOnFocusout", void 0);
184
+ n([o({
185
+ type: Boolean,
186
+ reflect: !0
187
+ })], i.prototype, "dense", void 0);
188
+ n([o({
189
+ type: String,
190
+ attribute: "aria-label"
191
+ })], i.prototype, "ariaLabelText", void 0);
192
+ n([o({
193
+ type: Boolean,
194
+ attribute: "no-trigger"
195
+ })], i.prototype, "noTrigger", void 0);
196
+ n([b(".menu-surface")], i.prototype, "menuSurfaceElement", void 0);
197
+ n([u({ slot: "trigger" })], i.prototype, "assignedTriggers", void 0);
198
+ n([u({ flatten: !0 })], i.prototype, "defaultSlotElements", void 0);
199
+ i = n([E("md-menu")], i);
200
+ export {
201
+ i as MdMenu,
202
+ y as MdMenuItem
203
+ };
204
+
205
+ //# sourceMappingURL=menu.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"menu.js","names":[],"sources":["../../../src/components/menu/menu.ts"],"sourcesContent":["import { html, nothing } from 'lit';\nimport { customElement, property, state, query, queryAssignedElements } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport { menuStyles } from './menu.css.js';\nimport { MdMenuItem } from './menu-item.js';\n\nexport type MenuPositioning = 'absolute' | 'fixed';\nexport type MenuPlacement =\n | 'bottom-start'\n | 'bottom-end'\n | 'bottom'\n | 'top-start'\n | 'top-end'\n | 'top'\n | 'left'\n | 'right';\nexport type MenuAlignment = 'start' | 'end' | 'center';\n\n/**\n * Material Design 3 Menu component.\n * Menus display a list of choices on temporary surfaces when users interact with a trigger.\n *\n * @element md-menu\n *\n * @slot trigger - Slotted trigger element (e.g. button or icon-button).\n * @slot - Default slot for `md-menu-item` components or dividers.\n *\n * @fires open - Dispatched when the menu opens.\n * @fires close - Dispatched when the menu closes.\n * @fires select - Dispatched when an item inside the menu is selected.\n */\n@customElement('md-menu')\nexport class MdMenu extends MdBaseElement {\n static override styles = [MdBaseElement.styles, menuStyles];\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ attribute: false })\n anchor: string | HTMLElement | null = null;\n\n @property({ type: String, reflect: true })\n positioning: MenuPositioning = 'absolute';\n\n @property({ type: String, reflect: true })\n placement: MenuPlacement = 'bottom-start';\n\n @property({ type: String, reflect: true })\n alignment: MenuAlignment = 'start';\n\n @property({ type: Number, attribute: 'x-offset' })\n xOffset = 0;\n\n @property({ type: Number, attribute: 'y-offset' })\n yOffset = 4;\n\n @property({ type: Boolean, reflect: true })\n quick = false;\n\n @property({ type: Boolean, attribute: 'stay-open-on-focusout' })\n stayOpenOnFocusout = false;\n\n @property({ type: Boolean, reflect: true })\n dense = false;\n\n @property({ type: String, attribute: 'aria-label' })\n ariaLabelText = 'Menu';\n\n @property({ type: Boolean, attribute: 'no-trigger' })\n noTrigger = false;\n\n @query('.menu-surface')\n private menuSurfaceElement!: HTMLElement;\n\n @queryAssignedElements({ slot: 'trigger' })\n private assignedTriggers!: HTMLElement[];\n\n @queryAssignedElements({ flatten: true })\n private defaultSlotElements!: HTMLElement[];\n\n private _anchorElement: HTMLElement | null = null;\n\n get anchorElement(): HTMLElement | null {\n if (this._anchorElement) {\n return this._anchorElement;\n }\n if (this.anchor instanceof HTMLElement) {\n return this.anchor;\n }\n if (typeof this.anchor === 'string' && this.anchor.length > 0) {\n const root = this.getRootNode() as Document | ShadowRoot;\n const el = root.getElementById?.(this.anchor) || document.getElementById(this.anchor);\n if (el) return el;\n }\n if (this.assignedTriggers && this.assignedTriggers.length > 0) {\n return this.assignedTriggers[0] ?? null;\n }\n return null;\n }\n\n set anchorElement(el: HTMLElement | null) {\n this._anchorElement = el;\n this.requestUpdate();\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n window.addEventListener('keydown', this.handleWindowKeyDown);\n document.addEventListener('pointerdown', this.handleDocumentClick);\n window.addEventListener('resize', this.handlePositionUpdate);\n window.addEventListener('scroll', this.handlePositionUpdate, true);\n this.addEventListener('item-click', this.handleItemSelection as EventListener);\n this.addEventListener('menu-item-click', this.handleItemSelection as EventListener);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n window.removeEventListener('keydown', this.handleWindowKeyDown);\n document.removeEventListener('pointerdown', this.handleDocumentClick);\n window.removeEventListener('resize', this.handlePositionUpdate);\n window.removeEventListener('scroll', this.handlePositionUpdate, true);\n this.removeEventListener('item-click', this.handleItemSelection as EventListener);\n this.removeEventListener('menu-item-click', this.handleItemSelection as EventListener);\n }\n\n override updated(changedProperties: Map<string, unknown>): void {\n super.updated(changedProperties);\n\n if (changedProperties.has('open')) {\n if (this.open) {\n this.emitEvent('open');\n this.updatePosition();\n // Give time for surface to render and receive focus\n setTimeout(() => {\n this.focusFirstItem();\n }, 16);\n } else {\n this.emitEvent('close');\n }\n }\n\n if (changedProperties.has('dense')) {\n this.updateDenseProp();\n }\n }\n\n private updateDenseProp(): void {\n const items = this.getItems(false);\n for (const item of items) {\n if (item instanceof MdMenuItem) {\n item.dense = this.dense;\n }\n }\n }\n\n private handlePositionUpdate = (): void => {\n if (this.open) {\n this.updatePosition();\n }\n };\n\n /**\n * Calculates and updates the positioning of the menu surface.\n */\n updatePosition(): void {\n if (!this.menuSurfaceElement) return;\n\n const anchorEl = this.anchorElement;\n if (!anchorEl) {\n // Default relative placement inside host\n this.applyRelativePlacement();\n return;\n }\n\n // If anchor is external to the component or positioning is fixed\n const isExternalAnchor = !this.contains(anchorEl);\n if (isExternalAnchor || this.positioning === 'fixed') {\n const rect = anchorEl.getBoundingClientRect();\n const surface = this.menuSurfaceElement;\n surface.classList.add('is-fixed');\n\n let top = 0;\n let left = 0;\n\n const placement = this.placement;\n const isTop = placement.startsWith('top');\n const isEnd = placement.endsWith('end') || this.alignment === 'end';\n\n if (isTop) {\n top = rect.top - this.yOffset - (surface.offsetHeight || 0);\n } else {\n top = rect.bottom + this.yOffset;\n }\n\n if (isEnd) {\n left = rect.right - (surface.offsetWidth || 0) + this.xOffset;\n } else {\n left = rect.left + this.xOffset;\n }\n\n // Viewport collision bounds\n const padding = 8;\n const maxLeft = window.innerWidth - (surface.offsetWidth || 112) - padding;\n left = Math.max(padding, Math.min(left, maxLeft));\n\n surface.style.top = `${top}px`;\n surface.style.left = `${left}px`;\n surface.style.right = 'auto';\n surface.style.bottom = 'auto';\n } else {\n this.applyRelativePlacement();\n }\n }\n\n private applyRelativePlacement(): void {\n if (!this.menuSurfaceElement) return;\n const surface = this.menuSurfaceElement;\n surface.classList.remove('is-fixed');\n\n const isTop = this.placement.startsWith('top');\n const isEnd = this.placement.endsWith('end') || this.alignment === 'end';\n\n if (isTop) {\n surface.style.top = 'auto';\n surface.style.bottom = `calc(100% + ${this.yOffset}px)`;\n } else {\n surface.style.top = `calc(100% + ${this.yOffset}px)`;\n surface.style.bottom = 'auto';\n }\n\n if (isEnd) {\n surface.style.left = 'auto';\n surface.style.right = `${-this.xOffset}px`;\n } else {\n surface.style.left = `${this.xOffset}px`;\n surface.style.right = 'auto';\n }\n }\n\n private handleDocumentClick = (event: MouseEvent | PointerEvent): void => {\n if (!this.open) return;\n const path = event.composedPath();\n\n // If clicked inside this menu or anchor, ignore\n if (path.includes(this)) return;\n if (this._anchorElement && path.includes(this._anchorElement)) return;\n if (typeof this.anchor === 'string' && this.anchorElement && path.includes(this.anchorElement)) return;\n\n this.close();\n };\n\n private handleWindowKeyDown = (event: KeyboardEvent): void => {\n if (!this.open) return;\n\n if (event.key === 'Escape') {\n event.preventDefault();\n event.stopPropagation();\n this.close();\n this.anchorElement?.focus();\n }\n };\n\n private handleSurfaceKeyDown = (event: KeyboardEvent): void => {\n const items = this.getItems(true);\n if (items.length === 0) return;\n\n let activeEl: Element | null = null;\n try {\n activeEl = document.activeElement;\n } catch {\n activeEl = null;\n }\n\n const currentIndex = items.findIndex(\n (item) => item === activeEl || item.contains(activeEl)\n );\n\n switch (event.key) {\n case 'ArrowDown': {\n event.preventDefault();\n const nextIndex = currentIndex >= 0 && currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n items[nextIndex]?.focus();\n break;\n }\n case 'ArrowUp': {\n event.preventDefault();\n const prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n items[prevIndex]?.focus();\n break;\n }\n case 'Home': {\n event.preventDefault();\n items[0]?.focus();\n break;\n }\n case 'End': {\n event.preventDefault();\n items[items.length - 1]?.focus();\n break;\n }\n case 'Tab': {\n if (!this.stayOpenOnFocusout) {\n this.close();\n }\n break;\n }\n }\n };\n\n private handleItemSelection = (event: CustomEvent): void => {\n const detail = event.detail;\n this.emitEvent('select', detail);\n\n if (!detail?.keepOpen) {\n this.close();\n }\n };\n\n private handleTriggerClick = (event: MouseEvent): void => {\n event.stopPropagation();\n this.toggle();\n };\n\n /**\n * Opens the menu.\n */\n show(): void {\n if (!this.open) {\n this.open = true;\n }\n }\n\n /**\n * Closes the menu.\n */\n close(): void {\n if (this.open) {\n this.open = false;\n }\n }\n\n /**\n * Toggles the menu open/closed state.\n */\n toggle(): void {\n this.open = !this.open;\n }\n\n /**\n * Returns all menu items inside the menu.\n * @param onlyEnabled - If true, filters out disabled items.\n */\n getItems(onlyEnabled = false): MdMenuItem[] {\n const items = Array.from(this.querySelectorAll('md-menu-item')) as MdMenuItem[];\n if (onlyEnabled) {\n return items.filter((item) => !item.disabled && !item.hasAttribute('disabled'));\n }\n return items;\n }\n\n /**\n * Focuses the first non-disabled menu item.\n */\n focusFirstItem(): void {\n const items = this.getItems(true);\n if (items.length > 0) {\n items[0]!.focus();\n } else if (this.menuSurfaceElement) {\n this.menuSurfaceElement.focus();\n }\n }\n\n /**\n * Focuses the last non-disabled menu item.\n */\n focusLastItem(): void {\n const items = this.getItems(true);\n if (items.length > 0) {\n items[items.length - 1]!.focus();\n }\n }\n\n /**\n * Focuses the menu item at the specified index.\n */\n focusItemAtIndex(index: number): void {\n const items = this.getItems(true);\n if (index >= 0 && index < items.length) {\n items[index]!.focus();\n }\n }\n\n override render() {\n const triggerContent = !this.noTrigger\n ? html`\n <div class=\"trigger-wrapper\" @click=${this.handleTriggerClick}>\n <slot name=\"trigger\"></slot>\n </div>\n `\n : nothing;\n\n return html`\n <div class=\"backdrop\" @click=${() => this.close()}></div>\n\n ${triggerContent}\n\n <div\n class=\"menu-surface\"\n role=\"menu\"\n tabindex=\"-1\"\n aria-label=${this.ariaLabelText}\n aria-hidden=${this.open ? 'false' : 'true'}\n @keydown=${this.handleSurfaceKeyDown}\n >\n <slot @slotchange=${this.updateDenseProp}></slot>\n </div>\n `;\n }\n}\n\nexport * from './menu-item.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-menu': MdMenu;\n }\n}\n"],"mappings":"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"}
@@ -0,0 +1,49 @@
1
+ import { MdBaseElement } from '../../internal/base-component.js';
2
+ export type NavigationBarLabelMode = 'alwaysShow' | 'selectedShow' | 'hidden' | 'always' | 'selected' | 'none';
3
+ /**
4
+ * Material Design 3 Navigation Bar Item Component.
5
+ *
6
+ * Represents an individual destination in a navigation bar with an icon,
7
+ * active indicator pill, badge, and label.
8
+ *
9
+ * @slot icon - Leading/inactive icon.
10
+ * @slot active-icon - Custom icon shown when the item is active.
11
+ * @slot badge - Custom badge indicator or element.
12
+ * @slot - Default slot for item label text.
13
+ *
14
+ * @fires item-click - Dispatched when the item is clicked.
15
+ */
16
+ export declare class MdNavigationBarItem extends MdBaseElement {
17
+ static styles: import('lit').CSSResultGroup[];
18
+ active: boolean;
19
+ selected: boolean;
20
+ disabled: boolean;
21
+ icon: string;
22
+ activeIcon: string;
23
+ label: string;
24
+ badge: string;
25
+ value: string;
26
+ href: string;
27
+ target: string;
28
+ labelMode: NavigationBarLabelMode;
29
+ hideInactiveLabels: boolean;
30
+ private assignedActiveIcons;
31
+ private assignedBadges;
32
+ willUpdate(changedProperties: Map<string, unknown>): void;
33
+ connectedCallback(): void;
34
+ updated(changedProperties: Map<string, unknown>): void;
35
+ private updateAriaAttributes;
36
+ private handleClick;
37
+ private renderBadge;
38
+ private renderIcon;
39
+ render(): import('lit-html').TemplateResult<1>;
40
+ }
41
+ export declare class MdNavBarItem extends MdNavigationBarItem {
42
+ }
43
+ declare global {
44
+ interface HTMLElementTagNameMap {
45
+ 'md-navigation-bar-item': MdNavigationBarItem;
46
+ 'md-nav-bar-item': MdNavBarItem;
47
+ }
48
+ }
49
+ //# sourceMappingURL=navigation-bar-item.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"navigation-bar-item.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-bar/navigation-bar-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,iCAAiC,CAAC;AACzC,OAAO,yCAAyC,CAAC;AACjD,OAAO,iBAAiB,CAAC;AAGzB,MAAM,MAAM,sBAAsB,GAAG,YAAY,GAAG,cAAc,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAE/G;;;;;;;;;;;;GAYG;AACH,qBACa,mBAAoB,SAAQ,aAAa;IACpD,OAAgB,MAAM,iCAAmD;IAGzE,MAAM,UAAS;IAGf,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,IAAI,SAAM;IAGV,UAAU,SAAM;IAGhB,KAAK,SAAM;IAGX,KAAK,SAAM;IAGX,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,MAAM,SAAM;IAGZ,SAAS,EAAE,sBAAsB,CAAgB;IAGjD,kBAAkB,UAAS;IAG3B,OAAO,CAAC,mBAAmB,CAAiB;IAG5C,OAAO,CAAC,cAAc,CAAiB;IAE9B,UAAU,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAelD,iBAAiB;IAMjB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAOxD,OAAO,CAAC,oBAAoB;IAU5B,OAAO,CAAC,WAAW,CAajB;IAEF,OAAO,CAAC,WAAW;IAoBnB,OAAO,CAAC,UAAU;IA4BT,MAAM;CA4ChB;AAGD,qBACa,YAAa,SAAQ,mBAAmB;CAAG;AAExD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,wBAAwB,EAAE,mBAAmB,CAAC;QAC9C,iBAAiB,EAAE,YAAY,CAAC;KACjC;CACF"}
@@ -0,0 +1,5 @@
1
+ import { n as t, t as r } from "../../chunks/navigation-bar-item-C9DfOEzg.js";
2
+ export {
3
+ r as MdNavBarItem,
4
+ t as MdNavigationBarItem
5
+ };
@@ -0,0 +1,3 @@
1
+ export declare const navigationBarStyles: import('lit').CSSResult;
2
+ export declare const navigationBarItemStyles: import('lit').CSSResult;
3
+ //# sourceMappingURL=navigation-bar.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"navigation-bar.css.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-bar/navigation-bar.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,mBAAmB,yBAqC/B,CAAC;AAEF,eAAO,MAAM,uBAAuB,yBA0MnC,CAAC"}
@@ -0,0 +1,50 @@
1
+ import { PropertyValues } from 'lit';
2
+ import { MdBaseElement } from '../../internal/base-component.js';
3
+ import { NavigationBarLabelMode } from './navigation-bar-item.js';
4
+ export * from './navigation-bar-item.js';
5
+ /**
6
+ * Material Design 3 Navigation Bar component.
7
+ *
8
+ * Navigation bars let users switch between 3 to 5 top-level destinations.
9
+ * Supports active indicator pill, badge notifications, alwaysShow/selectedShow/hidden label modes,
10
+ * keyboard navigation, and custom change events.
11
+ *
12
+ * @slot - Default slot for `md-navigation-bar-item` destinations.
13
+ *
14
+ * @fires change - Dispatched when the active navigation item changes. Detail: `{ activeIndex, selectedIndex, index, value, item }`
15
+ */
16
+ export declare class MdNavigationBar extends MdBaseElement {
17
+ static styles: import('lit').CSSResultGroup[];
18
+ activeIndex: number;
19
+ get selectedIndex(): number;
20
+ set selectedIndex(val: number);
21
+ value: string;
22
+ labelMode: NavigationBarLabelMode;
23
+ hideInactiveLabels: boolean;
24
+ disabled: boolean;
25
+ private assignedItems;
26
+ private get items();
27
+ connectedCallback(): void;
28
+ disconnectedCallback(): void;
29
+ updated(changedProperties: PropertyValues<this>): void;
30
+ private handleSlotChange;
31
+ private syncDisabled;
32
+ private syncLabelMode;
33
+ private syncActiveItem;
34
+ /**
35
+ * Selects a navigation item by index.
36
+ */
37
+ select(index: number): void;
38
+ private handleClick;
39
+ private handleKeyDown;
40
+ render(): import('lit-html').TemplateResult<1>;
41
+ }
42
+ export declare class MdNavBar extends MdNavigationBar {
43
+ }
44
+ declare global {
45
+ interface HTMLElementTagNameMap {
46
+ 'md-navigation-bar': MdNavigationBar;
47
+ 'md-nav-bar': MdNavBar;
48
+ }
49
+ }
50
+ //# sourceMappingURL=navigation-bar.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"navigation-bar.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-bar/navigation-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3C,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAEjE,OAAO,EAAuB,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAEvF,cAAc,0BAA0B,CAAC;AAEzC;;;;;;;;;;GAUG;AACH,qBACa,eAAgB,SAAQ,aAAa;IAChD,OAAgB,MAAM,iCAA+C;IAGrE,WAAW,SAAK;IAEhB,IACI,aAAa,IAAI,MAAM,CAE1B;IACD,IAAI,aAAa,CAAC,GAAG,EAAE,MAAM,EAE5B;IAGD,KAAK,SAAM;IAGX,SAAS,EAAE,sBAAsB,CAAgB;IAGjD,kBAAkB,UAAS;IAG3B,QAAQ,UAAS;IAGjB,OAAO,CAAC,aAAa,CAAyB;IAE9C,OAAO,KAAK,KAAK,GAKhB;IAEQ,iBAAiB;IAYjB,oBAAoB;IAMpB,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC;IA6BxD,OAAO,CAAC,gBAAgB,CAMtB;IAEF,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,cAAc;IAmBtB;;OAEG;IACI,MAAM,CAAC,KAAK,EAAE,MAAM;IAiB3B,OAAO,CAAC,WAAW,CAsBjB;IAEF,OAAO,CAAC,aAAa,CAqCnB;IAEO,MAAM;CAOhB;AAGD,qBACa,QAAS,SAAQ,eAAe;CAAG;AAEhD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;QACrC,YAAY,EAAE,QAAQ,CAAC;KACxB;CACF"}
@@ -0,0 +1,150 @@
1
+ import { n as r, t as a } from "../../chunks/decorate-DXuynaiA.js";
2
+ import { n as y, r as u, t as g } from "../../chunks/navigation-bar-item-C9DfOEzg.js";
3
+ import { html as b } from "lit";
4
+ import { customElement as o, property as h, queryAssignedElements as I } from "lit/decorators.js";
5
+ var s = class extends r {
6
+ constructor(...t) {
7
+ super(...t), this.activeIndex = 0, this.value = "", this.labelMode = "alwaysShow", this.hideInactiveLabels = !1, this.disabled = !1, this.handleSlotChange = () => {
8
+ this.syncActiveItem(), this.syncLabelMode(), this.disabled && this.syncDisabled();
9
+ }, this.handleClick = (e) => {
10
+ if (this.disabled) return;
11
+ const i = e.target.closest("md-navigation-bar-item, md-nav-bar-item");
12
+ if (!i || i.disabled || !this.items.includes(i)) return;
13
+ const n = this.items.indexOf(i);
14
+ n !== -1 && (this.activeIndex = n, this.value = i.value || i.label, this.syncActiveItem(), this.emitEvent("change", {
15
+ activeIndex: this.activeIndex,
16
+ selectedIndex: this.activeIndex,
17
+ index: this.activeIndex,
18
+ value: this.value,
19
+ item: i
20
+ }));
21
+ }, this.handleKeyDown = (e) => {
22
+ if (this.disabled) return;
23
+ const i = this.items.filter((d) => !d.disabled);
24
+ if (i.length === 0) return;
25
+ const n = this.items[this.activeIndex], c = i.indexOf(n);
26
+ let l = -1;
27
+ if (e.key === "ArrowRight" || e.key === "ArrowDown" ? (e.preventDefault(), l = c < i.length - 1 ? c + 1 : 0) : e.key === "ArrowLeft" || e.key === "ArrowUp" ? (e.preventDefault(), l = c > 0 ? c - 1 : i.length - 1) : e.key === "Home" ? (e.preventDefault(), l = 0) : e.key === "End" && (e.preventDefault(), l = i.length - 1), l !== -1 && i[l]) {
28
+ const d = i[l];
29
+ this.activeIndex = this.items.indexOf(d), this.value = d.value || d.label, this.syncActiveItem(), d.focus(), this.emitEvent("change", {
30
+ activeIndex: this.activeIndex,
31
+ selectedIndex: this.activeIndex,
32
+ index: this.activeIndex,
33
+ value: this.value,
34
+ item: d
35
+ });
36
+ }
37
+ };
38
+ }
39
+ static {
40
+ this.styles = [r.styles, u];
41
+ }
42
+ get selectedIndex() {
43
+ return this.activeIndex;
44
+ }
45
+ set selectedIndex(t) {
46
+ this.activeIndex = t;
47
+ }
48
+ get items() {
49
+ return this.assignedItems && this.assignedItems.length > 0 ? this.assignedItems : Array.from(this.querySelectorAll("md-navigation-bar-item, md-nav-bar-item"));
50
+ }
51
+ connectedCallback() {
52
+ super.connectedCallback(), this.hasAttribute("role") || this.setAttribute("role", "tablist"), this.hasAttribute("aria-label") || this.setAttribute("aria-label", "Navigation"), this.addEventListener("click", this.handleClick), this.addEventListener("keydown", this.handleKeyDown);
53
+ }
54
+ disconnectedCallback() {
55
+ super.disconnectedCallback(), this.removeEventListener("click", this.handleClick), this.removeEventListener("keydown", this.handleKeyDown);
56
+ }
57
+ updated(t) {
58
+ if (super.updated(t), t.has("activeIndex") || t.has("value")) {
59
+ if (t.has("activeIndex") && !t.has("value")) {
60
+ const e = this.items[this.activeIndex];
61
+ e && (this.value = e.value || e.label);
62
+ } else if (t.has("value") && !t.has("activeIndex")) {
63
+ const e = this.items.findIndex((i) => i.value === this.value || i.label === this.value);
64
+ e !== -1 && (this.activeIndex = e);
65
+ }
66
+ this.syncActiveItem();
67
+ }
68
+ (t.has("labelMode") || t.has("hideInactiveLabels")) && this.syncLabelMode(), t.has("disabled") && this.disabled && this.syncDisabled();
69
+ }
70
+ syncDisabled() {
71
+ this.items && this.disabled && this.items.forEach((t) => {
72
+ t.disabled = !0;
73
+ });
74
+ }
75
+ syncLabelMode() {
76
+ this.items && this.items.forEach((t) => {
77
+ this.labelMode && (t.labelMode = this.labelMode), this.hideInactiveLabels && (t.hideInactiveLabels = this.hideInactiveLabels);
78
+ });
79
+ }
80
+ syncActiveItem() {
81
+ if (!this.items || this.items.length === 0) return;
82
+ this.activeIndex < 0 && (this.activeIndex = 0), this.activeIndex >= this.items.length && (this.activeIndex = this.items.length - 1), this.items.forEach((e, i) => {
83
+ const n = i === this.activeIndex;
84
+ e.active = n, e.selected = n, e.tabIndex = n ? 0 : -1;
85
+ });
86
+ const t = this.items[this.activeIndex];
87
+ t && !this.value && (this.value = t.value || t.label);
88
+ }
89
+ select(t) {
90
+ if (!this.items || t < 0 || t >= this.items.length) return;
91
+ const e = this.items[t];
92
+ e && !e.disabled && (this.activeIndex = t, this.value = e.value || e.label, this.syncActiveItem(), this.emitEvent("change", {
93
+ activeIndex: this.activeIndex,
94
+ selectedIndex: this.activeIndex,
95
+ index: this.activeIndex,
96
+ value: this.value,
97
+ item: e
98
+ }));
99
+ }
100
+ render() {
101
+ return b`
102
+ <div class="nav-bar-container">
103
+ <slot @slotchange=${this.handleSlotChange}></slot>
104
+ </div>
105
+ `;
106
+ }
107
+ };
108
+ a([h({
109
+ type: Number,
110
+ reflect: !0,
111
+ attribute: "active-index"
112
+ })], s.prototype, "activeIndex", void 0);
113
+ a([h({
114
+ type: Number,
115
+ attribute: "selected-index"
116
+ })], s.prototype, "selectedIndex", null);
117
+ a([h({
118
+ type: String,
119
+ reflect: !0
120
+ })], s.prototype, "value", void 0);
121
+ a([h({
122
+ type: String,
123
+ reflect: !0,
124
+ attribute: "label-mode"
125
+ })], s.prototype, "labelMode", void 0);
126
+ a([h({
127
+ type: Boolean,
128
+ reflect: !0,
129
+ attribute: "hide-inactive-labels"
130
+ })], s.prototype, "hideInactiveLabels", void 0);
131
+ a([h({
132
+ type: Boolean,
133
+ reflect: !0
134
+ })], s.prototype, "disabled", void 0);
135
+ a([I({
136
+ selector: "md-navigation-bar-item, md-nav-bar-item",
137
+ flatten: !0
138
+ })], s.prototype, "assignedItems", void 0);
139
+ s = a([o("md-navigation-bar")], s);
140
+ var v = class extends s {
141
+ };
142
+ v = a([o("md-nav-bar")], v);
143
+ export {
144
+ v as MdNavBar,
145
+ g as MdNavBarItem,
146
+ s as MdNavigationBar,
147
+ y as MdNavigationBarItem
148
+ };
149
+
150
+ //# sourceMappingURL=navigation-bar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"navigation-bar.js","names":[],"sources":["../../../src/components/navigation-bar/navigation-bar.ts"],"sourcesContent":["import { html, PropertyValues } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport { navigationBarStyles } from './navigation-bar.css.js';\nimport { MdNavigationBarItem, NavigationBarLabelMode } from './navigation-bar-item.js';\n\nexport * from './navigation-bar-item.js';\n\n/**\n * Material Design 3 Navigation Bar component.\n *\n * Navigation bars let users switch between 3 to 5 top-level destinations.\n * Supports active indicator pill, badge notifications, alwaysShow/selectedShow/hidden label modes,\n * keyboard navigation, and custom change events.\n *\n * @slot - Default slot for `md-navigation-bar-item` destinations.\n *\n * @fires change - Dispatched when the active navigation item changes. Detail: `{ activeIndex, selectedIndex, index, value, item }`\n */\n@customElement('md-navigation-bar')\nexport class MdNavigationBar extends MdBaseElement {\n static override styles = [MdBaseElement.styles, navigationBarStyles];\n\n @property({ type: Number, reflect: true, attribute: 'active-index' })\n activeIndex = 0;\n\n @property({ type: Number, attribute: 'selected-index' })\n get selectedIndex(): number {\n return this.activeIndex;\n }\n set selectedIndex(val: number) {\n this.activeIndex = val;\n }\n\n @property({ type: String, reflect: true })\n value = '';\n\n @property({ type: String, reflect: true, attribute: 'label-mode' })\n labelMode: NavigationBarLabelMode = 'alwaysShow';\n\n @property({ type: Boolean, reflect: true, attribute: 'hide-inactive-labels' })\n hideInactiveLabels = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @queryAssignedElements({ selector: 'md-navigation-bar-item, md-nav-bar-item', flatten: true })\n private assignedItems!: MdNavigationBarItem[];\n\n private get items(): MdNavigationBarItem[] {\n if (this.assignedItems && this.assignedItems.length > 0) {\n return this.assignedItems;\n }\n return Array.from(this.querySelectorAll('md-navigation-bar-item, md-nav-bar-item')) as MdNavigationBarItem[];\n }\n\n override connectedCallback() {\n super.connectedCallback();\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'tablist');\n }\n if (!this.hasAttribute('aria-label')) {\n this.setAttribute('aria-label', 'Navigation');\n }\n this.addEventListener('click', this.handleClick);\n this.addEventListener('keydown', this.handleKeyDown);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.handleClick);\n this.removeEventListener('keydown', this.handleKeyDown);\n }\n\n override updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('activeIndex') || changedProperties.has('value')) {\n if (changedProperties.has('activeIndex') && !changedProperties.has('value')) {\n const current = this.items[this.activeIndex];\n if (current) {\n this.value = current.value || current.label;\n }\n } else if (changedProperties.has('value') && !changedProperties.has('activeIndex')) {\n const matchingIndex = this.items.findIndex(\n (item) => item.value === this.value || item.label === this.value\n );\n if (matchingIndex !== -1) {\n this.activeIndex = matchingIndex;\n }\n }\n this.syncActiveItem();\n }\n\n if (changedProperties.has('labelMode') || changedProperties.has('hideInactiveLabels')) {\n this.syncLabelMode();\n }\n\n if (changedProperties.has('disabled') && this.disabled) {\n this.syncDisabled();\n }\n }\n\n private handleSlotChange = () => {\n this.syncActiveItem();\n this.syncLabelMode();\n if (this.disabled) {\n this.syncDisabled();\n }\n };\n\n private syncDisabled() {\n if (!this.items) return;\n if (this.disabled) {\n this.items.forEach((item) => {\n item.disabled = true;\n });\n }\n }\n\n private syncLabelMode() {\n if (!this.items) return;\n this.items.forEach((item) => {\n if (this.labelMode) {\n item.labelMode = this.labelMode;\n }\n if (this.hideInactiveLabels) {\n item.hideInactiveLabels = this.hideInactiveLabels;\n }\n });\n }\n\n private syncActiveItem() {\n if (!this.items || this.items.length === 0) return;\n\n if (this.activeIndex < 0) this.activeIndex = 0;\n if (this.activeIndex >= this.items.length) this.activeIndex = this.items.length - 1;\n\n this.items.forEach((item, index) => {\n const isActive = index === this.activeIndex;\n item.active = isActive;\n item.selected = isActive;\n item.tabIndex = isActive ? 0 : -1;\n });\n\n const currentItem = this.items[this.activeIndex];\n if (currentItem && !this.value) {\n this.value = currentItem.value || currentItem.label;\n }\n }\n\n /**\n * Selects a navigation item by index.\n */\n public select(index: number) {\n if (!this.items || index < 0 || index >= this.items.length) return;\n const target = this.items[index];\n if (target && !target.disabled) {\n this.activeIndex = index;\n this.value = target.value || target.label;\n this.syncActiveItem();\n this.emitEvent('change', {\n activeIndex: this.activeIndex,\n selectedIndex: this.activeIndex,\n index: this.activeIndex,\n value: this.value,\n item: target,\n });\n }\n }\n\n private handleClick = (event: MouseEvent) => {\n if (this.disabled) return;\n\n const target = (event.target as HTMLElement).closest(\n 'md-navigation-bar-item, md-nav-bar-item'\n ) as MdNavigationBarItem | null;\n\n if (!target || target.disabled || !this.items.includes(target)) return;\n\n const index = this.items.indexOf(target);\n if (index !== -1) {\n this.activeIndex = index;\n this.value = target.value || target.label;\n this.syncActiveItem();\n this.emitEvent('change', {\n activeIndex: this.activeIndex,\n selectedIndex: this.activeIndex,\n index: this.activeIndex,\n value: this.value,\n item: target,\n });\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) return;\n const enabledItems = this.items.filter((i) => !i.disabled);\n if (enabledItems.length === 0) return;\n\n const activeItem = this.items[this.activeIndex];\n const currentIndex = enabledItems.indexOf(activeItem!);\n\n let nextIndex = -1;\n if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {\n event.preventDefault();\n nextIndex = currentIndex < enabledItems.length - 1 ? currentIndex + 1 : 0;\n } else if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {\n event.preventDefault();\n nextIndex = currentIndex > 0 ? currentIndex - 1 : enabledItems.length - 1;\n } else if (event.key === 'Home') {\n event.preventDefault();\n nextIndex = 0;\n } else if (event.key === 'End') {\n event.preventDefault();\n nextIndex = enabledItems.length - 1;\n }\n\n if (nextIndex !== -1 && enabledItems[nextIndex]) {\n const targetItem = enabledItems[nextIndex]!;\n this.activeIndex = this.items.indexOf(targetItem);\n this.value = targetItem.value || targetItem.label;\n this.syncActiveItem();\n targetItem.focus();\n this.emitEvent('change', {\n activeIndex: this.activeIndex,\n selectedIndex: this.activeIndex,\n index: this.activeIndex,\n value: this.value,\n item: targetItem,\n });\n }\n };\n\n override render() {\n return html`\n <div class=\"nav-bar-container\">\n <slot @slotchange=${this.handleSlotChange}></slot>\n </div>\n `;\n }\n}\n\n// Aliases\n@customElement('md-nav-bar')\nexport class MdNavBar extends MdNavigationBar {}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-navigation-bar': MdNavigationBar;\n 'md-nav-bar': MdNavBar;\n }\n}\n"],"mappings":"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"}
@@ -0,0 +1,36 @@
1
+ import { MdBaseElement } from '../../internal/base-component.js';
2
+ /**
3
+ * Material Design 3 Navigation Rail Item component.
4
+ *
5
+ * @slot icon - Custom leading icon.
6
+ * @slot - Default slot for destination label.
7
+ * @slot badge - Custom badge element.
8
+ */
9
+ export declare class MdNavigationRailItem extends MdBaseElement {
10
+ static styles: import('lit').CSSResultGroup[];
11
+ icon: string;
12
+ activeIcon: string;
13
+ label: string;
14
+ headline: string;
15
+ badge: string;
16
+ badgeDot: boolean;
17
+ active: boolean;
18
+ selected: boolean;
19
+ disabled: boolean;
20
+ hideLabel: boolean;
21
+ href: string;
22
+ target: string;
23
+ value: string;
24
+ willUpdate(changedProperties: Map<string, unknown>): void;
25
+ private handleClick;
26
+ render(): import('lit-html').TemplateResult<1>;
27
+ }
28
+ export declare class MdNavRailItem extends MdNavigationRailItem {
29
+ }
30
+ declare global {
31
+ interface HTMLElementTagNameMap {
32
+ 'md-navigation-rail-item': MdNavigationRailItem;
33
+ 'md-nav-rail-item': MdNavRailItem;
34
+ }
35
+ }
36
+ //# sourceMappingURL=navigation-rail-item.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"navigation-rail-item.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-rail/navigation-rail-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,iCAAiC,CAAC;AACzC,OAAO,yCAAyC,CAAC;AACjD,OAAO,iBAAiB,CAAC;AAGzB;;;;;;GAMG;AACH,qBACa,oBAAqB,SAAQ,aAAa;IACrD,OAAgB,MAAM,iCAAoD;IAG1E,IAAI,SAAM;IAGV,UAAU,SAAM;IAGhB,KAAK,SAAM;IAGX,QAAQ,SAAM;IAGd,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,MAAM,UAAS;IAGf,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,SAAS,UAAS;IAGlB,IAAI,SAAM;IAGV,MAAM,SAAM;IAGZ,KAAK,SAAM;IAEF,UAAU,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAe3D,OAAO,CAAC,WAAW,CAajB;IAEO,MAAM;CAqEhB;AAGD,qBACa,aAAc,SAAQ,oBAAoB;CAAG;AAE1D,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,yBAAyB,EAAE,oBAAoB,CAAC;QAChD,kBAAkB,EAAE,aAAa,CAAC;KACnC;CACF"}
@@ -0,0 +1,5 @@
1
+ import { n as t, t as i } from "../../chunks/navigation-rail-item-6pdhNHJK.js";
2
+ export {
3
+ i as MdNavRailItem,
4
+ t as MdNavigationRailItem
5
+ };
@@ -0,0 +1,3 @@
1
+ export declare const navigationRailStyles: import('lit').CSSResult;
2
+ export declare const navigationRailItemStyles: import('lit').CSSResult;
3
+ //# sourceMappingURL=navigation-rail.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"navigation-rail.css.d.ts","sourceRoot":"","sources":["../../../src/components/navigation-rail/navigation-rail.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,oBAAoB,yBAgFhC,CAAC;AAEF,eAAO,MAAM,wBAAwB,yBA0JpC,CAAC"}