@shoper/phoenix_design_system 1.18.8-5 → 1.18.8-6

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 (21) hide show
  1. package/build/cjs/packages/phoenix/src/components/details/details.js +11 -0
  2. package/build/cjs/packages/phoenix/src/components/details/details.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/components/details/details_content.js +23 -0
  4. package/build/cjs/packages/phoenix/src/components/details/details_content.js.map +1 -0
  5. package/build/cjs/packages/phoenix/src/components/details/details_toggler.js +63 -0
  6. package/build/cjs/packages/phoenix/src/components/details/details_toggler.js.map +1 -0
  7. package/build/cjs/packages/phoenix/src/index.js +14 -0
  8. package/build/cjs/packages/phoenix/src/index.js.map +1 -1
  9. package/build/esm/packages/phoenix/src/components/details/details.d.ts +1 -0
  10. package/build/esm/packages/phoenix/src/components/details/details.js +11 -0
  11. package/build/esm/packages/phoenix/src/components/details/details.js.map +1 -1
  12. package/build/esm/packages/phoenix/src/components/details/details_content.d.ts +6 -0
  13. package/build/esm/packages/phoenix/src/components/details/details_content.js +21 -0
  14. package/build/esm/packages/phoenix/src/components/details/details_content.js.map +1 -0
  15. package/build/esm/packages/phoenix/src/components/details/details_toggler.d.ts +11 -0
  16. package/build/esm/packages/phoenix/src/components/details/details_toggler.js +61 -0
  17. package/build/esm/packages/phoenix/src/components/details/details_toggler.js.map +1 -0
  18. package/build/esm/packages/phoenix/src/index.d.ts +2 -0
  19. package/build/esm/packages/phoenix/src/index.js +2 -0
  20. package/build/esm/packages/phoenix/src/index.js.map +1 -1
  21. package/package.json +1 -1
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
+ var lit = require('lit');
6
7
  var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
7
8
  var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
8
9
  var details_constants = require('./details_constants.js');
@@ -53,6 +54,16 @@ exports.HDetails = class HDetails extends phoenix_light_lit_element.PhoenixLight
53
54
  detail: { open, target: details }
54
55
  });
55
56
  }
57
+ render() {
58
+ return lit.html `
59
+ <details class="smooth-details">
60
+ ${this.getSlot('toggler')}
61
+ <summary>Click to expand</summary>
62
+
63
+ ${this.getSlot('content')}
64
+ </details>
65
+ `;
66
+ }
56
67
  };
57
68
  exports.HDetails = tslib_es6.__decorate([
58
69
  phoenix_custom_element.phoenixCustomElement('h-details')
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,23 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
+ var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
7
+ var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
8
+
9
+ exports.HDetailsContent = class HDetailsContent extends phoenix_light_lit_element.PhoenixLightLitElement {
10
+ constructor() {
11
+ super();
12
+ this.slot = this.hasAttribute('slot') ? this.slot : 'content';
13
+ }
14
+ connectedCallback() {
15
+ super.connectedCallback();
16
+ this.classList.add('content-wrapper');
17
+ }
18
+ };
19
+ exports.HDetailsContent = tslib_es6.__decorate([
20
+ phoenix_custom_element.phoenixCustomElement('h-details-content'),
21
+ tslib_es6.__metadata("design:paramtypes", [])
22
+ ], exports.HDetailsContent);
23
+ //# sourceMappingURL=details_content.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,63 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
+ var lit = require('lit');
7
+ var decorators = require('lit/decorators');
8
+ var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
9
+ var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
10
+
11
+ exports.HDetailsToggler = class HDetailsToggler extends phoenix_light_lit_element.PhoenixLightLitElement {
12
+ constructor() {
13
+ super();
14
+ this._dynamicNodes = [];
15
+ this._nodeObserver = null;
16
+ this.slot = this.hasAttribute('slot') ? this.slot : 'toggler';
17
+ }
18
+ connectedCallback() {
19
+ super.connectedCallback();
20
+ this.captureNewNodes();
21
+ this._nodeObserver = new MutationObserver((mutations) => {
22
+ let shouldUpdate = false;
23
+ for (const mutation of mutations) {
24
+ for (const node of mutation.addedNodes) {
25
+ if (node.nodeName.toLowerCase() !== 'summary') {
26
+ shouldUpdate = true;
27
+ }
28
+ }
29
+ }
30
+ if (shouldUpdate) {
31
+ this.captureNewNodes();
32
+ }
33
+ });
34
+ this._nodeObserver.observe(this, { childList: true });
35
+ }
36
+ disconnectedCallback() {
37
+ var _a;
38
+ super.disconnectedCallback();
39
+ (_a = this._nodeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
40
+ }
41
+ captureNewNodes() {
42
+ const incomingNodes = Array.from(this.childNodes).filter((node) => node.nodeName.toLowerCase() !== 'summary');
43
+ if (incomingNodes.length > 0) {
44
+ this._dynamicNodes = [...this._dynamicNodes, ...incomingNodes];
45
+ }
46
+ }
47
+ render() {
48
+ return lit.html `
49
+ <summary>
50
+ ${this._dynamicNodes}
51
+ </summary>
52
+ `;
53
+ }
54
+ };
55
+ tslib_es6.__decorate([
56
+ decorators.state(),
57
+ tslib_es6.__metadata("design:type", Array)
58
+ ], exports.HDetailsToggler.prototype, "_dynamicNodes", void 0);
59
+ exports.HDetailsToggler = tslib_es6.__decorate([
60
+ phoenix_custom_element.phoenixCustomElement('h-details-toggler'),
61
+ tslib_es6.__metadata("design:paramtypes", [])
62
+ ], exports.HDetailsToggler);
63
+ //# sourceMappingURL=details_toggler.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -81,6 +81,8 @@ var accordion_content = require('./components/accordion/accordion_content.js');
81
81
  var accordion_toggler = require('./components/accordion/accordion_toggler.js');
82
82
  var details_constants = require('./components/details/details_constants.js');
83
83
  var details = require('./components/details/details.js');
84
+ var details_toggler = require('./components/details/details_toggler.js');
85
+ var details_content = require('./components/details/details_content.js');
84
86
  var dropdown_close = require('./components/dropdown/dropdown_close.js');
85
87
  var toggle_button_group = require('./components/groups/toggle_button_group/toggle_button_group.js');
86
88
  var toggle_button = require('./components/groups/toggle_button_group/toggle_button.js');
@@ -503,6 +505,18 @@ Object.defineProperty(exports, 'HDetails', {
503
505
  return details.HDetails;
504
506
  }
505
507
  });
508
+ Object.defineProperty(exports, 'HDetailsToggler', {
509
+ enumerable: true,
510
+ get: function () {
511
+ return details_toggler.HDetailsToggler;
512
+ }
513
+ });
514
+ Object.defineProperty(exports, 'HDetailsContent', {
515
+ enumerable: true,
516
+ get: function () {
517
+ return details_content.HDetailsContent;
518
+ }
519
+ });
506
520
  Object.defineProperty(exports, 'HDropdownClose', {
507
521
  enumerable: true,
508
522
  get: function () {
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -8,4 +8,5 @@ export declare class HDetails extends PhoenixLightLitElement {
8
8
  private _open;
9
9
  private _close;
10
10
  private _dispatchToggle;
11
+ protected render(): unknown;
11
12
  }
@@ -1,4 +1,5 @@
1
1
  import { __decorate } from '../../../../../external/tslib/tslib.es6.js';
2
+ import { html } from 'lit';
2
3
  import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
3
4
  import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
4
5
  import { DETAILS_CSS_CLASSES, DETAILS_TRANSITION_DURATION, DETAILS_EVENTS } from './details_constants.js';
@@ -49,6 +50,16 @@ let HDetails = class HDetails extends PhoenixLightLitElement {
49
50
  detail: { open, target: details }
50
51
  });
51
52
  }
53
+ render() {
54
+ return html `
55
+ <details class="smooth-details">
56
+ ${this.getSlot('toggler')}
57
+ <summary>Click to expand</summary>
58
+
59
+ ${this.getSlot('content')}
60
+ </details>
61
+ `;
62
+ }
52
63
  };
53
64
  HDetails = __decorate([
54
65
  phoenixCustomElement('h-details')
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,2BAA2B,4CAAgD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,2BAA2B,4CAAgD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,6 @@
1
+ import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
2
+ import './details_types';
3
+ export declare class HDetailsContent extends PhoenixLightLitElement {
4
+ constructor();
5
+ connectedCallback(): void;
6
+ }
@@ -0,0 +1,21 @@
1
+ import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
2
+ import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
3
+ import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
4
+
5
+ let HDetailsContent = class HDetailsContent extends PhoenixLightLitElement {
6
+ constructor() {
7
+ super();
8
+ this.slot = this.hasAttribute('slot') ? this.slot : 'content';
9
+ }
10
+ connectedCallback() {
11
+ super.connectedCallback();
12
+ this.classList.add('content-wrapper');
13
+ }
14
+ };
15
+ HDetailsContent = __decorate([
16
+ phoenixCustomElement('h-details-content'),
17
+ __metadata("design:paramtypes", [])
18
+ ], HDetailsContent);
19
+
20
+ export { HDetailsContent };
21
+ //# sourceMappingURL=details_content.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,11 @@
1
+ import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
2
+ import './details_types';
3
+ export declare class HDetailsToggler extends PhoenixLightLitElement {
4
+ private _dynamicNodes;
5
+ private _nodeObserver;
6
+ constructor();
7
+ connectedCallback(): void;
8
+ disconnectedCallback(): void;
9
+ private captureNewNodes;
10
+ protected render(): import("lit-html").TemplateResult<1>;
11
+ }
@@ -0,0 +1,61 @@
1
+ import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
2
+ import { html } from 'lit';
3
+ import { state } from 'lit/decorators';
4
+ import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
5
+ import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
6
+
7
+ let HDetailsToggler = class HDetailsToggler extends PhoenixLightLitElement {
8
+ constructor() {
9
+ super();
10
+ this._dynamicNodes = [];
11
+ this._nodeObserver = null;
12
+ this.slot = this.hasAttribute('slot') ? this.slot : 'toggler';
13
+ }
14
+ connectedCallback() {
15
+ super.connectedCallback();
16
+ this.captureNewNodes();
17
+ this._nodeObserver = new MutationObserver((mutations) => {
18
+ let shouldUpdate = false;
19
+ for (const mutation of mutations) {
20
+ for (const node of mutation.addedNodes) {
21
+ if (node.nodeName.toLowerCase() !== 'summary') {
22
+ shouldUpdate = true;
23
+ }
24
+ }
25
+ }
26
+ if (shouldUpdate) {
27
+ this.captureNewNodes();
28
+ }
29
+ });
30
+ this._nodeObserver.observe(this, { childList: true });
31
+ }
32
+ disconnectedCallback() {
33
+ var _a;
34
+ super.disconnectedCallback();
35
+ (_a = this._nodeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
36
+ }
37
+ captureNewNodes() {
38
+ const incomingNodes = Array.from(this.childNodes).filter((node) => node.nodeName.toLowerCase() !== 'summary');
39
+ if (incomingNodes.length > 0) {
40
+ this._dynamicNodes = [...this._dynamicNodes, ...incomingNodes];
41
+ }
42
+ }
43
+ render() {
44
+ return html `
45
+ <summary>
46
+ ${this._dynamicNodes}
47
+ </summary>
48
+ `;
49
+ }
50
+ };
51
+ __decorate([
52
+ state(),
53
+ __metadata("design:type", Array)
54
+ ], HDetailsToggler.prototype, "_dynamicNodes", void 0);
55
+ HDetailsToggler = __decorate([
56
+ phoenixCustomElement('h-details-toggler'),
57
+ __metadata("design:paramtypes", [])
58
+ ], HDetailsToggler);
59
+
60
+ export { HDetailsToggler };
61
+ //# sourceMappingURL=details_toggler.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -72,6 +72,8 @@ export { HAccordionToggler } from './components/accordion/accordion_toggler';
72
72
  export { HAccordionContent } from './components/accordion/accordion_content';
73
73
  export * from './components/accordion/accordion_constants';
74
74
  export { HDetails } from './components/details/details';
75
+ export { HDetailsToggler } from './components/details/details_toggler';
76
+ export { HDetailsContent } from './components/details/details_content';
75
77
  export * from './components/details/details_constants';
76
78
  export { BtnController } from './controllers/btn_controller/btn_controller';
77
79
  export { HDropdown } from './components/dropdown/dropdown';
@@ -77,6 +77,8 @@ export { HAccordionContent } from './components/accordion/accordion_content.js';
77
77
  export { HAccordionToggler } from './components/accordion/accordion_toggler.js';
78
78
  export { DETAILS_CSS_CLASSES, DETAILS_EVENTS, DETAILS_TRANSITION_DURATION } from './components/details/details_constants.js';
79
79
  export { HDetails } from './components/details/details.js';
80
+ export { HDetailsToggler } from './components/details/details_toggler.js';
81
+ export { HDetailsContent } from './components/details/details_content.js';
80
82
  export { HDropdownClose } from './components/dropdown/dropdown_close.js';
81
83
  export { HToggleButtonGroup } from './components/groups/toggle_button_group/toggle_button_group.js';
82
84
  export { HToggleButton } from './components/groups/toggle_button_group/toggle_button.js';
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@shoper/phoenix_design_system",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "1.18.8-5",
5
+ "version": "1.18.8-6",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",