@leaflink/stash 43.1.0 → 43.2.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.
@@ -1,361 +1,104 @@
1
- import { t as N } from "./locale.js";
2
- import O from "./Dropdown.js";
3
- import A from "./Icon.js";
4
- import D from "lodash-es/isFunction";
5
- import B from "./Chip.js";
6
- import { resolveComponent as _, openBlock as r, createElementBlock as h, mergeProps as y, createElementVNode as n, normalizeClass as i, toDisplayString as c, Fragment as w, createBlock as m, withCtx as v, createTextVNode as u, createCommentVNode as k, normalizeStyle as S, renderList as I, createVNode as $ } from "vue";
7
- import { _ as C } from "./_plugin-vue_export-helper-dad06003.js";
8
- import "lodash-es/get";
1
+ import { defineComponent as b, ref as g, watch as m, onMounted as x, openBlock as p, createElementBlock as c, createVNode as _, withCtx as f, Fragment as I, renderList as V, createBlock as k, unref as T, createTextVNode as N, toDisplayString as B } from "vue";
2
+ import C from "@leaflink/snitch";
3
+ import d from "lodash-es/kebabCase";
4
+ import { useRoute as U, useRouter as y } from "vue-router";
5
+ import { _ as P } from "./Tab.vue_vue_type_script_setup_true_lang-b810bee8.js";
6
+ import D from "./Tabs.js";
7
+ import "./Badge.js";
8
+ import "./_plugin-vue_export-helper-dad06003.js";
9
+ import "./Tabs.vue_used_vue_type_style_index_0_lang.module-4f247ed7.js";
10
+ import "lodash-es/debounce";
11
+ import "lodash-es/uniqueId";
9
12
  import "./constants.js";
13
+ import "./locale.js";
14
+ import "lodash-es/get";
15
+ import "./Dropdown.js";
10
16
  import "./clickoutside.js";
11
17
  import "./utils/calculateElementOverflow.js";
12
18
  import "./utils/helpers.js";
13
19
  import "lodash-es/camelCase";
14
20
  import "lodash-es/isFinite";
15
21
  import "lodash-es/isPlainObject";
16
- import "lodash-es/uniqueId";
22
+ import "./Icon.js";
17
23
  import "./index-79ce320f.js";
18
24
  import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
19
- import "./utils/colorScheme.js";
20
- const M = "_link_5hoi4_176", z = "_badge_5hoi4_225", E = {
21
- link: M,
22
- "is-active": "_is-active_5hoi4_192",
23
- "is-disabled": "_is-disabled_5hoi4_202",
24
- "dropdown-link": "_dropdown-link_5hoi4_207",
25
- badge: z
26
- }, L = {
27
- name: "nav-item",
28
- components: {
29
- Chip: B
30
- },
31
- inheritAttrs: !1,
32
- props: {
33
- /**
34
- * Used to display the bubble count, i.e. orders, messages
35
- */
36
- badge: {
37
- type: [Number, String],
38
- default: 0
39
- },
40
- /**
41
- * The background color of the badge.
42
- * Currently limited to a subset of brand colors.
43
- */
44
- badgeColor: {
45
- type: String,
46
- default: "blue",
47
- validator: (e) => ["blue", "red"].includes(e)
48
- },
49
- /**
50
- * Private/inherited - Item index.
51
- */
52
- index: {
53
- type: Number,
54
- required: !0
55
- },
56
- /**
57
- * Private/inherited - Whether the current tab `index` matches `activeIndex`
58
- */
59
- isActive: Boolean,
60
- /**
61
- * Private/inherited - Whether the item is inside the dropdown
62
- */
63
- isDropdown: Boolean,
64
- /**
65
- * Used to render an `<a>` tag. Denotes the target href of the link.
66
- */
67
- href: {
68
- default: "",
69
- type: String
70
- },
71
- /**
72
- * The nav item label
73
- */
74
- label: {
75
- default: "",
76
- type: String
77
- },
78
- /**
79
- * Used to render a `<router-link>`. Denotes the target route of the link.
80
- * See: https://router.vuejs.org/api/#router-link
81
- */
82
- to: {
83
- default: "",
84
- type: [Object, String]
85
- },
86
- /**
87
- * Will render a plain text item if true.
88
- * Accepts a function to ensure the value is up-to-date, such as when it comes from vuex
89
- */
90
- disabled: {
91
- default: !1,
92
- type: [Boolean, Function]
93
- }
94
- },
95
- computed: {
96
- isDisabled() {
97
- return D(this.disabled) ? this.disabled() : this.disabled;
98
- }
99
- },
100
- methods: {
101
- /**
102
- * Customer Active Class matcher.
103
- *
104
- * This attempts to match the URL ignoring the path params.
105
- */
106
- hasActiveClass(e) {
107
- if (e === this.$route.path)
108
- return !0;
109
- if (this.$route.path.includes(e)) {
110
- const b = (this.$route.path.length - this.$route.path.lastIndexOf("/")) * -1, t = this.$route.path.slice(0, b);
111
- return e === t;
112
- }
113
- }
114
- }
115
- }, V = ["data-id"], F = ["data-id", "onClick"], P = ["href"], T = ["aria-selected", "data-id"], W = ["href"];
116
- function R(e, b, t, d, l, a) {
117
- const f = _("Chip"), g = _("router-link");
118
- return a.isDisabled ? (r(), h("li", y({
119
- key: 0,
120
- "aria-disabled": "true",
121
- "data-id": t.index
122
- }, e.$attrs), [
123
- n("span", {
124
- class: i([e.$style.link, { [e.$style["dropdown-link"]]: t.isDropdown }, e.$style["is-disabled"]])
125
- }, c(t.label), 3)
126
- ], 16, V)) : (r(), h(w, { key: 1 }, [
127
- t.to ? (r(), m(g, {
128
- key: 0,
129
- custom: "",
130
- to: t.to
131
- }, {
132
- default: v(({ route: p, navigate: s }) => {
133
- var o;
134
- return [
135
- n("li", y({
136
- role: "tab",
137
- "data-id": t.index,
138
- class: [{ [e.$style["is-active"]]: a.hasActiveClass(p.path) }, "cursor-pointer"]
139
- }, e.$attrs, { onClick: s }), [
140
- n("a", {
141
- class: i([e.$style.link, { [e.$style["dropdown-link"]]: t.isDropdown }]),
142
- href: ((o = t.to) == null ? void 0 : o.name) || t.to
143
- }, [
144
- u(c(t.label) + " ", 1),
145
- t.badge ? (r(), m(f, {
146
- key: 0,
147
- radius: "pill",
148
- shade: "main",
149
- size: "small",
150
- class: i(e.$style.badge),
151
- "color-scheme": t.badgeColor
152
- }, {
153
- default: v(() => [
154
- u(c(t.badge), 1)
155
- ]),
156
- _: 1
157
- }, 8, ["class", "color-scheme"])) : k("", !0)
158
- ], 10, P)
159
- ], 16, F)
160
- ];
161
- }),
162
- _: 1
163
- }, 8, ["to"])) : (r(), h("li", y({
164
- key: 1,
165
- role: "tab",
166
- "aria-selected": t.isActive || null,
167
- class: { [e.$style["is-active"]]: t.isActive },
168
- "data-id": t.index
169
- }, e.$attrs), [
170
- n("a", {
171
- class: i([e.$style.link, { [e.$style["dropdown-link"]]: t.isDropdown }]),
172
- href: t.href
173
- }, [
174
- u(c(t.label) + " ", 1),
175
- t.badge ? (r(), m(f, {
176
- key: 0,
177
- radius: "pill",
178
- shade: "main",
179
- size: "small",
180
- class: i(e.$style.badge),
181
- "color-scheme": t.badgeColor
182
- }, {
183
- default: v(() => [
184
- u(c(t.badge), 1)
185
- ]),
186
- _: 1
187
- }, 8, ["class", "color-scheme"])) : k("", !0)
188
- ], 10, W)
189
- ], 16, T))
190
- ], 64));
191
- }
192
- const j = {
193
- $style: E
194
- }, q = /* @__PURE__ */ C(L, [["render", R], ["__cssModules", j]]), U = "_link_f9rla_176", G = "_tabs_f9rla_203", H = "_list_f9rla_212", J = "_item_f9rla_220", K = "_dropdown_f9rla_236", Q = {
195
- link: U,
196
- "is-active": "_is-active_f9rla_192",
197
- tabs: G,
198
- "is-scrollable": "_is-scrollable_f9rla_206",
199
- list: H,
200
- item: J,
201
- "is-invisible": "_is-invisible_f9rla_232",
202
- dropdown: K,
203
- "is-visible": "_is-visible_f9rla_244",
204
- "dropdown-list": "_dropdown-list_f9rla_248",
205
- "is-open": "_is-open_f9rla_263",
206
- "dropdown-toggle": "_dropdown-toggle_f9rla_282",
207
- "has-active": "_has-active_f9rla_293",
208
- "dropdown-icon": "_dropdown-icon_f9rla_297"
209
- }, X = {
25
+ const E = {
26
+ class: "root stash-page-navigation container",
27
+ "data-test": "stash-page-navigation"
28
+ }, re = /* @__PURE__ */ b({
210
29
  name: "ll-page-navigation",
211
- components: {
212
- "ll-dropdown": O,
213
- "ll-icon": A,
214
- NavItem: q
215
- },
30
+ __name: "PageNavigation",
216
31
  props: {
217
- /**
218
- * Index of active tab (zero-based)
219
- */
220
- activeIndex: {
221
- type: Number,
222
- default: 0
223
- },
224
- /**
225
- * Array of tabs. A `tab` is an object containing a `label` and either an `href` | `to`
226
- */
227
- items: {
228
- type: Array,
229
- default: () => []
230
- }
32
+ activeIndex: { default: void 0 },
33
+ modelValue: { default: "" },
34
+ items: {}
231
35
  },
232
- data() {
233
- return {
234
- hasIntersectionObserver: "IntersectionObserver" in window,
235
- observer: void 0,
236
- overflowIds: [],
237
- toggleWidth: 0,
238
- moreText: N("ll.pageNavigation.more")
239
- };
240
- },
241
- watch: {
242
- items() {
243
- this.destroyObserver(), this.observe();
36
+ emits: ["update:modelValue", "change"],
37
+ setup(v, { emit: i }) {
38
+ const r = v;
39
+ r.activeIndex && C.info("The `activeIndex` prop is deprecated. Use `v-model` instead.");
40
+ const o = U(), u = y(), s = g("");
41
+ function l(t) {
42
+ t !== s.value && (s.value = t, i("update:modelValue", t));
244
43
  }
245
- },
246
- mounted() {
247
- this.observe();
248
- },
249
- activated() {
250
- this.observe();
251
- },
252
- deactivated() {
253
- this.destroyObserver();
254
- },
255
- beforeUnmount() {
256
- this.destroyObserver();
257
- },
258
- methods: {
259
- /**
260
- * Event emitted when a tab is clicked, with the target tab index.
261
- */
262
- observe() {
263
- var e;
264
- if (this.hasIntersectionObserver) {
265
- const b = Array.from(this.$refs.tabList.children), t = {
266
- root: this.$refs.tabList,
267
- rootMargin: "0px 0px 0px 0px",
268
- threshold: Array.from({ length: 100 }).map((d, l) => (l + 1) / 100)
269
- };
270
- this.observer = new IntersectionObserver((d) => {
271
- d.forEach((l) => {
272
- const a = l.target.getAttribute("data-id");
273
- l.intersectionRatio > 0.96 ? this.overflowIds.includes(a) && this.overflowIds.splice(this.overflowIds.indexOf(a), 1) : this.overflowIds.includes(a) || this.overflowIds.push(a);
274
- });
275
- }, t), b.forEach((d) => {
276
- this.observer.observe(d);
277
- }), this.toggleWidth = (e = this.$refs.toggle.$el) == null ? void 0 : e.getBoundingClientRect().width;
44
+ return m(() => r.modelValue, (t, e) => {
45
+ if (e === t)
46
+ return;
47
+ const a = r.items.findIndex((n) => d(n.label) === t);
48
+ i("change", a);
49
+ }), x(() => {
50
+ if (!r.items.length)
51
+ return;
52
+ if (r.activeIndex !== void 0) {
53
+ const e = r.items[r.activeIndex];
54
+ l(d(e.label));
55
+ return;
278
56
  }
279
- },
280
- destroyObserver() {
281
- this.observer && (this.observer.disconnect(), this.observer = void 0);
282
- }
283
- }
284
- }, Y = { class: "container" }, Z = ["onClick"];
285
- function x(e, b, t, d, l, a) {
286
- const f = _("NavItem"), g = _("ll-icon"), p = _("ll-dropdown");
287
- return r(), h("div", Y, [
288
- n("nav", {
289
- class: i([e.$style.tabs, { [e.$style["is-scrollable"]]: !l.hasIntersectionObserver }])
290
- }, [
291
- n("ul", {
292
- ref: "tabList",
293
- class: i(e.$style.list),
294
- style: S({
295
- width: `calc(100% - ${l.toggleWidth}px)`
296
- })
297
- }, [
298
- (r(!0), h(w, null, I(t.items, (s, o) => (r(), m(f, {
299
- key: o,
300
- class: i([e.$style.item, { [e.$style["is-invisible"]]: l.overflowIds.includes(`${o}`) }]),
301
- badge: s.badge,
302
- "badge-color": s.badgeColor,
303
- "data-id": o,
304
- href: s.href,
305
- index: o,
306
- "is-active": o === t.activeIndex,
307
- label: s.label,
308
- to: s.to,
309
- disabled: s.disabled
310
- }, null, 8, ["class", "badge", "badge-color", "data-id", "href", "index", "is-active", "label", "to", "disabled"]))), 128))
311
- ], 6),
312
- $(p, {
313
- ref: "toggle",
314
- class: i([e.$style.dropdown, { [e.$style["is-visible"]]: l.overflowIds.length }]),
315
- offset: { x: -1 }
57
+ if (r.modelValue) {
58
+ l(r.modelValue);
59
+ return;
60
+ }
61
+ if (!u)
62
+ return;
63
+ const t = r.items.find((e) => {
64
+ if (e != null && e.disabled || !(e != null && e.to) && !(e != null && e.href))
65
+ return;
66
+ const { path: a } = u.resolve((e == null ? void 0 : e.to) || (e == null ? void 0 : e.href));
67
+ if (a === o.path)
68
+ return !0;
69
+ if (!o.path.includes(a))
70
+ return;
71
+ const n = (o.path.length - o.path.lastIndexOf("/")) * -1, h = o.path.slice(0, n);
72
+ return a === h;
73
+ });
74
+ t && l((t == null ? void 0 : t.value) || d(t.label));
75
+ }), (t, e) => (p(), c("nav", E, [
76
+ _(D, {
77
+ "active-tab": s.value,
78
+ "onUpdate:activeTab": l
316
79
  }, {
317
- toggle: v(({ toggle: s }) => [
318
- n("button", {
319
- "aria-haspopup": "true",
320
- class: i([e.$style.link, e.$style["dropdown-toggle"]]),
321
- type: "button",
322
- "aria-expanded": "false",
323
- onClick: s
324
- }, [
325
- u(c(l.moreText) + " ", 1),
326
- $(g, {
327
- name: "caret-down",
328
- class: i(e.$style["dropdown-icon"])
329
- }, null, 8, ["class"])
330
- ], 10, Z)
331
- ]),
332
- default: v(() => [
333
- n("ul", {
334
- class: i(e.$style["dropdown-list"])
335
- }, [
336
- (r(!0), h(w, null, I(t.items, (s, o) => (r(), m(f, {
337
- key: o,
338
- class: i({ hidden: !l.overflowIds.includes(`${o}`) }),
339
- href: s.href,
340
- index: o,
341
- "is-active": o === t.activeIndex,
342
- "is-dropdown": !0,
343
- label: s.label,
344
- to: s.to,
345
- disabled: (s == null ? void 0 : s.disabled) ?? !1
346
- }, null, 8, ["class", "href", "index", "is-active", "label", "to", "disabled"]))), 128))
347
- ], 2)
80
+ default: f(() => [
81
+ (p(!0), c(I, null, V(r.items, (a, n) => (p(), k(P, {
82
+ key: a.label,
83
+ value: (a == null ? void 0 : a.value) || T(d)(a.label),
84
+ to: a.to,
85
+ href: a.href,
86
+ badge: a.badge,
87
+ disabled: a.disabled,
88
+ "data-id": n
89
+ }, {
90
+ default: f(() => [
91
+ N(B(a.label), 1)
92
+ ]),
93
+ _: 2
94
+ }, 1032, ["value", "to", "href", "badge", "disabled", "data-id"]))), 128))
348
95
  ]),
349
96
  _: 1
350
- }, 8, ["class"])
351
- ], 2)
352
- ]);
353
- }
354
- const ee = {
355
- $style: Q
356
- }, ye = /* @__PURE__ */ C(X, [["render", x], ["__cssModules", ee]]);
97
+ }, 8, ["active-tab"])
98
+ ]));
99
+ }
100
+ });
357
101
  export {
358
- q as NavItem,
359
- ye as default
102
+ re as default
360
103
  };
361
104
  //# sourceMappingURL=PageNavigation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PageNavigation.js","sources":["../src/components/PageNavigation/components/NavItem.vue","../src/components/PageNavigation/PageNavigation.vue"],"sourcesContent":["<script>\n import isFunction from 'lodash-es/isFunction';\n\n import Chip from '../../Chip/Chip.vue';\n\n export default {\n name: 'nav-item',\n\n components: {\n Chip,\n },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Used to display the bubble count, i.e. orders, messages\n */\n badge: {\n type: [Number, String],\n default: 0,\n },\n\n /**\n * The background color of the badge.\n * Currently limited to a subset of brand colors.\n */\n badgeColor: {\n type: String,\n default: 'blue',\n validator: (value) => ['blue', 'red'].includes(value),\n },\n\n /**\n * Private/inherited - Item index.\n */\n index: {\n type: Number,\n required: true,\n },\n /**\n * Private/inherited - Whether the current tab `index` matches `activeIndex`\n */\n isActive: Boolean,\n /**\n * Private/inherited - Whether the item is inside the dropdown\n */\n isDropdown: Boolean,\n /**\n * Used to render an `<a>` tag. Denotes the target href of the link.\n */\n href: {\n default: '',\n type: String,\n },\n /**\n * The nav item label\n */\n label: {\n default: '',\n type: String,\n },\n /**\n * Used to render a `<router-link>`. Denotes the target route of the link.\n * See: https://router.vuejs.org/api/#router-link\n */\n to: {\n default: '',\n type: [Object, String],\n },\n /**\n * Will render a plain text item if true.\n * Accepts a function to ensure the value is up-to-date, such as when it comes from vuex\n */\n disabled: {\n default: false,\n type: [Boolean, Function],\n },\n },\n\n computed: {\n isDisabled() {\n if (isFunction(this.disabled)) {\n return this.disabled();\n }\n\n return this.disabled;\n },\n },\n\n methods: {\n /**\n * Customer Active Class matcher.\n *\n * This attempts to match the URL ignoring the path params.\n */\n hasActiveClass(path) {\n if (path === this.$route.path) {\n return true;\n } else if (this.$route.path.includes(path)) {\n const sliceIndex = (this.$route.path.length - this.$route.path.lastIndexOf('/')) * -1;\n const parentPath = this.$route.path.slice(0, sliceIndex);\n\n return path === parentPath;\n }\n },\n },\n };\n</script>\n\n<template>\n <li v-if=\"isDisabled\" aria-disabled=\"true\" :data-id=\"index\" v-bind=\"$attrs\">\n <span :class=\"[$style.link, { [$style['dropdown-link']]: isDropdown }, $style['is-disabled']]\">{{ label }}</span>\n </li>\n <template v-else>\n <router-link v-if=\"to\" v-slot=\"{ route, navigate }\" custom :to=\"to\">\n <li\n role=\"tab\"\n :data-id=\"index\"\n :class=\"[{ [$style['is-active']]: hasActiveClass(route.path) }, 'cursor-pointer']\"\n v-bind=\"$attrs\"\n @click=\"navigate\"\n >\n <a :class=\"[$style.link, { [$style['dropdown-link']]: isDropdown }]\" :href=\"to?.name || to\">\n {{ label }}\n <Chip v-if=\"badge\" radius=\"pill\" shade=\"main\" size=\"small\" :class=\"$style.badge\" :color-scheme=\"badgeColor\">\n {{ badge }}\n </Chip>\n </a>\n </li>\n </router-link>\n <li\n v-else\n role=\"tab\"\n :aria-selected=\"isActive || null\"\n :class=\"{ [$style['is-active']]: isActive }\"\n :data-id=\"index\"\n v-bind=\"$attrs\"\n >\n <a :class=\"[$style.link, { [$style['dropdown-link']]: isDropdown }]\" :href=\"href\">\n {{ label }}\n <Chip v-if=\"badge\" radius=\"pill\" shade=\"main\" size=\"small\" :class=\"$style.badge\" :color-scheme=\"badgeColor\">\n {{ badge }}\n </Chip>\n </a>\n </li>\n </template>\n</template>\n\n<style lang=\"scss\" module>\n .link {\n border-bottom: border(medium, transparent);\n color: var(--color-ice-700);\n display: block;\n font-family: $font-family-primary;\n font-weight: typo('h3', 'weight');\n line-height: 1.75em;\n padding: space(1) 0;\n transition: color $primary-transition;\n white-space: nowrap;\n\n &:hover,\n &:focus {\n color: var(--color-blue);\n outline: 0;\n text-decoration: none;\n }\n\n .is-active & {\n color: var(--color-blue);\n\n &,\n &:hover,\n &:focus {\n background-color: transparent;\n border-bottom-color: var(--color-blue);\n }\n\n &:focus {\n color: var(--color-blue);\n }\n }\n\n &.is-disabled {\n pointer-events: none;\n color: var(--color-ice-500);\n }\n }\n\n .dropdown-link {\n border-bottom: 0;\n border-radius: $border-radius;\n font-size: typo('button', 'size');\n height: space(4);\n line-height: space(4);\n padding: 0 space(1);\n transition: none;\n\n &:hover,\n &:focus,\n &:active {\n background: var(--color-blue);\n color: var(--color-white);\n text-decoration: none;\n }\n\n .is-active &,\n .is-active &:hover,\n .is-active &:focus {\n color: var(--color-blue);\n }\n }\n\n .badge {\n margin-left: 2px;\n }\n</style>\n","<script>\n import { t } from '../../locale';\n import Dropdown from '../Dropdown/Dropdown.vue';\n import Icon from '../Icon/Icon.vue';\n import NavItem from './components/NavItem.vue';\n\n export { default as NavItem } from './components/NavItem.vue';\n\n export default {\n name: 'll-page-navigation',\n\n components: {\n 'll-dropdown': Dropdown,\n 'll-icon': Icon,\n NavItem,\n },\n\n props: {\n /**\n * Index of active tab (zero-based)\n */\n activeIndex: {\n type: Number,\n default: 0,\n },\n /**\n * Array of tabs. A `tab` is an object containing a `label` and either an `href` | `to`\n */\n items: {\n type: Array,\n default: () => [],\n },\n },\n\n data() {\n return {\n hasIntersectionObserver: 'IntersectionObserver' in window,\n observer: undefined,\n overflowIds: [],\n toggleWidth: 0,\n moreText: t('ll.pageNavigation.more'),\n };\n },\n\n watch: {\n items() {\n this.destroyObserver();\n this.observe();\n },\n },\n\n mounted() {\n this.observe();\n },\n\n activated() {\n this.observe();\n },\n\n deactivated() {\n this.destroyObserver();\n },\n\n beforeUnmount() {\n this.destroyObserver();\n },\n\n methods: {\n /**\n * Event emitted when a tab is clicked, with the target tab index.\n */\n observe() {\n if (this.hasIntersectionObserver) {\n const tabs = Array.from(this.$refs.tabList.children);\n\n const options = {\n root: this.$refs.tabList,\n rootMargin: '0px 0px 0px 0px',\n threshold: Array.from({ length: 100 }).map((v, i) => (i + 1) / 100),\n };\n\n this.observer = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n const dataId = entry.target.getAttribute('data-id');\n\n /**\n * Check for partial intersection.\n * Zooming out can result in ratio of approx 0.984\n * Anything higher will result in nav items disappearing\n */\n if (entry.intersectionRatio > 0.96) {\n // show tab, hide in dropdown\n if (this.overflowIds.includes(dataId)) {\n this.overflowIds.splice(this.overflowIds.indexOf(dataId), 1);\n }\n } else {\n // hide tab, show in dropdown\n if (!this.overflowIds.includes(dataId)) {\n this.overflowIds.push(dataId);\n }\n }\n });\n }, options);\n\n tabs.forEach((element) => {\n this.observer.observe(element);\n });\n\n this.toggleWidth = this.$refs.toggle.$el?.getBoundingClientRect().width;\n }\n },\n\n destroyObserver() {\n if (this.observer) {\n this.observer.disconnect();\n this.observer = undefined;\n }\n },\n },\n };\n</script>\n\n<template>\n <div class=\"container\">\n <nav :class=\"[$style.tabs, { [$style['is-scrollable']]: !hasIntersectionObserver }]\">\n <ul\n ref=\"tabList\"\n :class=\"$style.list\"\n :style=\"{\n width: `calc(100% - ${toggleWidth}px)`,\n }\"\n >\n <NavItem\n v-for=\"(item, index) in items\"\n :key=\"index\"\n :class=\"[$style.item, { [$style['is-invisible']]: overflowIds.includes(`${index}`) }]\"\n :badge=\"item.badge\"\n :badge-color=\"item.badgeColor\"\n :data-id=\"index\"\n :href=\"item.href\"\n :index=\"index\"\n :is-active=\"index === activeIndex\"\n :label=\"item.label\"\n :to=\"item.to\"\n :disabled=\"item.disabled\"\n />\n </ul>\n <ll-dropdown\n ref=\"toggle\"\n :class=\"[$style.dropdown, { [$style['is-visible']]: overflowIds.length }]\"\n :offset=\"{ x: -1 }\"\n >\n <template #toggle=\"{ toggle }\">\n <button\n aria-haspopup=\"true\"\n :class=\"[$style.link, $style['dropdown-toggle']]\"\n type=\"button\"\n aria-expanded=\"false\"\n @click=\"toggle\"\n >\n {{ moreText }}\n <ll-icon name=\"caret-down\" :class=\"$style['dropdown-icon']\" />\n </button>\n </template>\n\n <template #default>\n <ul :class=\"$style['dropdown-list']\">\n <NavItem\n v-for=\"(item, index) in items\"\n :key=\"index\"\n :class=\"{ hidden: !overflowIds.includes(`${index}`) }\"\n :href=\"item.href\"\n :index=\"index\"\n :is-active=\"index === activeIndex\"\n :is-dropdown=\"true\"\n :label=\"item.label\"\n :to=\"item.to\"\n :disabled=\"item?.disabled ?? false\"\n />\n </ul>\n </template>\n </ll-dropdown>\n </nav>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n .link {\n border-bottom: border(medium, transparent);\n color: var(--color-ice-700);\n display: block;\n font-family: $font-family-primary;\n font-weight: typo('h3', 'weight');\n line-height: 1.75em;\n padding: space(1) 0;\n transition: color $secondary-transition;\n white-space: nowrap;\n\n &:hover,\n &:focus {\n color: var(--color-blue);\n outline: 0;\n text-decoration: none;\n }\n\n .is-active & {\n color: var(--color-blue);\n\n &,\n &:hover,\n &:focus {\n background-color: transparent;\n border-bottom-color: var(--color-blue);\n }\n\n &:focus {\n color: var(--color-blue);\n }\n }\n }\n\n .tabs {\n position: relative;\n\n &.is-scrollable {\n margin-right: 0;\n max-width: 100%;\n overflow: auto;\n }\n }\n\n .list {\n display: inline-flex;\n list-style: none;\n overflow: hidden;\n padding: 0;\n position: relative;\n }\n\n .item {\n padding: 0 space(2) 0 0;\n\n @include breakpoint('md') {\n padding-right: space(3);\n }\n\n &.is-active {\n transition: none !important;\n }\n }\n\n .is-invisible {\n visibility: hidden;\n }\n\n .tabs .dropdown {\n display: inline-flex;\n height: 100%;\n position: absolute;\n right: 0;\n top: 0;\n visibility: hidden;\n\n &.is-visible {\n visibility: visible;\n }\n }\n\n .dropdown-list {\n @include elevation('high');\n\n background: var(--color-white);\n border: none;\n border-radius: $border-radius;\n display: block;\n list-style: none;\n margin-top: 0;\n min-width: 140px;\n padding: space(1);\n position: static;\n right: -(space(1));\n top: 100%;\n z-index: z-index(control);\n\n .is-open & {\n display: block;\n }\n\n &::before {\n @include corner;\n\n border-left: border(thin, var(--color-blue));\n border-top: border(thin, var(--color-blue));\n content: '';\n display: none;\n right: space(2);\n }\n }\n\n .dropdown-toggle {\n background: transparent;\n border: 0;\n border-bottom: border(medium, transparent);\n color: var(--color-blue);\n display: flex;\n padding-left: space(1);\n\n &:hover,\n &:focus {\n color: var(--color-blue-hover);\n }\n\n .has-active & {\n border-bottom-color: var(--color-blue);\n }\n }\n\n .dropdown-icon {\n height: icon('default', 'height');\n position: relative;\n top: 1px;\n vertical-align: bottom;\n width: icon('default', 'width');\n }\n</style>\n"],"names":["_sfc_main","Chip","value","isFunction","path","sliceIndex","parentPath","$options","_openBlock","_createElementBlock","_mergeProps","$props","_ctx","_createElementVNode","_normalizeClass","_Fragment","_createBlock","_component_router_link","route","navigate","_a","_createTextVNode","_toDisplayString","_component_Chip","Dropdown","Icon","NavItem","t","tabs","options","v","i","entries","entry","dataId","element","_hoisted_1","$data","_normalizeStyle","_renderList","item","index","_component_NavItem","_createVNode","_component_ll_dropdown","_withCtx","toggle","_component_ll_icon"],"mappings":"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"}
1
+ {"version":3,"file":"PageNavigation.js","sources":["../src/components/PageNavigation/PageNavigation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import logger from '@leaflink/snitch';\n import kebabCase from 'lodash-es/kebabCase';\n import { onMounted, ref, watch } from 'vue';\n import { RouteLocationRaw, useRoute, useRouter } from 'vue-router';\n\n import Tab, { type TabProps } from '../Tab/Tab.vue';\n import Tabs from '../Tabs/Tabs.vue';\n\n defineOptions({\n name: 'll-page-navigation',\n });\n\n export interface NavItem extends Omit<TabProps, 'value'> {\n /**\n * The tab's label\n */\n label: string;\n\n /**\n * The tab's label\n */\n value?: string;\n }\n\n export interface PageNavigationProps {\n /**\n * Index of active tab (zero-based)\n * @deprecated Use v-model instead.\n */\n activeIndex?: number | string;\n\n /**\n * The currently active tab value\n */\n modelValue?: string;\n\n /**\n * Array of tabs. A `tab` is an object containing a `label` and either an `href` | `to`\n */\n items: NavItem[];\n }\n\n const props = withDefaults(defineProps<PageNavigationProps>(), {\n activeIndex: undefined,\n modelValue: '',\n });\n\n const emit =\n defineEmits<{\n /**\n * Emits the current active nav value\n */\n (e: 'update:modelValue', activeTab: string): void;\n\n /**\n * Emits the current active nav index\n * @deprecated - Use v-model instead.\n */\n (e: 'change', activeNavIndex: number): void;\n }>();\n\n if (props.activeIndex) {\n logger.info('The `activeIndex` prop is deprecated. Use `v-model` instead.');\n }\n\n const route = useRoute();\n const router = useRouter();\n\n // this ref is needed to keep track of the active tab even if v-model is not passed\n const activeTab = ref('');\n\n function onUpdateActiveTab(newActiveTab: string) {\n if (newActiveTab === activeTab.value) return;\n\n activeTab.value = newActiveTab;\n emit('update:modelValue', newActiveTab);\n }\n\n // TODO: Remove this once activeIndex is removed\n watch(() => props.modelValue, (newValue, oldValue) => {\n if (oldValue === newValue) return;\n\n const activeNavItemIndex = props.items.findIndex((item) => kebabCase(item.label) === newValue);\n\n emit('change', activeNavItemIndex);\n });\n\n onMounted(() => {\n if (!props.items.length) return;\n\n // TODO: Remove this once activeIndex is removed\n if (props.activeIndex !== undefined) {\n const activeTabItem = props.items[props.activeIndex];\n\n onUpdateActiveTab(kebabCase(activeTabItem.label));\n\n return;\n }\n\n if (props.modelValue) {\n onUpdateActiveTab(props.modelValue);\n return;\n }\n\n if (!router) return;\n\n const itemMatchingRoute = props.items.find(item => {\n if (item?.disabled || (!item?.to && !item?.href)) return;\n\n const { path } = router.resolve(item?.to as RouteLocationRaw || item?.href as string);\n\n if (path === route.path) {\n return true;\n }\n\n if (!route.path.includes(path)) return;\n\n const sliceIndex = (route.path.length - route.path.lastIndexOf('/')) * -1;\n const parentPath = route.path.slice(0, sliceIndex);\n\n return path === parentPath;\n });\n\n if (!itemMatchingRoute) return;\n\n onUpdateActiveTab(itemMatchingRoute?.value || kebabCase(itemMatchingRoute.label));\n });\n</script>\n\n<template>\n <nav class=\"root stash-page-navigation container\" data-test=\"stash-page-navigation\">\n <Tabs :active-tab=\"activeTab\" @update:active-tab=\"onUpdateActiveTab\">\n <Tab\n v-for=\"(item, index) in props.items\"\n :key=\"item.label\"\n :value=\"item?.value || kebabCase(item.label)\"\n :to=\"item.to\"\n :href=\"item.href\"\n :badge=\"item.badge\"\n :disabled=\"item.disabled\"\n :data-id=\"index\"\n >\n {{ item.label }}\n </Tab>\n </Tabs>\n </nav>\n</template>\n"],"names":["props","logger","route","useRoute","router","useRouter","activeTab","ref","onUpdateActiveTab","newActiveTab","emit","watch","newValue","oldValue","activeNavItemIndex","item","kebabCase","onMounted","activeTabItem","itemMatchingRoute","path","sliceIndex","parentPath"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DE,IAAIA,EAAM,eACRC,EAAO,KAAK,8DAA8D;AAG5E,UAAMC,IAAQC,KACRC,IAASC,KAGTC,IAAYC,EAAI,EAAE;AAExB,aAASC,EAAkBC,GAAsB;AAC/C,MAAIA,MAAiBH,EAAU,UAE/BA,EAAU,QAAQG,GAClBC,EAAK,qBAAqBD,CAAY;AAAA,IACxC;AAGA,WAAAE,EAAM,MAAMX,EAAM,YAAY,CAACY,GAAUC,MAAa;AACpD,UAAIA,MAAaD;AAAU;AAErB,YAAAE,IAAqBd,EAAM,MAAM,UAAU,CAACe,MAASC,EAAUD,EAAK,KAAK,MAAMH,CAAQ;AAE7F,MAAAF,EAAK,UAAUI,CAAkB;AAAA,IAAA,CAClC,GAEDG,EAAU,MAAM;AACV,UAAA,CAACjB,EAAM,MAAM;AAAQ;AAGrB,UAAAA,EAAM,gBAAgB,QAAW;AACnC,cAAMkB,IAAgBlB,EAAM,MAAMA,EAAM,WAAW;AAEjC,QAAAQ,EAAAQ,EAAUE,EAAc,KAAK,CAAC;AAEhD;AAAA,MACF;AAEA,UAAIlB,EAAM,YAAY;AACpB,QAAAQ,EAAkBR,EAAM,UAAU;AAClC;AAAA,MACF;AAEA,UAAI,CAACI;AAAQ;AAEb,YAAMe,IAAoBnB,EAAM,MAAM,KAAK,CAAQe,MAAA;AACjD,YAAIA,KAAA,QAAAA,EAAM,YAAa,EAACA,KAAA,QAAAA,EAAM,OAAM,EAACA,KAAA,QAAAA,EAAM;AAAO;AAE5C,cAAA,EAAE,MAAAK,EAAS,IAAAhB,EAAO,SAAQW,KAAA,gBAAAA,EAAM,QAA0BA,KAAA,gBAAAA,EAAM,KAAc;AAEhF,YAAAK,MAASlB,EAAM;AACV,iBAAA;AAGT,YAAI,CAACA,EAAM,KAAK,SAASkB,CAAI;AAAG;AAE1B,cAAAC,KAAcnB,EAAM,KAAK,SAASA,EAAM,KAAK,YAAY,GAAG,KAAK,IACjEoB,IAAapB,EAAM,KAAK,MAAM,GAAGmB,CAAU;AAEjD,eAAOD,MAASE;AAAA,MAAA,CACjB;AAED,MAAKH,KAELX,GAAkBW,KAAA,gBAAAA,EAAmB,UAASH,EAAUG,EAAkB,KAAK,CAAC;AAAA,IAAA,CACjF;;;;;;;;;;;;;;;;;;;;;;;;;;"}