xv-webcomponents 0.1.30 → 0.1.32

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 (123) hide show
  1. package/dist/cjs/{index-782b9733.js → index-5ee1b884.js} +43 -2
  2. package/dist/cjs/index-5ee1b884.js.map +1 -0
  3. package/dist/cjs/index.cjs.js +1 -1
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/{utils-aa46f72a.js → utils-22c0eda0.js} +1 -16
  6. package/dist/cjs/utils-22c0eda0.js.map +1 -0
  7. package/dist/cjs/{xv-accordion-v2_28.cjs.entry.js → xv-accordion-v2_26.cjs.entry.js} +191 -440
  8. package/dist/cjs/xv-accordion-v2_26.cjs.entry.js.map +1 -0
  9. package/dist/cjs/xv-breadcrumbs-v2.cjs.entry.js +1 -1
  10. package/dist/cjs/xv-webcomponents.cjs.js +2 -2
  11. package/dist/collection/collection-manifest.json +1 -3
  12. package/dist/collection/components/xv-checkbox/xv-checkbox.css +4 -1
  13. package/dist/collection/components/xv-checkbox/xv-checkbox.js +1 -1
  14. package/dist/collection/components/xv-checkbox/xv-checkbox.js.map +1 -1
  15. package/dist/collection/components/xv-dropdown/xv-dropdown-item/xv-dropdown-item.js +1 -1
  16. package/dist/collection/components/xv-dropdown/xv-dropdown.css +1 -1
  17. package/dist/collection/components/xv-dropdown/xv-dropdown.js +41 -11
  18. package/dist/collection/components/xv-dropdown/xv-dropdown.js.map +1 -1
  19. package/dist/collection/components/xv-footer/xv-footer.js +1 -1
  20. package/dist/collection/components/xv-header/xv-header.js +1 -1
  21. package/dist/collection/components/xv-link/xv-link.css +5 -0
  22. package/dist/collection/components/xv-link/xv-link.js +3 -3
  23. package/dist/collection/components/xv-link/xv-link.js.map +1 -1
  24. package/dist/collection/components/xv-modal/xv-modal.css +8 -4
  25. package/dist/collection/components/xv-modal/xv-modal.js +31 -7
  26. package/dist/collection/components/xv-modal/xv-modal.js.map +1 -1
  27. package/dist/collection/components/xv-notification/xv-notification.js +3 -3
  28. package/dist/collection/components/xv-notification/xv-notification.js.map +1 -1
  29. package/dist/collection/components/xv-overflow-menu/xv-overflow-menu-item/xv-overflow-menu-item.js +1 -1
  30. package/dist/collection/components/xv-overflow-menu/xv-overflow-menu.css +3 -0
  31. package/dist/collection/components/xv-overflow-menu/xv-overflow-menu.js +1 -1
  32. package/dist/collection/components/xv-progress-indicator/xv-progress-indicator-item/xv-progress-indicator-item.js +1 -1
  33. package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +2 -2
  34. package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js.map +1 -1
  35. package/dist/collection/components/xv-table/_vars.js +9 -0
  36. package/dist/collection/components/xv-table/_vars.js.map +1 -0
  37. package/dist/collection/components/xv-table/xv-table-cell/xv-table-cell.css +93 -0
  38. package/dist/collection/components/xv-table/xv-table-cell/xv-table-cell.js +160 -0
  39. package/dist/collection/components/xv-table/xv-table-cell/xv-table-cell.js.map +1 -0
  40. package/dist/collection/components/xv-table/xv-table-expand/xv-table-expand.css +55 -114
  41. package/dist/collection/components/xv-table/xv-table-expand/xv-table-expand.js +28 -151
  42. package/dist/collection/components/xv-table/xv-table-expand/xv-table-expand.js.map +1 -1
  43. package/dist/collection/components/xv-table/xv-table-row/xv-table-row.css +27 -34
  44. package/dist/collection/components/xv-table/xv-table-row/xv-table-row.js +165 -106
  45. package/dist/collection/components/xv-table/xv-table-row/xv-table-row.js.map +1 -1
  46. package/dist/collection/components/xv-table/xv-table.css +101 -141
  47. package/dist/collection/components/xv-table/xv-table.js +70 -196
  48. package/dist/collection/components/xv-table/xv-table.js.map +1 -1
  49. package/dist/collection/components/xv-tabs/xv-tab/xv-tab.css +7 -0
  50. package/dist/collection/components/xv-tabs/xv-tab/xv-tab.js +44 -3
  51. package/dist/collection/components/xv-tabs/xv-tab/xv-tab.js.map +1 -1
  52. package/dist/collection/components/xv-tabs/xv-tabs.css +60 -12
  53. package/dist/collection/components/xv-tabs/xv-tabs.js +97 -48
  54. package/dist/collection/components/xv-tabs/xv-tabs.js.map +1 -1
  55. package/dist/collection/components/xv-tag/xv-tag.js +1 -1
  56. package/dist/collection/components/xv-text-input/xv-text-input.js +53 -10
  57. package/dist/collection/components/xv-text-input/xv-text-input.js.map +1 -1
  58. package/dist/collection/components/xv-tooltip/xv-tooltip.css +6 -1
  59. package/dist/collection/components/xv-tooltip/xv-tooltip.js +22 -3
  60. package/dist/collection/components/xv-tooltip/xv-tooltip.js.map +1 -1
  61. package/dist/esm/{index-83ab73b7.js → index-590eb7d2.js} +43 -3
  62. package/dist/esm/index-590eb7d2.js.map +1 -0
  63. package/dist/esm/index.js +1 -1
  64. package/dist/esm/loader.js +3 -3
  65. package/dist/esm/{utils-0d1c18d5.js → utils-a9c71376.js} +2 -16
  66. package/dist/esm/utils-a9c71376.js.map +1 -0
  67. package/dist/esm/{xv-accordion-v2_28.entry.js → xv-accordion-v2_26.entry.js} +191 -438
  68. package/dist/esm/xv-accordion-v2_26.entry.js.map +1 -0
  69. package/dist/esm/xv-breadcrumbs-v2.entry.js +1 -1
  70. package/dist/esm/xv-webcomponents.js +3 -3
  71. package/dist/types/components/xv-dropdown/xv-dropdown.d.ts +2 -0
  72. package/dist/types/components/xv-link/xv-link.d.ts +1 -1
  73. package/dist/types/components/xv-modal/xv-modal.d.ts +5 -1
  74. package/dist/types/components/xv-table/_vars.d.ts +19 -0
  75. package/dist/types/components/xv-table/xv-table-cell/xv-table-cell.d.ts +12 -0
  76. package/dist/types/components/xv-table/xv-table-expand/xv-table-expand.d.ts +4 -20
  77. package/dist/types/components/xv-table/xv-table-row/xv-table-row.d.ts +16 -46
  78. package/dist/types/components/xv-table/xv-table.d.ts +10 -32
  79. package/dist/types/components/xv-tabs/xv-tab/xv-tab.d.ts +2 -0
  80. package/dist/types/components/xv-tabs/xv-tabs.d.ts +15 -11
  81. package/dist/types/components/xv-text-input/xv-text-input.d.ts +3 -0
  82. package/dist/types/components/xv-tooltip/xv-tooltip.d.ts +1 -0
  83. package/dist/types/components.d.ts +127 -265
  84. package/dist/xv-webcomponents/index.esm.js +1 -1
  85. package/dist/xv-webcomponents/p-51113bf3.entry.js +2 -0
  86. package/dist/xv-webcomponents/p-51113bf3.entry.js.map +1 -0
  87. package/dist/xv-webcomponents/p-612356e6.js +3 -0
  88. package/dist/xv-webcomponents/p-612356e6.js.map +1 -0
  89. package/dist/xv-webcomponents/p-c09a0bfe.entry.js +2 -0
  90. package/dist/xv-webcomponents/p-f98a1845.js +2 -0
  91. package/dist/xv-webcomponents/p-f98a1845.js.map +1 -0
  92. package/dist/xv-webcomponents/xv-webcomponents.esm.js +1 -1
  93. package/dist/xv-webcomponents/xv-webcomponents.esm.js.map +1 -1
  94. package/package.json +1 -1
  95. package/dist/cjs/index-782b9733.js.map +0 -1
  96. package/dist/cjs/utils-aa46f72a.js.map +0 -1
  97. package/dist/cjs/xv-accordion-v2_28.cjs.entry.js.map +0 -1
  98. package/dist/collection/components/xv-table/defs.js +0 -28
  99. package/dist/collection/components/xv-table/defs.js.map +0 -1
  100. package/dist/collection/components/xv-table/xv-table-col/xv-table-col.css +0 -13
  101. package/dist/collection/components/xv-table/xv-table-col/xv-table-col.js +0 -111
  102. package/dist/collection/components/xv-table/xv-table-col/xv-table-col.js.map +0 -1
  103. package/dist/collection/components/xv-table/xv-table-header-row/xv-table-header-row.css +0 -80
  104. package/dist/collection/components/xv-table/xv-table-header-row/xv-table-header-row.js +0 -172
  105. package/dist/collection/components/xv-table/xv-table-header-row/xv-table-header-row.js.map +0 -1
  106. package/dist/collection/components/xv-table/xv-table-toolbar/xv-table-toolbar.css +0 -47
  107. package/dist/collection/components/xv-table/xv-table-toolbar/xv-table-toolbar.js +0 -78
  108. package/dist/collection/components/xv-table/xv-table-toolbar/xv-table-toolbar.js.map +0 -1
  109. package/dist/esm/index-83ab73b7.js.map +0 -1
  110. package/dist/esm/utils-0d1c18d5.js.map +0 -1
  111. package/dist/esm/xv-accordion-v2_28.entry.js.map +0 -1
  112. package/dist/types/components/xv-table/defs.d.ts +0 -38
  113. package/dist/types/components/xv-table/xv-table-col/xv-table-col.d.ts +0 -9
  114. package/dist/types/components/xv-table/xv-table-header-row/xv-table-header-row.d.ts +0 -28
  115. package/dist/types/components/xv-table/xv-table-toolbar/xv-table-toolbar.d.ts +0 -6
  116. package/dist/xv-webcomponents/p-39bf1511.js +0 -2
  117. package/dist/xv-webcomponents/p-39bf1511.js.map +0 -1
  118. package/dist/xv-webcomponents/p-5f18d718.entry.js +0 -2
  119. package/dist/xv-webcomponents/p-840929c5.js +0 -3
  120. package/dist/xv-webcomponents/p-840929c5.js.map +0 -1
  121. package/dist/xv-webcomponents/p-cc83f7ea.entry.js +0 -2
  122. package/dist/xv-webcomponents/p-cc83f7ea.entry.js.map +0 -1
  123. /package/dist/xv-webcomponents/{p-5f18d718.entry.js.map → p-c09a0bfe.entry.js.map} +0 -0
@@ -16,7 +16,7 @@ export class XvDropdown {
16
16
  return values;
17
17
  };
18
18
  this.handleOpen = () => {
19
- if (this.disabled || this.open)
19
+ if (this.disabled || this.open || this.loading)
20
20
  return;
21
21
  this.open = true;
22
22
  };
@@ -45,7 +45,6 @@ export class XvDropdown {
45
45
  selected: `${this.defaultValue}` === option.getAttribute('value'),
46
46
  };
47
47
  if (dropdownItemData.selected) {
48
- console.log('dropdownItemData', dropdownItemData);
49
48
  setAttr(option, 'selected', dropdownItemData.selected);
50
49
  this.selectedMap.set(dropdownItemData.value, dropdownItemData);
51
50
  }
@@ -95,7 +94,7 @@ export class XvDropdown {
95
94
  this.changeSelection.emit(this.setSelected(this.selectedMap, optionElements));
96
95
  }
97
96
  render() {
98
- return (h(Host, { key: '7c3f08a31359efeba9c35dabba6b9d1cfa66086d', size: this.size, class: "xv-dropdown", role: "combobox", tabindex: this.disabled ? -1 : false }, h("label", { key: '530293b5a2bd148576f41cb343d5ccaefb51cdd3', class: "label" }, h("slot", { key: 'fd66aff04936aedd63bcecf2decec0d4176f6174', name: "label" }, this.label)), h("div", { key: '72c4bd316a9104b0610d06cecdbc57de3b98df88', class: "xv-dropdown-control control", onClick: this.handleOpen }, this.selected.length ? (h("p", { class: "control_value" }, this.selected.join(', '))) : (h("p", { class: "control_placeholder" }, this.placeholder || '')), this.error && (h("svg", { key: '26ebc2800b21e02d783e928abb7fb4ef0280cee4', class: "control_icon error", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" }, h("path", { key: 'bfce50f7bd4972652941003a42e3205f8d4a014f', fill: "currentColor", d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" }))), (!this.error && !!this.warning) && (h("svg", { key: '4fe8eccfb3322d1595a327face9ebb762dfa4c4f', class: "control_icon warning", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" }, h("path", { key: 'fd0df7d4d2e439ac314fa227dc315c8edf6aff3d', fill: "currentColor", d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z" }))), h("svg", { key: 'bb39e6b12ca1dbd20b3f299c3602045c26128c14', class: "control_arrow", focusable: "false", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", "aria-hidden": "true", width: "16", height: "16", viewBox: "0 0 16 16" }, h("path", { key: '37918f651612b529d8120cc230e09e768a0cda11', d: "M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z" }))), this.open && h("div", { key: '70b5add96ff43f0eff9074822ad767b5b78e0e92', class: "options" }, h("slot", { key: "xv-dropdown-options" })), (this.helper || this.error || this.warning) && (h("p", { key: 'c5b425f7406751318f53f549584cff6892f8a173', class: "helper" }, this.error || this.warning || this.helper))));
97
+ return (h(Host, { key: 'c079d730375bac47e2990c414f78dbe5f0c819de', class: "xv-dropdown", role: "combobox", size: this.size, open: this.open, error: this.error, disabled: this.disabled, tabindex: this.disabled ? -1 : false }, h("label", { key: '89822575a8ba145cfbc54bd40ae50021069243ea', class: "label" }, h("slot", { key: 'd09fa78e0df2f911160b059a1254dd09b1c2edcf', name: "label" }, this.label)), h("div", { key: 'a4cb541ee3ccca7148b11ff2a5455d9efb75831e', class: "xv-dropdown-control control", onClick: this.handleOpen }, this.selected.length ? (h("p", { class: "control_value" }, this.selected.join(', '))) : (h("p", { class: "control_placeholder" }, this.placeholder || '')), this.renderIcon(), h("svg", { key: '698d39331ed3e1e09ae48db98244d0f8e2cecc47', class: "control_arrow", focusable: "false", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", "aria-hidden": "true", width: "16", height: "16", viewBox: "0 0 16 16" }, h("path", { key: '4e78ab3ba78ff63b21f2766887440b5d638fc5e6', d: "M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z" }))), this.open && h("div", { key: 'd3493338d8e5acd48a0c825843da13ba631e7050', class: "options" }, h("slot", { key: "xv-dropdown-options" })), (this.helper || this.error || this.warning) && (h("p", { key: 'b337cece3d8c4aeb4aedc10b0ef6669c19e27e30', class: "helper" }, this.error || this.warning || this.helper))));
99
98
  }
100
99
  componentWillLoad() {
101
100
  this.setDefaultValues();
@@ -106,6 +105,18 @@ export class XvDropdown {
106
105
  disconnectedCallback() {
107
106
  this.removeListeners();
108
107
  }
108
+ renderIcon() {
109
+ if (this.loading) {
110
+ return h("xv-loader-v2", { class: "control_icon error", size: SIZE_VAR.XS });
111
+ }
112
+ if (this.error) {
113
+ return (h("svg", { class: "control_icon error", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" }, h("path", { fill: "currentColor", d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" })));
114
+ }
115
+ if (!this.error && !!this.warning) {
116
+ return (h("svg", { class: "control_icon warning", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" }, h("path", { fill: "currentColor", d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z" })));
117
+ }
118
+ return undefined;
119
+ }
109
120
  static get is() { return "xv-dropdown-v2"; }
110
121
  static get encapsulation() { return "shadow"; }
111
122
  static get originalStyleUrls() {
@@ -137,7 +148,7 @@ export class XvDropdown {
137
148
  "getter": false,
138
149
  "setter": false,
139
150
  "attribute": "disabled",
140
- "reflect": false
151
+ "reflect": true
141
152
  },
142
153
  "multiple": {
143
154
  "type": "boolean",
@@ -156,7 +167,7 @@ export class XvDropdown {
156
167
  "getter": false,
157
168
  "setter": false,
158
169
  "attribute": "multiple",
159
- "reflect": false
170
+ "reflect": true
160
171
  },
161
172
  "required": {
162
173
  "type": "boolean",
@@ -175,7 +186,26 @@ export class XvDropdown {
175
186
  "getter": false,
176
187
  "setter": false,
177
188
  "attribute": "required",
178
- "reflect": false
189
+ "reflect": true
190
+ },
191
+ "loading": {
192
+ "type": "boolean",
193
+ "mutable": false,
194
+ "complexType": {
195
+ "original": "boolean",
196
+ "resolved": "boolean",
197
+ "references": {}
198
+ },
199
+ "required": false,
200
+ "optional": true,
201
+ "docs": {
202
+ "tags": [],
203
+ "text": ""
204
+ },
205
+ "getter": false,
206
+ "setter": false,
207
+ "attribute": "loading",
208
+ "reflect": true
179
209
  },
180
210
  "open": {
181
211
  "type": "boolean",
@@ -213,7 +243,7 @@ export class XvDropdown {
213
243
  "getter": false,
214
244
  "setter": false,
215
245
  "attribute": "error",
216
- "reflect": false
246
+ "reflect": true
217
247
  },
218
248
  "label": {
219
249
  "type": "string",
@@ -232,7 +262,7 @@ export class XvDropdown {
232
262
  "getter": false,
233
263
  "setter": false,
234
264
  "attribute": "label",
235
- "reflect": false
265
+ "reflect": true
236
266
  },
237
267
  "helper": {
238
268
  "type": "string",
@@ -251,7 +281,7 @@ export class XvDropdown {
251
281
  "getter": false,
252
282
  "setter": false,
253
283
  "attribute": "helper",
254
- "reflect": false
284
+ "reflect": true
255
285
  },
256
286
  "warning": {
257
287
  "type": "string",
@@ -270,7 +300,7 @@ export class XvDropdown {
270
300
  "getter": false,
271
301
  "setter": false,
272
302
  "attribute": "warning",
273
- "reflect": false
303
+ "reflect": true
274
304
  },
275
305
  "placeholder": {
276
306
  "type": "string",
@@ -289,7 +319,7 @@ export class XvDropdown {
289
319
  "getter": false,
290
320
  "setter": false,
291
321
  "attribute": "placeholder",
292
- "reflect": false
322
+ "reflect": true
293
323
  },
294
324
  "size": {
295
325
  "type": "string",
@@ -1 +1 @@
1
- {"version":3,"file":"xv-dropdown.js","sourceRoot":"","sources":["../../../src/components/xv-dropdown/xv-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Element, Watch, Listen, Event, EventEmitter } from '@stencil/core';\nimport { SIZE_VAR } from '../../types/enum';\nimport { DropdownItemData, DropdownItemSelector } from './_vars';\nimport { forEach, setAttr } from '../../utils/utils';\n\n@Component({\n tag: 'xv-dropdown-v2',\n styleUrl: 'xv-dropdown.scss',\n shadow: true,\n})\nexport class XvDropdown {\n @Element() el: HTMLElement;\n @Prop() disabled?: boolean;\n @Prop() multiple?: boolean;\n @Prop() required?: boolean;\n @Prop({ reflect: true, mutable: true }) open?: boolean;\n @Prop() error?: string;\n @Prop() label?: string;\n @Prop() helper?: string;\n @Prop() warning?: string;\n @Prop() placeholder?: string;\n @Prop() size: SIZE_VAR = SIZE_VAR.MD;\n @Prop({ attribute: 'default-value'}) defaultValue?: DropdownItemData['value'];\n\n @State() selected: DropdownItemData['text'][] = [];\n @State() selectedMap: Map<DropdownItemData['value'], DropdownItemData> = new Map();\n\n @Event() changeSelection: EventEmitter<DropdownItemData[]>;\n\n @Watch('open')\n openChangeHandle() {\n if (this.disabled) return;\n\n if (this.open) {\n this.addListeners();\n } else {\n this.removeListeners();\n }\n }\n\n @Listen('itemSelected')\n handleItemSelected({ detail }: CustomEvent<DropdownItemData>) {\n const hasItem = this.selectedMap.has(detail.value);\n\n if (this.multiple) {\n if (detail.selected) {\n if (!hasItem) this.selectedMap.set(detail.value, detail);\n } else {\n if (hasItem) {\n if (this.required && this.selectedMap.size === 1) return;\n this.selectedMap.delete(detail.value);\n }\n }\n } else {\n if (detail.selected) {\n this.selectedMap.clear();\n this.selectedMap.set(detail.value, detail);\n } else {\n if (!this.required) this.selectedMap.clear();\n }\n this.open = false;\n }\n\n const optionElements = this.el.querySelectorAll(DropdownItemSelector);\n\n forEach(\n optionElements,\n (option) => setAttr(option, 'selected', this.selectedMap.has(option.getAttribute('value')))\n );\n\n this.changeSelection.emit(this.setSelected(this.selectedMap, optionElements));\n }\n\n private setSelected = (selectedMap: typeof this.selectedMap, optionNodes?: NodeListOf<Element>): DropdownItemData[] => {\n const values = Array.from(selectedMap.values());\n const options = optionNodes || this.el.querySelectorAll(DropdownItemSelector);\n\n this.selected = values.length === options.length ?\n ['Alle ausgewählt'] : values.length > 2 ?\n [`${values.length} ausgewählt`] : values.map((v) => v.text);\n\n return values;\n };\n\n private handleOpen = () => {\n if (this.disabled || this.open) return;\n this.open = true;\n };\n\n private handleClickOutside = (ev: MouseEvent) => {\n if (!this.open || this.el.contains(ev.target as Node)) return;\n\n if (this.open) this.open = false;\n }\n\n private addListeners = () => {\n document.body.addEventListener('click', this.handleClickOutside);\n }\n\n private removeListeners = () => {\n document.body.removeEventListener('click', this.handleClickOutside);\n }\n\n private setDefaultValues = () => {\n if (!this.defaultValue) return;\n\n // Needs to wait next Javascript tik\n setTimeout(() => {\n const options = this.el.querySelectorAll(DropdownItemSelector);\n\n forEach(\n options,\n (option) => {\n const dropdownItemData: DropdownItemData = {\n value: option.getAttribute('value'),\n text: (option as any).innerText,\n selected: `${this.defaultValue}` === option.getAttribute('value'),\n };\n\n if (dropdownItemData.selected) {\n console.log('dropdownItemData', dropdownItemData);\n setAttr(option, 'selected', dropdownItemData.selected);\n this.selectedMap.set(dropdownItemData.value, dropdownItemData);\n }\n }\n );\n\n this.setSelected(this.selectedMap, options);\n });\n };\n\n render() {\n return (\n <Host size={this.size} class=\"xv-dropdown\" role=\"combobox\" tabindex={this.disabled ? -1 : false}>\n <label class=\"label\">\n <slot name=\"label\">{this.label}</slot>\n </label>\n\n <div class=\"xv-dropdown-control control\" onClick={this.handleOpen}>\n {this.selected.length ? (\n <p class=\"control_value\">{this.selected.join(', ')}</p>\n ) : (\n <p class=\"control_placeholder\">{this.placeholder || ''}</p>\n )}\n\n {this.error && (\n <svg class=\"control_icon error\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path fill=\"currentColor\" d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z\" />\n </svg>\n )}\n {(!this.error && !!this.warning) && (\n <svg class=\"control_icon warning\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path fill=\"currentColor\" d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z\" />\n </svg>\n )}\n\n <svg class=\"control_arrow\" focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\" aria-hidden=\"true\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n <path d=\"M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z\"></path>\n </svg>\n </div>\n\n {this.open && <div class=\"options\">\n <slot key=\"xv-dropdown-options\" />\n </div>}\n\n {(this.helper || this.error || this.warning) && (\n <p class=\"helper\">{this.error || this.warning || this.helper}</p>\n )}\n </Host>\n );\n }\n\n componentWillLoad() {\n this.setDefaultValues();\n }\n\n componentDidLoad() {\n this.openChangeHandle();\n }\n\n disconnectedCallback() {\n this.removeListeners();\n }\n}\n"]}
1
+ {"version":3,"file":"xv-dropdown.js","sourceRoot":"","sources":["../../../src/components/xv-dropdown/xv-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Element, Watch, Listen, Event, EventEmitter } from '@stencil/core';\nimport { SIZE_VAR } from '../../types/enum';\nimport { DropdownItemData, DropdownItemSelector } from './_vars';\nimport { forEach, setAttr } from '../../utils/utils';\n\n@Component({\n tag: 'xv-dropdown-v2',\n styleUrl: 'xv-dropdown.scss',\n shadow: true,\n})\nexport class XvDropdown {\n @Element() el: HTMLElement;\n @Prop({ reflect: true }) disabled?: boolean;\n @Prop({ reflect: true }) multiple?: boolean;\n @Prop({ reflect: true }) required?: boolean;\n @Prop({ reflect: true }) loading?: boolean;\n @Prop({ reflect: true, mutable: true }) open?: boolean;\n @Prop({ reflect: true }) error?: string;\n @Prop({ reflect: true }) label?: string;\n @Prop({ reflect: true }) helper?: string;\n @Prop({ reflect: true }) warning?: string;\n @Prop({ reflect: true }) placeholder?: string;\n @Prop() size: SIZE_VAR = SIZE_VAR.MD;\n @Prop({ attribute: 'default-value'}) defaultValue?: DropdownItemData['value'];\n\n @State() selected: DropdownItemData['text'][] = [];\n @State() selectedMap: Map<DropdownItemData['value'], DropdownItemData> = new Map();\n\n @Event() changeSelection: EventEmitter<DropdownItemData[]>;\n\n @Watch('open')\n openChangeHandle() {\n if (this.disabled) return;\n\n if (this.open) {\n this.addListeners();\n } else {\n this.removeListeners();\n }\n }\n\n @Listen('itemSelected')\n handleItemSelected({ detail }: CustomEvent<DropdownItemData>) {\n const hasItem = this.selectedMap.has(detail.value);\n\n if (this.multiple) {\n if (detail.selected) {\n if (!hasItem) this.selectedMap.set(detail.value, detail);\n } else {\n if (hasItem) {\n if (this.required && this.selectedMap.size === 1) return;\n this.selectedMap.delete(detail.value);\n }\n }\n } else {\n if (detail.selected) {\n this.selectedMap.clear();\n this.selectedMap.set(detail.value, detail);\n } else {\n if (!this.required) this.selectedMap.clear();\n }\n this.open = false;\n }\n\n const optionElements = this.el.querySelectorAll(DropdownItemSelector);\n\n forEach(\n optionElements,\n (option) => setAttr(option, 'selected', this.selectedMap.has(option.getAttribute('value')))\n );\n\n this.changeSelection.emit(this.setSelected(this.selectedMap, optionElements));\n }\n\n private setSelected = (selectedMap: typeof this.selectedMap, optionNodes?: NodeListOf<Element>): DropdownItemData[] => {\n const values = Array.from(selectedMap.values());\n const options = optionNodes || this.el.querySelectorAll(DropdownItemSelector);\n\n this.selected = values.length === options.length ?\n ['Alle ausgewählt'] : values.length > 2 ?\n [`${values.length} ausgewählt`] : values.map((v) => v.text);\n\n return values;\n };\n\n private handleOpen = () => {\n if (this.disabled || this.open || this.loading) return;\n this.open = true;\n };\n\n private handleClickOutside = (ev: MouseEvent) => {\n if (!this.open || this.el.contains(ev.target as Node)) return;\n\n if (this.open) this.open = false;\n }\n\n private addListeners = () => {\n document.body.addEventListener('click', this.handleClickOutside);\n }\n\n private removeListeners = () => {\n document.body.removeEventListener('click', this.handleClickOutside);\n }\n\n private setDefaultValues = () => {\n if (!this.defaultValue) return;\n\n // Needs to wait next Javascript tik\n setTimeout(() => {\n const options = this.el.querySelectorAll(DropdownItemSelector);\n\n forEach(\n options,\n (option) => {\n const dropdownItemData: DropdownItemData = {\n value: option.getAttribute('value'),\n text: (option as any).innerText,\n selected: `${this.defaultValue}` === option.getAttribute('value'),\n };\n\n if (dropdownItemData.selected) {\n setAttr(option, 'selected', dropdownItemData.selected);\n this.selectedMap.set(dropdownItemData.value, dropdownItemData);\n }\n }\n );\n\n this.setSelected(this.selectedMap, options);\n });\n };\n\n render() {\n return (\n <Host\n class=\"xv-dropdown\"\n role=\"combobox\"\n size={this.size}\n open={this.open}\n error={this.error}\n disabled={this.disabled}\n tabindex={this.disabled ? -1 : false}>\n <label class=\"label\">\n <slot name=\"label\">{this.label}</slot>\n </label>\n\n <div class=\"xv-dropdown-control control\" onClick={this.handleOpen}>\n {this.selected.length ? (\n <p class=\"control_value\">{this.selected.join(', ')}</p>\n ) : (\n <p class=\"control_placeholder\">{this.placeholder || ''}</p>\n )}\n\n {this.renderIcon()}\n\n <svg class=\"control_arrow\" focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\" aria-hidden=\"true\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n <path d=\"M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z\"></path>\n </svg>\n </div>\n\n {this.open && <div class=\"options\">\n <slot key=\"xv-dropdown-options\" />\n </div>}\n\n {(this.helper || this.error || this.warning) && (\n <p class=\"helper\">{this.error || this.warning || this.helper}</p>\n )}\n </Host>\n );\n }\n\n componentWillLoad() {\n this.setDefaultValues();\n }\n\n componentDidLoad() {\n this.openChangeHandle();\n }\n\n disconnectedCallback() {\n this.removeListeners();\n }\n\n private renderIcon(): undefined | HTMLElement {\n if (this.loading) {\n return <xv-loader-v2 class=\"control_icon error\" size={SIZE_VAR.XS} />\n }\n\n if (this.error) {\n return (\n <svg class=\"control_icon error\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path fill=\"currentColor\"\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z\" />\n </svg>\n )\n }\n\n if (!this.error && !!this.warning) {\n return (\n <svg class=\"control_icon warning\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path fill=\"currentColor\" d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z\" />\n </svg>\n );\n }\n\n return undefined;\n }\n}\n"]}
@@ -14,7 +14,7 @@ export class Xvfooter {
14
14
  }
15
15
  }
16
16
  render() {
17
- return (h("footer", { key: '1d62a179df61f0f8ae16112d1877d47078c0f694' }, h("div", { key: 'ebe950dd52aa300f2f6000e3e240384e44c351f0', innerHTML: this.htmlContent })));
17
+ return (h("footer", { key: '0db6bc4ceab1da36181d8a106677ee2b4c871a5d' }, h("div", { key: '4ed868bc230e7dd45ebca9255827c1cfeb40e1f7', innerHTML: this.htmlContent })));
18
18
  }
19
19
  static get is() { return "xv-footer"; }
20
20
  static get originalStyleUrls() {
@@ -23,7 +23,7 @@ export class XvHeader {
23
23
  }
24
24
  }
25
25
  render() {
26
- return (h("div", { key: '17b758439ac9d36d231ea77c5b0a749755919671', id: "nav-container", class: "xv-header" }, h("nav", { key: '0c6f3ec230830c41a58f50f86ecafbe520d6757f', class: "navbar navbar-default navbar-fixed-top backend-force-relative" }, h("div", { key: 'bebdd889d198c62cf79a8ca02e789d8a0a3ed7f4', class: "container" }, h("div", { key: 'd4617727cffe7b4aada604394a056a27b3df8d89', class: "row" }, h("div", { key: 'e3c7ca51335b89a9032cdde950657d876d157bba', class: "col-sm-3 col-xs-3 col-xxs-4 no-padding-right" }, h("div", { key: 'c70a5de73859a1a19966b3b643a3b6ac1cab49fe', class: "navbar-header" }, h("button", { key: '054943c922178450585e1a801825cf6737e3448d', class: "btn btn-default navbar-toggle pull-left navbar-btn", "data-toggle": "collapse", "data-target": "#main-menu" }, h("i", { key: '50c000376822e1b39582c32ca36720b7e88011b3', class: "fa fa-bars fa-lg", "aria-hidden": "true" })), h("div", { key: '50763da33dea51d5e42fcca7f684c65194c1ac1c', class: "visible-xs-inline" }, h("a", { key: 'ace4253640362dc8bc086243d5d029be0aed717a', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: '413fd9b3d9090abcc7697eb417b3f604652baafe', src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg", alt: "Crossvertise" }))), h("div", { key: '38abf1c9d06ce56ca3df77dcbc9f127724c4412b', class: "hidden-xs" }, h("a", { key: '2f413d15878c4fda13bb0742e618c194765d3410', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: '169e7a4d95ecfdda6125c8968c9d5785bfb67c62', loading: "lazy", src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg", alt: "Crossvertise" }))))), h("div", { key: '54ffe049cfd4def82e54d32b9a995388a7b0a3ef', class: "col-sm-9 col-xs-9 col-xxs-8 no-padding-left" }, h("ul", { key: 'ebfa9382c68f49a58603623a8ad6dea3b6778480', class: "nav nav-pills nav-meta pull-right" }, h("li", { key: '04cdcecf7518face6a3ab8318b1bf8386df3509a' }, h("a", { key: 'eb01fb3eb7f48df8aaa1868b102884244dbf0b9e', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, h("i", { key: '6e6468006b1f8a3d434a73aef4bc4774846100b1', class: "fa fa-user" }), h("i", { key: '496a5bb8fd4ec003f83c7d93cfecbff821d9570f', class: "fa fa-exchange-alt" }))), h("li", { key: 'ee8114f5da71c02792631efa5db06ff1853e1d3d' }, h("a", { key: 'c564eb6479e59117138f598e0c488473880c4169', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, "Kontakt"), h("a", { key: '1ab3ee273d7f950d16fbbd082830cee0ad31338f', href: "https://www.crossvertise.com/contact", class: "btn btn-link navbar-btn hidden-xs", style: { display: 'none' } }, "Kontakt"), h("a", { key: 'cf6b91b54d242a5a450396feddb851b10c21dfe2', class: "btn btn-default btn-link navbar-btn visible-xs hidden-xxs", href: "#" }, h("i", { key: '5c57f304259725b56edffbfe89b4116bdfa03d01', class: "fa fa-phone" }))), h("li", { key: 'bff9df0a062ba73cdb7cfb62e52ec2c5cf7eb4b2', class: "dropdown", id: "my-xv-menu" }, h("a", { key: 'be582a5ff458559d311481c8e615e2c999a98b2c', href: "#", class: "dropdown-toggle btn btn-default navbar-btn btn-link", "data-toggle": "dropdown" }, h("i", { key: '61e2d3853664f239992177ebf1b7d24a8c4b3891', class: "fa fa-user fa-lg text-success", "aria-hidden": "true" }), "\u00A0", h("span", { key: '93f81a97f7b649ae34f61366a6d265a7c381b479', class: "hidden-xs" }, "Mein Bereich"), h("span", { key: 'c719beed11b9ca505b3935d1b080056972975bf5', class: "caret" })), h("ul", { key: 'f23370ef5ccf3c792e9a8f148ce18013db8ce25b', class: "dropdown-menu-left dropdown-menu navbar-myxv" }, h("li", { key: 'd5fa4543bc4cf88384888505e77d1ea692798abb' }, h("a", { key: 'e0093d0d32e091dd6ea8a65e7b5c3802b1d9066c', href: "#" }, h("i", { key: '294da165d6f1964044b8a86fba972c75f2307a40', class: "fa fa-tachometer-alt fa-fw" }), "\u00A0Cockpitfunktionen\u00A0", h("i", { key: '48d212dfc8ba3301fc5876c229534c37efec6095', class: "fa fa-caret-down" }))), h("li", { key: '76e744f5f005627702849299b30b661cc3186e75' }, h("a", { key: 'fd1946c49709fbe61a4277b6a0c7d1ff2d342709', href: "#" }, h("i", { key: '5b1a8006f15ddea5692d41551623a96c1c344426', class: "fa fa-cubes" }), "\u00A0Entit\u00E4ten\u00A0", h("i", { key: '3a52fdf953b0792cb3d287ac41f493659093af3b', class: "fa fa-caret-down" }))), h("li", { key: '3bdaecf8f4d795d44d075bdc9ae626aad64f1464', role: "separator", class: "divider" }), h("li", { key: 'd0fbe94290ba97a7547816476888a2463bc49f55' }, h("a", { key: 'e20b9db82ad5c8afa3749a4d222505e0aa07ae90', href: "#" }, h("i", { key: '5623596a0eae6399de421cf3536bc0e05ebff700', class: "fa fa-user" }), "\u00A0Mein Crossvertise\u00A0", h("span", { key: 'eda253c704f6b9c6f0d793c93fa6ff845be66a6a', class: "badge" }, "0"), h("i", { key: '9ff7c367b502aabedef6c131e627879b67c8a295', class: "fa fa-caret-down" }))), h("li", { key: '7ff050b3e0978025f18115fe33a982daf3f3ec56' }, h("a", { key: '7f6641a7354a9bff4774c71434d25e94186fb2ea', href: "https://www.crossvertise.com/de-de/mycrossvertise/account/logoff?returnUrl=https%3A%2F%2Fwww.crossvertise.com" }, h("i", { key: 'c3013e411aba74ba1a437889c0c8ee87f3fae5e0', class: "fa fa-sign-out-alt fa-fw", "aria-hidden": "true" }), "\u00A0Logout")))), h("li", { key: 'a88d592fcda782ab5d50916d8824d1992ac0bc6c', class: "visible-sm-block visible-xs-block hidden-xxs" }, h("a", { key: '8de83de25419b43154b1a12d278984acb0b1542e', class: "btn btn-default navbar-btn btn-link", "data-toggle": "collapse", "data-target": "#search-collapse" }, h("i", { key: '8bdb16e9dbd427bec443b4cc8d8f4baccf9b9190', class: "fa fa-search", "aria-hidden": "true" }))), h("li", { key: '65947d1fbd384ffdb3476fe775f860d100165311', class: "hidden-md hidden-lg" }, h("a", { key: 'b9618154b33860c709047e20a4768aab46e0f0e3', class: "btn btn-default navbar-btn btn-link", href: "https://market.crossvertise.com/de-de/mycrossvertise/account/logon?returnUrl=https%3A%2F%2Fwww.crossvertise.com%2F" }, h("i", { key: 'df10d0e0bcfc2574df51bbd772fc7ea2735fc26d', class: "fa fa-user fa-lg", "aria-hidden": "true" }), h("span", { key: 'e40d5fdc63fb8487982f80d7997ca7fbb2fd1822', class: "hidden-xs" }, "Login"))), h("li", { key: 'f0fbf675ea3df61d24d326ee83e10d8ad606d6f9', class: "hidden-xs hidden-sm" }, h("a", { key: '03f05ca6156be7d332003767a4ac2485170d4919', role: "button", class: "btn btn-default navbar-btn btn-link", "data-toggle": "modal", "data-target": "#login-modal" }, h("i", { key: 'b9279aae23e597472482b1d66233ef2df18ce4c1', class: "fa fa-user fa-lg", "aria-hidden": "true" }), h("span", { key: 'e4f8594718bbcbaf9f868c9269491df601c0c56b' }, "Login"))), h("li", { key: 'ffaa8b078a1f1da2d0bc8941be7a033e425af8b3', class: "hidden-xs" }, h("a", { key: '7de25b8e4af7110649577e9a0043ddcb0f6ec614', class: "btn btn-default navbar-btn btn-link", href: "https://market.crossvertise.com/de-de/mycrossvertise/account/register" }, h("span", { key: '36d0e4f425575a2925e51f22851c4d156f2c8a0e' }, "Registrieren"))), h("li", { key: '93f2374feb5f4285b8df4d7ecc2047055a644b6c', class: "navbar-divider hidden-xs" }), h("li", { key: '26599864dd47d74b8b4143fdf7bfac5d5a7a1991' }, h("a", { key: 'a263d5c0ef78cf4ed93ea3e788fabfb634116ee6', class: "btn btn-success navbar-btn", href: "https://market.crossvertise.com/de-de/mycrossvertise/shoppingcart/activecart" }, h("span", { key: '7f4c6d9d861b556dbfbca18ce5b2c5b34033c9dd', class: "xv-font-icon-warenkorb fa-lg fa-fw", "aria-hidden": "true" }), h("span", { key: '1b83d9a3258966f0b982436a954e852c83588ae0', class: "hidden-xs hidden-sm" }, "\u00A0Warenkorb\u00A0"), h("span", { key: 'a2e423edf3534e7367bdd8d41004a944c21e3eea', class: "badge badge-success" }, "0"))))))), h("div", { key: 'cfdd0d5a23384025d8ce1eab6e09cc88f21ef4aa', class: "collapse hidden-md hidden-lg", id: "search-collapse" }, h("div", { key: 'c6cd2346373fe563fa52b4045ac90f558c0abeaa', class: "container" }, h("form", { key: 'b1b3f3fc6c7eaccc6da72624786c747976aba21b', action: "https://market.crossvertise.com/de-de/media/search", class: "navbar-form", method: "get", role: "search" }, h("div", { key: 'ed1f817d2027760a32ce1612638eb10a99ef9338', class: "input-group" }, h("input", { key: '6953caece69247465868c0ac9b2cf72a08c6489f', class: "form-control", name: "Q", placeholder: "Suche", type: "text", autocomplete: "off" }), h("span", { key: 'fbff70f2115109b98fef9410fefcefe73c25460d', class: "input-group-btn force-full-width" }, h("button", { key: 'c7d246bda8ea174e0fd6a7888ac39b360090ab44', class: "btn btn-default search-addon", type: "submit" }, h("i", { key: 'b4256d72a2a05c08669619125bef1156d036511e', class: "fa fa-search", "aria-hidden": "true" })))))))), h("div", { key: '1aaa27ad68668cf906499a7aab97eeeb12c37834', innerHTML: this.htmlContent })));
26
+ return (h("div", { key: 'fb841d4abad14c4387fe46688c4f3af2307b886a', id: "nav-container", class: "xv-header" }, h("nav", { key: '58e74fe05d964a92caa4557b80507a38c4a98179', class: "navbar navbar-default navbar-fixed-top backend-force-relative" }, h("div", { key: '97ea3528c6e075c1d387ea24594f91104d7b8867', class: "container" }, h("div", { key: '8bdd52c37bcec11ea6b30d0174736f59788b53eb', class: "row" }, h("div", { key: 'e449f3feac1044f052ec6e2617c0d935064656c7', class: "col-sm-3 col-xs-3 col-xxs-4 no-padding-right" }, h("div", { key: '55a1d17cba703a6e40eb338c7543dc6976bf38a9', class: "navbar-header" }, h("button", { key: '4db1d1c007cce64e85d9c4bed564d2871ababcfc', class: "btn btn-default navbar-toggle pull-left navbar-btn", "data-toggle": "collapse", "data-target": "#main-menu" }, h("i", { key: '65e325b62f0438edd702620c4e17a53219967a0a', class: "fa fa-bars fa-lg", "aria-hidden": "true" })), h("div", { key: '441bfb68db2009ee3237b77d81fb95dc81aa481f', class: "visible-xs-inline" }, h("a", { key: 'addb8f9d2564bb51622d446709200f1f11ca5676', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: 'e3397a1cce10f32d84b329d7e0f86a668b59f0ce', src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg", alt: "Crossvertise" }))), h("div", { key: '90f493fdfb861b43a6e15fd98f4b20b5c27393f1', class: "hidden-xs" }, h("a", { key: '91d6cc6a27a1a1345453b6e61bffc75dd8af8dac', href: "https://www.crossvertise.com/", class: "navbar-brand" }, h("img", { key: '3e865f04a2b4fd3518d9afdb6e14c1ff40fe316f', loading: "lazy", src: "https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg", alt: "Crossvertise" }))))), h("div", { key: 'f93d3819bb445cdb9e5af3aef12b015a343d6310', class: "col-sm-9 col-xs-9 col-xxs-8 no-padding-left" }, h("ul", { key: 'f45ff2bde04e59dcf6b64843540aa3fd4e40f689', class: "nav nav-pills nav-meta pull-right" }, h("li", { key: 'ed84b8372b0d2bb667a8cafadb4ab563da5abfe0' }, h("a", { key: '13a62dee054906b573e6680101a3ca0b21b831a0', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, h("i", { key: '0baabbb18c07000acd90290323c9634be9c4fc7c', class: "fa fa-user" }), h("i", { key: 'd704cea8700026507e77c06ef9b9ed7debabe817', class: "fa fa-exchange-alt" }))), h("li", { key: '71071c96004f83a4aaf0c882139da925e42866a8' }, h("a", { key: 'e408f1d8d07134e922871ad2cf528f1593d0d1e0', class: "btn btn-link navbar-btn hidden-xs", href: "#" }, "Kontakt"), h("a", { key: 'c646eb76e06b7dbdc38b2c2781271413d2fd15ea', href: "https://www.crossvertise.com/contact", class: "btn btn-link navbar-btn hidden-xs", style: { display: 'none' } }, "Kontakt"), h("a", { key: '0af75819d57f535803e52289ff96fac569c50300', class: "btn btn-default btn-link navbar-btn visible-xs hidden-xxs", href: "#" }, h("i", { key: '5bbb8f180b8e305b03b6fdfec3390582b0150d5d', class: "fa fa-phone" }))), h("li", { key: 'eccf3a963e94fbfd5d0bac632583bf1bb8ae75af', class: "dropdown", id: "my-xv-menu" }, h("a", { key: 'c08b078cf111d3b68521eae23b80ca6f179462ca', href: "#", class: "dropdown-toggle btn btn-default navbar-btn btn-link", "data-toggle": "dropdown" }, h("i", { key: '64624fbad4dfcf0249e8cfeb40bf6724d1546b06', class: "fa fa-user fa-lg text-success", "aria-hidden": "true" }), "\u00A0", h("span", { key: '7cb9c97ba9717c43d5ca6f590434dd925e523726', class: "hidden-xs" }, "Mein Bereich"), h("span", { key: '96609dcd1f21c1de3f6b5921bf8d0d21414e16ba', class: "caret" })), h("ul", { key: '89d95f1a1620aba9e971ea4f2b53d5e82634dcb7', class: "dropdown-menu-left dropdown-menu navbar-myxv" }, h("li", { key: 'f995fffeb04c8e71855e333d1bcb88fa96cf138b' }, h("a", { key: '4f4109b08bd7fb0e0beff296a5566f447febb72e', href: "#" }, h("i", { key: '4676a42f1d33aca1fa82c39c66ad852d4a46a90b', class: "fa fa-tachometer-alt fa-fw" }), "\u00A0Cockpitfunktionen\u00A0", h("i", { key: '8f786200fa2781591c930bf2f8c5bcaab9c26ee6', class: "fa fa-caret-down" }))), h("li", { key: 'cbbe6aea9589e291677d1d4a9545b6338c515f59' }, h("a", { key: '90d02c4e0ffd7c880d5a054bd93efad517c17cf1', href: "#" }, h("i", { key: 'a658d4354d00bc1b33bdbabdd67c2822c0bbadd7', class: "fa fa-cubes" }), "\u00A0Entit\u00E4ten\u00A0", h("i", { key: 'a2a4d953a2f7ab3becd94609a063bd41444f1d5e', class: "fa fa-caret-down" }))), h("li", { key: '45f2e6536719387d007c300569bd888ab73a368e', role: "separator", class: "divider" }), h("li", { key: 'c1b3c21287ad9c948994a7e66b5598f2d7b92cee' }, h("a", { key: '4577bb088ee70c827a6c73670ab333c1e7233ebb', href: "#" }, h("i", { key: '59190e441f77825b6faa7f1a6a126b55368424bd', class: "fa fa-user" }), "\u00A0Mein Crossvertise\u00A0", h("span", { key: '56c84bb9710788f708f66a29b8ed2560eddcdc9c', class: "badge" }, "0"), h("i", { key: '3a94b49a78254ff80c748031879499e0b1c3d6cd', class: "fa fa-caret-down" }))), h("li", { key: '56c19ee479dd30ef4b2a3ced111c5a2488b011be' }, h("a", { key: 'bf6795b1a369fd48144a5c3f2d6dde87329005d3', href: "https://www.crossvertise.com/de-de/mycrossvertise/account/logoff?returnUrl=https%3A%2F%2Fwww.crossvertise.com" }, h("i", { key: 'd74387b0a971ec31ef52f7275a4059135f7a2f2e', class: "fa fa-sign-out-alt fa-fw", "aria-hidden": "true" }), "\u00A0Logout")))), h("li", { key: '4cd39d21f39cf38b653fe354fcac95541ed3b5d4', class: "visible-sm-block visible-xs-block hidden-xxs" }, h("a", { key: 'ff7d151d063d17b4937c8adee7240928abf11ca1', class: "btn btn-default navbar-btn btn-link", "data-toggle": "collapse", "data-target": "#search-collapse" }, h("i", { key: 'e921298a0e809efa116a19445211146af7ff478c', class: "fa fa-search", "aria-hidden": "true" }))), h("li", { key: 'daa6740a57a697e93099a9acf0f290103e38885e', class: "hidden-md hidden-lg" }, h("a", { key: '6b1d587f4fde5f26adcec987a13d837db9b3d4b9', class: "btn btn-default navbar-btn btn-link", href: "https://market.crossvertise.com/de-de/mycrossvertise/account/logon?returnUrl=https%3A%2F%2Fwww.crossvertise.com%2F" }, h("i", { key: '29eaea9f9d7c099b0666aa80c0baa47f0194eca8', class: "fa fa-user fa-lg", "aria-hidden": "true" }), h("span", { key: '2e32a44fff79ce051c6478911dff06ab014fcb03', class: "hidden-xs" }, "Login"))), h("li", { key: '70aad34ed65c79187309b6d43c2d60a4c50c10f7', class: "hidden-xs hidden-sm" }, h("a", { key: '0700efbabecfcc3c23703d5ef51d455cc37a7c76', role: "button", class: "btn btn-default navbar-btn btn-link", "data-toggle": "modal", "data-target": "#login-modal" }, h("i", { key: 'dacc64c5ec7a805a82c04786942045d34f9f5505', class: "fa fa-user fa-lg", "aria-hidden": "true" }), h("span", { key: '6862516762bb49b3268ab5439616e5d84eeee33a' }, "Login"))), h("li", { key: '1465c89bc216b466eb9b502503c4e071522b949e', class: "hidden-xs" }, h("a", { key: '4fb628fc7e3713032c8cc6291bea0364549ec486', class: "btn btn-default navbar-btn btn-link", href: "https://market.crossvertise.com/de-de/mycrossvertise/account/register" }, h("span", { key: 'bd27d18587f03bb6579a68ec0f67e401e9a2f4aa' }, "Registrieren"))), h("li", { key: 'b58c8bdfcba9fbcc4fc9abcc7a532552a6bf4d59', class: "navbar-divider hidden-xs" }), h("li", { key: '9c184e2e5ce45a573f227427b21511efb77a7367' }, h("a", { key: '4e1e2905fa27feef5ee4d7e8d08cf8f365460aa9', class: "btn btn-success navbar-btn", href: "https://market.crossvertise.com/de-de/mycrossvertise/shoppingcart/activecart" }, h("span", { key: 'bc461fb3883487c5a9bab6171e0395d896871dae', class: "xv-font-icon-warenkorb fa-lg fa-fw", "aria-hidden": "true" }), h("span", { key: '798befbada9c958f75aa71534223bfc3053e2d8a', class: "hidden-xs hidden-sm" }, "\u00A0Warenkorb\u00A0"), h("span", { key: '466810cee52d04c975304e2644a19b0fed8acb52', class: "badge badge-success" }, "0"))))))), h("div", { key: 'df2e0fdf3ee050571555b538a13b81255a5ed6d6', class: "collapse hidden-md hidden-lg", id: "search-collapse" }, h("div", { key: 'aa8e481da43b4d19fef2ebe5f18c3f698188109a', class: "container" }, h("form", { key: '1f74f4c3728f1dbc53ee160316cfc503a05d1809', action: "https://market.crossvertise.com/de-de/media/search", class: "navbar-form", method: "get", role: "search" }, h("div", { key: '3b0a8b8e0422baeabf49bc2acbd416ce3d0d0f4d', class: "input-group" }, h("input", { key: '81b1da2dc533688f68238fde64d2b0137143bfa0', class: "form-control", name: "Q", placeholder: "Suche", type: "text", autocomplete: "off" }), h("span", { key: '1bd05fa901a518fbfe48044a73d6b134699c1aeb', class: "input-group-btn force-full-width" }, h("button", { key: '825112ca880ad4ca36e449def155c87f1b134168', class: "btn btn-default search-addon", type: "submit" }, h("i", { key: '2812b8d6e635a3c8d971982340e70c1aa1d72072', class: "fa fa-search", "aria-hidden": "true" })))))))), h("div", { key: '33abf8e8dbe83d92a154f9487ba37826e0c3befe', innerHTML: this.htmlContent })));
27
27
  }
28
28
  static get is() { return "xv-header"; }
29
29
  static get originalStyleUrls() {
@@ -22,6 +22,11 @@
22
22
  text-decoration-line: none;
23
23
  }
24
24
 
25
+ :host(.xv-link_ghost) .xv-link {
26
+ color: inherit;
27
+ text-decoration: none;
28
+ }
29
+
25
30
  .xv-link {
26
31
  display: inline-flex;
27
32
  gap: 8px;
@@ -12,7 +12,7 @@ export class XvLink {
12
12
  e.stopPropagation();
13
13
  }
14
14
  render() {
15
- return (h(Host, { key: '9be5ba37fee1e5ec5679dfc2a633aa79585d2cc7', class: `xv-link_${this.variant}` }, h("a", { key: '3ef8125ad7602cc1a30c29bab90cafafe5e07573', href: this.href, onClick: this.preventLinkHandler.bind(this), class: `xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`, target: this.target }, h("slot", { key: 'e15d10152f80d8adab43b4a8679070e57e5ec876', name: "icon-left" }), h("slot", { key: 'b8f7e7ed9c0ee2cc650c7363dde0d33b85b5566d' }), h("slot", { key: '6e8d71e3e484edee74688bf5acaed759798761a8', name: "icon-right" }))));
15
+ return (h(Host, { key: 'de2c35e526a84d4f0ea3d309e9b338951cebf205', class: `xv-link_${this.variant}` }, h("a", { key: 'fb838688638462ab7e160377420b785584581b46', href: this.href, onClick: this.preventLinkHandler.bind(this), class: `xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`, target: this.target }, h("slot", { key: 'f921c3064a1372e1855fa41cd65f5dda53a98913', name: "icon-left" }), h("slot", { key: '6250191343e6676a7db35ff087e31ddc4f2a6f66' }), h("slot", { key: 'fc091c32addf4a4f1d2616b24f121325921f5954', name: "icon-right" }))));
16
16
  }
17
17
  static get is() { return "xv-link-v2"; }
18
18
  static get encapsulation() { return "shadow"; }
@@ -110,8 +110,8 @@ export class XvLink {
110
110
  "type": "string",
111
111
  "mutable": false,
112
112
  "complexType": {
113
- "original": "'standalone' | 'inline'",
114
- "resolved": "\"inline\" | \"standalone\"",
113
+ "original": "'standalone' | 'inline' | 'ghost'",
114
+ "resolved": "\"ghost\" | \"inline\" | \"standalone\"",
115
115
  "references": {}
116
116
  },
117
117
  "required": false,
@@ -1 +1 @@
1
- {"version":3,"file":"xv-link.js","sourceRoot":"","sources":["../../../src/components/xv-link/xv-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,MAAM;IALnB;QAQU,aAAQ,GAAY,KAAK,CAAC;QAC1B,SAAI,GAAuB,IAAI,CAAC;QAChC,YAAO,GAA4B,QAAQ,CAAC;KA2BrD;IAzBC,kBAAkB,CAAC,CAAe;QAChC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAE3B,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;IACtB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,WAAW,IAAI,CAAC,OAAO,EAAE;YACpC,0DACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAC3C,KAAK,EAAE,WAAW,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,EACxE,MAAM,EAAE,IAAI,CAAC,MAAM;gBAEnB,6DAAM,IAAI,EAAC,WAAW,GAAQ;gBAE9B,8DAAa;gBAEb,6DAAM,IAAI,EAAC,YAAY,GAAQ,CAC7B,CACC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-link-v2',\n styleUrl: 'xv-link.scss',\n shadow: true,\n})\nexport class XvLink {\n @Prop() href: string;\n @Prop() target: '_self' | '_blank' | '_parent' | '_top';\n @Prop() disabled: boolean = false;\n @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n @Prop() variant: 'standalone' | 'inline' = 'inline';\n\n preventLinkHandler(e: PointerEvent) {\n if (!this.disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n }\n\n render() {\n return (\n <Host class={`xv-link_${this.variant}`}>\n <a\n href={this.href}\n onClick={this.preventLinkHandler.bind(this)}\n class={`xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`}\n target={this.target}\n >\n <slot name=\"icon-left\"></slot>\n\n <slot></slot>\n\n <slot name=\"icon-right\"></slot>\n </a>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"xv-link.js","sourceRoot":"","sources":["../../../src/components/xv-link/xv-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,MAAM;IALnB;QAQU,aAAQ,GAAY,KAAK,CAAC;QAC1B,SAAI,GAAuB,IAAI,CAAC;QAChC,YAAO,GAAsC,QAAQ,CAAC;KA2B/D;IAzBC,kBAAkB,CAAC,CAAe;QAChC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAE3B,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;IACtB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,WAAW,IAAI,CAAC,OAAO,EAAE;YACpC,0DACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAC3C,KAAK,EAAE,WAAW,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,EACxE,MAAM,EAAE,IAAI,CAAC,MAAM;gBAEnB,6DAAM,IAAI,EAAC,WAAW,GAAQ;gBAE9B,8DAAa;gBAEb,6DAAM,IAAI,EAAC,YAAY,GAAQ,CAC7B,CACC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'xv-link-v2',\n styleUrl: 'xv-link.scss',\n shadow: true,\n})\nexport class XvLink {\n @Prop() href: string;\n @Prop() target: '_self' | '_blank' | '_parent' | '_top';\n @Prop() disabled: boolean = false;\n @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n @Prop() variant: 'standalone' | 'inline' | 'ghost' = 'inline';\n\n preventLinkHandler(e: PointerEvent) {\n if (!this.disabled) return;\n\n e.preventDefault();\n e.stopPropagation();\n }\n\n render() {\n return (\n <Host class={`xv-link_${this.variant}`}>\n <a\n href={this.href}\n onClick={this.preventLinkHandler.bind(this)}\n class={`xv-link ${this.disabled ? 'xv-link_disabled' : ''} ${this.size}`}\n target={this.target}\n >\n <slot name=\"icon-left\"></slot>\n\n <slot></slot>\n\n <slot name=\"icon-right\"></slot>\n </a>\n </Host>\n );\n }\n}\n"]}
@@ -1,5 +1,5 @@
1
1
  :host {
2
- display: inline-block;
2
+ display: inline-flex;
3
3
  }
4
4
  :host .backdrop {
5
5
  position: fixed;
@@ -20,12 +20,13 @@
20
20
  max-width: 960px;
21
21
  position: relative;
22
22
  animation: fadeIn 0.25s ease;
23
- padding: var(--gap-md, 16px);
23
+ padding-block: var(--gap-md, 16px);
24
24
  background: var(--layer-02, #FFF);
25
25
  box-shadow: 0 6px 10px 4px rgba(39, 52, 53, 0.15), 0 2px 3px 0 rgba(39, 52, 53, 0.3);
26
26
  }
27
27
  :host .modal_header {
28
28
  position: relative;
29
+ padding-inline: var(--gap-md, 16px);
29
30
  }
30
31
  :host .modal_header__title {
31
32
  color: var(--text-text-primary, #333);
@@ -35,12 +36,15 @@
35
36
  margin: 0 20px 0 0;
36
37
  }
37
38
  :host .modal_content {
38
- margin-top: var(--gap-md, 16px);
39
- margin-bottom: var(--gap-md, 16px);
39
+ padding: var(--gap-md, 16px);
40
+ overflow: visible;
41
+ }
42
+ :host .modal_content.overflow {
40
43
  overflow: auto;
41
44
  }
42
45
  :host .modal_footer {
43
46
  position: relative;
47
+ padding-inline: var(--gap-md, 16px);
44
48
  }
45
49
  :host .modal_close {
46
50
  z-index: 1;
@@ -14,6 +14,10 @@ export class XvModal {
14
14
  * Size of modal. But max size is 90% view width
15
15
  */
16
16
  this.size = SIZE_VAR.MD;
17
+ /**
18
+ * When need scroll modal content
19
+ */
20
+ this.overflow = true;
17
21
  this.triggerEl = null;
18
22
  this.onBackdropClick = async (e) => {
19
23
  if (this.permanent)
@@ -42,19 +46,19 @@ export class XvModal {
42
46
  async openModal() {
43
47
  var _a;
44
48
  this.open = true;
45
- (_a = this.changeOpen) === null || _a === void 0 ? void 0 : _a.emit(this.open);
49
+ (_a = this.openChange) === null || _a === void 0 ? void 0 : _a.emit(this.open);
46
50
  return this.open;
47
51
  }
48
52
  ;
49
53
  async closeModal() {
50
54
  var _a;
51
55
  this.open = false;
52
- (_a = this.changeOpen) === null || _a === void 0 ? void 0 : _a.emit(this.open);
56
+ (_a = this.openChange) === null || _a === void 0 ? void 0 : _a.emit(this.open);
53
57
  return this.open;
54
58
  }
55
59
  render() {
56
60
  var _a;
57
- return (h(Host, { key: '6402def40d1bd383381fc2d696daaed05ef2589e', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '1552ccbc352a3d6544681576114ba4eed1787f99', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: '5e7e1cd0a0abdd923d563fadaa9bcc54802a8e98', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '985c3257ce78509d1a749a32f0e4d9df2ffdf728', class: "modal" }, h("button", { key: '6b2073798e6911ef8fc79d9772f7bf59395e01d3', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '0e84498948e35e92d0a35717fe50d77e32884e73', class: "modal_header" }, h("slot", { key: '31aedf3610813334c0abc4f9a25017289acc7224', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: 'a38797b67a494fffc28c6126a6f47640b522bba3', class: "modal_header__title" }, this.el.title))), h("div", { key: '919757268480698659e7f524eb63bc06f73466e6', class: "modal_content" }, h("slot", { key: '5c310e5285f3dd0fb013a4cb92f969bb697b03d1' })), h("div", { key: '0ecf04b9c83ee114decfaea71792df727c6642f5', class: "modal_footer" }, h("slot", { key: 'd72b63333e9a6287d0d2d27189bf3bf16d12e297', name: "footer" }))))));
61
+ return (h(Host, { key: '2366289d47548d714bbdd49948f792f351f28f08', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '5315e7fff2a42c9cacff80f8123198b3b478afb9', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: 'de7fd67203a1728be67f86a2ea40279d93faa17c', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '088329b5f8624893d0e6a70de8e5320b555ca917', class: "modal" }, h("button", { key: '930e3e2f153a8b29ad072d3293ceff42d4f29467', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '454958176af3ffe3a3ce05fcd4676498ba64ed7d', class: "modal_header" }, h("slot", { key: 'c36847fd99974fe853eedebaab7d35b14895fc62', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: '967825b4cf637c6fde19330fda5b88fc63aee479', class: "modal_header__title" }, this.el.title))), h("div", { key: '6ea2df2fa221a02655c9d981565132879901bbe7', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '2636c2c24cfc4faf7561f2c4d5a380f23ce904e8' })), h("div", { key: 'cb4d838daf7bc1e8fb4c029318250ec2f3e7a37a', class: "modal_footer" }, h("slot", { key: '79b371cb00c2152a1131be31202f7c8061a4b61b', name: "footer" }))))));
58
62
  }
59
63
  disconnectedCallback() {
60
64
  this.removeTriggerListener();
@@ -110,7 +114,7 @@ export class XvModal {
110
114
  "getter": false,
111
115
  "setter": false,
112
116
  "attribute": "permanent",
113
- "reflect": false,
117
+ "reflect": true,
114
118
  "defaultValue": "false"
115
119
  },
116
120
  "size": {
@@ -136,15 +140,35 @@ export class XvModal {
136
140
  "getter": false,
137
141
  "setter": false,
138
142
  "attribute": "size",
139
- "reflect": false,
143
+ "reflect": true,
140
144
  "defaultValue": "SIZE_VAR.MD"
145
+ },
146
+ "overflow": {
147
+ "type": "boolean",
148
+ "mutable": false,
149
+ "complexType": {
150
+ "original": "boolean",
151
+ "resolved": "boolean",
152
+ "references": {}
153
+ },
154
+ "required": false,
155
+ "optional": false,
156
+ "docs": {
157
+ "tags": [],
158
+ "text": "When need scroll modal content"
159
+ },
160
+ "getter": false,
161
+ "setter": false,
162
+ "attribute": "overflow",
163
+ "reflect": true,
164
+ "defaultValue": "true"
141
165
  }
142
166
  };
143
167
  }
144
168
  static get events() {
145
169
  return [{
146
- "method": "changeOpen",
147
- "name": "changeOpen",
170
+ "method": "openChange",
171
+ "name": "openChange",
148
172
  "bubbles": true,
149
173
  "cancelable": true,
150
174
  "composed": true,
@@ -1 +1 @@
1
- {"version":3,"file":"xv-modal.js","sourceRoot":"","sources":["../../../src/components/xv-modal/xv-modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Element, Event, EventEmitter, Method } from '@stencil/core';\nimport { SIZE_VAR } from '../../types/enum';\n\n@Component({\n tag: 'xv-modal-v2',\n styleUrl: 'xv-modal.scss',\n shadow: true,\n})\nexport class XvModal {\n @Element() el: HTMLElement;\n /**\n * Is modal opened\n */\n @Prop({ reflect: true, mutable: true }) open: boolean = false;\n /**\n * If true then modal not be closed on backdrop click\n */\n @Prop() permanent: boolean = false;\n /**\n * Size of modal. But max size is 90% view width\n */\n @Prop() size: SIZE_VAR = SIZE_VAR.MD;\n\n @Event() changeOpen: EventEmitter<boolean>;\n\n private triggerEl: HTMLElement | null = null;\n\n @Method()\n async openModal() {\n this.open = true;\n this.changeOpen?.emit(this.open);\n return this.open\n };\n\n @Method()\n async closeModal() {\n this.open = false;\n this.changeOpen?.emit(this.open);\n return this.open\n }\n\n private onBackdropClick = async (e: MouseEvent) => {\n if (this.permanent) return;\n // click on backdrop\n if (e.target === e.currentTarget) {\n await this.closeModal();\n }\n };\n\n private removeTriggerListener = () => {\n this.triggerEl?.removeEventListener('click', this.openModal.bind(this));\n };\n\n private setupTrigger = () => {\n this.removeTriggerListener();\n const slot = this.el.shadowRoot.querySelector('slot[name=\"trigger\"]') as HTMLSlotElement;\n\n if (slot) {\n const assigned = slot.assignedElements();\n if (assigned.length > 0) {\n this.triggerEl = assigned[0] as HTMLElement;\n this.triggerEl.addEventListener('click', this.openModal.bind(this));\n }\n }\n }\n\n render() {\n return (\n <Host role=\"dialog\" size={this.size} id={this.el.id}>\n <slot name=\"trigger\" onSlotchange={this.setupTrigger} />\n\n <div class={{ backdrop: true }} onClick={this.onBackdropClick}>\n <div class=\"modal\">\n <button class=\"modal_close\" onClick={this.closeModal.bind(this)}>&times;</button>\n <div class=\"modal_header\">\n <slot name=\"header\">\n {this.el?.title && <h5 class=\"modal_header__title\">{this.el.title}</h5>}\n </slot>\n </div>\n\n <div class=\"modal_content\">\n <slot />\n </div>\n\n <div class=\"modal_footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n disconnectedCallback() {\n this.removeTriggerListener();\n }\n}\n"]}
1
+ {"version":3,"file":"xv-modal.js","sourceRoot":"","sources":["../../../src/components/xv-modal/xv-modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Element, Event, EventEmitter, Method } from '@stencil/core';\nimport { SIZE_VAR } from '../../types/enum';\n\n@Component({\n tag: 'xv-modal-v2',\n styleUrl: 'xv-modal.scss',\n shadow: true,\n})\nexport class XvModal {\n @Element() el: HTMLElement;\n /**\n * Is modal opened\n */\n @Prop({ reflect: true, mutable: true }) open: boolean = false;\n /**\n * If true then modal not be closed on backdrop click\n */\n @Prop({ reflect: true }) permanent: boolean = false;\n /**\n * Size of modal. But max size is 90% view width\n */\n @Prop({ reflect: true }) size: SIZE_VAR = SIZE_VAR.MD;\n /**\n * When need scroll modal content\n */\n @Prop({ reflect: true }) overflow: boolean = true;\n\n @Event({ eventName: 'openChange' }) openChange!: EventEmitter<boolean>;\n\n private triggerEl: HTMLElement | null = null;\n\n @Method()\n async openModal() {\n this.open = true;\n this.openChange?.emit(this.open);\n return this.open\n };\n\n @Method()\n async closeModal() {\n this.open = false;\n this.openChange?.emit(this.open);\n return this.open\n }\n\n private onBackdropClick = async (e: MouseEvent) => {\n if (this.permanent) return;\n // click on backdrop\n if (e.target === e.currentTarget) {\n await this.closeModal();\n }\n };\n\n private removeTriggerListener = () => {\n this.triggerEl?.removeEventListener('click', this.openModal.bind(this));\n };\n\n private setupTrigger = () => {\n this.removeTriggerListener();\n const slot = this.el.shadowRoot.querySelector('slot[name=\"trigger\"]') as HTMLSlotElement;\n\n if (slot) {\n const assigned = slot.assignedElements();\n if (assigned.length > 0) {\n this.triggerEl = assigned[0] as HTMLElement;\n this.triggerEl.addEventListener('click', this.openModal.bind(this));\n }\n }\n }\n\n render() {\n return (\n <Host role=\"dialog\" size={this.size} id={this.el.id}>\n <slot name=\"trigger\" onSlotchange={this.setupTrigger} />\n\n <div class={{ backdrop: true }} onClick={this.onBackdropClick}>\n <div class=\"modal\">\n <button class=\"modal_close\" onClick={this.closeModal.bind(this)}>&times;</button>\n <div class=\"modal_header\">\n <slot name=\"header\">\n {this.el?.title && <h5 class=\"modal_header__title\">{this.el.title}</h5>}\n </slot>\n </div>\n\n <div class={{ 'modal_content': true, overflow: this.overflow }}>\n <slot />\n </div>\n\n <div class=\"modal_footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n disconnectedCallback() {\n this.removeTriggerListener();\n }\n}\n"]}
@@ -25,7 +25,7 @@ export class XvNotification {
25
25
  };
26
26
  }
27
27
  render() {
28
- return (h(Host, { key: '9a0744259a817b6a28a5e6bf0841b28c67c38c4d', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: 'e7602dc421de6d9c81893df0938a8f8a752d50ac', class: "content" }, h("div", { key: '7dee10b112988942cd31301bdac111ea335ef471', class: "content_wrapper" }, this.el.title && h("h5", { key: '020c0d0eca5349549b5100701406756cc2871ffa', class: "content_title" }, this.el.title), h("slot", { key: '8b8e6f865d10b14f38b5d622fb7cd8b23c139eb2' })), h("slot", { key: 'cad5e543aabcba222ced7e26331bbb71239451fe', name: "footer" })), this.dismissible && h("button", { key: 'd5d67c83075389832315cbec1fe3852b72552d73', class: "close", onClick: this.closeHandle })));
28
+ return (h(Host, { key: '910f05cb3632aee19f893969b3f2225890586cfb', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: '575f30f393d7bf69f7ac4b7c14cc08742ea37a02', class: "content" }, h("div", { key: '9df87a020f9b0eeaa37b4162e930e3d73db4eba5', class: "content_wrapper" }, this.el.title && h("h5", { key: '6aceb1370abd0511d94def7830c203f8e51ad84b', class: "content_title" }, this.el.title), h("slot", { key: 'c053806cacc705dc3cfbba53c36dc761ca995e87' })), h("slot", { key: '7967d656c6541a9f21cb2a2cd87376915c21f0c3', name: "footer" })), this.dismissible && h("button", { key: '0cb3d1e44bb0f84f8a72f1ac7875364911fb4fa7', class: "close", onClick: this.closeHandle })));
29
29
  }
30
30
  static get is() { return "xv-notification-v2"; }
31
31
  static get encapsulation() { return "shadow"; }
@@ -65,7 +65,7 @@ export class XvNotification {
65
65
  "getter": false,
66
66
  "setter": false,
67
67
  "attribute": "variant",
68
- "reflect": false,
68
+ "reflect": true,
69
69
  "defaultValue": "NOTIFICATION_VARIANTS.INFO"
70
70
  },
71
71
  "dismissible": {
@@ -85,7 +85,7 @@ export class XvNotification {
85
85
  "getter": false,
86
86
  "setter": false,
87
87
  "attribute": "dismissible",
88
- "reflect": false,
88
+ "reflect": true,
89
89
  "defaultValue": "false"
90
90
  }
91
91
  };
@@ -1 +1 @@
1
- {"version":3,"file":"xv-notification.js","sourceRoot":"","sources":["../../../src/components/xv-notification/xv-notification.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAQhD,MAAM,OAAO,cAAc;IAN3B;QAQU,YAAO,GAA0B,qBAAqB,CAAC,IAAI,CAAC;QAC5D,gBAAW,GAAY,KAAK,CAAC;QAG7B,gBAAW,GAAG,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAoBpD,eAAU,GAAG,CAAC,OAA8B,EAAE,MAAc,MAAM,EAAE,EAAE;YAC5E,QAAQ,OAAO,EAAE,CAAC;gBAChB,KAAK,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC;oBACjC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,0RAA0R,GAAG,CAC7R,CACP,CAAC;gBACJ,CAAC;gBACD,KAAK,qBAAqB,CAAC,IAAI,CAAC,CAAC,CAAC;oBAChC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,0QAA0Q,GAAG,CAC7Q,CACP,CAAC;gBACJ,CAAC;gBACD,KAAK,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC;oBACnC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,mMAAmM,GAAG,CACtM,CACP,CAAA;gBACH,CAAC;gBACD,KAAK,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC;oBACnC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,yTAAyT,GAAG,CAC5T,CACP,CAAC;gBACJ,CAAC;gBACD;oBACE,OAAO,IAAI,CAAC;YAChB,CAAC;QACH,CAAC,CAAC;KACH;IAxDC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAE,IAAI,CAAC,OAAO;YAC7C,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC;YAE9B,4DAAK,KAAK,EAAC,SAAS;gBAClB,4DAAK,KAAK,EAAC,iBAAiB;oBACzB,IAAI,CAAC,EAAE,CAAC,KAAK,IAAI,2DAAI,KAAK,EAAC,eAAe,IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,CAAM;oBAChE,8DAAa,CACT;gBACN,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB;YAEL,IAAI,CAAC,WAAW,IAAI,+DAAQ,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,GAAI,CACnE,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwCF","sourcesContent":["import { Component, Host, h, Prop, Element, Event, EventEmitter } from '@stencil/core';\nimport { NOTIFICATION_VARIANTS } from './_vars';\n\n@Component({\n tag: 'xv-notification-v2',\n styleUrl: 'xv-notification.scss',\n shadow: true,\n assetsDirs: ['xv-notification/icons']\n})\nexport class XvNotification {\n @Element() el: HTMLElement;\n @Prop() variant: NOTIFICATION_VARIANTS = NOTIFICATION_VARIANTS.INFO;\n @Prop() dismissible: boolean = false;\n @Event() close: EventEmitter<MouseEvent>;\n\n private closeHandle = (e: MouseEvent) => this.close.emit(e);\n\n render() {\n return (\n <Host class=\"xv-notification\" type={this.variant}>\n {this.renderIcon(this.variant)}\n\n <div class=\"content\">\n <div class=\"content_wrapper\">\n {this.el.title && <h5 class=\"content_title\">{this.el.title}</h5>}\n <slot></slot>\n </div>\n <slot name=\"footer\"></slot>\n </div>\n\n {this.dismissible && <button class=\"close\" onClick={this.closeHandle} />}\n </Host>\n );\n }\n\n private renderIcon = (variant: NOTIFICATION_VARIANTS, cls: string = 'icon') => {\n switch (variant) {\n case NOTIFICATION_VARIANTS.ERROR: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z\" />\n </svg>\n );\n }\n case NOTIFICATION_VARIANTS.INFO: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z\" />\n </svg>\n );\n }\n case NOTIFICATION_VARIANTS.SUCCESS: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z\" />\n </svg>\n )\n }\n case NOTIFICATION_VARIANTS.WARNING: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z\" />\n </svg>\n );\n }\n default:\n return null;\n }\n };\n}\n"]}
1
+ {"version":3,"file":"xv-notification.js","sourceRoot":"","sources":["../../../src/components/xv-notification/xv-notification.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAQhD,MAAM,OAAO,cAAc;IAN3B;QAQ2B,YAAO,GAA0B,qBAAqB,CAAC,IAAI,CAAC;QAC5D,gBAAW,GAAY,KAAK,CAAC;QAG9C,gBAAW,GAAG,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAoBpD,eAAU,GAAG,CAAC,OAA8B,EAAE,MAAc,MAAM,EAAE,EAAE;YAC5E,QAAQ,OAAO,EAAE,CAAC;gBAChB,KAAK,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC;oBACjC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,0RAA0R,GAAG,CAC7R,CACP,CAAC;gBACJ,CAAC;gBACD,KAAK,qBAAqB,CAAC,IAAI,CAAC,CAAC,CAAC;oBAChC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,0QAA0Q,GAAG,CAC7Q,CACP,CAAC;gBACJ,CAAC;gBACD,KAAK,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC;oBACnC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,mMAAmM,GAAG,CACtM,CACP,CAAA;gBACH,CAAC;gBACD,KAAK,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC;oBACnC,OAAO,CACL,WAAK,KAAK,EAAE,GAAG,EAAE,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa;wBACvE,YACE,CAAC,EAAC,yTAAyT,GAAG,CAC5T,CACP,CAAC;gBACJ,CAAC;gBACD;oBACE,OAAO,IAAI,CAAC;YAChB,CAAC;QACH,CAAC,CAAC;KACH;IAxDC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAE,IAAI,CAAC,OAAO;YAC7C,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC;YAE9B,4DAAK,KAAK,EAAC,SAAS;gBAClB,4DAAK,KAAK,EAAC,iBAAiB;oBACzB,IAAI,CAAC,EAAE,CAAC,KAAK,IAAI,2DAAI,KAAK,EAAC,eAAe,IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,CAAM;oBAChE,8DAAa,CACT;gBACN,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB;YAEL,IAAI,CAAC,WAAW,IAAI,+DAAQ,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,GAAI,CACnE,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwCF","sourcesContent":["import { Component, Host, h, Prop, Element, Event, EventEmitter } from '@stencil/core';\nimport { NOTIFICATION_VARIANTS } from './_vars';\n\n@Component({\n tag: 'xv-notification-v2',\n styleUrl: 'xv-notification.scss',\n shadow: true,\n assetsDirs: ['xv-notification/icons']\n})\nexport class XvNotification {\n @Element() el: HTMLElement;\n @Prop({ reflect: true }) variant: NOTIFICATION_VARIANTS = NOTIFICATION_VARIANTS.INFO;\n @Prop({ reflect: true }) dismissible: boolean = false;\n @Event() close: EventEmitter<MouseEvent>;\n\n private closeHandle = (e: MouseEvent) => this.close.emit(e);\n\n render() {\n return (\n <Host class=\"xv-notification\" type={this.variant}>\n {this.renderIcon(this.variant)}\n\n <div class=\"content\">\n <div class=\"content_wrapper\">\n {this.el.title && <h5 class=\"content_title\">{this.el.title}</h5>}\n <slot></slot>\n </div>\n <slot name=\"footer\"></slot>\n </div>\n\n {this.dismissible && <button class=\"close\" onClick={this.closeHandle} />}\n </Host>\n );\n }\n\n private renderIcon = (variant: NOTIFICATION_VARIANTS, cls: string = 'icon') => {\n switch (variant) {\n case NOTIFICATION_VARIANTS.ERROR: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z\" />\n </svg>\n );\n }\n case NOTIFICATION_VARIANTS.INFO: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z\" />\n </svg>\n );\n }\n case NOTIFICATION_VARIANTS.SUCCESS: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z\" />\n </svg>\n )\n }\n case NOTIFICATION_VARIANTS.WARNING: {\n return (\n <svg class={cls} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n <path\n d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z\" />\n </svg>\n );\n }\n default:\n return null;\n }\n };\n}\n"]}
@@ -11,7 +11,7 @@ export class XvOverflowMenuItem {
11
11
  this.itemClick.emit({ event, value: this.value });
12
12
  }
13
13
  render() {
14
- return (h(Host, { key: '8abe8cdfa428125612c4c8f399be07b101d7faff', class: "xv-overflow-menu-item", role: "menuitem", disabled: this.disabled }, h("slot", { key: '08c7c14f181c7980bc9ff4fc8dd511753b4b6c9e' })));
14
+ return (h(Host, { key: '8dc660c2d77b3885eb0b164633874047ca89058c', class: "xv-overflow-menu-item", role: "menuitem", disabled: this.disabled }, h("slot", { key: '557ee1f91a59d867bae782b7352688f091c3228b' })));
15
15
  }
16
16
  static get is() { return "xv-overflow-menu-v2-item"; }
17
17
  static get encapsulation() { return "shadow"; }
@@ -51,6 +51,9 @@
51
51
  max-width: 50vw;
52
52
  width: max-content;
53
53
  }
54
+ :host .list.open {
55
+ overflow: visible;
56
+ }
54
57
  :host .list ::slotted(xv-overflow-menu-v2-item) {
55
58
  padding: var(--overflow-menu-item-padding);
56
59
  }
@@ -48,7 +48,7 @@ export class XvOverflowMenu {
48
48
  }
49
49
  }
50
50
  render() {
51
- return (h(Host, { key: '38ab189c178b27de9de8cbd0174bc96b0beea5e6', class: "xv-overflow-menu", size: this.size, role: "menu", tabindex: -1 }, h("button", { key: '62a4ca90c866339ae4efeeb9579c5077ffed4f64', class: { btn: true, open: this.open }, onClick: this.onOpenToggle, disabled: this.disabled }, h("svg", { key: 'b46f8ca4e1073a1cca0c4c22c6e4d29f6f45b24c', xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 128 512" }, h("path", { key: '8a9f8d9b2e717a997d07ad3fb77c2ff9afbf2ac6', d: "M64 368a48 48 0 1 0 0 96 48 48 0 1 0 0-96zm0-160a48 48 0 1 0 0 96 48 48 0 1 0 0-96zM112 96A48 48 0 1 0 16 96a48 48 0 1 0 96 0z" }))), h("div", { key: 'cee611c895bb7386fe154b033c3c0da53e1ee493', class: { list: true, open: this.open, [`position-${this.position}`]: true } }, h("slot", { key: '9caf0adb12c16e7937df82c6bac4385be883ea22' }))));
51
+ return (h(Host, { key: '4a9f6f2c8a5a4f3c4d1b8c666930b51ccab80228', class: "xv-overflow-menu", size: this.size, role: "menu", tabindex: -1 }, h("button", { key: 'd55471ea38b1f3bf3d04054ff310f616d3c1cd4d', class: { btn: true, open: this.open }, onClick: this.onOpenToggle, disabled: this.disabled }, h("svg", { key: '70d5c2fd85655ecc48060d31a3ac3e2d822b33ce', xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 128 512" }, h("path", { key: '68847d692a27943e1e39368da3f448b4162cecb2', d: "M64 368a48 48 0 1 0 0 96 48 48 0 1 0 0-96zm0-160a48 48 0 1 0 0 96 48 48 0 1 0 0-96zM112 96A48 48 0 1 0 16 96a48 48 0 1 0 96 0z" }))), h("div", { key: '0c57895d318dc03c502f28a1b175aee7cc14c573', class: { list: true, open: this.open, [`position-${this.position}`]: true } }, h("slot", { key: 'd5645b5bce743e4cc8eae0c271379d212926c3b2' }))));
52
52
  }
53
53
  componentDidLoad() {
54
54
  this.openChangeHandle();
@@ -5,7 +5,7 @@ export class XvProgressIndicatorItem {
5
5
  this.status = PROGRESS_ITEM_STATUS.NO_STARTED;
6
6
  }
7
7
  render() {
8
- return (h(Host, { key: 'b1ab45057fee17bc449648e1c127239ada00f9c5', status: this.status, class: { 'xv-progress-indicator-item': true } }, h("span", { key: 'b933ea361bf3f97c4d50a08e15c6bb57c7ef1aaf', class: "line" }), h("span", { key: '267e7a12e4536b7b8ac9a102ebbbf4f072cb6302', class: "icon" }, h("svg", { key: '21694dc47b94fbbbbe3f6f864d8c500b6e9b0310', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" }, h("path", { key: '03e39da95382ddc05bbd41d9768f30cdf0d3de6e', fill: "currentColor", d: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" }))), h("p", { key: '12399f0c9a664804e014db0e7be6b3c117a560ef', class: "label" }, h("slot", { key: 'b2fc1af75b062c83063530923de8621dd38a4572' }))));
8
+ return (h(Host, { key: '79acb016d3774423ebc4b4fca110a2ac450358ff', status: this.status, class: { 'xv-progress-indicator-item': true } }, h("span", { key: 'da650032b1e038635c5bbbbdabcf8de3d510c162', class: "line" }), h("span", { key: 'b3cfcdca102ea9d180b711a90a3a735b1faf0296', class: "icon" }, h("svg", { key: 'ad92853715e40b74c291867a158759cfd13ff9af', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" }, h("path", { key: '955f05d5ffcebd9dee12fd89ae34cdf94d68f668', fill: "currentColor", d: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" }))), h("p", { key: '9c47e82f96314c2e0868c6c67ff9c0b4b66eec4f', class: "label" }, h("slot", { key: '5730d018f363e84fb299877ee854360eb42b06ce' }))));
9
9
  }
10
10
  static get is() { return "xv-progress-indicator-v2-item"; }
11
11
  static get encapsulation() { return "shadow"; }
@@ -56,7 +56,7 @@ export class XvProgressIndicator {
56
56
  this.updateChildItems();
57
57
  }
58
58
  render() {
59
- return (h(Host, { key: 'be4d8e9691b1421a5e6c50f9737b0f0e72182bdc', variant: this.variant, size: this.size, class: { 'xv-progress-indicator': true } }, h("slot", { key: '59631a2651175f2ccd94c2120df900160812b2fb' })));
59
+ return (h(Host, { key: '00ad521136d02deaedb3984ff711d23ff0853062', variant: this.variant, size: this.size, class: { 'xv-progress-indicator': true } }, h("slot", { key: '054dbfebd8387688975665058d9bba3903a768fc' })));
60
60
  }
61
61
  static get is() { return "xv-progress-indicator-v2"; }
62
62
  static get encapsulation() { return "shadow"; }
@@ -89,7 +89,7 @@ export class XvProgressIndicator {
89
89
  "getter": false,
90
90
  "setter": false,
91
91
  "attribute": "progress",
92
- "reflect": false,
92
+ "reflect": true,
93
93
  "defaultValue": "0"
94
94
  },
95
95
  "variant": {