@lit-material/navigation 0.0.2 → 0.1.0
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 +28 -0
- package/custom-elements.json +165 -0
- package/dist/adaptive-navigation.d.ts +52 -0
- package/dist/adaptive-navigation.d.ts.map +1 -0
- package/dist/adaptive-navigation.js +129 -0
- package/dist/adaptive-navigation.js.map +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -158,6 +158,34 @@ Fully out of scope for this first pass: responsive breakpoint switching (automat
|
|
|
158
158
|
between rail/drawer/bottom-navigation based on window size) — that's an app-level layout decision
|
|
159
159
|
this library doesn't make on your behalf.
|
|
160
160
|
|
|
161
|
+
## Adaptive navigation
|
|
162
|
+
|
|
163
|
+
`lit-material-adaptive-navigation` takes one list of destinations and shows the form M3
|
|
164
|
+
prescribes for the window: a navigation bar under 600px, a rail from 600px, and a drawer (or a
|
|
165
|
+
rail, with `expanded="rail"`) from 840px. All three are rendered and CSS shows one, so it needs no
|
|
166
|
+
script to pick and server-rendered markup is already right.
|
|
167
|
+
|
|
168
|
+
```html
|
|
169
|
+
<lit-material-adaptive-navigation id="nav" label="Sections"></lit-material-adaptive-navigation>
|
|
170
|
+
<script type="module">
|
|
171
|
+
const nav = document.querySelector("#nav");
|
|
172
|
+
nav.destinations = [{ label: "Overview", icon: "◎" }, { label: "Logs", icon: "≡", href: "/logs" }];
|
|
173
|
+
nav.selected = 0;
|
|
174
|
+
nav.addEventListener("change", () => console.log(nav.selected));
|
|
175
|
+
</script>
|
|
176
|
+
```
|
|
177
|
+
|
|
178
|
+
| Property | Attribute | Type | Default |
|
|
179
|
+
| -------- | --------- | ---- | ------- |
|
|
180
|
+
| `destinations` | — | `{ label; icon?; href?; disabled? }[]` | `[]` |
|
|
181
|
+
| `selected` | — | `number` | `-1` |
|
|
182
|
+
| `expanded` | `expanded` (reflected) | `"drawer" \| "rail"` | `"drawer"` |
|
|
183
|
+
| `label` | `label` | `string` | `"Main"` |
|
|
184
|
+
|
|
185
|
+
The selection is shared and `change` fires whichever form was used. It's one `<nav>` landmark
|
|
186
|
+
named by `label`; the hidden forms are out of the accessibility tree. Place it yourself (the bar
|
|
187
|
+
sits where the element is).
|
|
188
|
+
|
|
161
189
|
## License
|
|
162
190
|
|
|
163
191
|
MIT
|
package/custom-elements.json
CHANGED
|
@@ -2,6 +2,155 @@
|
|
|
2
2
|
"schemaVersion": "1.0.0",
|
|
3
3
|
"readme": "",
|
|
4
4
|
"modules": [
|
|
5
|
+
{
|
|
6
|
+
"kind": "javascript-module",
|
|
7
|
+
"path": "src/adaptive-navigation.ts",
|
|
8
|
+
"declarations": [
|
|
9
|
+
{
|
|
10
|
+
"kind": "class",
|
|
11
|
+
"description": "One set of destinations shown as M3 prescribes for the window's width: a\nnavigation bar on compact windows (under 600px), a rail on medium ones\n(600–839px), and a drawer — or a rail, with `expanded=\"rail\"` — on\nexpanded ones (840px and up).\n\nAll three are rendered and CSS shows one, so it needs no script to pick\nand server-rendered markup is already right; the hidden ones are out of\nthe accessibility tree. `selected` is shared, and `change` fires (with the\nnew index in `selected`) whichever one was used.\n\nPlace the bar yourself — e.g. the host fixed or sticky at the bottom on\ncompact windows: it sits where the element is.",
|
|
12
|
+
"name": "LitMaterialAdaptiveNavigation",
|
|
13
|
+
"cssProperties": [
|
|
14
|
+
{
|
|
15
|
+
"description": "Not a variable: breakpoints are fixed at 600px and 840px (M3 window size classes).",
|
|
16
|
+
"name": "--lit-material-adaptive-navigation-medium"
|
|
17
|
+
}
|
|
18
|
+
],
|
|
19
|
+
"members": [
|
|
20
|
+
{
|
|
21
|
+
"kind": "field",
|
|
22
|
+
"name": "destinations",
|
|
23
|
+
"type": {
|
|
24
|
+
"text": "NavigationDestination[]"
|
|
25
|
+
},
|
|
26
|
+
"default": "[]"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"kind": "field",
|
|
30
|
+
"name": "selected",
|
|
31
|
+
"type": {
|
|
32
|
+
"text": "number"
|
|
33
|
+
},
|
|
34
|
+
"default": "-1",
|
|
35
|
+
"attribute": "selected"
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"kind": "field",
|
|
39
|
+
"name": "expanded",
|
|
40
|
+
"type": {
|
|
41
|
+
"text": "\"drawer\" | \"rail\""
|
|
42
|
+
},
|
|
43
|
+
"default": "\"drawer\"",
|
|
44
|
+
"description": "What expanded windows show: `drawer` (default) or `rail`.",
|
|
45
|
+
"attribute": "expanded",
|
|
46
|
+
"reflects": true
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
"kind": "field",
|
|
50
|
+
"name": "label",
|
|
51
|
+
"type": {
|
|
52
|
+
"text": "string"
|
|
53
|
+
},
|
|
54
|
+
"default": "\"Main\"",
|
|
55
|
+
"description": "The accessible name of the navigation landmark.",
|
|
56
|
+
"attribute": "label"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"kind": "method",
|
|
60
|
+
"name": "onChange",
|
|
61
|
+
"privacy": "private",
|
|
62
|
+
"return": {
|
|
63
|
+
"type": {
|
|
64
|
+
"text": "void"
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
"parameters": [
|
|
68
|
+
{
|
|
69
|
+
"name": "event",
|
|
70
|
+
"type": {
|
|
71
|
+
"text": "Event"
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
]
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"kind": "method",
|
|
78
|
+
"name": "icon",
|
|
79
|
+
"privacy": "private",
|
|
80
|
+
"parameters": [
|
|
81
|
+
{
|
|
82
|
+
"name": "d",
|
|
83
|
+
"type": {
|
|
84
|
+
"text": "NavigationDestination"
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
]
|
|
88
|
+
}
|
|
89
|
+
],
|
|
90
|
+
"events": [
|
|
91
|
+
{
|
|
92
|
+
"name": "change",
|
|
93
|
+
"type": {
|
|
94
|
+
"text": "Event"
|
|
95
|
+
},
|
|
96
|
+
"description": "The selection changed; read `selected`."
|
|
97
|
+
}
|
|
98
|
+
],
|
|
99
|
+
"attributes": [
|
|
100
|
+
{
|
|
101
|
+
"name": "selected",
|
|
102
|
+
"type": {
|
|
103
|
+
"text": "number"
|
|
104
|
+
},
|
|
105
|
+
"default": "-1",
|
|
106
|
+
"fieldName": "selected"
|
|
107
|
+
},
|
|
108
|
+
{
|
|
109
|
+
"name": "expanded",
|
|
110
|
+
"type": {
|
|
111
|
+
"text": "\"drawer\" | \"rail\""
|
|
112
|
+
},
|
|
113
|
+
"default": "\"drawer\"",
|
|
114
|
+
"description": "What expanded windows show: `drawer` (default) or `rail`.",
|
|
115
|
+
"fieldName": "expanded"
|
|
116
|
+
},
|
|
117
|
+
{
|
|
118
|
+
"name": "label",
|
|
119
|
+
"type": {
|
|
120
|
+
"text": "string"
|
|
121
|
+
},
|
|
122
|
+
"default": "\"Main\"",
|
|
123
|
+
"description": "The accessible name of the navigation landmark.",
|
|
124
|
+
"fieldName": "label"
|
|
125
|
+
}
|
|
126
|
+
],
|
|
127
|
+
"superclass": {
|
|
128
|
+
"name": "LitElement",
|
|
129
|
+
"package": "lit"
|
|
130
|
+
},
|
|
131
|
+
"tagName": "lit-material-adaptive-navigation",
|
|
132
|
+
"customElement": true
|
|
133
|
+
}
|
|
134
|
+
],
|
|
135
|
+
"exports": [
|
|
136
|
+
{
|
|
137
|
+
"kind": "js",
|
|
138
|
+
"name": "LitMaterialAdaptiveNavigation",
|
|
139
|
+
"declaration": {
|
|
140
|
+
"name": "LitMaterialAdaptiveNavigation",
|
|
141
|
+
"module": "src/adaptive-navigation.ts"
|
|
142
|
+
}
|
|
143
|
+
},
|
|
144
|
+
{
|
|
145
|
+
"kind": "custom-element-definition",
|
|
146
|
+
"name": "lit-material-adaptive-navigation",
|
|
147
|
+
"declaration": {
|
|
148
|
+
"name": "LitMaterialAdaptiveNavigation",
|
|
149
|
+
"module": "src/adaptive-navigation.ts"
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
]
|
|
153
|
+
},
|
|
5
154
|
{
|
|
6
155
|
"kind": "javascript-module",
|
|
7
156
|
"path": "src/index.ts",
|
|
@@ -78,6 +227,22 @@
|
|
|
78
227
|
"name": "LitMaterialNavigationBarItem",
|
|
79
228
|
"module": "./navigation-bar-item.js"
|
|
80
229
|
}
|
|
230
|
+
},
|
|
231
|
+
{
|
|
232
|
+
"kind": "js",
|
|
233
|
+
"name": "LitMaterialAdaptiveNavigation",
|
|
234
|
+
"declaration": {
|
|
235
|
+
"name": "LitMaterialAdaptiveNavigation",
|
|
236
|
+
"module": "./adaptive-navigation.js"
|
|
237
|
+
}
|
|
238
|
+
},
|
|
239
|
+
{
|
|
240
|
+
"kind": "js",
|
|
241
|
+
"name": "NavigationDestination",
|
|
242
|
+
"declaration": {
|
|
243
|
+
"name": "NavigationDestination",
|
|
244
|
+
"module": "./adaptive-navigation.js"
|
|
245
|
+
}
|
|
81
246
|
}
|
|
82
247
|
]
|
|
83
248
|
},
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { LitElement, type TemplateResult } from "lit";
|
|
2
|
+
import "./navigation-drawer.js";
|
|
3
|
+
import "./navigation-drawer-item.js";
|
|
4
|
+
import "./navigation-rail.js";
|
|
5
|
+
import "./navigation-rail-item.js";
|
|
6
|
+
import "./navigation-bar.js";
|
|
7
|
+
import "./navigation-bar-item.js";
|
|
8
|
+
export interface NavigationDestination {
|
|
9
|
+
label: string;
|
|
10
|
+
/** An icon: an `svg`/`html` template, or text such as an emoji. */
|
|
11
|
+
icon?: TemplateResult | string;
|
|
12
|
+
href?: string;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* One set of destinations shown as M3 prescribes for the window's width: a
|
|
17
|
+
* navigation bar on compact windows (under 600px), a rail on medium ones
|
|
18
|
+
* (600–839px), and a drawer — or a rail, with `expanded="rail"` — on
|
|
19
|
+
* expanded ones (840px and up).
|
|
20
|
+
*
|
|
21
|
+
* All three are rendered and CSS shows one, so it needs no script to pick
|
|
22
|
+
* and server-rendered markup is already right; the hidden ones are out of
|
|
23
|
+
* the accessibility tree. `selected` is shared, and `change` fires (with the
|
|
24
|
+
* new index in `selected`) whichever one was used.
|
|
25
|
+
*
|
|
26
|
+
* Place the bar yourself — e.g. the host fixed or sticky at the bottom on
|
|
27
|
+
* compact windows: it sits where the element is.
|
|
28
|
+
*
|
|
29
|
+
* @element lit-material-adaptive-navigation
|
|
30
|
+
*
|
|
31
|
+
* @fires change - The selection changed; read `selected`.
|
|
32
|
+
*
|
|
33
|
+
* @cssprop --lit-material-adaptive-navigation-medium - Not a variable: breakpoints are fixed at 600px and 840px (M3 window size classes).
|
|
34
|
+
*/
|
|
35
|
+
export declare class LitMaterialAdaptiveNavigation extends LitElement {
|
|
36
|
+
static styles: import("lit").CSSResult;
|
|
37
|
+
destinations: NavigationDestination[];
|
|
38
|
+
selected: number;
|
|
39
|
+
/** What expanded windows show: `drawer` (default) or `rail`. */
|
|
40
|
+
expanded: "drawer" | "rail";
|
|
41
|
+
/** The accessible name of the navigation landmark. */
|
|
42
|
+
label: string;
|
|
43
|
+
private onChange;
|
|
44
|
+
private icon;
|
|
45
|
+
render(): TemplateResult<1>;
|
|
46
|
+
}
|
|
47
|
+
declare global {
|
|
48
|
+
interface HTMLElementTagNameMap {
|
|
49
|
+
"lit-material-adaptive-navigation": LitMaterialAdaptiveNavigation;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
//# sourceMappingURL=adaptive-navigation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"adaptive-navigation.d.ts","sourceRoot":"","sources":["../src/adaptive-navigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAW,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE1E,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,0BAA0B,CAAC;AAElC,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,IAAI,CAAC,EAAE,cAAc,GAAG,MAAM,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBACa,6BAA8B,SAAQ,UAAU;IAC3D,OAAgB,MAAM,0BA8BpB;IAE8B,YAAY,EAAE,qBAAqB,EAAE,CAAM;IAE/C,QAAQ,SAAM;IAE1C,gEAAgE;IACnC,QAAQ,EAAE,QAAQ,GAAG,MAAM,CAAY;IAEpE,sDAAsD;IAC1C,KAAK,SAAU;IAE3B,OAAO,CAAC,QAAQ;IAQhB,OAAO,CAAC,IAAI;IAIH,MAAM;CAyBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kCAAkC,EAAE,6BAA6B,CAAC;KACnE;CACF"}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { css, html, LitElement, nothing } from "lit";
|
|
8
|
+
import { customElement, property } from "lit/decorators.js";
|
|
9
|
+
import "./navigation-drawer.js";
|
|
10
|
+
import "./navigation-drawer-item.js";
|
|
11
|
+
import "./navigation-rail.js";
|
|
12
|
+
import "./navigation-rail-item.js";
|
|
13
|
+
import "./navigation-bar.js";
|
|
14
|
+
import "./navigation-bar-item.js";
|
|
15
|
+
/**
|
|
16
|
+
* One set of destinations shown as M3 prescribes for the window's width: a
|
|
17
|
+
* navigation bar on compact windows (under 600px), a rail on medium ones
|
|
18
|
+
* (600–839px), and a drawer — or a rail, with `expanded="rail"` — on
|
|
19
|
+
* expanded ones (840px and up).
|
|
20
|
+
*
|
|
21
|
+
* All three are rendered and CSS shows one, so it needs no script to pick
|
|
22
|
+
* and server-rendered markup is already right; the hidden ones are out of
|
|
23
|
+
* the accessibility tree. `selected` is shared, and `change` fires (with the
|
|
24
|
+
* new index in `selected`) whichever one was used.
|
|
25
|
+
*
|
|
26
|
+
* Place the bar yourself — e.g. the host fixed or sticky at the bottom on
|
|
27
|
+
* compact windows: it sits where the element is.
|
|
28
|
+
*
|
|
29
|
+
* @element lit-material-adaptive-navigation
|
|
30
|
+
*
|
|
31
|
+
* @fires change - The selection changed; read `selected`.
|
|
32
|
+
*
|
|
33
|
+
* @cssprop --lit-material-adaptive-navigation-medium - Not a variable: breakpoints are fixed at 600px and 840px (M3 window size classes).
|
|
34
|
+
*/
|
|
35
|
+
let LitMaterialAdaptiveNavigation = class LitMaterialAdaptiveNavigation extends LitElement {
|
|
36
|
+
constructor() {
|
|
37
|
+
super(...arguments);
|
|
38
|
+
this.destinations = [];
|
|
39
|
+
this.selected = -1;
|
|
40
|
+
/** What expanded windows show: `drawer` (default) or `rail`. */
|
|
41
|
+
this.expanded = "drawer";
|
|
42
|
+
/** The accessible name of the navigation landmark. */
|
|
43
|
+
this.label = "Main";
|
|
44
|
+
}
|
|
45
|
+
static { this.styles = css `
|
|
46
|
+
:host {
|
|
47
|
+
display: block;
|
|
48
|
+
}
|
|
49
|
+
.bar,
|
|
50
|
+
.rail,
|
|
51
|
+
.drawer {
|
|
52
|
+
display: none;
|
|
53
|
+
}
|
|
54
|
+
@media (max-width: 599.98px) {
|
|
55
|
+
.bar { display: block; }
|
|
56
|
+
}
|
|
57
|
+
@media (min-width: 600px) and (max-width: 839.98px) {
|
|
58
|
+
.rail { display: block; height: 100%; }
|
|
59
|
+
}
|
|
60
|
+
@media (min-width: 840px) {
|
|
61
|
+
:host(:not([expanded="rail"])) .drawer { display: block; height: 100%; }
|
|
62
|
+
:host([expanded="rail"]) .rail { display: block; height: 100%; }
|
|
63
|
+
}
|
|
64
|
+
[slot="icon"] {
|
|
65
|
+
display: inline-flex;
|
|
66
|
+
width: 24px;
|
|
67
|
+
height: 24px;
|
|
68
|
+
align-items: center;
|
|
69
|
+
justify-content: center;
|
|
70
|
+
}
|
|
71
|
+
[slot="icon"] svg {
|
|
72
|
+
width: 100%;
|
|
73
|
+
height: 100%;
|
|
74
|
+
}
|
|
75
|
+
`; }
|
|
76
|
+
onChange(event) {
|
|
77
|
+
event.stopPropagation();
|
|
78
|
+
const selected = event.target.selected;
|
|
79
|
+
if (selected === this.selected)
|
|
80
|
+
return;
|
|
81
|
+
this.selected = selected;
|
|
82
|
+
this.dispatchEvent(new Event("change", { bubbles: true, composed: true }));
|
|
83
|
+
}
|
|
84
|
+
icon(d) {
|
|
85
|
+
return d.icon === undefined ? nothing : html `<span slot="icon" aria-hidden="true">${d.icon}</span>`;
|
|
86
|
+
}
|
|
87
|
+
render() {
|
|
88
|
+
const ds = this.destinations;
|
|
89
|
+
return html `
|
|
90
|
+
<nav aria-label=${this.label}>
|
|
91
|
+
<div class="drawer">
|
|
92
|
+
<lit-material-navigation-drawer .selected=${this.selected} @change=${this.onChange}>
|
|
93
|
+
${ds.map((d, i) => html `<lit-material-navigation-drawer-item ?selected=${i === this.selected} ?disabled=${!!d.disabled} href=${d.href ?? nothing}
|
|
94
|
+
>${this.icon(d)}${d.label}</lit-material-navigation-drawer-item>`)}
|
|
95
|
+
</lit-material-navigation-drawer>
|
|
96
|
+
</div>
|
|
97
|
+
<div class="rail">
|
|
98
|
+
<lit-material-navigation-rail .selected=${this.selected} @change=${this.onChange}>
|
|
99
|
+
${ds.map((d, i) => html `<lit-material-navigation-rail-item ?selected=${i === this.selected} ?disabled=${!!d.disabled} href=${d.href ?? nothing}
|
|
100
|
+
>${this.icon(d)}${d.label}</lit-material-navigation-rail-item>`)}
|
|
101
|
+
</lit-material-navigation-rail>
|
|
102
|
+
</div>
|
|
103
|
+
<div class="bar">
|
|
104
|
+
<lit-material-navigation-bar .selected=${this.selected} @change=${this.onChange}>
|
|
105
|
+
${ds.map((d, i) => html `<lit-material-navigation-bar-item ?selected=${i === this.selected} ?disabled=${!!d.disabled} href=${d.href ?? nothing}
|
|
106
|
+
>${this.icon(d)}${d.label}</lit-material-navigation-bar-item>`)}
|
|
107
|
+
</lit-material-navigation-bar>
|
|
108
|
+
</div>
|
|
109
|
+
</nav>
|
|
110
|
+
`;
|
|
111
|
+
}
|
|
112
|
+
};
|
|
113
|
+
__decorate([
|
|
114
|
+
property({ attribute: false })
|
|
115
|
+
], LitMaterialAdaptiveNavigation.prototype, "destinations", void 0);
|
|
116
|
+
__decorate([
|
|
117
|
+
property({ type: Number })
|
|
118
|
+
], LitMaterialAdaptiveNavigation.prototype, "selected", void 0);
|
|
119
|
+
__decorate([
|
|
120
|
+
property({ reflect: true })
|
|
121
|
+
], LitMaterialAdaptiveNavigation.prototype, "expanded", void 0);
|
|
122
|
+
__decorate([
|
|
123
|
+
property()
|
|
124
|
+
], LitMaterialAdaptiveNavigation.prototype, "label", void 0);
|
|
125
|
+
LitMaterialAdaptiveNavigation = __decorate([
|
|
126
|
+
customElement("lit-material-adaptive-navigation")
|
|
127
|
+
], LitMaterialAdaptiveNavigation);
|
|
128
|
+
export { LitMaterialAdaptiveNavigation };
|
|
129
|
+
//# sourceMappingURL=adaptive-navigation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"adaptive-navigation.js","sourceRoot":"","sources":["../src/adaptive-navigation.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,wBAAwB,CAAC;AAChC,OAAO,6BAA6B,CAAC;AACrC,OAAO,sBAAsB,CAAC;AAC9B,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,0BAA0B,CAAC;AAUlC;;;;;;;;;;;;;;;;;;;GAmBG;AAEI,IAAM,6BAA6B,GAAnC,MAAM,6BAA8B,SAAQ,UAAU;IAAtD;;QAiC2B,iBAAY,GAA4B,EAAE,CAAC;QAE/C,aAAQ,GAAG,CAAC,CAAC,CAAC;QAE1C,gEAAgE;QACnC,aAAQ,GAAsB,QAAQ,CAAC;QAEpE,sDAAsD;QAC1C,UAAK,GAAG,MAAM,CAAC;IAuC7B,CAAC;aA/EiB,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8B3B,AA9BqB,CA8BpB;IAYM,QAAQ,CAAC,KAAY;QAC3B,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,MAAM,QAAQ,GAAI,KAAK,CAAC,MAA0C,CAAC,QAAQ,CAAC;QAC5E,IAAI,QAAQ,KAAK,IAAI,CAAC,QAAQ;YAAE,OAAO;QACvC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAC7E,CAAC;IAEO,IAAI,CAAC,CAAwB;QACnC,OAAO,CAAC,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA,wCAAwC,CAAC,CAAC,IAAI,SAAS,CAAC;IACtG,CAAC;IAEQ,MAAM;QACb,MAAM,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC;QAC7B,OAAO,IAAI,CAAA;wBACS,IAAI,CAAC,KAAK;;sDAEoB,IAAI,CAAC,QAAQ,YAAY,IAAI,CAAC,QAAQ;cAC9E,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA,kDAAkD,CAAC,KAAK,IAAI,CAAC,QAAQ,cAAc,CAAC,CAAC,CAAC,CAAC,QAAQ,SAAS,CAAC,CAAC,IAAI,IAAI,OAAO;iBAC3I,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,wCAAwC,CAAC;;;;oDAI5B,IAAI,CAAC,QAAQ,YAAY,IAAI,CAAC,QAAQ;cAC5E,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA,gDAAgD,CAAC,KAAK,IAAI,CAAC,QAAQ,cAAc,CAAC,CAAC,CAAC,CAAC,QAAQ,SAAS,CAAC,CAAC,IAAI,IAAI,OAAO;iBACzI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,sCAAsC,CAAC;;;;mDAI3B,IAAI,CAAC,QAAQ,YAAY,IAAI,CAAC,QAAQ;cAC3E,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA,+CAA+C,CAAC,KAAK,IAAI,CAAC,QAAQ,cAAc,CAAC,CAAC,CAAC,CAAC,QAAQ,SAAS,CAAC,CAAC,IAAI,IAAI,OAAO;iBACxI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,qCAAqC,CAAC;;;;KAIxE,CAAC;IACJ,CAAC;;AA9C+B;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;mEAA4C;AAE/C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+DAAe;AAGb;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+DAAwC;AAGxD;IAAX,QAAQ,EAAE;4DAAgB;AAzChB,6BAA6B;IADzC,aAAa,CAAC,kCAAkC,CAAC;GACrC,6BAA6B,CAgFzC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -6,4 +6,6 @@ export type { NavigationRailAlignment } from "./navigation-rail.js";
|
|
|
6
6
|
export { LitMaterialNavigationRailItem } from "./navigation-rail-item.js";
|
|
7
7
|
export { LitMaterialNavigationBar } from "./navigation-bar.js";
|
|
8
8
|
export { LitMaterialNavigationBarItem } from "./navigation-bar-item.js";
|
|
9
|
+
export { LitMaterialAdaptiveNavigation } from "./adaptive-navigation.js";
|
|
10
|
+
export type { NavigationDestination } from "./adaptive-navigation.js";
|
|
9
11
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AACrE,YAAY,EAAE,uBAAuB,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAChG,OAAO,EAAE,+BAA+B,EAAE,MAAM,6BAA6B,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AACjE,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,6BAA6B,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AACrE,YAAY,EAAE,uBAAuB,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAChG,OAAO,EAAE,+BAA+B,EAAE,MAAM,6BAA6B,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AACjE,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,6BAA6B,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,6BAA6B,EAAE,MAAM,0BAA0B,CAAC;AACzE,YAAY,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -4,4 +4,5 @@ export { LitMaterialNavigationRail } from "./navigation-rail.js";
|
|
|
4
4
|
export { LitMaterialNavigationRailItem } from "./navigation-rail-item.js";
|
|
5
5
|
export { LitMaterialNavigationBar } from "./navigation-bar.js";
|
|
6
6
|
export { LitMaterialNavigationBarItem } from "./navigation-bar-item.js";
|
|
7
|
+
export { LitMaterialAdaptiveNavigation } from "./adaptive-navigation.js";
|
|
7
8
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAErE,OAAO,EAAE,+BAA+B,EAAE,MAAM,6BAA6B,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,OAAO,EAAE,6BAA6B,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,wBAAwB,CAAC;AAErE,OAAO,EAAE,+BAA+B,EAAE,MAAM,6BAA6B,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,OAAO,EAAE,6BAA6B,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,6BAA6B,EAAE,MAAM,0BAA0B,CAAC"}
|