@telia-ace/knowledge-widget-components-guide-category-dropdown 1.0.24-next.3 → 1.0.24-next.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/{guide-category-dropdown.22199076.js → guide-category-dropdown.4f6333ff.js} +49 -49
  2. package/dist/guide-category-dropdown.4f6333ff.js.map +1 -0
  3. package/dist/index.js +1 -1
  4. package/package.json +3 -3
  5. package/dist/guide-category-dropdown.22199076.js.map +0 -1
package/dist/{guide-category-dropdown.22199076.js → guide-category-dropdown.4f6333ff.js} RENAMED
@@ -1,15 +1,15 @@
1
- var W = Object.defineProperty, H = Object.defineProperties;
2
- var U = Object.getOwnPropertyDescriptors;
1
+ var P = Object.defineProperty, W = Object.defineProperties;
2
+ var H = Object.getOwnPropertyDescriptors;
3
3
  var E = Object.getOwnPropertySymbols;
4
4
  var L = Object.prototype.hasOwnProperty, S = Object.prototype.propertyIsEnumerable;
5
- var I = (e, t, a) => t in e ? W(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a, c = (e, t) => {
5
+ var I = (e, t, a) => t in e ? P(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a, c = (e, t) => {
6
6
  for (var a in t || (t = {}))
7
7
  L.call(t, a) && I(e, a, t[a]);
8
8
  if (E)
9
9
  for (var a of E(t))
10
10
  S.call(t, a) && I(e, a, t[a]);
11
11
  return e;
12
- }, x = (e, t) => H(e, U(t));
12
+ }, x = (e, t) => W(e, H(t));
13
13
  var D = (e, t) => {
14
14
  var a = {};
15
15
  for (var n in e)
@@ -19,20 +19,20 @@ var D = (e, t) => {
19
19
  t.indexOf(n) < 0 && S.call(e, n) && (a[n] = e[n]);
20
20
  return a;
21
21
  };
22
- import { loadingOpacity as q, contentBox as J, borderTabStyle as K, Link as Q, linkTabStyle as V, List as X, list as Y, Text as k, useProperties as T, useHover as Z, SymbolBadge as f, useRouteData as _, useContainer as ee, useIsTabbing as te, createEmptyComponent as oe } from "@telia-ace/knowledge-widget-ui";
23
- import { appendClassNames as F, createParams as ae, formatUrl as ne } from "@telia-ace/widget-utilities";
24
- import o, { useState as G, useEffect as re } from "react";
25
- import { initialRouteFallback as le } from "@telia-ace/knowledge-widget-component-utilities";
22
+ import { loadingOpacity as U, contentBox as q, borderTabStyle as J, Link as K, linkTabStyle as Q, List as V, list as X, Text as k, useProperties as T, useHover as Y, SymbolBadge as f, useRouteData as Z, useContainer as _, useIsTabbing as ee, createEmptyComponent as te } from "@telia-ace/knowledge-widget-ui";
23
+ import { appendClassNames as F, createParams as oe, formatUrl as ae } from "@telia-ace/widget-utilities";
24
+ import o, { useState as G, useEffect as ne } from "react";
25
+ import { initialRouteFallback as re } from "@telia-ace/knowledge-widget-component-utilities";
26
26
  import { css as C } from "@emotion/react";
27
27
  import m from "@emotion/styled";
28
- const se = m.div`
28
+ const le = m.div`
29
+ ${U}
29
30
  ${q}
30
- ${J}
31
31
  overflow: hidden;
32
32
  min-height: 50px;
33
33
  ${(e) => e["data-toggler-in-focus"] && e.isTabbing && C`
34
34
  && {
35
- ${K(e)}
35
+ ${J(e)}
36
36
  }
37
37
  `};
38
38
  `, ie = m.button`
@@ -58,7 +58,7 @@ const se = m.div`
58
58
  }
59
59
  }
60
60
  `, M = (e) => {
61
- var t, a, n, d, g, i, r, u;
61
+ var t, a, n, d, g, s, r, u;
62
62
  return C`
63
63
  font-size: ${(t = e.theme.fonts) == null ? void 0 : t.normal};
64
64
  text-align: left;
@@ -75,7 +75,7 @@ const se = m.div`
75
75
  border-left: 2px solid ${(d = e.theme.colors) == null ? void 0 : d.primary};
76
76
  color: ${(g = e.theme.colors) == null ? void 0 : g.primary};
77
77
  ` : C`
78
- color: ${(i = e.theme.colors) == null ? void 0 : i.text};
78
+ color: ${(s = e.theme.colors) == null ? void 0 : s.text};
79
79
  `};
80
80
 
81
81
  span {
@@ -90,16 +90,16 @@ const se = m.div`
90
90
  min-width: 1em;
91
91
  }
92
92
  `;
93
- }, B = m.div`
93
+ }, se = m.div`
94
94
  ${M}
95
- `, ce = m(Q)`
95
+ `, ce = m(K)`
96
96
  ${M}
97
97
  &:focus {
98
98
  outline: none;
99
99
  }
100
100
  &:focus-visible {
101
101
  span {
102
- ${V};
102
+ ${Q};
103
103
  }
104
104
  }
105
105
  `, me = m.div`
@@ -119,11 +119,11 @@ const se = m.div`
119
119
  font-weight: normal;
120
120
  }
121
121
  }
122
- ${B} {
122
+ .humany-guide-category-dropdown-item {
123
123
  font-weight: normal;
124
124
  }
125
- `, de = m(X)`
126
- ${Y}
125
+ `, de = m(V)`
126
+ ${X}
127
127
  display: flex;
128
128
  justify-content: center;
129
129
  flex-direction: column;
@@ -153,27 +153,27 @@ const se = m.div`
153
153
  var t;
154
154
  return (t = e.theme.sizes) == null ? void 0 : t.small;
155
155
  }};
156
- `, s = {
157
- Wrapper: se,
156
+ `, i = {
157
+ Wrapper: le,
158
158
  Toggler: ie,
159
159
  List: de,
160
- Item: B,
160
+ Item: se,
161
161
  Link: ce,
162
162
  TopItem: me,
163
163
  MatchCount: ge
164
164
  }, ue = ({ matches: e }) => {
165
165
  const { showMatchCount: t = !1 } = T();
166
- return !t || typeof e == "undefined" ? null : /* @__PURE__ */ o.createElement(s.MatchCount, null, "(", e, ")");
166
+ return !t || typeof e == "undefined" ? null : /* @__PURE__ */ o.createElement(i.MatchCount, null, "(", e, ")");
167
167
  }, z = ue, pe = ({ item: e, guideCategory: t }) => {
168
168
  const {
169
169
  route: a = "browse",
170
170
  categoryAriaLabel: n = "",
171
171
  activeCategoryAriaLabel: d = "",
172
172
  fallbackOnInitialRoute: g = !1
173
- } = T(), [i, r] = Z(), { id: u, title: p, symbol: h, activeSymbol: b } = e, l = t === u;
173
+ } = T(), [s, r] = Y(), { id: u, title: p, symbol: h, activeSymbol: b } = e, l = t === u;
174
174
  return /* @__PURE__ */ o.createElement("li", {
175
175
  ref: r
176
- }, /* @__PURE__ */ o.createElement(s.Link, x(c({}, le(e, a, g, "category")), {
176
+ }, /* @__PURE__ */ o.createElement(i.Link, x(c({}, re(e, a, g, "category")), {
177
177
  "aria-pressed": l,
178
178
  "aria-label": (l ? d : n).replace(
179
179
  "{{category}}",
@@ -182,50 +182,50 @@ const se = m.div`
182
182
  className: "humany-guide-category-dropdown-link",
183
183
  "aria-current": l,
184
184
  selected: l
185
- }), (l || i) && b ? /* @__PURE__ */ o.createElement(f, {
185
+ }), (l || s) && b ? /* @__PURE__ */ o.createElement(f, {
186
186
  symbol: b
187
187
  }) : h && /* @__PURE__ */ o.createElement(f, {
188
188
  symbol: h
189
189
  }), /* @__PURE__ */ o.createElement(k, null, p), /* @__PURE__ */ o.createElement(z, c({}, e))));
190
190
  }, ye = pe, Ce = (a) => {
191
191
  var n = a, { className: e } = n, t = D(n, ["className"]);
192
- const d = _(), [g, i] = G(!1), {
192
+ const d = Z(), [g, s] = G(!1), {
193
193
  parent: r,
194
194
  route: u = "browse",
195
195
  categories: p = [],
196
196
  loading: h = !1
197
- } = T(), b = ee(), [l, w] = G(!1), { params: O } = d, R = te(), { guideCategory: v, tag: j, phrase: A, sorting: P } = O;
198
- if (re(() => {
197
+ } = T(), b = _(), [l, w] = G(!1), { params: B } = d, O = ee(), { guideCategory: v, tag: R, phrase: j, sorting: A } = B;
198
+ if (ne(() => {
199
199
  l && w(!1);
200
200
  }, [v]), h || !r || !p.length)
201
- return oe(b, x(c({}, t), {
201
+ return te(b, x(c({}, t), {
202
202
  className: F(e, "humany-guide-category-dropdown")
203
203
  }));
204
204
  const y = p.find(($) => $.id === v) || r, N = y.activeSymbol || y.symbol;
205
- return /* @__PURE__ */ o.createElement(s.Wrapper, x(c({}, t), {
205
+ return /* @__PURE__ */ o.createElement(i.Wrapper, x(c({}, t), {
206
206
  "data-loading": !1,
207
207
  "data-toggler-in-focus": g,
208
208
  "aria-expanded": l,
209
- isTabbing: R,
209
+ isTabbing: O,
210
210
  className: F(e, "humany-guide-category-dropdown")
211
- }), l ? /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(s.TopItem, {
211
+ }), l ? /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(i.TopItem, {
212
212
  className: "humany-guide-category-dropdown-top-item"
213
- }, /* @__PURE__ */ o.createElement(s.Link, {
213
+ }, /* @__PURE__ */ o.createElement(i.Link, {
214
214
  className: "humany-guide-category-dropdown-link",
215
215
  routeName: u,
216
- params: ae({
217
- tag: j,
218
- phrase: A,
219
- sorting: P,
216
+ params: oe({
217
+ tag: R,
218
+ phrase: j,
219
+ sorting: A,
220
220
  guideCategory: r.id,
221
- uriName: ne(r.title)
221
+ uriName: ae(r.title)
222
222
  }),
223
223
  selected: !1
224
224
  }, r.symbol ? /* @__PURE__ */ o.createElement(f, {
225
225
  symbol: r.symbol
226
- }) : null, /* @__PURE__ */ o.createElement(k, null, r.title), /* @__PURE__ */ o.createElement(z, c({}, r))), /* @__PURE__ */ o.createElement(s.Toggler, {
227
- onBlur: () => i(!1),
228
- onFocus: () => i(!0),
226
+ }) : null, /* @__PURE__ */ o.createElement(k, null, r.title), /* @__PURE__ */ o.createElement(z, c({}, r))), /* @__PURE__ */ o.createElement(i.Toggler, {
227
+ onBlur: () => s(!1),
228
+ onFocus: () => s(!0),
229
229
  className: "humany-guide-category-dropdown-toggler",
230
230
  onClick: () => {
231
231
  w(!l);
@@ -235,7 +235,7 @@ const se = m.div`
235
235
  }, /* @__PURE__ */ o.createElement(f, {
236
236
  size: 18,
237
237
  symbol: { type: "Svg", content: "caret-up" }
238
- }))), /* @__PURE__ */ o.createElement(s.List, {
238
+ }))), /* @__PURE__ */ o.createElement(i.List, {
239
239
  className: "humany-guide-category-dropdown-open",
240
240
  items: p,
241
241
  renderItem: ($) => /* @__PURE__ */ o.createElement(ye, {
@@ -243,9 +243,9 @@ const se = m.div`
243
243
  item: $,
244
244
  guideCategory: v
245
245
  })
246
- })) : /* @__PURE__ */ o.createElement(s.TopItem, {
246
+ })) : /* @__PURE__ */ o.createElement(i.TopItem, {
247
247
  className: "humany-guide-category-dropdown-top-item"
248
- }, /* @__PURE__ */ o.createElement(s.Item, {
248
+ }, /* @__PURE__ */ o.createElement(i.Item, {
249
249
  className: "humany-guide-category-dropdown-item",
250
250
  onClick: () => {
251
251
  w(!l);
@@ -253,9 +253,9 @@ const se = m.div`
253
253
  selected: !1
254
254
  }, N ? /* @__PURE__ */ o.createElement(f, {
255
255
  symbol: N
256
- }) : null, /* @__PURE__ */ o.createElement(k, null, y.title), /* @__PURE__ */ o.createElement(z, c({}, y))), /* @__PURE__ */ o.createElement(s.Toggler, {
257
- onBlur: () => i(!1),
258
- onFocus: () => i(!0),
256
+ }) : null, /* @__PURE__ */ o.createElement(k, null, y.title), /* @__PURE__ */ o.createElement(z, c({}, y))), /* @__PURE__ */ o.createElement(i.Toggler, {
257
+ onBlur: () => s(!1),
258
+ onFocus: () => s(!0),
259
259
  className: "humany-guide-category-dropdown-toggler",
260
260
  onClick: () => {
261
261
  w(!l);
@@ -270,4 +270,4 @@ const se = m.div`
270
270
  export {
271
271
  Ce as default
272
272
  };
273
- //# sourceMappingURL=guide-category-dropdown.22199076.js.map
273
+ //# sourceMappingURL=guide-category-dropdown.4f6333ff.js.map
package/dist/guide-category-dropdown.4f6333ff.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"guide-category-dropdown.4f6333ff.js","sources":["../src/guide-category-dropdown.styles.ts","../src/guide-category-dropdown-match-count.tsx","../src/guide-category-dropdown-item.tsx","../src/guide-category-dropdown.tsx"],"sourcesContent":["import { css, Theme } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n borderTabStyle,\n contentBox,\n Link as BaseLink,\n linkTabStyle,\n List as BaseList,\n list,\n loadingOpacity,\n Text,\n} from '@telia-ace/knowledge-widget-ui';\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst Wrapper: any = styled.div<any>`\n ${loadingOpacity}\n ${contentBox}\n overflow: hidden;\n min-height: 50px;\n ${(p) =>\n p['data-toggler-in-focus'] &&\n p.isTabbing &&\n css`\n && {\n ${borderTabStyle(p)}\n }\n `};\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst Toggler: any = styled.button`\n background: none;\n border: 0;\n outline: 0;\n display: block;\n cursor: pointer;\n padding: 0;\n font-size: ${(p) => p.theme.fonts?.normal};\n text-align: end;\n flex: 1 0 auto;\n svg {\n path,\n line {\n stroke: ${(p) => p.theme.colors?.text};\n }\n }\n`;\n\nconst styling = (p: { theme: Theme; selected: boolean }) => css`\n font-size: ${p.theme.fonts?.normal};\n text-align: left;\n text-align: left;\n text-decoration: none;\n font-weight: 300;\n display: flex;\n align-items: center;\n padding: ${p.theme.sizes?.small};\n padding-left: ${p.theme.sizes?.large};\n cursor: pointer;\n overflow: hidden;\n ${p.selected\n ? css`\n border-left: 2px solid ${p.theme.colors?.primary};\n color: ${p.theme.colors?.primary};\n `\n : css`\n color: ${p.theme.colors?.text};\n `};\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n i {\n margin-right: ${p.theme.sizes?.normal};\n font-size: ${p.theme.fonts?.medium};\n min-height: 1em;\n min-width: 1em;\n }\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst Item: any = styled.div`\n ${styling}\n`;\n\nconst Link: any = styled(BaseLink)<any>`\n ${styling}\n &:focus {\n outline: none;\n }\n &:focus-visible {\n span {\n ${linkTabStyle};\n }\n }\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst TopItem: any = styled.div`\n display: flex;\n justify-content: space-between;\n padding-right: ${(p) => p.theme.sizes?.large};\n min-height: 52px;\n white-space: nowrap;\n\n && {\n font-weight: normal;\n\n a {\n font-weight: normal;\n }\n }\n .humany-guide-category-dropdown-item {\n font-weight: normal;\n }\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst List: any = styled(BaseList)<any>`\n ${list}\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-right: ${(p) => p.theme.sizes?.medium};\n margin-left: ${(p) => p.theme.sizes?.large};\n margin-bottom: 22px;\n border-left: ${(p) => p.theme.border};\n li {\n margin: 0 0 ${(p) => p.theme.sizes?.normal} -2px;\n }\n li:last-child {\n margin: 0 0 0 -2px;\n }\n flex-basis: 100%;\n border-width: 2px;\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst MatchCount: any = styled(Text)`\n margin: 0 0 0 ${(p) => p.theme.sizes?.small};\n`;\n\nexport default {\n Wrapper,\n Toggler,\n List,\n Item,\n Link,\n TopItem,\n MatchCount,\n};\n","import { Category } from '@telia-ace/knowledge-widget-core';\nimport { useProperties } from '@telia-ace/knowledge-widget-ui';\nimport React from 'react';\nimport { GuideCategoryDropdownComponentProps } from './guide-category-dropdown-component';\nimport Styled from './guide-category-dropdown.styles';\n\nconst GuideCategoryDropdownMatchCount: React.FC<Category> = ({ matches }) => {\n const { showMatchCount = false } = useProperties<GuideCategoryDropdownComponentProps>();\n\n if (!showMatchCount || typeof matches === 'undefined') {\n return null;\n }\n\n return <Styled.MatchCount>({matches})</Styled.MatchCount>;\n};\n\nexport default GuideCategoryDropdownMatchCount;\n","import { initialRouteFallback } from '@telia-ace/knowledge-widget-component-utilities';\nimport { Category } from '@telia-ace/knowledge-widget-core';\nimport { SymbolBadge, Text, useHover, useProperties } from '@telia-ace/knowledge-widget-ui';\nimport React from 'react';\nimport { GuideCategoryDropdownComponentProps } from './guide-category-dropdown-component';\nimport GuideCategoryDropdownMatchCount from './guide-category-dropdown-match-count';\nimport Styled from './guide-category-dropdown.styles';\n\ntype Props = {\n item: Category;\n guideCategory: string;\n};\n\nconst GuideCategoryDropdownItem: React.FC<Props> = ({ item, guideCategory }) => {\n const {\n route = 'browse',\n categoryAriaLabel = '',\n activeCategoryAriaLabel = '',\n fallbackOnInitialRoute = false,\n } = useProperties<GuideCategoryDropdownComponentProps>();\n const [hovering, elem] = useHover();\n const { id, title, symbol, activeSymbol } = item;\n\n const selected = guideCategory === id;\n return (\n <li ref={elem as any}>\n <Styled.Link\n {...initialRouteFallback(item, route, fallbackOnInitialRoute, 'category')}\n aria-pressed={selected}\n aria-label={(selected ? activeCategoryAriaLabel : categoryAriaLabel).replace(\n '{{category}}',\n title\n )}\n className=\"humany-guide-category-dropdown-link\"\n aria-current={selected}\n selected={selected}\n >\n {(selected || hovering) && activeSymbol ? (\n <SymbolBadge symbol={activeSymbol} />\n ) : (\n symbol && <SymbolBadge symbol={symbol} />\n )}\n <Text>{title}</Text>\n <GuideCategoryDropdownMatchCount {...item} />\n </Styled.Link>\n </li>\n );\n};\n\nexport default GuideCategoryDropdownItem;\n","import { Category } from '@telia-ace/knowledge-widget-core';\nimport {\n createEmptyComponent,\n SymbolBadge,\n Text,\n useContainer,\n useIsTabbing,\n useProperties,\n useRouteData,\n} from '@telia-ace/knowledge-widget-ui';\nimport { appendClassNames, createParams, formatUrl } from '@telia-ace/widget-utilities';\nimport React, { useEffect, useState } from 'react';\nimport { GuideCategoryDropdownComponentProps } from './guide-category-dropdown-component';\nimport GuideCategoryDropdownItem from './guide-category-dropdown-item';\nimport GuideCategoryDropdownMatchCount from './guide-category-dropdown-match-count';\nimport Styled from './guide-category-dropdown.styles';\n\ntype Props = {\n className: string;\n};\n\nconst GuideCategoryDropdown: React.FC<Props> = ({ className, ...other }) => {\n const routeData = useRouteData();\n const [togglerFocus, setTogglerFocus] = useState(false);\n const {\n parent,\n route = 'browse',\n categories = [],\n loading = false,\n } = useProperties<GuideCategoryDropdownComponentProps>();\n const container = useContainer();\n const [isOpen, setIsOpen] = useState(false);\n const { params } = routeData;\n const isTabbing = useIsTabbing();\n const { guideCategory, tag, phrase, sorting } = params;\n\n useEffect(() => {\n if (isOpen) {\n setIsOpen(false);\n }\n }, [guideCategory]);\n\n if (loading || !parent || !categories.length) {\n return createEmptyComponent(container, {\n ...other,\n className: appendClassNames(className, 'humany-guide-category-dropdown'),\n });\n }\n\n const selected = categories.find((category) => category.id === guideCategory) || parent;\n const selectedSymbol = selected.activeSymbol || selected.symbol;\n\n return (\n <Styled.Wrapper\n {...other}\n data-loading={false}\n data-toggler-in-focus={togglerFocus}\n aria-expanded={isOpen}\n isTabbing={isTabbing}\n className={appendClassNames(className, 'humany-guide-category-dropdown')}\n >\n {isOpen ? (\n <>\n <Styled.TopItem className=\"humany-guide-category-dropdown-top-item\">\n <Styled.Link\n className=\"humany-guide-category-dropdown-link\"\n routeName={route}\n params={createParams({\n tag,\n phrase,\n sorting,\n guideCategory: parent.id,\n uriName: formatUrl(parent.title),\n })}\n selected={false}\n >\n {parent.symbol ? <SymbolBadge symbol={parent.symbol} /> : null}\n <Text>{parent.title}</Text>\n <GuideCategoryDropdownMatchCount {...parent} />\n </Styled.Link>\n <Styled.Toggler\n onBlur={() => setTogglerFocus(false)}\n onFocus={() => setTogglerFocus(true)}\n className=\"humany-guide-category-dropdown-toggler\"\n onClick={() => {\n setIsOpen(!isOpen);\n }}\n aria-expanded=\"true\"\n aria-label={selected.title}\n >\n <SymbolBadge size={18} symbol={{ type: 'Svg', content: 'caret-up' }} />\n </Styled.Toggler>\n </Styled.TopItem>\n <Styled.List\n className=\"humany-guide-category-dropdown-open\"\n items={categories}\n renderItem={(item: Category) => (\n <GuideCategoryDropdownItem\n key={item.id}\n item={item}\n guideCategory={guideCategory}\n />\n )}\n />\n </>\n ) : (\n <Styled.TopItem className=\"humany-guide-category-dropdown-top-item\">\n <Styled.Item\n className=\"humany-guide-category-dropdown-item\"\n onClick={() => {\n setIsOpen(!isOpen);\n }}\n selected={false}\n >\n {selectedSymbol ? <SymbolBadge symbol={selectedSymbol} /> : null}\n <Text>{selected.title}</Text>\n <GuideCategoryDropdownMatchCount {...selected} />\n </Styled.Item>\n <Styled.Toggler\n onBlur={() => setTogglerFocus(false)}\n onFocus={() => setTogglerFocus(true)}\n className=\"humany-guide-category-dropdown-toggler\"\n onClick={() => {\n setIsOpen(!isOpen);\n }}\n aria-expanded=\"false\"\n aria-label={selected.title}\n >\n <SymbolBadge size={18} symbol={{ type: 'Svg', content: 'caret-down' }} />\n </Styled.Toggler>\n </Styled.TopItem>\n )}\n </Styled.Wrapper>\n );\n};\n\nexport default GuideCategoryDropdown;\n"],"names":["Wrapper","styled","loadingOpacity","contentBox","p","css","borderTabStyle","Toggler","_a","styling","_b","_c","_d","_e","_f","_g","_h","Item","Link","BaseLink","linkTabStyle","TopItem","List","BaseList","list","MatchCount","Text","Styled","GuideCategoryDropdownMatchCount","matches","showMatchCount","useProperties","GuideCategoryDropdownMatchCount$1","GuideCategoryDropdownItem","item","guideCategory","route","categoryAriaLabel","activeCategoryAriaLabel","fallbackOnInitialRoute","hovering","elem","useHover","id","title","symbol","activeSymbol","selected","React","__spreadProps","__spreadValues","initialRouteFallback","SymbolBadge","GuideCategoryDropdownItem$1","GuideCategoryDropdown","className","other","__objRest","routeData","useRouteData","togglerFocus","setTogglerFocus","useState","parent","categories","loading","container","useContainer","isOpen","setIsOpen","params","isTabbing","useIsTabbing","tag","phrase","sorting","useEffect","createEmptyComponent","appendClassNames","category","selectedSymbol","createParams","formatUrl"],"mappings":"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"}
package/dist/index.js CHANGED
@@ -17,7 +17,7 @@ const P = (e, n, a) => !a || a.length < 1 ? n : h(e, n, null, a), h = (e, n, a,
17
17
  return C(
18
18
  e,
19
19
  "guide-category-dropdown",
20
- import("./guide-category-dropdown.22199076.js"),
20
+ import("./guide-category-dropdown.4f6333ff.js"),
21
21
  (i) => {
22
22
  const s = (t) => {
23
23
  i.writeProperties({ loading: !0 }), i.actions.dispatch("fetch", { params: t }).then(() => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telia-ace/knowledge-widget-components-guide-category-dropdown",
3
- "version": "1.0.24-next.3",
3
+ "version": "1.0.24-next.4",
4
4
  "description": "Guide category dropdown component for ACE Knowledge Widgets.",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "author": "Telia Company AB",
@@ -26,7 +26,7 @@
26
26
  },
27
27
  "sideEffects": false,
28
28
  "dependencies": {
29
- "@telia-ace/knowledge-widget-component-utilities": "^1.0.24-next.3",
29
+ "@telia-ace/knowledge-widget-component-utilities": "^1.0.24-next.4",
30
30
  "@telia-ace/knowledge-widget-core": "next",
31
31
  "@telia-ace/knowledge-widget-types-grid": "next",
32
32
  "@telia-ace/knowledge-widget-ui": "next",
@@ -47,5 +47,5 @@
47
47
  "react": "^18.2.0",
48
48
  "react-dom": "^18.2.0"
49
49
  },
50
- "gitHead": "035b7b89fbf7c736993d70e6dc4e420b8218a3a4"
50
+ "gitHead": "a56bbf9adaca1b07bf91566001480e28e81a8306"
51
51
  }
package/dist/guide-category-dropdown.22199076.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"guide-category-dropdown.22199076.js","sources":["../src/guide-category-dropdown.styles.ts","../src/guide-category-dropdown-match-count.tsx","../src/guide-category-dropdown-item.tsx","../src/guide-category-dropdown.tsx"],"sourcesContent":["import { css, Theme } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n borderTabStyle,\n contentBox,\n Link as BaseLink,\n linkTabStyle,\n List as BaseList,\n list,\n loadingOpacity,\n Text,\n} from '@telia-ace/knowledge-widget-ui';\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst Wrapper: any = styled.div<any>`\n ${loadingOpacity}\n ${contentBox}\n overflow: hidden;\n min-height: 50px;\n ${(p) =>\n p['data-toggler-in-focus'] &&\n p.isTabbing &&\n css`\n && {\n ${borderTabStyle(p)}\n }\n `};\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst Toggler: any = styled.button`\n background: none;\n border: 0;\n outline: 0;\n display: block;\n cursor: pointer;\n padding: 0;\n font-size: ${(p) => p.theme.fonts?.normal};\n text-align: end;\n flex: 1 0 auto;\n svg {\n path,\n line {\n stroke: ${(p) => p.theme.colors?.text};\n }\n }\n`;\n\nconst styling = (p: { theme: Theme; selected: boolean }) => css`\n font-size: ${p.theme.fonts?.normal};\n text-align: left;\n text-align: left;\n text-decoration: none;\n font-weight: 300;\n display: flex;\n align-items: center;\n padding: ${p.theme.sizes?.small};\n padding-left: ${p.theme.sizes?.large};\n cursor: pointer;\n overflow: hidden;\n ${p.selected\n ? css`\n border-left: 2px solid ${p.theme.colors?.primary};\n color: ${p.theme.colors?.primary};\n `\n : css`\n color: ${p.theme.colors?.text};\n `};\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n i {\n margin-right: ${p.theme.sizes?.normal};\n font-size: ${p.theme.fonts?.medium};\n min-height: 1em;\n min-width: 1em;\n }\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst Item: any = styled.div`\n ${styling}\n`;\n\nconst Link: any = styled(BaseLink)<any>`\n ${styling}\n &:focus {\n outline: none;\n }\n &:focus-visible {\n span {\n ${linkTabStyle};\n }\n }\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst TopItem: any = styled.div`\n display: flex;\n justify-content: space-between;\n padding-right: ${(p) => p.theme.sizes?.large};\n min-height: 52px;\n white-space: nowrap;\n\n && {\n font-weight: normal;\n\n a {\n font-weight: normal;\n }\n }\n ${Item} {\n font-weight: normal;\n }\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst List: any = styled(BaseList)<any>`\n ${list}\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-right: ${(p) => p.theme.sizes?.medium};\n margin-left: ${(p) => p.theme.sizes?.large};\n margin-bottom: 22px;\n border-left: ${(p) => p.theme.border};\n li {\n margin: 0 0 ${(p) => p.theme.sizes?.normal} -2px;\n }\n li:last-child {\n margin: 0 0 0 -2px;\n }\n flex-basis: 100%;\n border-width: 2px;\n`;\n\n// FUTURE TODO: Look into the typescript error when removing \": any\".\nconst MatchCount: any = styled(Text)`\n margin: 0 0 0 ${(p) => p.theme.sizes?.small};\n`;\n\nexport default {\n Wrapper,\n Toggler,\n List,\n Item,\n Link,\n TopItem,\n MatchCount,\n};\n","import { Category } from '@telia-ace/knowledge-widget-core';\nimport { useProperties } from '@telia-ace/knowledge-widget-ui';\nimport React from 'react';\nimport { GuideCategoryDropdownComponentProps } from './guide-category-dropdown-component';\nimport Styled from './guide-category-dropdown.styles';\n\nconst GuideCategoryDropdownMatchCount: React.FC<Category> = ({ matches }) => {\n const { showMatchCount = false } = useProperties<GuideCategoryDropdownComponentProps>();\n\n if (!showMatchCount || typeof matches === 'undefined') {\n return null;\n }\n\n return <Styled.MatchCount>({matches})</Styled.MatchCount>;\n};\n\nexport default GuideCategoryDropdownMatchCount;\n","import { initialRouteFallback } from '@telia-ace/knowledge-widget-component-utilities';\nimport { Category } from '@telia-ace/knowledge-widget-core';\nimport { SymbolBadge, Text, useHover, useProperties } from '@telia-ace/knowledge-widget-ui';\nimport React from 'react';\nimport { GuideCategoryDropdownComponentProps } from './guide-category-dropdown-component';\nimport GuideCategoryDropdownMatchCount from './guide-category-dropdown-match-count';\nimport Styled from './guide-category-dropdown.styles';\n\ntype Props = {\n item: Category;\n guideCategory: string;\n};\n\nconst GuideCategoryDropdownItem: React.FC<Props> = ({ item, guideCategory }) => {\n const {\n route = 'browse',\n categoryAriaLabel = '',\n activeCategoryAriaLabel = '',\n fallbackOnInitialRoute = false,\n } = useProperties<GuideCategoryDropdownComponentProps>();\n const [hovering, elem] = useHover();\n const { id, title, symbol, activeSymbol } = item;\n\n const selected = guideCategory === id;\n return (\n <li ref={elem as any}>\n <Styled.Link\n {...initialRouteFallback(item, route, fallbackOnInitialRoute, 'category')}\n aria-pressed={selected}\n aria-label={(selected ? activeCategoryAriaLabel : categoryAriaLabel).replace(\n '{{category}}',\n title\n )}\n className=\"humany-guide-category-dropdown-link\"\n aria-current={selected}\n selected={selected}\n >\n {(selected || hovering) && activeSymbol ? (\n <SymbolBadge symbol={activeSymbol} />\n ) : (\n symbol && <SymbolBadge symbol={symbol} />\n )}\n <Text>{title}</Text>\n <GuideCategoryDropdownMatchCount {...item} />\n </Styled.Link>\n </li>\n );\n};\n\nexport default GuideCategoryDropdownItem;\n","import { Category } from '@telia-ace/knowledge-widget-core';\nimport {\n createEmptyComponent,\n SymbolBadge,\n Text,\n useContainer,\n useIsTabbing,\n useProperties,\n useRouteData,\n} from '@telia-ace/knowledge-widget-ui';\nimport { appendClassNames, createParams, formatUrl } from '@telia-ace/widget-utilities';\nimport React, { useEffect, useState } from 'react';\nimport { GuideCategoryDropdownComponentProps } from './guide-category-dropdown-component';\nimport GuideCategoryDropdownItem from './guide-category-dropdown-item';\nimport GuideCategoryDropdownMatchCount from './guide-category-dropdown-match-count';\nimport Styled from './guide-category-dropdown.styles';\n\ntype Props = {\n className: string;\n};\n\nconst GuideCategoryDropdown: React.FC<Props> = ({ className, ...other }) => {\n const routeData = useRouteData();\n const [togglerFocus, setTogglerFocus] = useState(false);\n const {\n parent,\n route = 'browse',\n categories = [],\n loading = false,\n } = useProperties<GuideCategoryDropdownComponentProps>();\n const container = useContainer();\n const [isOpen, setIsOpen] = useState(false);\n const { params } = routeData;\n const isTabbing = useIsTabbing();\n const { guideCategory, tag, phrase, sorting } = params;\n\n useEffect(() => {\n if (isOpen) {\n setIsOpen(false);\n }\n }, [guideCategory]);\n\n if (loading || !parent || !categories.length) {\n return createEmptyComponent(container, {\n ...other,\n className: appendClassNames(className, 'humany-guide-category-dropdown'),\n });\n }\n\n const selected = categories.find((category) => category.id === guideCategory) || parent;\n const selectedSymbol = selected.activeSymbol || selected.symbol;\n\n return (\n <Styled.Wrapper\n {...other}\n data-loading={false}\n data-toggler-in-focus={togglerFocus}\n aria-expanded={isOpen}\n isTabbing={isTabbing}\n className={appendClassNames(className, 'humany-guide-category-dropdown')}\n >\n {isOpen ? (\n <>\n <Styled.TopItem className=\"humany-guide-category-dropdown-top-item\">\n <Styled.Link\n className=\"humany-guide-category-dropdown-link\"\n routeName={route}\n params={createParams({\n tag,\n phrase,\n sorting,\n guideCategory: parent.id,\n uriName: formatUrl(parent.title),\n })}\n selected={false}\n >\n {parent.symbol ? <SymbolBadge symbol={parent.symbol} /> : null}\n <Text>{parent.title}</Text>\n <GuideCategoryDropdownMatchCount {...parent} />\n </Styled.Link>\n <Styled.Toggler\n onBlur={() => setTogglerFocus(false)}\n onFocus={() => setTogglerFocus(true)}\n className=\"humany-guide-category-dropdown-toggler\"\n onClick={() => {\n setIsOpen(!isOpen);\n }}\n aria-expanded=\"true\"\n aria-label={selected.title}\n >\n <SymbolBadge size={18} symbol={{ type: 'Svg', content: 'caret-up' }} />\n </Styled.Toggler>\n </Styled.TopItem>\n <Styled.List\n className=\"humany-guide-category-dropdown-open\"\n items={categories}\n renderItem={(item: Category) => (\n <GuideCategoryDropdownItem\n key={item.id}\n item={item}\n guideCategory={guideCategory}\n />\n )}\n />\n </>\n ) : (\n <Styled.TopItem className=\"humany-guide-category-dropdown-top-item\">\n <Styled.Item\n className=\"humany-guide-category-dropdown-item\"\n onClick={() => {\n setIsOpen(!isOpen);\n }}\n selected={false}\n >\n {selectedSymbol ? <SymbolBadge symbol={selectedSymbol} /> : null}\n <Text>{selected.title}</Text>\n <GuideCategoryDropdownMatchCount {...selected} />\n </Styled.Item>\n <Styled.Toggler\n onBlur={() => setTogglerFocus(false)}\n onFocus={() => setTogglerFocus(true)}\n className=\"humany-guide-category-dropdown-toggler\"\n onClick={() => {\n setIsOpen(!isOpen);\n }}\n aria-expanded=\"false\"\n aria-label={selected.title}\n >\n <SymbolBadge size={18} symbol={{ type: 'Svg', content: 'caret-down' }} />\n </Styled.Toggler>\n </Styled.TopItem>\n )}\n </Styled.Wrapper>\n );\n};\n\nexport default GuideCategoryDropdown;\n"],"names":["Wrapper","styled","loadingOpacity","contentBox","p","css","borderTabStyle","Toggler","_a","styling","_b","_c","_d","_e","_f","_g","_h","Item","Link","BaseLink","linkTabStyle","TopItem","List","BaseList","list","MatchCount","Text","Styled","GuideCategoryDropdownMatchCount","matches","showMatchCount","useProperties","GuideCategoryDropdownMatchCount$1","GuideCategoryDropdownItem","item","guideCategory","route","categoryAriaLabel","activeCategoryAriaLabel","fallbackOnInitialRoute","hovering","elem","useHover","id","title","symbol","activeSymbol","selected","React","__spreadProps","__spreadValues","initialRouteFallback","SymbolBadge","GuideCategoryDropdownItem$1","GuideCategoryDropdown","className","other","__objRest","routeData","useRouteData","togglerFocus","setTogglerFocus","useState","parent","categories","loading","container","useContainer","isOpen","setIsOpen","params","isTabbing","useIsTabbing","tag","phrase","sorting","useEffect","createEmptyComponent","appendClassNames","category","selectedSymbol","createParams","formatUrl"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAMA,KAAeC,EAAO;AAAA,MACtBC;AAAA,MACAC;AAAA;AAAA;AAAA,MAGA,CAACC,MACCA,EAAE,4BACFA,EAAE,aACFC;AAAA;AAAA,kBAEUC,EAAeF,CAAC;AAAA;AAAA;AAAA,GAM5BG,KAAeN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOX,CAACG,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMjB,CAACJ,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,WAAR,gBAAAI,EAAgB;AAAA;AAAA;AAAA;AAAA,GAKvCC,IAAU,CAACL,MAA2C;;AAAA,SAAAC;AAAA,kBAC3CG,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAOjBE,IAAAN,EAAE,MAAM,UAAR,gBAAAM,EAAe;AAAA,qBACVC,IAAAP,EAAE,MAAM,UAAR,gBAAAO,EAAe;AAAA;AAAA;AAAA,MAG7BP,EAAE,WACEC;AAAA,wCAC6BO,IAAAR,EAAE,MAAM,WAAR,gBAAAQ,EAAgB;AAAA,wBAChCC,IAAAT,EAAE,MAAM,WAAR,gBAAAS,EAAgB;AAAA,cAE7BR;AAAA,wBACaS,IAAAV,EAAE,MAAM,WAAR,gBAAAU,EAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBASfC,IAAAX,EAAE,MAAM,UAAR,gBAAAW,EAAe;AAAA,sBAClBC,IAAAZ,EAAE,MAAM,UAAR,gBAAAY,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA,GAO9BC,IAAYhB,EAAO;AAAA,MACnBQ;AAAA,GAGAS,KAAYjB,EAAOkB,CAAQ;AAAA,MAC3BV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMQW;AAAA;AAAA;AAAA,GAMRC,KAAepB,EAAO;AAAA;AAAA;AAAA,qBAGP,CAACG,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAWrCS;AAAA;AAAA;AAAA,GAMAK,KAAYrB,EAAOsB,CAAQ;AAAA,MAC3BC;AAAA;AAAA;AAAA;AAAA,oBAIc,CAACpB,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA,mBACvB,CAACJ,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA;AAAA,mBAEtB,CAACJ,MAAMA,EAAE,MAAM;AAAA;AAAA,sBAEZ,CAACA,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUtCiB,KAAkBxB,EAAOyB,CAAI;AAAA,oBACf,CAACtB,MAAM;;AAAA,UAAAI,IAAAJ,EAAE,MAAM,UAAR,gBAAAI,EAAe;AAAA;AAAA,GAG3BmB,IAAA;AAAA,EACX,SAAA3B;AAAA,EACA,SAAAO;AAAA,EACA,MAAAe;AAAA,EACA,MAAAL;AAAA,EACA,MAAAC;AAAA,EACA,SAAAG;AAAA,EACA,YAAAI;AACJ,GClJMG,KAAsD,CAAC,EAAE,SAAAC,QAAc;AACzE,QAAM,EAAE,gBAAAC,IAAiB,GAAM,IAAIC,EAAmD;AAEtF,SAAI,CAACD,KAAkB,OAAOD,KAAY,cAC/B,uCAGHF,EAAO,YAAP,MAAkB,KAAEE,GAAQ,GAAC;AACzC,GAEAG,IAAeJ,ICHTK,KAA6C,CAAC,EAAE,MAAAC,GAAM,eAAAC,QAAoB;AACtE,QAAA;AAAA,IACF,OAAAC,IAAQ;AAAA,IACR,mBAAAC,IAAoB;AAAA,IACpB,yBAAAC,IAA0B;AAAA,IAC1B,wBAAAC,IAAyB;AAAA,MACzBR,EAAmD,GACjD,CAACS,GAAUC,CAAI,IAAIC,EAAS,GAC5B,EAAE,IAAAC,GAAI,OAAAC,GAAO,QAAAC,GAAQ,cAAAC,MAAiBZ,GAEtCa,IAAWZ,MAAkBQ;AACnC,SACK,gBAAAK,EAAA,cAAA,MAAA;AAAA,IAAG,KAAKP;AAAA,EACL,GAAA,gBAAAO,EAAA,cAACrB,EAAO,MAAPsB,EAAAC,EAAA,IACOC,GAAqBjB,GAAME,GAAOG,GAAwB,UAAU,IAD3E;AAAA,IAEG,gBAAcQ;AAAA,IACd,eAAaA,IAAWT,IAA0BD,GAAmB;AAAA,MACjE;AAAA,MACAO;AAAA,IACJ;AAAA,IACA,WAAU;AAAA,IACV,gBAAcG;AAAA,IACd,UAAAA;AAAA,EAAA,KAEEA,KAAYP,MAAaM,IACtB,gBAAAE,EAAA,cAAAI,GAAA;AAAA,IAAY,QAAQN;AAAA,EAAc,CAAA,IAEnCD,KAAW,gBAAAG,EAAA,cAAAI,GAAA;AAAA,IAAY,QAAAP;AAAA,EAAA,CAAgB,GAE3C,gBAAAG,EAAA,cAACtB,GAAM,MAAAkB,CAAM,GACZ,gBAAAI,EAAA,cAAApB,GAAAsB,EAAA,IAAoChB,EAAM,CAC/C,CACJ;AAER,GAEAmB,KAAepB,IC5BTqB,KAAyC,CAAC9C,MAA4B;AAA5B,MAAAE,IAAAF,GAAE,aAAA+C,MAAF7C,GAAgB8C,IAAAC,EAAhB/C,GAAgB,CAAd;AAC9C,QAAMgD,IAAYC,KACZ,CAACC,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChD;AAAA,IACF,QAAAC;AAAA,IACA,OAAA3B,IAAQ;AAAA,IACR,YAAA4B,IAAa,CAAC;AAAA,IACd,SAAAC,IAAU;AAAA,MACVlC,EAAmD,GACjDmC,IAAYC,MACZ,CAACC,GAAQC,CAAS,IAAIP,EAAS,EAAK,GACpC,EAAE,QAAAQ,EAAW,IAAAZ,GACba,IAAYC,MACZ,EAAE,eAAArC,GAAe,KAAAsC,GAAK,QAAAC,GAAQ,SAAAC,MAAYL;AAQhD,MANAM,GAAU,MAAM;AACZ,IAAIR,KACAC,EAAU,EAAK;AAAA,EACnB,GACD,CAAClC,CAAa,CAAC,GAEd8B,KAAW,CAACF,KAAU,CAACC,EAAW;AAClC,WAAOa,GAAqBX,GAAWjB,EAAAC,EAAA,IAChCM,IADgC;AAAA,MAEnC,WAAWsB,EAAiBvB,GAAW,gCAAgC;AAAA,IAAA,EAC1E;AAGC,QAAAR,IAAWiB,EAAW,KAAK,CAACe,MAAaA,EAAS,OAAO5C,CAAa,KAAK4B,GAC3EiB,IAAiBjC,EAAS,gBAAgBA,EAAS;AAGrD,SAAA,gBAAAC,EAAA,cAACrB,EAAO,SAAPsB,EAAAC,EAAA,IACOM,IADP;AAAA,IAEG,gBAAc;AAAA,IACd,yBAAuBI;AAAA,IACvB,iBAAeQ;AAAA,IACf,WAAAG;AAAA,IACA,WAAWO,EAAiBvB,GAAW,gCAAgC;AAAA,EAAA,IAEtEa,IACG,gBAAApB,EAAA,cAAAA,EAAA,UAAA,MACK,gBAAAA,EAAA,cAAArB,EAAO,SAAP;AAAA,IAAe,WAAU;AAAA,EACtB,GAAA,gBAAAqB,EAAA,cAACrB,EAAO,MAAP;AAAA,IACG,WAAU;AAAA,IACV,WAAWS;AAAA,IACX,QAAQ6C,GAAa;AAAA,MACjB,KAAAR;AAAA,MACA,QAAAC;AAAA,MACA,SAAAC;AAAA,MACA,eAAeZ,EAAO;AAAA,MACtB,SAASmB,GAAUnB,EAAO,KAAK;AAAA,IAAA,CAClC;AAAA,IACD,UAAU;AAAA,EAET,GAAAA,EAAO,SAAU,gBAAAf,EAAA,cAAAI,GAAA;AAAA,IAAY,QAAQW,EAAO;AAAA,EAAQ,CAAA,IAAK,MAC1D,gBAAAf,EAAA,cAACtB,SAAMqC,EAAO,KAAM,GACnB,gBAAAf,EAAA,cAAApB,GAAAsB,EAAA,IAAoCa,EAAQ,CACjD,GACC,gBAAAf,EAAA,cAAArB,EAAO,SAAP;AAAA,IACG,QAAQ,MAAMkC,EAAgB,EAAK;AAAA,IACnC,SAAS,MAAMA,EAAgB,EAAI;AAAA,IACnC,WAAU;AAAA,IACV,SAAS,MAAM;AACX,MAAAQ,EAAU,CAACD,CAAM;AAAA,IACrB;AAAA,IACA,iBAAc;AAAA,IACd,cAAYrB,EAAS;AAAA,EAAA,GAEpB,gBAAAC,EAAA,cAAAI,GAAA;AAAA,IAAY,MAAM;AAAA,IAAI,QAAQ,EAAE,MAAM,OAAO,SAAS,WAAW;AAAA,EAAG,CAAA,CACzE,CACJ,GACA,gBAAAJ,EAAA,cAACrB,EAAO,MAAP;AAAA,IACG,WAAU;AAAA,IACV,OAAOqC;AAAA,IACP,YAAY,CAAC9B,MACR,gBAAAc,EAAA,cAAAf,IAAA;AAAA,MACG,KAAKC,EAAK;AAAA,MACV,MAAAA;AAAA,MACA,eAAAC;AAAA,IAAA,CACJ;AAAA,EAER,CAAA,CACJ,IAEC,gBAAAa,EAAA,cAAArB,EAAO,SAAP;AAAA,IAAe,WAAU;AAAA,EACtB,GAAA,gBAAAqB,EAAA,cAACrB,EAAO,MAAP;AAAA,IACG,WAAU;AAAA,IACV,SAAS,MAAM;AACX,MAAA0C,EAAU,CAACD,CAAM;AAAA,IACrB;AAAA,IACA,UAAU;AAAA,EAAA,GAETY,IAAkB,gBAAAhC,EAAA,cAAAI,GAAA;AAAA,IAAY,QAAQ4B;AAAA,EAAgB,CAAA,IAAK,MAC5D,gBAAAhC,EAAA,cAACtB,SAAMqB,EAAS,KAAM,GACrB,gBAAAC,EAAA,cAAApB,GAAAsB,EAAA,IAAoCH,EAAU,CACnD,GACC,gBAAAC,EAAA,cAAArB,EAAO,SAAP;AAAA,IACG,QAAQ,MAAMkC,EAAgB,EAAK;AAAA,IACnC,SAAS,MAAMA,EAAgB,EAAI;AAAA,IACnC,WAAU;AAAA,IACV,SAAS,MAAM;AACX,MAAAQ,EAAU,CAACD,CAAM;AAAA,IACrB;AAAA,IACA,iBAAc;AAAA,IACd,cAAYrB,EAAS;AAAA,EAAA,GAEpB,gBAAAC,EAAA,cAAAI,GAAA;AAAA,IAAY,MAAM;AAAA,IAAI,QAAQ,EAAE,MAAM,OAAO,SAAS,aAAa;AAAA,EAAA,CAAG,CAC3E,CACJ,CAER;AAER;"}