@breadstone/mosaik-elements-foundation 0.0.235 → 0.0.238

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 (45) hide show
  1. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.d.ts +23 -1
  2. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.d.ts.map +1 -1
  3. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.js +37 -20
  4. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.js.map +1 -1
  5. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.d.ts.map +1 -1
  6. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.js +13 -1
  7. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.js.map +1 -1
  8. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.d.ts +64 -7
  9. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.d.ts.map +1 -1
  10. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.js +135 -12
  11. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.js.map +1 -1
  12. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElementTemplate.d.ts.map +1 -1
  13. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElementTemplate.js +18 -8
  14. package/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElementTemplate.js.map +1 -1
  15. package/Controls/Components/Grouping/Breadcrumb/IBreadcrumbItemElementProps.d.ts +7 -1
  16. package/Controls/Components/Grouping/Breadcrumb/IBreadcrumbItemElementProps.d.ts.map +1 -1
  17. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Cosmopolitan.d.ts.map +1 -1
  18. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Cosmopolitan.js +31 -3
  19. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Cosmopolitan.js.map +1 -1
  20. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Joy.d.ts.map +1 -1
  21. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Joy.js +67 -3
  22. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Joy.js.map +1 -1
  23. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Memphis.d.ts.map +1 -1
  24. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Memphis.js +31 -3
  25. package/Controls/Components/Grouping/Breadcrumb/Themes/BreadcrumbItemElement.Memphis.js.map +1 -1
  26. package/Controls/Components/Selectors/Table/Themes/TableElement.Cosmopolitan.d.ts.map +1 -1
  27. package/Controls/Components/Selectors/Table/Themes/TableElement.Cosmopolitan.js +19 -0
  28. package/Controls/Components/Selectors/Table/Themes/TableElement.Cosmopolitan.js.map +1 -1
  29. package/Controls/Components/Selectors/Table/Themes/TableElement.Joy.d.ts.map +1 -1
  30. package/Controls/Components/Selectors/Table/Themes/TableElement.Joy.js +19 -0
  31. package/Controls/Components/Selectors/Table/Themes/TableElement.Joy.js.map +1 -1
  32. package/Controls/Components/Selectors/Table/Themes/TableElement.Memphis.d.ts.map +1 -1
  33. package/Controls/Components/Selectors/Table/Themes/TableElement.Memphis.js +19 -0
  34. package/Controls/Components/Selectors/Table/Themes/TableElement.Memphis.js.map +1 -1
  35. package/Theming/IThemeService.d.ts +7 -0
  36. package/Theming/IThemeService.d.ts.map +1 -1
  37. package/Theming/IThemeService.js.map +1 -1
  38. package/Theming/Theme2Element.d.ts.map +1 -1
  39. package/Theming/Theme2Element.js +3 -2
  40. package/Theming/Theme2Element.js.map +1 -1
  41. package/Theming/ThemeService.d.ts.map +1 -1
  42. package/Theming/ThemeService.js +12 -6
  43. package/Theming/ThemeService.js.map +1 -1
  44. package/custom-elements.json +157 -26
  45. package/package.json +3 -3
@@ -1,4 +1,5 @@
1
1
  import { CustomElement } from '../../Abstracts/CustomElement';
2
+ import { BreadcrumbItemElement } from './BreadcrumbItemElement';
2
3
  import type { IBreadcrumbElementProps } from './IBreadcrumbElementProps';
3
4
  declare const BreadcrumbElement_base: (abstract new (...args: Array<any>) => import("../../../../Controls/Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../../Controls/Behaviors/Themeable").IThemeableCtor;
4
5
  /**
@@ -14,6 +15,9 @@ declare const BreadcrumbElement_base: (abstract new (...args: Array<any>) => imp
14
15
  * @category Navigation
15
16
  *
16
17
  * @slot - The default slot.
18
+ * @slot item-${i} - The item-${i} slot.
19
+ *
20
+ * @csspart symbol - The symbol part.
17
21
  *
18
22
  * @cssprop {String} --breadcrumb-font-family - The font family CSS custom property.
19
23
  * @cssprop {String} --breadcrumb-font-letter-spacing - The font letter spacing CSS custom property.
@@ -38,6 +42,8 @@ declare const BreadcrumbElement_base: (abstract new (...args: Array<any>) => imp
38
42
  * @cssprop {String} --breadcrumb-transition-property - The transition property CSS custom property.
39
43
  * @cssprop {String} --breadcrumb-translate - The translate CSS custom property.
40
44
  *
45
+ * @dependency mosaik-icon - The Icon element.
46
+ *
41
47
  * @example
42
48
  * Basic breadcrumb navigation trail:
43
49
  * ```html
@@ -63,8 +69,8 @@ declare const BreadcrumbElement_base: (abstract new (...args: Array<any>) => imp
63
69
  * @public
64
70
  */
65
71
  export declare class BreadcrumbElement extends BreadcrumbElement_base implements IBreadcrumbElementProps {
66
- private readonly _breadcrumbs;
67
72
  private _wrap;
73
+ private _items;
68
74
  /**
69
75
  * @public
70
76
  */
@@ -86,6 +92,22 @@ export declare class BreadcrumbElement extends BreadcrumbElement_base implements
86
92
  */
87
93
  get wrap(): boolean;
88
94
  set wrap(value: boolean);
95
+ /**
96
+ * Returns the breadcrumb items.
97
+ *
98
+ * @private
99
+ * @template
100
+ * @readonly
101
+ */
102
+ get items(): Array<BreadcrumbItemElement>;
103
+ /**
104
+ * Handles slot changes on the collector slot.
105
+ * Collects items and assigns them to named slots.
106
+ *
107
+ * @private
108
+ * @template
109
+ */
110
+ onSlotChange(event: Event): void;
89
111
  }
90
112
  /**
91
113
  * @public
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAG9D,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAOzE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4DG;AACH,qBAYa,iBACT,SAAQ,sBACR,YAAW,uBAAuB;IAQlC,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAgC;IAC7D,OAAO,CAAC,KAAK,CAAU;IAMvB;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,IAAI,IAAI,OAAO,CAEzB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,OAAO,EAK7B;CA0BJ;AAED;;GAEG;AACH,yBAAiB,iBAAiB,CAAC;IAC/B,KAAY,KAAK,GAAG,uBAAuB,CAAC;CAC/C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,mBAAmB,EAAE,iBAAiB,CAAC;KAC1C;CACJ"}
1
+ {"version":3,"file":"BreadcrumbElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAG9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAOzE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiEG;AACH,qBAaa,iBACT,SAAQ,sBACR,YAAW,uBAAuB;IAIlC,OAAO,CAAC,KAAK,CAAU;IACvB,OAAO,CAAC,MAAM,CAA+B;IAM7C;;OAEG;;IAYH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,IAAI,IAAI,OAAO,CAEzB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,OAAO,EAK7B;IAED;;;;;;OAMG;IACH,IAAW,KAAK,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAE/C;IAMD;;;;;;OAMG;IACI,YAAY,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;CAyB1C;AAED;;GAEG;AACH,yBAAiB,iBAAiB,CAAC;IAC/B,KAAY,KAAK,GAAG,uBAAuB,CAAC;CAC/C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,mBAAmB,EAAE,iBAAiB,CAAC;KAC1C;CACJ"}
@@ -11,8 +11,8 @@ var __metadata = (this && this.__metadata) || function (k, v) {
11
11
  import { Themeable } from '../../../../Controls/Behaviors/Themeable';
12
12
  import { Attribute } from '../../../Decorators/AttributeDecorator';
13
13
  import { Component } from '../../../Decorators/ComponentDecorator';
14
- import { QueryAssignedElements } from '../../../Decorators/Decorators';
15
14
  import { CustomElement } from '../../Abstracts/CustomElement';
15
+ import { IconElement } from '../../Media/Icon/IconElement';
16
16
  import { breadcrumbElementTemplate } from './BreadcrumbElementTemplate';
17
17
  import { BreadcrumbItemElement } from './BreadcrumbItemElement';
18
18
  import { breadcrumbElementCosmopolitanStyle } from './Themes/BreadcrumbElement.Cosmopolitan';
@@ -32,6 +32,9 @@ import { breadcrumbElementMemphisStyle } from './Themes/BreadcrumbElement.Memphi
32
32
  * @category Navigation
33
33
  *
34
34
  * @slot - The default slot.
35
+ * @slot item-${i} - The item-${i} slot.
36
+ *
37
+ * @csspart symbol - The symbol part.
35
38
  *
36
39
  * @cssprop {String} --breadcrumb-font-family - The font family CSS custom property.
37
40
  * @cssprop {String} --breadcrumb-font-letter-spacing - The font letter spacing CSS custom property.
@@ -56,6 +59,8 @@ import { breadcrumbElementMemphisStyle } from './Themes/BreadcrumbElement.Memphi
56
59
  * @cssprop {String} --breadcrumb-transition-property - The transition property CSS custom property.
57
60
  * @cssprop {String} --breadcrumb-translate - The translate CSS custom property.
58
61
  *
62
+ * @dependency mosaik-icon - The Icon element.
63
+ *
59
64
  * @example
60
65
  * Basic breadcrumb navigation trail:
61
66
  * ```html
@@ -82,8 +87,8 @@ import { breadcrumbElementMemphisStyle } from './Themes/BreadcrumbElement.Memphi
82
87
  */
83
88
  let BreadcrumbElement = class BreadcrumbElement extends Themeable(CustomElement) {
84
89
  // #region Fields
85
- _breadcrumbs;
86
90
  _wrap;
91
+ _items;
87
92
  // #endregion
88
93
  // #region Ctor
89
94
  /**
@@ -92,6 +97,7 @@ let BreadcrumbElement = class BreadcrumbElement extends Themeable(CustomElement)
92
97
  constructor() {
93
98
  super();
94
99
  this._wrap = false;
100
+ this._items = [];
95
101
  }
96
102
  // #endregion
97
103
  // #region Properties
@@ -121,32 +127,42 @@ let BreadcrumbElement = class BreadcrumbElement extends Themeable(CustomElement)
121
127
  this.requestUpdate('wrap');
122
128
  }
123
129
  }
130
+ /**
131
+ * Returns the breadcrumb items.
132
+ *
133
+ * @private
134
+ * @template
135
+ * @readonly
136
+ */
137
+ get items() {
138
+ return this._items;
139
+ }
124
140
  // #endregion
125
141
  // #region Methods
126
142
  /**
127
- * @internal
143
+ * Handles slot changes on the collector slot.
144
+ * Collects items and assigns them to named slots.
145
+ *
146
+ * @private
128
147
  * @template
129
148
  */
130
149
  onSlotChange(event) {
131
- const assignedElements = event.target.assignedElements();
132
- assignedElements.forEach((x, i) => {
133
- if (x.tagName.toLowerCase().includes(BreadcrumbItemElement.is)) {
134
- x.requestUpdate();
135
- x.classList.add('breadcrumb-item');
136
- x.classList.toggle('first', i === 0);
137
- x.classList.toggle('inner', i > 0 && i < assignedElements.length - 1);
138
- x.classList.toggle('last', i === assignedElements.length - 1);
139
- }
150
+ const slot = event.target;
151
+ const assignedElements = slot.assignedElements();
152
+ if (assignedElements.length === 0) {
153
+ return;
154
+ }
155
+ this._items = assignedElements.filter((child) => child.tagName.toLowerCase() === BreadcrumbItemElement.is);
156
+ this._items.forEach((item, i) => {
157
+ item.classList.add('breadcrumb-item');
158
+ item.classList.toggle('first', i === 0);
159
+ item.classList.toggle('inner', i > 0 && i < this._items.length - 1);
160
+ item.classList.toggle('last', i === this._items.length - 1);
161
+ item.setAttribute('slot', `item-${i}`);
140
162
  });
163
+ this.requestUpdate();
141
164
  }
142
165
  };
143
- __decorate([
144
- QueryAssignedElements({
145
- slot: 'actions',
146
- selector: BreadcrumbItemElement.is
147
- }),
148
- __metadata("design:type", Array)
149
- ], BreadcrumbElement.prototype, "_breadcrumbs", void 0);
150
166
  __decorate([
151
167
  Attribute({
152
168
  type: Boolean,
@@ -165,7 +181,8 @@ BreadcrumbElement = __decorate([
165
181
  cosmopolitan: breadcrumbElementCosmopolitanStyle
166
182
  },
167
183
  imports: [
168
- BreadcrumbElement
184
+ BreadcrumbItemElement,
185
+ IconElement
169
186
  ]
170
187
  }),
171
188
  __metadata("design:paramtypes", [])
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"BreadcrumbElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElement.ts"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,iBAAiB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAI3F"}
1
+ {"version":3,"file":"BreadcrumbElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAIjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,iBAAiB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAa3F"}
@@ -1,5 +1,8 @@
1
1
  // #region Imports
2
2
  import { html } from '../../../../Dom/Html';
3
+ import { Icons } from '../../../../Resources/Icons';
4
+ import { when } from '../../../Directives/Directives';
5
+ import { Size } from '../../../Types/Size';
3
6
  // #endregion
4
7
  /**
5
8
  * The template of the `BreadcrumbElement`.
@@ -8,7 +11,16 @@ import { html } from '../../../../Dom/Html';
8
11
  */
9
12
  export function breadcrumbElementTemplate(e) {
10
13
  return html `
11
- <slot slotchange="${(x) => e.onSlotChange(x)}"></slot>
14
+ <slot style="display:none" @slotchange="${(x) => e.onSlotChange(x)}"></slot>
15
+ ${e.items.map((_, i) => html `
16
+ ${when(i > 0, () => html `
17
+ <mosaik-icon part="symbol"
18
+ .data="${Icons.chevronRight}"
19
+ .size="${Size.Small}"
20
+ .inline="${true}"></mosaik-icon>
21
+ `)}
22
+ <slot name="item-${i}"></slot>
23
+ `)}
12
24
  `;
13
25
  }
14
26
  //# sourceMappingURL=BreadcrumbElementTemplate.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AAGjE,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;4BACa,CAAC,CAAQ,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;KACtD,CAAC;AACN,CAAC"}
1
+ {"version":3,"file":"BreadcrumbElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAG3C,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;kDACmC,CAAC,CAAQ,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;UACvE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA;cACtB,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;kCAEF,KAAK,CAAC,YAAY;kCAClB,IAAI,CAAC,KAAK;oCACR,IAAI;aAC3B,CAAC;+BACiB,CAAC;SACvB,CAAC;KACL,CAAC;AACN,CAAC"}
@@ -1,19 +1,24 @@
1
+ import { HyperlinkUnderline } from '../../../Types/HyperlinkUnderline';
1
2
  import { CustomElement } from '../../Abstracts/CustomElement';
2
3
  import type { IBreadcrumbItemElementProps } from './IBreadcrumbItemElementProps';
3
- declare const BreadcrumbItemElement_base: (abstract new (...args: Array<any>) => import("../../../../Controls/Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../../Controls/Behaviors/Themeable").IThemeableCtor;
4
+ declare const BreadcrumbItemElement_base: (abstract new (...args: Array<any>) => import("../../../../Controls/Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Labelable").ILabelableProps) & typeof CustomElement & import("../../../../Controls/Behaviors/Themeable").IThemeableCtor;
4
5
  /**
5
6
  * Breadcrumb Item - A component representing an individual link or label within a breadcrumb navigation trail.
6
7
  *
7
8
  * @description
8
9
  * The `Breadcrumb Item` component is used as a single element in a breadcrumb navigation trail. It can act as a link to navigate
9
- * to a previous section of the hierarchy or as a label for the current page. Breadcrumb items are commonly used in conjunction
10
+ * to a previous section of the hierarchy or as a label for the current page. When an `href` is provided, the item renders as
11
+ * an anchor link. Otherwise, it renders its slotted content directly. Breadcrumb items are commonly used in conjunction
10
12
  * with the `Breadcrumb` component to create a complete navigation trail.
11
13
  *
12
14
  * @name Breadcrumb Item
13
15
  * @element mosaik-breadcrumb-item
14
16
  * @category Navigation
15
17
  *
16
- * @slot - The content of the breadcrumb item, typically text or an icon.
18
+ * @slot label - The label content when using the anchor behavior.
19
+ *
20
+ * @csspart link - The anchor link element when href is provided.
21
+ * @csspart label - The text label area of the anchor link.
17
22
  *
18
23
  * @cssprop {String} --breadcrumb-item-border-style - The item border style CSS custom property.
19
24
  * @cssprop {String} --breadcrumb-item-font-family - The item font family CSS custom property.
@@ -23,6 +28,7 @@ declare const BreadcrumbItemElement_base: (abstract new (...args: Array<any>) =>
23
28
  * @cssprop {String} --breadcrumb-item-font-text-decoration - The item font text decoration CSS custom property.
24
29
  * @cssprop {String} --breadcrumb-item-font-text-transform - The item font text transform CSS custom property.
25
30
  * @cssprop {String} --breadcrumb-item-font-weight - The item font weight CSS custom property.
31
+ * @cssprop {String} --breadcrumb-item-foreground-color - The item foreground color CSS custom property.
26
32
  * @cssprop {String} --breadcrumb-item-gap - The item gap CSS custom property.
27
33
  * @cssprop {String} --breadcrumb-item-padding-bottom - The item padding bottom CSS custom property.
28
34
  * @cssprop {String} --breadcrumb-item-padding-left - The item padding left CSS custom property.
@@ -39,23 +45,37 @@ declare const BreadcrumbItemElement_base: (abstract new (...args: Array<any>) =>
39
45
  * @cssprop {String} --breadcrumb-item-transition-property - The item transition property CSS custom property.
40
46
  * @cssprop {String} --breadcrumb-item-translate - The item translate CSS custom property.
41
47
  *
42
- * @dependency mosaik-icon - The Icon element.
48
+ * @dependency mosaik-text - The Text element.
43
49
  *
44
50
  * @example
45
- * Used inside a breadcrumb navigation trail:
51
+ * Breadcrumb trail with slotted content:
46
52
  * ```html
47
53
  * <mosaik-breadcrumb>
48
54
  * <mosaik-breadcrumb-item>Home</mosaik-breadcrumb-item>
49
55
  * <mosaik-breadcrumb-item>Category</mosaik-breadcrumb-item>
50
- * <mosaik-breadcrumb-item>Subcategory</mosaik-breadcrumb-item>
51
56
  * <mosaik-breadcrumb-item is-active>Current Page</mosaik-breadcrumb-item>
52
57
  * </mosaik-breadcrumb>
53
58
  * ```
54
59
  *
60
+ * @example
61
+ * Breadcrumb trail with anchor links for navigation:
62
+ * ```html
63
+ * <mosaik-breadcrumb>
64
+ * <mosaik-breadcrumb-item label="Home" href="/home"></mosaik-breadcrumb-item>
65
+ * <mosaik-breadcrumb-item label="Products" href="/products"></mosaik-breadcrumb-item>
66
+ * <mosaik-breadcrumb-item label="Details" is-active></mosaik-breadcrumb-item>
67
+ * </mosaik-breadcrumb>
68
+ * ```
69
+ *
55
70
  * @public
56
71
  */
57
72
  export declare class BreadcrumbItemElement extends BreadcrumbItemElement_base implements IBreadcrumbItemElementProps {
58
73
  private _isActive;
74
+ private _href;
75
+ private _download;
76
+ private _rel;
77
+ private _target;
78
+ private _underline;
59
79
  /**
60
80
  * @public
61
81
  */
@@ -78,9 +98,46 @@ export declare class BreadcrumbItemElement extends BreadcrumbItemElement_base im
78
98
  get isActive(): boolean;
79
99
  set isActive(value: boolean);
80
100
  /**
101
+ * Gets or sets the `href` property.
102
+ * Contains a URL or a URL fragment that the hyperlink points to.
103
+ *
104
+ * @public
105
+ */
106
+ get href(): string;
107
+ set href(value: string);
108
+ /**
109
+ * Gets or sets the `download` property.
110
+ * Instructs browsers to download the URL instead of navigating to it.
111
+ *
112
+ * @public
113
+ */
114
+ get download(): string;
115
+ set download(value: string);
116
+ /**
117
+ * Gets or sets the `rel` property.
118
+ * Specifies the relationship of the target object to the link object.
119
+ *
120
+ * @public
121
+ */
122
+ get rel(): string;
123
+ set rel(value: string);
124
+ /**
125
+ * Gets or sets the `target` property.
126
+ * Specifies where to display the linked URL.
127
+ *
128
+ * @public
129
+ */
130
+ get target(): string;
131
+ set target(value: string);
132
+ /**
133
+ * Gets or sets the `underline` property.
134
+ * Determines when the underline is displayed on the link.
135
+ *
81
136
  * @public
137
+ * @attr underline
82
138
  */
83
- firstItem(): boolean;
139
+ get underline(): HyperlinkUnderline;
140
+ set underline(value: HyperlinkUnderline);
84
141
  }
85
142
  /**
86
143
  * @public
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbItemElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAG9D,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,+BAA+B,CAAC;;AAOjF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,qBAYa,qBACT,SAAQ,0BACR,YAAW,2BAA2B;IAItC,OAAO,CAAC,SAAS,CAAU;IAM3B;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,QAAQ,IAAI,OAAO,CAE7B;IACD,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAKjC;IAMD;;OAEG;IACI,SAAS,IAAI,OAAO;CAO9B;AAED;;GAEG;AACH,yBAAiB,qBAAqB,CAAC;IACnC,KAAY,KAAK,GAAG,2BAA2B,CAAC;CACnD;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,wBAAwB,EAAE,qBAAqB,CAAC;KACnD;CACJ"}
1
+ {"version":3,"file":"BreadcrumbItemElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9D,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,+BAA+B,CAAC;;AAOjF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkEG;AACH,qBAaa,qBACT,SAAQ,0BACR,YAAW,2BAA2B;IAItC,OAAO,CAAC,SAAS,CAAU;IAC3B,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,IAAI,CAAS;IACrB,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,UAAU,CAAqB;IAMvC;;OAEG;;IAgBH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,QAAQ,IAAI,OAAO,CAE7B;IACD,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAKjC;IAED;;;;;OAKG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAK5B;IAED;;;;;OAKG;IACH,IACW,QAAQ,IAAI,MAAM,CAE5B;IACD,IAAW,QAAQ,CAAC,KAAK,EAAE,MAAM,EAKhC;IAED;;;;;OAKG;IACH,IACW,GAAG,IAAI,MAAM,CAEvB;IACD,IAAW,GAAG,CAAC,KAAK,EAAE,MAAM,EAK3B;IAED;;;;;OAKG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IACD,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAK9B;IAED;;;;;;OAMG;IACH,IACW,SAAS,IAAI,kBAAkB,CAEzC;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,kBAAkB,EAK7C;CAQJ;AAED;;GAEG;AACH,yBAAiB,qBAAqB,CAAC;IACnC,KAAY,KAAK,GAAG,2BAA2B,CAAC;CACnD;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,wBAAwB,EAAE,qBAAqB,CAAC;KACnD;CACJ"}
@@ -9,10 +9,16 @@ var __metadata = (this && this.__metadata) || function (k, v) {
9
9
  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
10
10
  };
11
11
  import { Themeable } from '../../../../Controls/Behaviors/Themeable';
12
+ import { Disableable } from '../../../Behaviors/Disableable';
13
+ import { Labelable } from '../../../Behaviors/Labelable';
14
+ import { Variantable } from '../../../Behaviors/Variantable';
12
15
  import { Attribute } from '../../../Decorators/AttributeDecorator';
13
16
  import { Component } from '../../../Decorators/ComponentDecorator';
17
+ import { Property } from '../../../Decorators/PropertyDecorator';
18
+ import { HyperlinkUnderline } from '../../../Types/HyperlinkUnderline';
14
19
  import { CustomElement } from '../../Abstracts/CustomElement';
15
20
  import { IconElement } from '../../Media/Icon/IconElement';
21
+ import { TextElement } from '../../Primitives/Text/TextElement';
16
22
  import { breadcrumbItemElementTemplate } from './BreadcrumbItemElementTemplate';
17
23
  import { breadcrumbItemElementCosmopolitanStyle } from './Themes/BreadcrumbItemElement.Cosmopolitan';
18
24
  import { breadcrumbItemElementJoyStyle } from './Themes/BreadcrumbItemElement.Joy';
@@ -23,14 +29,18 @@ import { breadcrumbItemElementMemphisStyle } from './Themes/BreadcrumbItemElemen
23
29
  *
24
30
  * @description
25
31
  * The `Breadcrumb Item` component is used as a single element in a breadcrumb navigation trail. It can act as a link to navigate
26
- * to a previous section of the hierarchy or as a label for the current page. Breadcrumb items are commonly used in conjunction
32
+ * to a previous section of the hierarchy or as a label for the current page. When an `href` is provided, the item renders as
33
+ * an anchor link. Otherwise, it renders its slotted content directly. Breadcrumb items are commonly used in conjunction
27
34
  * with the `Breadcrumb` component to create a complete navigation trail.
28
35
  *
29
36
  * @name Breadcrumb Item
30
37
  * @element mosaik-breadcrumb-item
31
38
  * @category Navigation
32
39
  *
33
- * @slot - The content of the breadcrumb item, typically text or an icon.
40
+ * @slot label - The label content when using the anchor behavior.
41
+ *
42
+ * @csspart link - The anchor link element when href is provided.
43
+ * @csspart label - The text label area of the anchor link.
34
44
  *
35
45
  * @cssprop {String} --breadcrumb-item-border-style - The item border style CSS custom property.
36
46
  * @cssprop {String} --breadcrumb-item-font-family - The item font family CSS custom property.
@@ -40,6 +50,7 @@ import { breadcrumbItemElementMemphisStyle } from './Themes/BreadcrumbItemElemen
40
50
  * @cssprop {String} --breadcrumb-item-font-text-decoration - The item font text decoration CSS custom property.
41
51
  * @cssprop {String} --breadcrumb-item-font-text-transform - The item font text transform CSS custom property.
42
52
  * @cssprop {String} --breadcrumb-item-font-weight - The item font weight CSS custom property.
53
+ * @cssprop {String} --breadcrumb-item-foreground-color - The item foreground color CSS custom property.
43
54
  * @cssprop {String} --breadcrumb-item-gap - The item gap CSS custom property.
44
55
  * @cssprop {String} --breadcrumb-item-padding-bottom - The item padding bottom CSS custom property.
45
56
  * @cssprop {String} --breadcrumb-item-padding-left - The item padding left CSS custom property.
@@ -56,24 +67,38 @@ import { breadcrumbItemElementMemphisStyle } from './Themes/BreadcrumbItemElemen
56
67
  * @cssprop {String} --breadcrumb-item-transition-property - The item transition property CSS custom property.
57
68
  * @cssprop {String} --breadcrumb-item-translate - The item translate CSS custom property.
58
69
  *
59
- * @dependency mosaik-icon - The Icon element.
70
+ * @dependency mosaik-text - The Text element.
60
71
  *
61
72
  * @example
62
- * Used inside a breadcrumb navigation trail:
73
+ * Breadcrumb trail with slotted content:
63
74
  * ```html
64
75
  * <mosaik-breadcrumb>
65
76
  * <mosaik-breadcrumb-item>Home</mosaik-breadcrumb-item>
66
77
  * <mosaik-breadcrumb-item>Category</mosaik-breadcrumb-item>
67
- * <mosaik-breadcrumb-item>Subcategory</mosaik-breadcrumb-item>
68
78
  * <mosaik-breadcrumb-item is-active>Current Page</mosaik-breadcrumb-item>
69
79
  * </mosaik-breadcrumb>
70
80
  * ```
71
81
  *
82
+ * @example
83
+ * Breadcrumb trail with anchor links for navigation:
84
+ * ```html
85
+ * <mosaik-breadcrumb>
86
+ * <mosaik-breadcrumb-item label="Home" href="/home"></mosaik-breadcrumb-item>
87
+ * <mosaik-breadcrumb-item label="Products" href="/products"></mosaik-breadcrumb-item>
88
+ * <mosaik-breadcrumb-item label="Details" is-active></mosaik-breadcrumb-item>
89
+ * </mosaik-breadcrumb>
90
+ * ```
91
+ *
72
92
  * @public
73
93
  */
74
- let BreadcrumbItemElement = class BreadcrumbItemElement extends Themeable(CustomElement) {
94
+ let BreadcrumbItemElement = class BreadcrumbItemElement extends Themeable(Variantable(Disableable(Labelable(CustomElement)))) {
75
95
  // #region Fields
76
96
  _isActive;
97
+ _href;
98
+ _download;
99
+ _rel;
100
+ _target;
101
+ _underline;
77
102
  // #endregion
78
103
  // #region Ctor
79
104
  /**
@@ -82,6 +107,11 @@ let BreadcrumbItemElement = class BreadcrumbItemElement extends Themeable(Custom
82
107
  constructor() {
83
108
  super();
84
109
  this._isActive = false;
110
+ this._href = '';
111
+ this._download = '';
112
+ this._rel = '';
113
+ this._target = '';
114
+ this._underline = HyperlinkUnderline.Hover;
85
115
  }
86
116
  // #endregion
87
117
  // #region Properties
@@ -111,14 +141,81 @@ let BreadcrumbItemElement = class BreadcrumbItemElement extends Themeable(Custom
111
141
  this.requestUpdate('isActive');
112
142
  }
113
143
  }
114
- // #endregion
115
- // #region Methods
116
144
  /**
145
+ * Gets or sets the `href` property.
146
+ * Contains a URL or a URL fragment that the hyperlink points to.
147
+ *
148
+ * @public
149
+ */
150
+ get href() {
151
+ return this._href;
152
+ }
153
+ set href(value) {
154
+ if (this._href !== value) {
155
+ this._href = value;
156
+ this.requestUpdate('href');
157
+ }
158
+ }
159
+ /**
160
+ * Gets or sets the `download` property.
161
+ * Instructs browsers to download the URL instead of navigating to it.
162
+ *
163
+ * @public
164
+ */
165
+ get download() {
166
+ return this._download;
167
+ }
168
+ set download(value) {
169
+ if (this._download !== value) {
170
+ this._download = value;
171
+ this.requestUpdate('download');
172
+ }
173
+ }
174
+ /**
175
+ * Gets or sets the `rel` property.
176
+ * Specifies the relationship of the target object to the link object.
177
+ *
178
+ * @public
179
+ */
180
+ get rel() {
181
+ return this._rel;
182
+ }
183
+ set rel(value) {
184
+ if (this._rel !== value) {
185
+ this._rel = value;
186
+ this.requestUpdate('rel');
187
+ }
188
+ }
189
+ /**
190
+ * Gets or sets the `target` property.
191
+ * Specifies where to display the linked URL.
192
+ *
193
+ * @public
194
+ */
195
+ get target() {
196
+ return this._target;
197
+ }
198
+ set target(value) {
199
+ if (this._target !== value) {
200
+ this._target = value;
201
+ this.requestUpdate('target');
202
+ }
203
+ }
204
+ /**
205
+ * Gets or sets the `underline` property.
206
+ * Determines when the underline is displayed on the link.
207
+ *
117
208
  * @public
209
+ * @attr underline
118
210
  */
119
- firstItem() {
120
- const children = Array.prototype.slice.call(this.parentElement?.children);
121
- return children.indexOf(this) === 0;
211
+ get underline() {
212
+ return this._underline;
213
+ }
214
+ set underline(value) {
215
+ if (this._underline !== value) {
216
+ this._underline = value;
217
+ this.requestUpdate('underline');
218
+ }
122
219
  }
123
220
  };
124
221
  __decorate([
@@ -129,6 +226,31 @@ __decorate([
129
226
  __metadata("design:type", Boolean),
130
227
  __metadata("design:paramtypes", [Boolean])
131
228
  ], BreadcrumbItemElement.prototype, "isActive", null);
229
+ __decorate([
230
+ Property({ type: String }),
231
+ __metadata("design:type", String),
232
+ __metadata("design:paramtypes", [String])
233
+ ], BreadcrumbItemElement.prototype, "href", null);
234
+ __decorate([
235
+ Property({ type: String }),
236
+ __metadata("design:type", String),
237
+ __metadata("design:paramtypes", [String])
238
+ ], BreadcrumbItemElement.prototype, "download", null);
239
+ __decorate([
240
+ Property({ type: String }),
241
+ __metadata("design:type", String),
242
+ __metadata("design:paramtypes", [String])
243
+ ], BreadcrumbItemElement.prototype, "rel", null);
244
+ __decorate([
245
+ Property({ type: String }),
246
+ __metadata("design:type", String),
247
+ __metadata("design:paramtypes", [String])
248
+ ], BreadcrumbItemElement.prototype, "target", null);
249
+ __decorate([
250
+ Attribute({ type: HyperlinkUnderline }),
251
+ __metadata("design:type", String),
252
+ __metadata("design:paramtypes", [String])
253
+ ], BreadcrumbItemElement.prototype, "underline", null);
132
254
  BreadcrumbItemElement = __decorate([
133
255
  Component({
134
256
  selector: 'mosaik-breadcrumb-item',
@@ -139,7 +261,8 @@ BreadcrumbItemElement = __decorate([
139
261
  cosmopolitan: breadcrumbItemElementCosmopolitanStyle
140
262
  },
141
263
  imports: [
142
- IconElement
264
+ IconElement,
265
+ TextElement
143
266
  ]
144
267
  }),
145
268
  __metadata("design:paramtypes", [])
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbItemElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAEhF,OAAO,EAAE,sCAAsC,EAAE,MAAM,6CAA6C,CAAC;AACrG,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,iCAAiC,EAAE,MAAM,wCAAwC,CAAC;AAE3F,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AAaI,IAAM,qBAAqB,GAA3B,MAAM,qBACT,SAAQ,SAAS,CAAC,aAAa,CAAC;IAGhC,iBAAiB;IAET,SAAS,CAAU;IAE3B,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IAC3B,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,wBAAwB,CAAC;IACpC,CAAC;IAED;;;;;OAKG;IACH,IAIW,QAAQ;QACf,OAAO,IAAI,CAAC,SAAS,CAAC;IAC1B,CAAC;IACD,IAAW,QAAQ,CAAC,KAAc;QAC9B,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK,EAAE,CAAC;YAC3B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QACnC,CAAC;IACL,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;OAEG;IACI,SAAS;QACZ,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;QAC1E,OAAO,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACxC,CAAC;CAIJ,CAAA;AA5BG;IAAC,SAAS,CAAC;QACP,IAAI,EAAE,OAAO;QACb,UAAU,EAAE,IAAI;KACnB,CAAC;;;qDAGD;AAjDQ,qBAAqB;IAZjC,SAAS,CAAC;QACP,QAAQ,EAAE,wBAAwB;QAClC,QAAQ,EAAE,6BAA6B;QACvC,MAAM,EAAE;YACJ,GAAG,EAAE,6BAA6B;YAClC,OAAO,EAAE,iCAAiC;YAC1C,YAAY,EAAE,sCAAsC;SACvD;QACD,OAAO,EAAE;YACL,WAAW;SACd;KACJ,CAAC;;GACW,qBAAqB,CAuEjC"}
1
+ {"version":3,"file":"BreadcrumbItemElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElement.ts"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbItemElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAIjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAIrE;;;;GAIG;AACH,wBAAgB,6BAA6B,CAAC,CAAC,SAAS,qBAAqB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CASnG"}
1
+ {"version":3,"file":"BreadcrumbItemElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Grouping/Breadcrumb/BreadcrumbItemElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAIrE;;;;GAIG;AACH,wBAAgB,6BAA6B,CAAC,CAAC,SAAS,qBAAqB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAoBnG"}