slippers-ui 3.1.24 → 3.1.26-alpha

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,6 +1,6 @@
1
- import { defineComponent as C, computed as y, createElementBlock as i, openBlock as s, mergeProps as j, renderSlot as b, normalizeClass as m, createElementVNode as h, createBlock as R, resolveDynamicComponent as F, normalizeStyle as J, withCtx as N, createCommentVNode as M, ref as I, onMounted as W, nextTick as oe, onUnmounted as Q, createVNode as k, unref as G, Fragment as T, renderList as z, withModifiers as Z, toDisplayString as L, createTextVNode as B, resolveComponent as se, withDirectives as D, vShow as U, normalizeProps as ne, guardReactiveProps as le, onBeforeUnmount as X, onBeforeMount as ie, vModelSelect as re } from "vue";
2
- import { _ as w, C as Y, a as x, b as ee, c as de } from "./chunks/ChevronLgUp-HZ_-4Y4K.js";
3
- const ce = ["href"], ue = /* @__PURE__ */ C({
1
+ import { defineComponent as L, computed as $, openBlock as s, createElementBlock as r, mergeProps as H, renderSlot as b, normalizeClass as _, createElementVNode as v, createBlock as O, resolveDynamicComponent as j, normalizeStyle as Z, withCtx as N, createCommentVNode as M, ref as k, onMounted as P, onUnmounted as J, createVNode as y, unref as G, Fragment as T, renderList as z, withModifiers as q, toDisplayString as w, createTextVNode as B, resolveComponent as ne, withDirectives as F, vShow as D, normalizeProps as se, guardReactiveProps as le, onBeforeUnmount as K, onBeforeMount as Q, watch as U, vModelSelect as ie } from "vue";
2
+ import { _ as S, C as X, a as Y, b as x, c as re } from "./chunks/ChevronLgUp-EczI5oF8.js";
3
+ const de = ["href"], ce = /* @__PURE__ */ L({
4
4
  __name: "SlpButton",
5
5
  props: {
6
6
  disabled: { type: Boolean },
@@ -8,135 +8,135 @@ const ce = ["href"], ue = /* @__PURE__ */ C({
8
8
  href: {}
9
9
  },
10
10
  setup(p) {
11
- const e = p, n = y(() => e.disabled ?? !1), l = y(() => e.variant ?? "primary");
12
- y(() => e.href ?? "");
13
- const a = y(() => {
14
- let o = [`slp-btn-${l.value}`];
15
- return n.value && o.push("slp-btn-disabled"), o.join(" ");
11
+ const e = p, o = $(() => e.disabled ?? !1), i = $(() => e.variant ?? "primary");
12
+ $(() => e.href ?? "");
13
+ const a = $(() => {
14
+ let n = [`slp-btn-${i.value}`];
15
+ return o.value && n.push("slp-btn-disabled"), n.join(" ");
16
16
  });
17
- return (o, d) => e.href ? (s(), i("a", j({ key: 0 }, o.$attrs, {
17
+ return (n, d) => e.href ? (s(), r("a", H({ key: 0 }, n.$attrs, {
18
18
  class: ["slp-btn", a.value],
19
19
  href: e.href
20
20
  }), [
21
- b(o.$slots, "default", {}, void 0, !0)
22
- ], 16, ce)) : (s(), i("button", j({ key: 1 }, o.$attrs, {
21
+ b(n.$slots, "default", {}, void 0, !0)
22
+ ], 16, de)) : (s(), r("button", H({ key: 1 }, n.$attrs, {
23
23
  class: ["slp-btn", a.value],
24
24
  type: "button"
25
25
  }), [
26
- b(o.$slots, "default", {}, void 0, !0)
26
+ b(n.$slots, "default", {}, void 0, !0)
27
27
  ], 16));
28
28
  }
29
- }), K = /* @__PURE__ */ w(ue, [["__scopeId", "data-v-56e2df5f"]]), pe = /* @__PURE__ */ C({
29
+ }), W = /* @__PURE__ */ S(ce, [["__scopeId", "data-v-56e2df5f"]]), ue = /* @__PURE__ */ L({
30
30
  __name: "SlpColumn",
31
31
  props: {
32
32
  cols: {},
33
33
  size: {}
34
34
  },
35
35
  setup(p) {
36
- const e = p, n = y(() => e.cols ?? null), l = y(() => e.size ?? "md"), a = y(() => n.value ? `slp-col-${l.value}-${n.value}` : `slp-col-${l.value}`);
37
- return (o, d) => (s(), i("div", {
38
- class: m(a.value)
36
+ const e = p, o = $(() => e.cols ?? null), i = $(() => e.size ?? "md"), a = $(() => o.value ? `slp-col-${i.value}-${o.value}` : `slp-col-${i.value}`);
37
+ return (n, d) => (s(), r("div", {
38
+ class: _(a.value)
39
39
  }, [
40
- b(o.$slots, "default", {}, void 0, !0)
40
+ b(n.$slots, "default", {}, void 0, !0)
41
41
  ], 2));
42
42
  }
43
- }), Ct = /* @__PURE__ */ w(pe, [["__scopeId", "data-v-00b68f22"]]), ve = {
43
+ }), It = /* @__PURE__ */ S(ue, [["__scopeId", "data-v-00b68f22"]]), pe = {
44
44
  key: 0,
45
45
  class: "slp-full-light-purple-background"
46
46
  }, fe = {
47
47
  key: 1,
48
48
  class: "slp-charcoal-grey-background"
49
- }, he = {
49
+ }, ve = {
50
50
  key: 2,
51
51
  class: "slp-gradient-background"
52
- }, ge = {
52
+ }, he = {
53
53
  key: 3,
54
54
  class: "slp-full-gradient-background"
55
55
  }, me = {
56
56
  key: 4,
57
57
  class: "slp-full-charcoal-background"
58
- }, _e = {
58
+ }, ge = {
59
59
  key: 5,
60
60
  class: "slp-partial-charcoal-background"
61
- }, be = {
61
+ }, _e = {
62
62
  key: 6,
63
63
  class: "slp-half-grey-background"
64
- }, ye = {
64
+ }, be = {
65
65
  key: 7,
66
66
  class: "slp-partial-white-background"
67
- }, $e = {
67
+ }, ye = {
68
68
  key: 8,
69
69
  class: "slp-partial-grey-background"
70
- }, ke = /* @__PURE__ */ C({
70
+ }, $e = /* @__PURE__ */ L({
71
71
  __name: "SlpContainer",
72
72
  props: {
73
73
  fluid: { type: Boolean },
74
74
  variant: {}
75
75
  },
76
76
  setup(p) {
77
- const e = p, n = y(() => e.fluid ?? !1), l = y(() => e.variant ?? "white"), a = y(() => n.value ? "fluid" : "");
78
- return (o, d) => l.value === "light-purple-100" ? (s(), i("div", ve, [
79
- h("div", {
80
- class: m(["slp-container", a.value])
77
+ const e = p, o = $(() => e.fluid ?? !1), i = $(() => e.variant ?? "white"), a = $(() => o.value ? "fluid" : "");
78
+ return (n, d) => i.value === "light-purple-100" ? (s(), r("div", pe, [
79
+ v("div", {
80
+ class: _(["slp-container", a.value])
81
81
  }, [
82
- b(o.$slots, "default", {}, void 0, !0)
82
+ b(n.$slots, "default", {}, void 0, !0)
83
83
  ], 2)
84
- ])) : l.value === "grey-100" ? (s(), i("div", fe, [
85
- h("div", {
86
- class: m(["slp-container", a.value])
84
+ ])) : i.value === "grey-100" ? (s(), r("div", fe, [
85
+ v("div", {
86
+ class: _(["slp-container", a.value])
87
87
  }, [
88
- b(o.$slots, "default", {}, void 0, !0)
88
+ b(n.$slots, "default", {}, void 0, !0)
89
89
  ], 2)
90
- ])) : l.value === "gradient" ? (s(), i("div", he, [
91
- h("div", {
92
- class: m(["slp-container", a.value])
90
+ ])) : i.value === "gradient" ? (s(), r("div", ve, [
91
+ v("div", {
92
+ class: _(["slp-container", a.value])
93
93
  }, [
94
- b(o.$slots, "default", {}, void 0, !0)
94
+ b(n.$slots, "default", {}, void 0, !0)
95
95
  ], 2)
96
- ])) : l.value === "gradient-full" ? (s(), i("div", ge, [
97
- h("div", {
98
- class: m(["slp-container", a.value])
96
+ ])) : i.value === "gradient-full" ? (s(), r("div", he, [
97
+ v("div", {
98
+ class: _(["slp-container", a.value])
99
99
  }, [
100
- b(o.$slots, "default", {}, void 0, !0)
100
+ b(n.$slots, "default", {}, void 0, !0)
101
101
  ], 2)
102
- ])) : l.value === "charcoal-100" ? (s(), i("div", me, [
103
- h("div", {
104
- class: m(["slp-container", a.value])
102
+ ])) : i.value === "charcoal-100" ? (s(), r("div", me, [
103
+ v("div", {
104
+ class: _(["slp-container", a.value])
105
105
  }, [
106
- b(o.$slots, "default", {}, void 0, !0)
106
+ b(n.$slots, "default", {}, void 0, !0)
107
107
  ], 2)
108
- ])) : l.value === "charcoal-75" ? (s(), i("div", _e, [
109
- h("div", {
110
- class: m(["slp-container", a.value])
108
+ ])) : i.value === "charcoal-75" ? (s(), r("div", ge, [
109
+ v("div", {
110
+ class: _(["slp-container", a.value])
111
111
  }, [
112
- b(o.$slots, "default", {}, void 0, !0)
112
+ b(n.$slots, "default", {}, void 0, !0)
113
113
  ], 2)
114
- ])) : l.value === "grey-50" ? (s(), i("div", be, [
115
- h("div", {
116
- class: m(["slp-container", a.value])
114
+ ])) : i.value === "grey-50" ? (s(), r("div", _e, [
115
+ v("div", {
116
+ class: _(["slp-container", a.value])
117
117
  }, [
118
- b(o.$slots, "default", {}, void 0, !0)
118
+ b(n.$slots, "default", {}, void 0, !0)
119
119
  ], 2)
120
- ])) : l.value === "white-75" ? (s(), i("div", ye, [
121
- h("div", {
122
- class: m(["slp-container", a.value])
120
+ ])) : i.value === "white-75" ? (s(), r("div", be, [
121
+ v("div", {
122
+ class: _(["slp-container", a.value])
123
123
  }, [
124
- b(o.$slots, "default", {}, void 0, !0)
124
+ b(n.$slots, "default", {}, void 0, !0)
125
125
  ], 2)
126
- ])) : l.value === "grey-75" ? (s(), i("div", $e, [
127
- h("div", {
128
- class: m(["slp-container", a.value])
126
+ ])) : i.value === "grey-75" ? (s(), r("div", ye, [
127
+ v("div", {
128
+ class: _(["slp-container", a.value])
129
129
  }, [
130
- b(o.$slots, "default", {}, void 0, !0)
130
+ b(n.$slots, "default", {}, void 0, !0)
131
131
  ], 2)
132
- ])) : (s(), i("div", {
132
+ ])) : (s(), r("div", {
133
133
  key: 9,
134
- class: m(["slp-container", a.value])
134
+ class: _(["slp-container", a.value])
135
135
  }, [
136
- b(o.$slots, "default", {}, void 0, !0)
136
+ b(n.$slots, "default", {}, void 0, !0)
137
137
  ], 2));
138
138
  }
139
- }), te = /* @__PURE__ */ w(ke, [["__scopeId", "data-v-e594efe8"]]), we = /* @__PURE__ */ C({
139
+ }), ee = /* @__PURE__ */ S($e, [["__scopeId", "data-v-67a0761e"]]), ke = /* @__PURE__ */ L({
140
140
  __name: "SlpIcon",
141
141
  props: {
142
142
  size: {
@@ -156,39 +156,39 @@ const ce = ["href"], ue = /* @__PURE__ */ C({
156
156
  }
157
157
  },
158
158
  setup(p) {
159
- const e = p, n = y(() => {
159
+ const e = p, o = $(() => {
160
160
  const a = ["slp-icon"];
161
161
  return typeof e.size == "string" && isNaN(Number(e.size)) && a.push(`slp-icon--size-${e.size}`), e.color && !e.color.startsWith("#") && a.push(`slp-icon--color-${e.color}`), a;
162
- }), l = y(() => {
163
- var o;
162
+ }), i = $(() => {
163
+ var n;
164
164
  const a = {};
165
- if ((o = e.color) != null && o.startsWith("#") && (a.color = e.color, a.fill = e.color), typeof e.size == "number" || !isNaN(Number(e.size))) {
165
+ if ((n = e.color) != null && n.startsWith("#") && (a.color = e.color, a.fill = e.color), typeof e.size == "number" || !isNaN(Number(e.size))) {
166
166
  const d = typeof e.size == "number" ? e.size : Number(e.size);
167
167
  a.width = `${d}px`, a.height = `${d}px`;
168
168
  }
169
169
  return a;
170
170
  });
171
- return (a, o) => {
172
- var d, r;
173
- return s(), R(F(p.icon), {
174
- class: m(["slp-icon", n.value]),
175
- style: J(l.value),
171
+ return (a, n) => {
172
+ var d, l;
173
+ return s(), O(j(p.icon), {
174
+ class: _(["slp-icon", o.value]),
175
+ style: Z(i.value),
176
176
  role: "img",
177
177
  "aria-hidden": "true",
178
- "data-icon-name": ((r = (d = p.icon) == null ? void 0 : d.__docgenInfo) == null ? void 0 : r.displayName) || ""
178
+ "data-icon-name": ((l = (d = p.icon) == null ? void 0 : d.__docgenInfo) == null ? void 0 : l.displayName) || ""
179
179
  }, null, 8, ["class", "style", "data-icon-name"]);
180
180
  };
181
181
  }
182
- }), P = /* @__PURE__ */ w(we, [["__scopeId", "data-v-b82aeda9"]]), Se = {}, Le = { class: "slp-row" };
182
+ }), R = /* @__PURE__ */ S(ke, [["__scopeId", "data-v-b82aeda9"]]), we = {}, Se = { class: "slp-row" };
183
183
  function Ce(p, e) {
184
- return s(), i("div", Le, [
184
+ return s(), r("div", Se, [
185
185
  b(p.$slots, "default", {}, void 0, !0)
186
186
  ]);
187
187
  }
188
- const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f"]]), Ie = {
188
+ const Nt = /* @__PURE__ */ S(we, [["render", Ce], ["__scopeId", "data-v-adc8d02f"]]), Le = {
189
189
  key: 0,
190
190
  class: "arrow-symbol"
191
- }, Ne = /* @__PURE__ */ C({
191
+ }, Ie = /* @__PURE__ */ L({
192
192
  __name: "SlpTypography",
193
193
  props: {
194
194
  variant: {},
@@ -217,21 +217,21 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
217
217
  "arrow",
218
218
  "quotes",
219
219
  "emphasis"
220
- ], n = ["span", "h1", "h2", "h3", "h4", "h5", "p", "div"], l = p, a = y(() => e.includes(l.variant || "") ? l.variant : "body1"), o = y(() => n.includes(l.tag || "") ? l.tag : "span"), d = y(() => `slp-text-${a.value}`);
221
- return (r, c) => (s(), R(F(o.value), {
222
- class: m(d.value)
220
+ ], o = ["span", "h1", "h2", "h3", "h4", "p", "div"], i = p, a = $(() => e.includes(i.variant || "") ? i.variant : "body1"), n = $(() => o.includes(i.tag || "") ? i.tag : "span"), d = $(() => `slp-text-${a.value}`);
221
+ return (l, c) => (s(), O(j(n.value), {
222
+ class: _(d.value)
223
223
  }, {
224
224
  default: N(() => [
225
- b(r.$slots, "default", {}, void 0, !0),
226
- a.value === "arrow" ? (s(), i("span", Ie, "→")) : M("", !0)
225
+ b(l.$slots, "default", {}, void 0, !0),
226
+ a.value === "arrow" ? (s(), r("span", Le, "→")) : M("", !0)
227
227
  ]),
228
228
  _: 3
229
229
  }, 8, ["class"]));
230
230
  }
231
- }), A = /* @__PURE__ */ w(Ne, [["__scopeId", "data-v-64ad2128"]]), Te = {
231
+ }), A = /* @__PURE__ */ S(Ie, [["__scopeId", "data-v-fba90f83"]]), Ne = {
232
232
  key: 0,
233
233
  class: "dropdown-menu"
234
- }, ze = ["onClick"], Ee = { class: "side-navigation" }, Ve = ["data-ga-name", "onClick"], Me = /* @__PURE__ */ C({
234
+ }, Te = ["onClick"], ze = { class: "side-navigation" }, Me = ["data-ga-name", "onClick"], Ee = /* @__PURE__ */ L({
235
235
  __name: "SlpSideNavigation",
236
236
  props: {
237
237
  position: {
@@ -248,100 +248,97 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
248
248
  }
249
249
  },
250
250
  setup(p) {
251
- const e = p, n = I(null), l = (u) => {
252
- n.value && !n.value.contains(u.target) && (r.value = !1);
253
- }, a = I(null), o = I(null);
251
+ const e = p, o = k(null), i = (f) => {
252
+ o.value && !o.value.contains(f.target) && (l.value = !1);
253
+ }, a = k(null), n = k(null);
254
254
  let d = null;
255
- const r = I(!1), c = (u) => {
256
- const v = document.getElementById(u);
257
- v && v.scrollIntoView({ behavior: "smooth" }), r.value = !1;
255
+ const l = k(!1), c = (f) => {
256
+ const g = document.getElementById(f);
257
+ g && g.scrollIntoView({ behavior: "smooth" }), l.value = !1;
258
258
  }, t = () => {
259
- if (!o.value) return;
260
- const u = e.navigationItems.map((v) => document.getElementById(v.id)).filter((v) => v !== null);
259
+ if (!n.value) return;
260
+ const f = e.navigationItems.map((h) => document.getElementById(h.id)).filter((h) => h !== null), g = (window.innerHeight - 140 - 1) * -1;
261
261
  d = new IntersectionObserver(
262
- (v) => {
263
- v.forEach((g) => {
264
- if (g.isIntersecting) {
265
- const f = g.target.getAttribute("id");
266
- f && (a.value = f);
262
+ (h) => {
263
+ h.forEach((u) => {
264
+ if (u.isIntersecting) {
265
+ const m = u.target.getAttribute("id");
266
+ m && (a.value = m);
267
267
  }
268
268
  });
269
269
  },
270
270
  {
271
- rootMargin: "0px 0px -40% 0px",
272
- // When the 40% of the content is in the viewport the menu will be highlighted
273
- threshold: Array.from({ length: 99 }, (v, g) => (g + 2) / 100)
271
+ rootMargin: `-120px 0px ${g}px 0px`,
272
+ threshold: Array.from({ length: 99 }, (h, u) => (u + 2) / 100)
274
273
  }
275
- ), u.forEach((v) => d == null ? void 0 : d.observe(v));
274
+ ), f.forEach((h) => d == null ? void 0 : d.observe(h));
276
275
  };
277
- return W(() => {
278
- document.addEventListener("click", l), oe(() => {
279
- t();
280
- });
281
- }), Q(() => {
282
- d && d.disconnect(), document.removeEventListener("click", l);
283
- }), (u, v) => (s(), i("div", {
284
- class: m([
276
+ return P(() => {
277
+ t(), document.addEventListener("click", i);
278
+ }), J(() => {
279
+ d && d.disconnect(), document.removeEventListener("click", i);
280
+ }), (f, g) => (s(), r("div", {
281
+ class: _([
285
282
  "side-navigation-layout",
286
283
  `side-navigation-layout--${e.position}`,
287
284
  { "side-navigation--dark": e.darkMode }
288
285
  ])
289
286
  }, [
290
- h("div", {
287
+ v("div", {
291
288
  ref_key: "dropdownRef",
292
- ref: n,
289
+ ref: o,
293
290
  class: "side-navigation-dropdown"
294
291
  }, [
295
- h("button", {
292
+ v("button", {
296
293
  class: "dropdown-toggle",
297
- onClick: v[0] || (v[0] = (g) => r.value = !r.value)
294
+ onClick: g[0] || (g[0] = (h) => l.value = !l.value)
298
295
  }, [
299
- v[1] || (v[1] = h("span", null, "Jump to a section", -1)),
300
- k(P, {
301
- icon: r.value ? G(Y) : G(x),
296
+ g[1] || (g[1] = v("span", null, "Jump to a section", -1)),
297
+ y(R, {
298
+ icon: l.value ? G(X) : G(Y),
302
299
  color: "black",
303
300
  size: "sm"
304
301
  }, null, 8, ["icon"])
305
302
  ]),
306
- r.value ? (s(), i("ul", Te, [
307
- (s(!0), i(T, null, z(e.navigationItems, (g) => (s(), i("li", {
308
- key: g.id,
303
+ l.value ? (s(), r("ul", Ne, [
304
+ (s(!0), r(T, null, z(e.navigationItems, (h) => (s(), r("li", {
305
+ key: h.id,
309
306
  class: "dropdown-item"
310
307
  }, [
311
- h("a", {
308
+ v("a", {
312
309
  href: "#",
313
310
  class: "dropdown-link",
314
- onClick: Z((f) => c(g.id), ["prevent"])
315
- }, L(g.text), 9, ze)
311
+ onClick: q((u) => c(h.id), ["prevent"])
312
+ }, w(h.text), 9, Te)
316
313
  ]))), 128))
317
314
  ])) : M("", !0)
318
315
  ], 512),
319
- h("nav", Ee, [
320
- h("ul", null, [
321
- (s(!0), i(T, null, z(e.navigationItems, (g) => (s(), i("li", {
322
- key: g.id,
316
+ v("nav", ze, [
317
+ v("ul", null, [
318
+ (s(!0), r(T, null, z(e.navigationItems, (h) => (s(), r("li", {
319
+ key: h.id,
323
320
  class: "side-navigation__item"
324
321
  }, [
325
- h("a", {
322
+ v("a", {
326
323
  href: "#",
327
- class: m(["side-navigation__link", { "side-navigation__link--active": a.value === g.id }]),
328
- "data-ga-name": g.text,
324
+ class: _(["side-navigation__link", { "side-navigation__link--active": a.value === h.id }]),
325
+ "data-ga-name": h.text,
329
326
  "data-ga-location": "side anchor",
330
- onClick: Z((f) => c(g.id), ["prevent"])
331
- }, L(g.text), 11, Ve)
327
+ onClick: q((u) => c(h.id), ["prevent"])
328
+ }, w(h.text), 11, Me)
332
329
  ]))), 128))
333
330
  ])
334
331
  ]),
335
- h("div", {
332
+ v("div", {
336
333
  ref_key: "slotContentRef",
337
- ref: o,
334
+ ref: n,
338
335
  class: "side-navigation-content"
339
336
  }, [
340
- b(u.$slots, "default", {}, void 0, !0)
337
+ b(f.$slots, "default", {}, void 0, !0)
341
338
  ], 512)
342
339
  ], 2));
343
340
  }
344
- }), Nt = /* @__PURE__ */ w(Me, [["__scopeId", "data-v-68f8d83f"]]), Ge = ["for"], Be = ["name", "value", "id", "checked", "disabled"], Oe = /* @__PURE__ */ C({
341
+ }), Tt = /* @__PURE__ */ S(Ee, [["__scopeId", "data-v-76494345"]]), Ge = ["for"], Be = ["name", "value", "id", "checked", "disabled"], Ve = /* @__PURE__ */ L({
345
342
  __name: "SlpRadioButton",
346
343
  props: {
347
344
  option: {},
@@ -350,31 +347,31 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
350
347
  },
351
348
  emits: ["update:modelValue"],
352
349
  setup(p, { emit: e }) {
353
- const n = e, l = (a) => {
354
- const o = a.target;
355
- n("update:modelValue", o.value);
350
+ const o = e, i = (a) => {
351
+ const n = a.target;
352
+ o("update:modelValue", n.value);
356
353
  };
357
- return (a, o) => {
358
- var d, r, c;
359
- return s(), i("label", {
354
+ return (a, n) => {
355
+ var d, l, c;
356
+ return s(), r("label", {
360
357
  for: a.option,
361
- class: m(["slp-radio", { disabled: (d = a.config) == null ? void 0 : d.disabled }])
358
+ class: _(["slp-radio", { disabled: (d = a.config) == null ? void 0 : d.disabled }])
362
359
  }, [
363
- B(L(a.option) + " ", 1),
364
- h("input", {
360
+ B(w(a.option) + " ", 1),
361
+ v("input", {
365
362
  type: "radio",
366
363
  name: a.name,
367
364
  value: a.option,
368
365
  id: a.option,
369
- onInput: l,
370
- checked: (r = a.config) == null ? void 0 : r.checked,
366
+ onInput: i,
367
+ checked: (l = a.config) == null ? void 0 : l.checked,
371
368
  disabled: (c = a.config) == null ? void 0 : c.disabled
372
369
  }, null, 40, Be),
373
- o[0] || (o[0] = h("span", { class: "slp-radio__checkmark" }, null, -1))
370
+ n[0] || (n[0] = v("span", { class: "slp-radio__checkmark" }, null, -1))
374
371
  ], 10, Ge);
375
372
  };
376
373
  }
377
- }), Re = /* @__PURE__ */ w(Oe, [["__scopeId", "data-v-f37e970e"]]), Pe = /* @__PURE__ */ C({
374
+ }), Oe = /* @__PURE__ */ S(Ve, [["__scopeId", "data-v-f37e970e"]]), Re = /* @__PURE__ */ L({
378
375
  __name: "SlpRadioButtonGroup",
379
376
  props: {
380
377
  options: {},
@@ -386,28 +383,28 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
386
383
  },
387
384
  emits: ["update:modelValue"],
388
385
  setup(p, { emit: e }) {
389
- const n = {
386
+ const o = {
390
387
  VERTICAL: "vertical",
391
388
  HORIZONTAL: "horizontal"
392
- }, l = e, a = (o) => {
393
- l("update:modelValue", o);
389
+ }, i = e, a = (n) => {
390
+ i("update:modelValue", n);
394
391
  };
395
- return (o, d) => {
396
- var r, c;
397
- return s(), R(te, {
398
- class: m(["slp-radio-group", {
399
- "slp-radio-group--vertical": ((r = o.config) == null ? void 0 : r.orientation) === n.VERTICAL,
400
- "slp-radio-group--horizontal": ((c = o.config) == null ? void 0 : c.orientation) === n.HORIZONTAL
392
+ return (n, d) => {
393
+ var l, c;
394
+ return s(), O(ee, {
395
+ class: _(["slp-radio-group", {
396
+ "slp-radio-group--vertical": ((l = n.config) == null ? void 0 : l.orientation) === o.VERTICAL,
397
+ "slp-radio-group--horizontal": ((c = n.config) == null ? void 0 : c.orientation) === o.HORIZONTAL
401
398
  }])
402
399
  }, {
403
400
  default: N(() => [
404
- (s(!0), i(T, null, z(o.options, (t) => (s(), R(Re, {
401
+ (s(!0), r(T, null, z(n.options, (t) => (s(), O(Oe, {
405
402
  key: t.value,
406
403
  option: t.value,
407
- name: o.name,
404
+ name: n.name,
408
405
  config: {
409
406
  ...t.config,
410
- checked: t.value === o.modelValue
407
+ checked: t.value === n.modelValue
411
408
  },
412
409
  "onUpdate:modelValue": a
413
410
  }, null, 8, ["option", "name", "config"]))), 128))
@@ -416,13 +413,13 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
416
413
  }, 8, ["class"]);
417
414
  };
418
415
  }
419
- }), Tt = /* @__PURE__ */ w(Pe, [["__scopeId", "data-v-ae31ec89"]]), Ae = {
416
+ }), zt = /* @__PURE__ */ S(Re, [["__scopeId", "data-v-ae31ec89"]]), Ae = {
420
417
  key: 0,
421
418
  class: "slp-loading-round"
422
- }, De = {
419
+ }, Fe = {
423
420
  key: 1,
424
421
  class: "slp-loading-linear"
425
- }, We = /* @__PURE__ */ C({
422
+ }, Pe = /* @__PURE__ */ L({
426
423
  name: "SlpLoader",
427
424
  __name: "SlpLoader",
428
425
  props: {
@@ -430,12 +427,12 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
430
427
  },
431
428
  setup(p) {
432
429
  const e = p;
433
- return (n, l) => {
430
+ return (o, i) => {
434
431
  var a;
435
- return ((a = e.config) == null ? void 0 : a.variant) === "round" ? (s(), i("div", Ae)) : (s(), i("div", De));
432
+ return ((a = e.config) == null ? void 0 : a.variant) === "round" ? (s(), r("div", Ae)) : (s(), r("div", Fe));
436
433
  };
437
434
  }
438
- }), zt = /* @__PURE__ */ w(We, [["__scopeId", "data-v-ee32411b"]]), qe = ["href", "data-ga-name", "data-ga-location"], He = /* @__PURE__ */ C({
435
+ }), Mt = /* @__PURE__ */ S(Pe, [["__scopeId", "data-v-ee32411b"]]), De = ["href", "data-ga-name", "data-ga-location"], We = /* @__PURE__ */ L({
439
436
  __name: "Tree",
440
437
  props: {
441
438
  text: { default: "" },
@@ -450,39 +447,39 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
450
447
  }) }
451
448
  },
452
449
  setup(p) {
453
- return (e, n) => {
454
- var a, o, d, r, c, t;
455
- const l = se("Tree", !0);
456
- return s(), i("div", {
457
- class: m([`depth-${(a = e.config) == null ? void 0 : a.depth}`, { mobile: (o = e.config) == null ? void 0 : o.mobile }])
450
+ return (e, o) => {
451
+ var a, n, d, l, c, t;
452
+ const i = ne("Tree", !0);
453
+ return s(), r("div", {
454
+ class: _([`depth-${(a = e.config) == null ? void 0 : a.depth}`, { mobile: (n = e.config) == null ? void 0 : n.mobile }])
458
455
  }, [
459
- e.text ? (s(), i("a", {
456
+ e.text ? (s(), r("a", {
460
457
  key: 0,
461
- class: m(["anchor", { selected: (d = e.config) == null ? void 0 : d.isSelected }]),
462
- href: (r = e.config) == null ? void 0 : r.href,
458
+ class: _(["anchor", { selected: (d = e.config) == null ? void 0 : d.isSelected }]),
459
+ href: (l = e.config) == null ? void 0 : l.href,
463
460
  "data-ga-name": (c = e.config) == null ? void 0 : c.dataGaName,
464
461
  "data-ga-location": (t = e.config) == null ? void 0 : t.dataGaLocation
465
- }, L(e.text), 11, qe)) : M("", !0),
466
- (s(!0), i(T, null, z(e.nodes, (u) => {
467
- var v, g, f, _, S, $;
468
- return s(), R(l, {
469
- key: u.text,
470
- nodes: u.nodes,
471
- text: u.text,
462
+ }, w(e.text), 11, De)) : M("", !0),
463
+ (s(!0), r(T, null, z(e.nodes, (f) => {
464
+ var g, h, u, m, I, C;
465
+ return s(), O(i, {
466
+ key: f.text,
467
+ nodes: f.nodes,
468
+ text: f.text,
472
469
  config: {
473
- href: ((v = u.config) == null ? void 0 : v.href) ?? "",
474
- dataGaName: (g = u.config) == null ? void 0 : g.dataGaName,
475
- dataGaLocation: (f = u.config) == null ? void 0 : f.dataGaLocation,
476
- depth: (((_ = e.config) == null ? void 0 : _.depth) ?? 0) + 1,
477
- isSelected: (S = u.config) == null ? void 0 : S.isSelected,
478
- mobile: ($ = e.config) == null ? void 0 : $.mobile
470
+ href: ((g = f.config) == null ? void 0 : g.href) ?? "",
471
+ dataGaName: (h = f.config) == null ? void 0 : h.dataGaName,
472
+ dataGaLocation: (u = f.config) == null ? void 0 : u.dataGaLocation,
473
+ depth: (((m = e.config) == null ? void 0 : m.depth) ?? 0) + 1,
474
+ isSelected: (I = f.config) == null ? void 0 : I.isSelected,
475
+ mobile: (C = e.config) == null ? void 0 : C.mobile
479
476
  }
480
477
  }, null, 8, ["nodes", "text", "config"]);
481
478
  }), 128))
482
479
  ], 2);
483
480
  };
484
481
  }
485
- }), ae = /* @__PURE__ */ w(He, [["__scopeId", "data-v-c3be63ed"]]), Ue = { class: "dropdown__list" }, Ke = { class: "horizontal-rule slp-my-16" }, je = /* @__PURE__ */ C({
482
+ }), te = /* @__PURE__ */ S(We, [["__scopeId", "data-v-c3be63ed"]]), He = { class: "dropdown__list" }, qe = { class: "horizontal-rule slp-my-16" }, Ue = /* @__PURE__ */ L({
486
483
  __name: "SlpAnchorDropdown",
487
484
  props: {
488
485
  dropdownLabel: { default: "Jump to a section" },
@@ -490,49 +487,49 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
490
487
  hyperlinks: {}
491
488
  },
492
489
  setup(p) {
493
- const e = I(!1), n = () => {
490
+ const e = k(!1), o = () => {
494
491
  e.value = !e.value;
495
492
  };
496
- return (l, a) => {
497
- var o, d, r;
498
- return s(), i("div", {
499
- class: m(["dropdown", { hide: !e.value }])
493
+ return (i, a) => {
494
+ var n, d, l;
495
+ return s(), r("div", {
496
+ class: _(["dropdown", { hide: !e.value }])
500
497
  }, [
501
- k(K, {
498
+ y(W, {
502
499
  class: "dropdown__button",
503
500
  variant: "ghost",
504
- onClick: n
501
+ onClick: o
505
502
  }, {
506
503
  default: N(() => [
507
- h("span", null, L(l.dropdownLabel), 1),
508
- k(P, {
509
- icon: e.value ? G(Y) : G(x)
504
+ v("span", null, w(i.dropdownLabel), 1),
505
+ y(R, {
506
+ icon: e.value ? G(X) : G(Y)
510
507
  }, null, 8, ["icon"])
511
508
  ]),
512
509
  _: 1
513
510
  }),
514
- h("div", Ue, [
515
- D(k(A, {
511
+ v("div", He, [
512
+ F(y(A, {
516
513
  tag: "div",
517
514
  variant: "body3-bold",
518
515
  class: "nav-heading"
519
516
  }, {
520
517
  default: N(() => [
521
- B(L(l.anchors.text), 1)
518
+ B(w(i.anchors.text), 1)
522
519
  ]),
523
520
  _: 1
524
521
  }, 512), [
525
- [U, l.anchors.text]
522
+ [D, i.anchors.text]
526
523
  ]),
527
- k(ae, {
524
+ y(te, {
528
525
  mobile: "",
529
- nodes: l.anchors.data,
530
- onClick: n
526
+ nodes: i.anchors.data,
527
+ onClick: o
531
528
  }, null, 8, ["nodes"]),
532
- D(h("div", Ke, null, 512), [
533
- [U, (o = l.hyperlinks) == null ? void 0 : o.data.length]
529
+ F(v("div", qe, null, 512), [
530
+ [D, (n = i.hyperlinks) == null ? void 0 : n.data.length]
534
531
  ]),
535
- D(k(A, {
532
+ F(y(A, {
536
533
  tag: "div",
537
534
  variant: "body3-bold",
538
535
  class: "nav-heading"
@@ -540,28 +537,28 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
540
537
  default: N(() => {
541
538
  var c;
542
539
  return [
543
- B(L((c = l.hyperlinks) == null ? void 0 : c.text), 1)
540
+ B(w((c = i.hyperlinks) == null ? void 0 : c.text), 1)
544
541
  ];
545
542
  }),
546
543
  _: 1
547
544
  }, 512), [
548
- [U, (d = l.hyperlinks) == null ? void 0 : d.text]
545
+ [D, (d = i.hyperlinks) == null ? void 0 : d.text]
549
546
  ]),
550
- h("ul", null, [
551
- (s(!0), i(T, null, z((r = l.hyperlinks) == null ? void 0 : r.data, (c) => (s(), i("li", {
547
+ v("ul", null, [
548
+ (s(!0), r(T, null, z((l = i.hyperlinks) == null ? void 0 : l.data, (c) => (s(), r("li", {
552
549
  key: c.text
553
550
  }, [
554
- k(K, {
551
+ y(W, {
555
552
  class: "dropdown__link",
556
553
  variant: "ghost",
557
554
  href: c.config.href
558
555
  }, {
559
556
  default: N(() => [
560
- h("span", null, L(c.text), 1),
561
- k(K, { variant: "icon" }, {
557
+ v("span", null, w(c.text), 1),
558
+ y(W, { variant: "icon" }, {
562
559
  default: N(() => [
563
- k(P, {
564
- icon: G(ee),
560
+ y(R, {
561
+ icon: G(x),
565
562
  size: "xs"
566
563
  }, null, 8, ["icon"])
567
564
  ]),
@@ -576,107 +573,107 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
576
573
  ], 2);
577
574
  };
578
575
  }
579
- }), Ze = /* @__PURE__ */ w(je, [["__scopeId", "data-v-9b690a76"]]), Fe = { key: 0 }, Je = {
576
+ }), je = /* @__PURE__ */ S(Ue, [["__scopeId", "data-v-9b690a76"]]), Ze = { key: 0 }, Je = {
580
577
  key: 1,
581
578
  id: "collapsible-sidebar-wrapper"
582
- }, Qe = { id: "collapsible-sidebar-content" }, Xe = { id: "collapsible-sidebar" }, Ye = { class: "anchors" }, xe = /* @__PURE__ */ C({
579
+ }, Ke = { id: "collapsible-sidebar-content" }, Qe = { id: "collapsible-sidebar" }, Xe = { class: "anchors" }, Ye = /* @__PURE__ */ L({
583
580
  __name: "SlpSideNavigationWithTree",
584
581
  props: {
585
582
  anchors: {},
586
- hyperlinks: {},
587
- alwaysExpanded: { type: Boolean }
583
+ hyperlinks: {}
588
584
  },
589
585
  setup(p) {
590
- const e = p, n = I([]), l = I(
591
- e.anchors.data.map((f) => ({
592
- text: f.text,
593
- nodes: f.nodes,
594
- config: {
595
- href: f.config.href,
596
- dataGaName: f.config.dataGaName,
597
- dataGaLocation: f.config.dataGaLocation,
598
- depth: 0,
599
- mobile: !1
600
- }
601
- }))
602
- ), a = I(!1), o = I(!0);
586
+ const e = p, o = k([]), i = k(e.anchors.data.map((u) => ({
587
+ text: u.text,
588
+ nodes: u.nodes,
589
+ config: {
590
+ href: u.config.href,
591
+ dataGaName: u.config.dataGaName,
592
+ dataGaLocation: u.config.dataGaLocation,
593
+ depth: 0,
594
+ mobile: !1
595
+ }
596
+ }))), a = k(!1), n = k(!0);
603
597
  let d = null;
604
- const r = (f, _ = []) => (f.forEach((S) => {
605
- S.config.href && _.push(S.config.href), S.nodes && r(S.nodes, _);
606
- }), _), c = (f) => {
607
- const _ = [], S = ($) => $.some((E, V) => (_.push(V), E.config.href === f || E.nodes && S(E.nodes) ? !0 : (_.pop(), !1)));
608
- return S(e.anchors.data), _;
609
- }, t = (f) => {
610
- let _ = 0;
611
- const S = ($, E, V) => {
612
- const O = {
613
- text: $.text,
598
+ const l = (u, m = []) => (u.forEach((I) => {
599
+ I.config.href && m.push(I.config.href), I.nodes && l(I.nodes, m);
600
+ }), m), c = (u) => {
601
+ const m = [], I = (C) => C.some((E, V) => (m.push(V), E.config.href === u || E.nodes && I(E.nodes) ? !0 : (m.pop(), !1)));
602
+ return I(e.anchors.data), m;
603
+ }, t = (u) => {
604
+ let m = 0;
605
+ const I = (C, E) => {
606
+ const V = {
607
+ text: C.text,
614
608
  config: {
615
- href: $.config.href,
616
- dataGaName: $.config.dataGaName,
617
- dataGaLocation: $.config.dataGaLocation
609
+ href: C.config.href,
610
+ dataGaName: C.config.dataGaName,
611
+ dataGaLocation: C.config.dataGaLocation
618
612
  }
619
613
  };
620
- return f && E === 0 && (O.config.isSelected = !0), e.alwaysExpanded ? (n.value[V] === E && (O.config.isSelected = !0), $.nodes && (O.nodes = $.nodes.map(
621
- (q, H) => S(q, H, V + 1)
622
- ))) : n.value[V] === E && ($.nodes && (V += 1, O.nodes = $.nodes.map(
623
- (q, H) => S(q, H, V)
624
- ), V -= 1), V + 1 === n.value.length && (O.config.isSelected = !0)), O;
614
+ return u && E === 0 && (V.config.isSelected = !0), o.value[m] === E && (C.nodes && (m += 1, V.nodes = C.nodes.map(
615
+ (ae, oe) => I(ae, oe)
616
+ ), m -= 1), m + 1 === o.value.length && (V.config.isSelected = !0)), V;
625
617
  };
626
- return e.anchors.data.map(($, E) => S($, E, _));
627
- }, u = (f) => {
628
- f.forEach((_) => {
629
- _.isIntersecting ? (n.value = c(`#${_.target.id}`), e.alwaysExpanded || (l.value = t(!1))) : o.value && !e.alwaysExpanded && (l.value = t(!0), o.value = !1), e.alwaysExpanded && (l.value = t(!1));
618
+ return e.anchors.data.map(
619
+ (C, E) => I(C, E)
620
+ );
621
+ }, f = (u) => {
622
+ u.forEach((m) => {
623
+ m.isIntersecting ? (o.value = c(`#${m.target.id}`), i.value = t(!1)) : n.value && (i.value = t(!0), n.value = !1);
630
624
  });
631
- }, v = () => {
632
- a.value = window.innerWidth < 768;
633
625
  }, g = () => {
634
- l.value = t(!0), o.value = !1;
635
- const f = (window.innerHeight - 120 - 48) * -1;
636
- d = new IntersectionObserver(u, {
637
- rootMargin: `-120px 0px ${f}px 0px`,
638
- threshold: 0
639
- }), setTimeout(() => {
640
- r(e.anchors.data).forEach((S) => {
641
- const $ = document.querySelector(S);
642
- $ && (d == null || d.observe($));
626
+ a.value = window.innerWidth < 768;
627
+ }, h = () => {
628
+ i.value = t(!0), n.value = !1;
629
+ const u = (window.innerHeight - 120 - 48) * -1;
630
+ d = new IntersectionObserver(
631
+ f,
632
+ {
633
+ rootMargin: `-120px 0px ${u}px 0px`,
634
+ threshold: 0
635
+ }
636
+ ), setTimeout(() => {
637
+ l(e.anchors.data).forEach((I) => {
638
+ const C = document.querySelector(I);
639
+ C && (d == null || d.observe(C));
643
640
  });
644
641
  }, 0);
645
642
  };
646
- return W(() => {
647
- v(), window.addEventListener("resize", v), g();
648
- }), Q(() => {
649
- window.removeEventListener("resize", v), d && d.disconnect();
650
- }), (f, _) => (s(), i("div", null, [
651
- a.value ? (s(), i("div", Fe, [
652
- k(Ze, ne(le({ anchors: f.anchors, hyperlinks: f.hyperlinks })), null, 16),
653
- b(f.$slots, "default", {}, void 0, !0)
654
- ])) : (s(), i("div", Je, [
655
- h("div", Qe, [
656
- b(f.$slots, "default", {}, void 0, !0)
643
+ return P(() => {
644
+ g(), window.addEventListener("resize", g), h();
645
+ }), J(() => {
646
+ window.removeEventListener("resize", g), d && d.disconnect();
647
+ }), (u, m) => (s(), r("div", null, [
648
+ a.value ? (s(), r("div", Ze, [
649
+ y(je, se(le({ anchors: u.anchors, hyperlinks: u.hyperlinks })), null, 16),
650
+ b(u.$slots, "default", {}, void 0, !0)
651
+ ])) : (s(), r("div", Je, [
652
+ v("div", Ke, [
653
+ b(u.$slots, "default", {}, void 0, !0)
657
654
  ]),
658
- h("nav", Xe, [
659
- b(f.$slots, "header", {}, void 0, !0),
660
- h("div", Ye, [
661
- f.anchors.text ? (s(), R(A, {
655
+ v("nav", Qe, [
656
+ b(u.$slots, "header", {}, void 0, !0),
657
+ v("div", Xe, [
658
+ u.anchors.text ? (s(), O(A, {
662
659
  key: 0,
663
660
  tag: "div",
664
661
  variant: "body3-bold",
665
662
  class: "nav-heading"
666
663
  }, {
667
664
  default: N(() => [
668
- B(L(f.anchors.text), 1)
665
+ B(w(u.anchors.text), 1)
669
666
  ]),
670
667
  _: 1
671
668
  })) : M("", !0),
672
- k(ae, { nodes: l.value }, null, 8, ["nodes"])
669
+ y(te, { nodes: i.value }, null, 8, ["nodes"])
673
670
  ]),
674
- b(f.$slots, "footer", {}, void 0, !0)
671
+ b(u.$slots, "footer", {}, void 0, !0)
675
672
  ])
676
673
  ]))
677
674
  ]));
678
675
  }
679
- }), Et = /* @__PURE__ */ w(xe, [["__scopeId", "data-v-47e57dda"]]), et = ["id", "aria-describedby"], tt = { class: "slp-tooltip__wrapper" }, at = ["id", "data-ga-features", "data-ga-features-sub", "data-ga-features-sub-card", "data-ga-name", "data-ga-location", "href"], ot = ["id"], st = ["id", "aria-describedby"], nt = { class: "slp-tooltip__wrapper" }, lt = ["id", "innerHTML"], it = ["id"], rt = /* @__PURE__ */ C({
676
+ }), Et = /* @__PURE__ */ S(Ye, [["__scopeId", "data-v-9319fd2e"]]), xe = ["id", "aria-describedby"], et = { class: "slp-tooltip__wrapper" }, tt = ["id", "data-ga-features", "data-ga-features-sub", "data-ga-features-sub-card", "data-ga-name", "data-ga-location", "href"], at = ["id"], ot = ["id", "aria-describedby"], nt = { class: "slp-tooltip__wrapper" }, st = ["id", "innerHTML"], lt = ["id"], it = /* @__PURE__ */ L({
680
677
  __name: "SlpTooltip",
681
678
  props: {
682
679
  text: { default: "" },
@@ -687,23 +684,23 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
687
684
  dataProperties: { default: null }
688
685
  },
689
686
  setup(p) {
690
- const e = p, n = I(!1), l = I(""), a = I(""), o = I(""), d = (t) => {
691
- e.mode === "hover" && (n.value = t.type === "mouseenter");
692
- }, r = () => {
693
- n.value = e.mode === "click" ? !n.value : !1;
687
+ const e = p, o = k(!1), i = k(""), a = k(""), n = k(""), d = (t) => {
688
+ e.mode === "hover" && (o.value = t.type === "mouseenter");
689
+ }, l = () => {
690
+ o.value = e.mode === "click";
694
691
  }, c = (t) => {
695
- t.target.id !== e.id && (n.value = !1);
692
+ t.target.id !== e.id && (o.value = !1);
696
693
  };
697
- return W(() => {
694
+ return P(() => {
698
695
  if (e.mode === "click" && document.addEventListener("click", c), e.text) {
699
- const t = e.text.match(/\[(.*?)\]/), u = e.text.match(/\((.*?)\)/);
700
- l.value = t ? t[1] : "", a.value = u ? u[1] : "", o.value = e.text.replace(`(${a.value})`, "").replace(`[${l.value}]`, "").trim();
696
+ const t = e.text.match(/\[(.*?)\]/), f = e.text.match(/\((.*?)\)/);
697
+ i.value = t ? t[1] : "", a.value = f ? f[1] : "", n.value = e.text.replace(`(${a.value})`, "").replace(`[${i.value}]`, "").trim();
701
698
  }
702
- }), X(() => {
699
+ }), K(() => {
703
700
  document.removeEventListener("click", c);
704
- }), (t, u) => {
705
- var v, g, f;
706
- return t.mode === "hover" ? (s(), i("div", {
701
+ }), (t, f) => {
702
+ var g, h, u;
703
+ return t.mode === "hover" ? (s(), r("div", {
707
704
  key: 0,
708
705
  id: t.id,
709
706
  "aria-label": "Click to open tooltip with more information.",
@@ -711,271 +708,293 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
711
708
  class: "slp-tooltip",
712
709
  onMouseenter: d,
713
710
  onMouseleave: d,
714
- onClick: r
711
+ onClick: l
715
712
  }, [
716
- h("div", tt, [
713
+ v("div", et, [
717
714
  b(t.$slots, "default", {}, void 0, !0),
718
- n.value ? (s(), i("div", {
715
+ o.value ? (s(), r("div", {
719
716
  key: 0,
720
- class: m(["slp-tooltip__content", `${t.position} ${t.mode === "hover" ? "hover-mode" : ""}`])
717
+ class: _(["slp-tooltip__content", `${t.position} ${t.mode === "hover" ? "hover-mode" : ""}`])
721
718
  }, [
722
- B(L(o.value) + " ", 1),
723
- t.text ? (s(), i("a", {
719
+ B(w(n.value) + " ", 1),
720
+ t.text ? (s(), r("a", {
724
721
  key: 0,
725
722
  id: `${t.id}-content`,
726
723
  "data-ga-features": t.dataProperties && t.dataProperties.features.toLowerCase() || null,
727
- "data-ga-features-sub": (v = t.dataProperties) == null ? void 0 : v.sub,
728
- "data-ga-features-sub-card": (g = t.dataProperties) == null ? void 0 : g.card,
729
- "data-ga-name": (f = t.dataProperties) == null ? void 0 : f.plan,
724
+ "data-ga-features-sub": (g = t.dataProperties) == null ? void 0 : g.sub,
725
+ "data-ga-features-sub-card": (h = t.dataProperties) == null ? void 0 : h.card,
726
+ "data-ga-name": (u = t.dataProperties) == null ? void 0 : u.plan,
730
727
  "data-ga-location": t.dataProperties ? "features content" : null,
731
728
  role: "tooltip",
732
729
  href: a.value
733
- }, L(l.value), 9, at)) : t.list ? (s(), i("ul", {
730
+ }, w(i.value), 9, tt)) : t.list ? (s(), r("ul", {
734
731
  key: 1,
735
732
  id: `${t.id}-content`,
736
733
  role: "tooltip",
737
734
  class: "slp-tooltip__list"
738
735
  }, [
739
- (s(!0), i(T, null, z(t.list, (_) => (s(), i("li", {
740
- key: _.text
741
- }, L(_.text), 1))), 128))
742
- ], 8, ot)) : M("", !0)
736
+ (s(!0), r(T, null, z(t.list, (m) => (s(), r("li", {
737
+ key: m.text
738
+ }, w(m.text), 1))), 128))
739
+ ], 8, at)) : M("", !0)
743
740
  ], 2)) : M("", !0)
744
741
  ])
745
- ], 40, et)) : (s(), i("button", {
742
+ ], 40, xe)) : (s(), r("button", {
746
743
  key: 1,
747
744
  id: t.id,
748
745
  "aria-label": "Click to open tooltip with more information.",
749
746
  "aria-describedby": `${t.id}-content`,
750
- class: m(`slp-tooltip ${t.mode === "click" ? "button-mode" : ""}`),
751
- onClick: r
747
+ class: _(`slp-tooltip ${t.mode === "click" ? "button-mode" : ""}`),
748
+ onClick: l
752
749
  }, [
753
- h("div", nt, [
750
+ v("div", nt, [
754
751
  b(t.$slots, "default", {}, void 0, !0),
755
- n.value ? (s(), i("div", {
752
+ o.value ? (s(), r("div", {
756
753
  key: 0,
757
- class: m(["slp-tooltip__content", `${t.position} ${t.mode === "hover" ? "hover-mode" : ""}`])
754
+ class: _(["slp-tooltip__content", `${t.position} ${t.mode === "hover" ? "hover-mode" : ""}`])
758
755
  }, [
759
- t.text ? (s(), i("span", {
756
+ t.text ? (s(), r("span", {
760
757
  key: 0,
761
758
  id: `${t.id}-content`,
762
759
  role: "tooltip",
763
760
  innerHTML: t.text
764
- }, null, 8, lt)) : (s(), i("ul", {
761
+ }, null, 8, st)) : (s(), r("ul", {
765
762
  key: 1,
766
763
  id: `${t.id}-content`,
767
764
  role: "tooltip",
768
765
  class: "slp-tooltip__list"
769
766
  }, [
770
- (s(!0), i(T, null, z(t.list, (_) => (s(), i("li", {
771
- key: _.text
772
- }, L(_.text), 1))), 128))
773
- ], 8, it))
767
+ (s(!0), r(T, null, z(t.list, (m) => (s(), r("li", {
768
+ key: m.text
769
+ }, w(m.text), 1))), 128))
770
+ ], 8, lt))
774
771
  ], 2)) : M("", !0)
775
772
  ])
776
- ], 10, st));
773
+ ], 10, ot));
777
774
  };
778
775
  }
779
- }), dt = /* @__PURE__ */ w(rt, [["__scopeId", "data-v-1280f345"]]), ct = {
776
+ }), rt = /* @__PURE__ */ S(it, [["__scopeId", "data-v-a2668f04"]]), dt = {
780
777
  key: 0,
781
778
  class: "breadcrumb",
782
779
  vocab: "https://schema.org/",
783
780
  typeof: "BreadcrumbList"
784
- }, ut = ["onMouseenter", "onMouseleave"], pt = ["data-ga-name", "data-ga-location", "href"], vt = {
781
+ }, ct = ["onMouseenter", "onMouseleave"], ut = ["data-ga-name", "data-ga-location", "href"], pt = {
785
782
  key: 0,
786
783
  class: "breadcrumb__chevron"
787
- }, ft = ["content"], ht = {
784
+ }, ft = ["content"], vt = {
788
785
  key: 1,
789
786
  class: "breadcrumb",
790
787
  vocab: "https://schema.org/",
791
788
  typeof: "BreadcrumbList"
792
- }, gt = ["href", "data-ga-name", "data-ga-location"], mt = ["content"], _t = /* @__PURE__ */ C({
789
+ }, ht = ["href", "data-ga-name", "data-ga-location"], mt = ["content"], gt = /* @__PURE__ */ L({
793
790
  __name: "SlpBreadcrumb",
794
791
  props: {
795
792
  crumbs: { default: () => [] },
796
793
  router: {}
797
794
  },
798
795
  setup(p) {
799
- const e = p, n = I(e.crumbs), l = I(!1), a = (r) => {
800
- const c = r.split(" ");
796
+ const e = p, o = k(e.crumbs), i = k(!1), a = (l) => {
797
+ const c = l.split(" ");
801
798
  for (let t = 0; t < c.length; t++)
802
799
  c[t] = c[t][0].toUpperCase() + c[t].substr(1);
803
800
  return c.join(" ");
804
- }, o = () => {
805
- l.value = window.innerWidth < 768;
806
- }, d = (r) => {
807
- n.value[r] && (n.value[r] = {
808
- ...n.value[r],
809
- hover: !n.value[r].hover
801
+ }, n = () => {
802
+ i.value = window.innerWidth < 768;
803
+ }, d = (l) => {
804
+ o.value[l] && (o.value[l] = {
805
+ ...o.value[l],
806
+ hover: !o.value[l].hover
810
807
  });
811
808
  };
812
- return ie(() => {
809
+ return Q(() => {
813
810
  if (e.router) {
814
- const r = e.router.currentRoute.path, c = r.startsWith("/") ? r.substring(1).split("/") : r.split("/"), t = [];
815
- let u = "";
816
- c.forEach((v) => {
817
- u = `${u}/${v}`;
818
- const g = e.router.match(u);
819
- g.params.slug !== null && v.length && t.push({
820
- title: a(v.replace(/-/g, " ")),
811
+ const l = e.router.currentRoute.path, c = l.startsWith("/") ? l.substring(1).split("/") : l.split("/"), t = [];
812
+ let f = "";
813
+ c.forEach((g) => {
814
+ f = `${f}/${g}`;
815
+ const h = e.router.match(f);
816
+ h.params.slug !== null && g.length && t.push({
817
+ title: a(g.replace(/-/g, " ")),
821
818
  hover: !1,
822
- ...g
819
+ ...h
823
820
  });
824
- }), n.value = t;
821
+ }), o.value = t;
825
822
  }
826
- }), W(() => {
827
- o(), window.addEventListener("resize", o);
828
- }), X(() => {
829
- window.removeEventListener("resize", o);
830
- }), (r, c) => n.value && !l.value ? (s(), i("ol", ct, [
831
- (s(!0), i(T, null, z(n.value, (t, u) => (s(), i("li", {
823
+ }), P(() => {
824
+ n(), window.addEventListener("resize", n);
825
+ }), K(() => {
826
+ window.removeEventListener("resize", n);
827
+ }), (l, c) => o.value && !i.value ? (s(), r("ol", dt, [
828
+ (s(!0), r(T, null, z(o.value, (t, f) => (s(), r("li", {
832
829
  key: t.title,
833
- class: m(["breadcrumb__crumb", {
834
- "breadcrumb__crumb--disabled": u === n.value.length - 1
830
+ class: _(["breadcrumb__crumb", {
831
+ "breadcrumb__crumb--disabled": f === o.value.length - 1
835
832
  }]),
836
833
  property: "itemListElement",
837
834
  typeof: "ListItem",
838
- onMouseenter: (v) => d(u),
839
- onMouseleave: (v) => d(u)
835
+ onMouseenter: (g) => d(f),
836
+ onMouseleave: (g) => d(f)
840
837
  }, [
841
- k(dt, {
838
+ y(rt, {
842
839
  text: t.title,
843
840
  class: "breadcrumb__crumb__tooltip",
844
841
  position: "top"
845
842
  }, {
846
843
  default: N(() => [
847
- h("a", {
844
+ v("a", {
848
845
  property: "item",
849
846
  typeof: "WebPage",
850
847
  "data-ga-name": t.dataGaName || t.title.toLowerCase(),
851
848
  "data-ga-location": t.dataGaLocation || "breadcrumb",
852
- href: u !== n.value.length - 1 ? t.path : void 0
849
+ href: f !== o.value.length - 1 ? t.path : void 0
853
850
  }, [
854
- k(A, {
851
+ y(A, {
855
852
  tag: "span",
856
853
  variant: "body3",
857
854
  property: "name"
858
855
  }, {
859
856
  default: N(() => [
860
- B(L(t.title.length > 18 ? t.title.substring(0, 18).concat("...") : t.title), 1)
857
+ B(w(t.title.length > 18 ? t.title.substring(0, 18).concat("...") : t.title), 1)
861
858
  ]),
862
859
  _: 2
863
860
  }, 1024)
864
- ], 8, pt)
861
+ ], 8, ut)
865
862
  ]),
866
863
  _: 2
867
864
  }, 1032, ["text"]),
868
- u !== n.value.length - 1 ? (s(), i("span", vt, [
869
- k(P, {
865
+ f !== o.value.length - 1 ? (s(), r("span", pt, [
866
+ y(R, {
870
867
  color: "accent-500",
871
868
  size: "xs",
872
- icon: G(ee)
869
+ icon: G(x)
873
870
  }, null, 8, ["icon"])
874
871
  ])) : M("", !0),
875
- h("meta", {
872
+ v("meta", {
876
873
  property: "position",
877
- content: u + 1
874
+ content: f + 1
878
875
  }, null, 8, ft)
879
- ], 42, ut))), 128))
880
- ])) : n.value && l.value ? (s(), i("ol", ht, [
881
- (s(!0), i(T, null, z(n.value, (t) => (s(), i("li", {
876
+ ], 42, ct))), 128))
877
+ ])) : o.value && i.value ? (s(), r("ol", vt, [
878
+ (s(!0), r(T, null, z(o.value, (t) => (s(), r("li", {
882
879
  key: t.title,
883
880
  class: "breadcrumb__crumb breadcrumb__crumb--mobile",
884
881
  property: "itemListElement",
885
882
  typeof: "ListItem"
886
883
  }, [
887
- h("a", {
884
+ v("a", {
888
885
  class: "slp-flex slp-align-items-center",
889
- href: n.value[n.value.length - 2].path,
886
+ href: o.value[o.value.length - 2].path,
890
887
  "data-ga-name": t.dataGaName || t.title.toLowerCase(),
891
888
  "data-ga-location": t.dataGaLocation || "breadcrumb",
892
889
  property: "item",
893
890
  typeof: "WebPage"
894
891
  }, [
895
- h("span", null, [
896
- k(P, {
892
+ v("span", null, [
893
+ y(R, {
897
894
  color: "accent-500",
898
895
  size: "xs",
899
- icon: G(de)
896
+ icon: G(re)
900
897
  }, null, 8, ["icon"])
901
898
  ]),
902
- k(A, {
899
+ y(A, {
903
900
  class: "slp-ml-8",
904
901
  tag: "span",
905
902
  variant: "body2",
906
903
  property: "name"
907
904
  }, {
908
905
  default: N(() => [
909
- B(L(n.value[n.value.length - 2].title), 1)
906
+ B(w(o.value[o.value.length - 2].title), 1)
910
907
  ]),
911
908
  _: 1
912
909
  })
913
- ], 8, gt),
914
- h("meta", {
910
+ ], 8, ht),
911
+ v("meta", {
915
912
  property: "position",
916
- content: n.value.length - 1
913
+ content: o.value.length - 1
917
914
  }, null, 8, mt)
918
915
  ]))), 128))
919
916
  ])) : M("", !0);
920
917
  }
921
- }), Vt = /* @__PURE__ */ w(_t, [["__scopeId", "data-v-fd412793"]]), bt = ["value"], yt = {
922
- key: 1,
923
- class: "dropdown"
924
- }, $t = /* @__PURE__ */ C({
918
+ }), Gt = /* @__PURE__ */ S(gt, [["__scopeId", "data-v-fd412793"]]), _t = { class: "dropdown" }, bt = ["aria-label", "name"], yt = ["value", "name"], $t = ["value", "name"], kt = /* @__PURE__ */ L({
925
919
  __name: "SlpDropdown",
926
920
  props: {
927
- modelValue: {},
921
+ name: {},
928
922
  options: {},
929
- labelKey: {},
930
- valueKey: {}
923
+ textField: { default: void 0 },
924
+ valueField: { default: void 0 },
925
+ value: { type: [String, Object, Number, Boolean], default: void 0 },
926
+ dropdownLabel: { default: void 0 },
927
+ config: { default: {
928
+ primitive: !0
929
+ } }
931
930
  },
932
- emits: ["update:modelValue"],
931
+ emits: ["input"],
933
932
  setup(p, { emit: e }) {
934
- const n = p, l = e, a = (r, c) => {
935
- if (typeof r == "object" && r !== null) {
936
- if (!c) {
937
- const v = Object.keys(r)[0];
938
- return r[v];
933
+ const o = p, i = e, a = k(o.value), n = k(!0);
934
+ Q(() => {
935
+ var l;
936
+ if (n.value = !o.options.every(
937
+ (c) => typeof c == "object"
938
+ ), !n.value && !(o.textField && o.valueField))
939
+ throw new Error(
940
+ "The 'options' prop is an Array of Objects and textField nor the ValueField have been specified"
941
+ );
942
+ if (o.value === void 0 && o.options.length > 0)
943
+ if (n.value)
944
+ a.value = o.options[0], i("input", a.value);
945
+ else {
946
+ const c = o.options[0];
947
+ a.value = (l = o.config) != null && l.primitive ? c[o.valueField] : c, i("input", a.value);
939
948
  }
940
- const t = c.split(".");
941
- let u = r;
942
- for (const v of t)
943
- u = u == null ? void 0 : u[v];
944
- return u;
949
+ }), U(
950
+ () => a.value,
951
+ (l) => {
952
+ i("input", l);
945
953
  }
946
- return r;
947
- }, o = y(() => n.options.length > 0 ? a(n.options[0], n.valueKey) : ""), d = y({
948
- // Getter: Called when the template reads selectedValue
949
- // Returns the current modelValue from parent (or empty string if undefined)
950
- get: () => n.modelValue ?? o.value,
951
- // Setter: Called when the select's v-model updates selectedValue
952
- // Emits the new value to the parent component
953
- set: (r) => l("update:modelValue", r)
954
- });
955
- return (r, c) => r.options.length ? D((s(), i("select", {
956
- key: 0,
957
- "onUpdate:modelValue": c[0] || (c[0] = (t) => d.value = t),
958
- class: "dropdown"
959
- }, [
960
- (s(!0), i(T, null, z(r.options, (t, u) => (s(), i("option", {
961
- key: `${a(t, r.valueKey)}-${u}`,
962
- value: a(t, r.valueKey)
963
- }, L(a(t, r.labelKey)), 9, bt))), 128))
964
- ], 512)), [
965
- [re, d.value]
966
- ]) : (s(), i("div", yt, c[1] || (c[1] = [
967
- h("p", null, "No options available", -1)
968
- ])));
954
+ ), U(
955
+ () => o.value,
956
+ (l) => {
957
+ a.value = l;
958
+ }
959
+ );
960
+ const d = (l) => {
961
+ const c = l.target;
962
+ i(o.name, c.value);
963
+ };
964
+ return (l, c) => (s(), r("div", _t, [
965
+ F(v("select", {
966
+ "aria-label": l.dropdownLabel || `${l.name} dropdown`,
967
+ class: "dropdown__select",
968
+ name: l.name,
969
+ onChange: d,
970
+ "onUpdate:modelValue": c[0] || (c[0] = (t) => a.value = t)
971
+ }, [
972
+ n.value ? (s(!0), r(T, { key: 0 }, z(l.options, (t) => (s(), r("option", {
973
+ key: t,
974
+ value: t,
975
+ name: t
976
+ }, w(t), 9, yt))), 128)) : (s(!0), r(T, { key: 1 }, z(l.options, (t) => {
977
+ var f;
978
+ return s(), r("option", {
979
+ key: t[l.valueField],
980
+ value: (f = l.config) != null && f.primitive ? t[l.valueField] : t,
981
+ name: t[l.textField]
982
+ }, w(t[l.textField]), 9, $t);
983
+ }), 128))
984
+ ], 40, bt), [
985
+ [ie, a.value]
986
+ ])
987
+ ]));
969
988
  }
970
- }), Mt = /* @__PURE__ */ w($t, [["__scopeId", "data-v-413766e8"]]), kt = ["id"], wt = /* @__PURE__ */ C({
989
+ }), Bt = /* @__PURE__ */ S(kt, [["__scopeId", "data-v-9c71f7b0"]]), wt = ["id"], St = /* @__PURE__ */ L({
971
990
  __name: "SlpSection",
972
991
  props: {
973
992
  backgroundColor: {
974
993
  type: String,
975
994
  required: !1,
976
995
  validator(p) {
977
- const e = /^#([A-Fa-f0-9]{3}){1,2}$/.test(p), n = /^\$color-[a-zA-Z0-9-]+$/.test(p);
978
- return p ? e || n : !0;
996
+ const e = /^#([A-Fa-f0-9]{3}){1,2}$/.test(p), o = /^\$color-[a-zA-Z0-9-]+$/.test(p);
997
+ return p ? e || o : !0;
979
998
  }
980
999
  },
981
1000
  id: {
@@ -984,41 +1003,42 @@ const It = /* @__PURE__ */ w(Se, [["render", Ce], ["__scopeId", "data-v-adc8d02f
984
1003
  }
985
1004
  },
986
1005
  setup(p) {
987
- const e = p, n = y(() => {
1006
+ const e = p, o = $(() => {
988
1007
  var a;
989
1008
  return !e.backgroundColor || (a = e.backgroundColor) != null && a.startsWith("$") ? {} : { backgroundColor: e.backgroundColor };
990
- }), l = y(() => {
991
- var a, o;
992
- return (a = e.backgroundColor) != null && a.startsWith("$") ? `slp-background-${(o = e.backgroundColor) == null ? void 0 : o.slice(1)}` : null;
1009
+ }), i = $(() => {
1010
+ var a, n;
1011
+ return (a = e.backgroundColor) != null && a.startsWith("$") ? `slp-background-${(n = e.backgroundColor) == null ? void 0 : n.slice(1)}` : null;
993
1012
  });
994
- return (a, o) => (s(), i("section", {
995
- style: J(n.value),
996
- class: m(l.value),
1013
+ return (a, n) => (s(), r("section", {
1014
+ style: Z(o.value),
1015
+ class: _(i.value),
997
1016
  id: p.id || void 0
998
1017
  }, [
999
- k(te, null, {
1018
+ y(ee, null, {
1000
1019
  default: N(() => [
1001
1020
  b(a.$slots, "default", {}, void 0, !0)
1002
1021
  ]),
1003
1022
  _: 3
1004
1023
  })
1005
- ], 14, kt));
1024
+ ], 14, wt));
1006
1025
  }
1007
- }), Gt = /* @__PURE__ */ w(wt, [["__scopeId", "data-v-2b3ad016"]]);
1026
+ }), Vt = /* @__PURE__ */ S(St, [["__scopeId", "data-v-2b3ad016"]]);
1008
1027
  export {
1009
- Vt as SlpBreadcrumb,
1010
- K as SlpButton,
1011
- Ct as SlpColumn,
1012
- te as SlpContainer,
1013
- Mt as SlpDropdown,
1014
- P as SlpIcon,
1015
- zt as SlpLoader,
1016
- Re as SlpRadioButton,
1017
- Tt as SlpRadioButtonGroup,
1018
- It as SlpRow,
1019
- Gt as SlpSection,
1020
- Nt as SlpSideNavigation,
1028
+ Gt as SlpBreadcrumb,
1029
+ W as SlpButton,
1030
+ It as SlpColumn,
1031
+ ee as SlpContainer,
1032
+ Bt as SlpCustomDropdown,
1033
+ Bt as SlpDropdown,
1034
+ R as SlpIcon,
1035
+ Mt as SlpLoader,
1036
+ Oe as SlpRadioButton,
1037
+ zt as SlpRadioButtonGroup,
1038
+ Nt as SlpRow,
1039
+ Vt as SlpSection,
1040
+ Tt as SlpSideNavigation,
1021
1041
  Et as SlpSideNavigationWithTree,
1022
- dt as SlpTooltip,
1042
+ rt as SlpTooltip,
1023
1043
  A as SlpTypography
1024
1044
  };