@ppg_pl/pallete 2.0.23 → 2.0.25

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 (89) hide show
  1. package/README.md +12 -5
  2. package/dist/cjs/{index-53e78fc8.js → index-d74cbc0d.js} +33 -2
  3. package/dist/cjs/index-d74cbc0d.js.map +1 -0
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/loader.cjs.js.map +1 -1
  6. package/dist/cjs/my-backdrop_8.cjs.entry.js +1648 -1286
  7. package/dist/cjs/my-backdrop_8.cjs.entry.js.map +1 -1
  8. package/dist/cjs/pallete.cjs.js +2 -2
  9. package/dist/cjs/pallete.cjs.js.map +1 -1
  10. package/dist/collection/components/my-backdrop/my-backdrop.css +7 -0
  11. package/dist/collection/components/my-colorbox/my-colorbox.css +7 -0
  12. package/dist/collection/components/my-colorinfo/assets/Shape.svg +4 -0
  13. package/dist/collection/components/my-colorinfo/assets/close.png +0 -0
  14. package/dist/collection/components/my-colorinfo/assets/shape.png +0 -0
  15. package/dist/collection/components/my-colorinfo/my-colorinfo.js +124 -1
  16. package/dist/collection/components/my-colorinfo/my-colorinfo.js.map +1 -1
  17. package/dist/collection/components/my-component/my-component.js +68 -1
  18. package/dist/collection/components/my-component/my-component.js.map +1 -1
  19. package/dist/collection/components/my-modal/my-modal.css +140 -31
  20. package/dist/collection/components/my-modal/my-modal.js +41 -2
  21. package/dist/collection/components/my-modal/my-modal.js.map +1 -1
  22. package/dist/collection/components/my-search/my-search.css +7 -0
  23. package/dist/collection/components/my-slider/index.js +9 -6
  24. package/dist/collection/components/my-slider/index.js.map +1 -1
  25. package/dist/collection/components/my-slider/my-slider.css +12 -3
  26. package/dist/collection/types.js.map +1 -1
  27. package/dist/components/index3.js +10 -7
  28. package/dist/components/index3.js.map +1 -1
  29. package/dist/components/my-backdrop2.js +1 -1
  30. package/dist/components/my-backdrop2.js.map +1 -1
  31. package/dist/components/my-colorbox2.js +1 -1
  32. package/dist/components/my-colorbox2.js.map +1 -1
  33. package/dist/components/my-colorinfo2.js +42 -2
  34. package/dist/components/my-colorinfo2.js.map +1 -1
  35. package/dist/components/my-component.js +15 -3
  36. package/dist/components/my-component.js.map +1 -1
  37. package/dist/components/my-modal2.js +1588 -1273
  38. package/dist/components/my-modal2.js.map +1 -1
  39. package/dist/components/my-search2.js +1 -1
  40. package/dist/components/my-search2.js.map +1 -1
  41. package/dist/esm/{index-b0145abf.js → index-45a30349.js} +33 -2
  42. package/dist/esm/index-45a30349.js.map +1 -0
  43. package/dist/esm/loader.js +3 -3
  44. package/dist/esm/loader.js.map +1 -1
  45. package/dist/esm/my-backdrop_8.entry.js +1648 -1286
  46. package/dist/esm/my-backdrop_8.entry.js.map +1 -1
  47. package/dist/esm/pallete.js +3 -3
  48. package/dist/esm/pallete.js.map +1 -1
  49. package/dist/pallete/assets/Shape.svg +4 -0
  50. package/dist/pallete/assets/shape.png +0 -0
  51. package/dist/pallete/p-a3449132.js +3 -0
  52. package/dist/pallete/p-a3449132.js.map +1 -0
  53. package/dist/pallete/p-d142c667.entry.js +2 -0
  54. package/dist/pallete/p-d142c667.entry.js.map +1 -0
  55. package/dist/pallete/pallete.css +1 -1
  56. package/dist/pallete/pallete.esm.js +1 -1
  57. package/dist/pallete/pallete.esm.js.map +1 -1
  58. package/dist/types/components/my-colorinfo/my-colorinfo.d.ts +11 -1
  59. package/dist/types/components/my-component/my-component.d.ts +9 -0
  60. package/dist/types/components/my-modal/my-modal.d.ts +3 -1
  61. package/dist/types/components.d.ts +24 -2
  62. package/dist/types/types.d.ts +4 -0
  63. package/package.json +5 -4
  64. package/www/build/assets/Shape.svg +4 -0
  65. package/www/build/assets/shape.png +0 -0
  66. package/www/build/p-8c41f668.js +2 -0
  67. package/www/build/p-a3449132.js +3 -0
  68. package/www/build/p-a3449132.js.map +1 -0
  69. package/www/build/p-d142c667.entry.js +2 -0
  70. package/www/build/p-d142c667.entry.js.map +1 -0
  71. package/www/build/p-f8a0208d.css +1 -0
  72. package/www/build/pallete.css +1 -1
  73. package/www/build/pallete.esm.js +1 -1
  74. package/www/build/pallete.esm.js.map +1 -1
  75. package/www/index.html +62 -10
  76. package/dist/cjs/index-53e78fc8.js.map +0 -1
  77. package/dist/esm/index-b0145abf.js.map +0 -1
  78. package/dist/pallete/p-bdb05818.entry.js +0 -2
  79. package/dist/pallete/p-bdb05818.entry.js.map +0 -1
  80. package/dist/pallete/p-c6a049a2.js +0 -3
  81. package/dist/pallete/p-c6a049a2.js.map +0 -1
  82. package/www/build/p-bdb05818.entry.js +0 -2
  83. package/www/build/p-bdb05818.entry.js.map +0 -1
  84. package/www/build/p-c6a049a2.js +0 -3
  85. package/www/build/p-c6a049a2.js.map +0 -1
  86. /package/www/{build/assets → assets}/fonts/Galatea-Regular.eot +0 -0
  87. /package/www/{build/assets → assets}/fonts/Galatea-Regular.ttf +0 -0
  88. /package/www/{build/assets → assets}/fonts/Galatea-Regular.woff +0 -0
  89. /package/www/{build/assets → assets}/fonts/Galatea-Regular.woff2 +0 -0
package/README.md CHANGED
@@ -20,7 +20,6 @@ This documentation provides an overview of the project's architecture, technolog
20
20
 
21
21
  - **Webcomponent Library**: The frontend application is written as a webcomponent using [StencilJS](https://stenciljs.com/docs/introduction).
22
22
  - **Integration**: To integrate the webcomponent into an HTML file, follow these steps:
23
-
24
23
  1. Install the package using npm:
25
24
 
26
25
  ```
@@ -49,9 +48,11 @@ This documentation provides an overview of the project's architecture, technolog
49
48
  <style type="text/css" media="screen, print">
50
49
  @font-face {
51
50
  font-family: 'Galatea';
52
- src: url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.woff2) format('woff2'), url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.woff)
53
- format('woff'), url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.ttf) format('truetype'), url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.eot)
54
- format('embedded-opentype');
51
+ src:
52
+ url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.woff2) format('woff2'),
53
+ url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.woff) format('woff'),
54
+ url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.ttf) format('truetype'),
55
+ url(/node_modules/@ppg_pl/pallete/www/build/assets/fonts/Galatea-Regular.eot) format('embedded-opentype');
55
56
  font-weight: 400;
56
57
  font-style: normal;
57
58
  }
@@ -61,7 +62,7 @@ This documentation provides an overview of the project's architecture, technolog
61
62
  <script nomodule src="/node_modules/@ppg_pl/pallete/www/build/pallete.js"></script>
62
63
  </head>
63
64
  <body>
64
- <my-component class="modal_pallete"></my-component>
65
+ <my-component class="modal_pallete" price="5.99"></my-component>
65
66
 
66
67
  <label for="shop">Shop</label> <input name="shop" type="shop" /> <label for="product">Product</label><input name="product" type="product" />
67
68
  <button>open modal</button>
@@ -72,11 +73,17 @@ This documentation provides an overview of the project's architecture, technolog
72
73
  const shop = document.querySelector('input[name="shop"]');
73
74
  const product = document.querySelector('input[name="product"]');
74
75
 
76
+ modal.setAttribute('available_testers', JSON.stringify([{ id_product_attribute: 213, color_name: 'ecru' }]));
75
77
  btn.addEventListener('click', () => {
76
78
  modal.setAttribute('shop', shop.value);
77
79
  modal.setAttribute('product', product.value);
78
80
  modal.open();
79
81
  });
82
+ modal.addEventListener('addToBasket', e => {
83
+ const { id } = e.detail;
84
+
85
+ console.log('Dodaj tester do koszyka:', id);
86
+ });
80
87
  </script>
81
88
  </body>
82
89
  </html>
package/dist/cjs/{index-53e78fc8.js → index-d74cbc0d.js} RENAMED
@@ -60,6 +60,11 @@ const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
60
60
  * Don't add values to these!!
61
61
  */
62
62
  const EMPTY_OBJ = {};
63
+ /**
64
+ * Namespaces
65
+ */
66
+ const SVG_NS = 'http://www.w3.org/2000/svg';
67
+ const HTML_NS = 'http://www.w3.org/1999/xhtml';
63
68
  const isDef = (v) => v != null;
64
69
  /**
65
70
  * Check whether a value is a 'complex type', defined here as an object or a
@@ -561,8 +566,15 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
561
566
  elm = newVNode.$elm$ = doc.createTextNode(newVNode.$text$);
562
567
  }
563
568
  else {
569
+ if (!isSvgMode) {
570
+ isSvgMode = newVNode.$tag$ === 'svg';
571
+ }
564
572
  // create element
565
- elm = newVNode.$elm$ = (doc.createElement(newVNode.$tag$));
573
+ elm = newVNode.$elm$ = (doc.createElementNS(isSvgMode ? SVG_NS : HTML_NS, newVNode.$tag$)
574
+ );
575
+ if (isSvgMode && newVNode.$tag$ === 'foreignObject') {
576
+ isSvgMode = false;
577
+ }
566
578
  // add css classes, attrs, props, listeners, etc.
567
579
  {
568
580
  updateElement(null, newVNode, isSvgMode);
@@ -583,6 +595,16 @@ const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
583
595
  }
584
596
  }
585
597
  }
598
+ {
599
+ if (newVNode.$tag$ === 'svg') {
600
+ // Only reset the SVG context when we're exiting <svg> element
601
+ isSvgMode = false;
602
+ }
603
+ else if (elm.tagName === 'foreignObject') {
604
+ // Reenter SVG context when we're exiting <foreignObject> element
605
+ isSvgMode = true;
606
+ }
607
+ }
586
608
  }
587
609
  return elm;
588
610
  };
@@ -885,8 +907,14 @@ const patch = (oldVNode, newVNode) => {
885
907
  const elm = (newVNode.$elm$ = oldVNode.$elm$);
886
908
  const oldChildren = oldVNode.$children$;
887
909
  const newChildren = newVNode.$children$;
910
+ const tag = newVNode.$tag$;
888
911
  const text = newVNode.$text$;
889
912
  if (text === null) {
913
+ {
914
+ // test if we're rendering an svg element, or still rendering nodes inside of one
915
+ // only add this to the when the compiler sees we're using an svg somewhere
916
+ isSvgMode = tag === 'svg' ? true : tag === 'foreignObject' ? false : isSvgMode;
917
+ }
890
918
  {
891
919
  {
892
920
  // either this is the first render of an element OR it's an update
@@ -913,6 +941,9 @@ const patch = (oldVNode, newVNode) => {
913
941
  // no new child vnodes, but there are old child vnodes to remove
914
942
  removeVnodes(oldChildren, 0, oldChildren.length - 1);
915
943
  }
944
+ if (isSvgMode && tag === 'svg') {
945
+ isSvgMode = false;
946
+ }
916
947
  }
917
948
  else if (oldVNode.$text$ !== text) {
918
949
  // update the text content for the text only vnode
@@ -1660,4 +1691,4 @@ exports.promiseResolve = promiseResolve;
1660
1691
  exports.registerInstance = registerInstance;
1661
1692
  exports.setNonce = setNonce;
1662
1693
 
1663
- //# sourceMappingURL=index-53e78fc8.js.map
1694
+ //# sourceMappingURL=index-d74cbc0d.js.map