@ppg_pl/pallete 0.0.2 → 0.0.4

package/dist/components/my-backdrop.js

@@ -1,6 +0,0 @@
-import { M as MyBackdrop$1, d as defineCustomElement$1 } from './my-backdrop2.js';
-
-const MyBackdrop = MyBackdrop$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MyBackdrop, defineCustomElement };

package/dist/components/my-backdrop2.js

@@ -1,29 +0,0 @@
-import { proxyCustomElement, HTMLElement } from '@stencil/core/internal/client';
-
-const myBackdropCss = "html{font-size:62.5%}body{font-size:1.5rem}*{font-family:\"Galatea\", sans-serif}my-backdrop{width:100%;height:100%;background-color:rgba(0, 0, 0, 0.7);position:fixed;z-index:100;left:0;top:0}";
-
-const MyBackdrop = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-  }
-  render() {
-    return null;
-  }
-  static get style() { return myBackdropCss; }
-}, [0, "my-backdrop"]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["my-backdrop"];
-  components.forEach(tagName => { switch (tagName) {
-    case "my-backdrop":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, MyBackdrop);
-      }
-      break;
-  } });
-}
-
-export { MyBackdrop as M, defineCustomElement as d };

package/dist/components/my-colorbox.js

@@ -1,6 +0,0 @@
-import { M as MyColorBox, d as defineCustomElement$1 } from './my-colorbox2.js';
-
-const MyColorbox = MyColorBox;
-const defineCustomElement = defineCustomElement$1;
-
-export { MyColorbox, defineCustomElement };

package/dist/components/my-colorbox2.js

@@ -1,61 +0,0 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { s as setDataLayer } from './gtmUtils.js';
-
-const myColorboxCss = "html{font-size:62.5%}body{font-size:1.5rem}*{font-family:\"Galatea\", sans-serif}.my-color-box{width:125px;height:125px;display:block;margin-bottom:5px;cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;position:relative}@media (max-width: 1024px){.my-color-box{width:80px;height:80px}}.my-color-box .color-name{width:100%;background-color:#fff;padding:15px 0px 10px;border-top-left-radius:15px;border-top-right-radius:15px;opacity:0;transition:0.3s opacity ease-in-out;font-size:1rem;color:#232323;text-transform:lowercase}.my-color-box.active .color-name{opacity:1}.my-color-box.categoryactive{width:120px;height:115px}.my-color-box.categoryactive .color-name{opacity:1}@media (max-width: 1024px){.my-color-box.categoryactive{width:72px;height:72px}}.my-color-box:hover .color-name{opacity:1}";
-
-const MyColorBox = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.colorCheck = () => {
-      this.checkTimeout = setTimeout(() => {
-        setDataLayer({
-          event: 'ColorCheck',
-          shop: this.shop,
-          product: this.product,
-          color: this.name,
-        });
-      }, 2000);
-    };
-    this.colorUnCheck = () => {
-      if (this.checkTimeout)
-        clearTimeout(this.checkTimeout);
-      this.checkTimeout = undefined;
-    };
-    this.darkenColor = (color) => {
-      const red = parseInt(color[1] + color[2], 16) - 20;
-      const green = parseInt(color[3] + color[4], 16) - 20;
-      const blue = parseInt(color[5] + color[6], 16) - 20;
-      return `rgb(${red},${green},${blue})`;
-    };
-  }
-  render() {
-    return (h("div", { onMouseEnter: () => this.colorCheck(), onMouseLeave: () => this.colorUnCheck(), class: `my-color-box ${this.isActive ? 'active' : ''} ${this.isCategoryActive ? 'categoryactive' : ''}`, style: {
-        background: this.color,
-        border: this.isCategoryActive ? `5px solid ${this.darkenColor(this.color)}` : '',
-      } }, h("div", { class: "color-name" }, this.name)));
-  }
-  static get style() { return myColorboxCss; }
-}, [0, "my-colorbox", {
-    "color": [1],
-    "name": [1],
-    "shop": [1],
-    "product": [1],
-    "isActive": [4, "is-active"],
-    "isCategoryActive": [4, "is-category-active"]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["my-colorbox"];
-  components.forEach(tagName => { switch (tagName) {
-    case "my-colorbox":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, MyColorBox);
-      }
-      break;
-  } });
-}
-
-export { MyColorBox as M, defineCustomElement as d };

package/dist/components/my-colorinfo.js

@@ -1,6 +0,0 @@
-import { M as MyColorInfo, d as defineCustomElement$1 } from './my-colorinfo2.js';
-
-const MyColorinfo = MyColorInfo;
-const defineCustomElement = defineCustomElement$1;
-
-export { MyColorinfo, defineCustomElement };

package/dist/components/my-loader.js

@@ -1,6 +0,0 @@
-import { M as MyLoader$1, d as defineCustomElement$1 } from './my-loader2.js';
-
-const MyLoader = MyLoader$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MyLoader, defineCustomElement };

package/dist/components/my-loader2.js

@@ -1,29 +0,0 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-
-const myLoaderCss = ".container{display:flex;justify-content:center;align-items:center;height:100px;overflow:hidden}.item{width:20px;height:20px;margin:3px;list-style-type:none;transition:0.5s all ease}.item:nth-child(1){animation:right-1 1s infinite alternate;background-color:#b8cf40;animation-delay:20ms}@keyframes right-1{0%{transform:translateY(-18px)}100%{transform:translateY(18px)}}.item:nth-child(2){animation:right-2 1s infinite alternate;background-color:#ee4b5e;animation-delay:40ms}@keyframes right-2{0%{transform:translateY(-21px)}100%{transform:translateY(21px)}}.item:nth-child(3){animation:right-3 1s infinite alternate;background-color:#ea0f47;animation-delay:60ms}@keyframes right-3{0%{transform:translateY(-24px)}100%{transform:translateY(24px)}}.item:nth-child(4){animation:right-4 1s infinite alternate;background-color:#d42840;animation-delay:80ms}@keyframes right-4{0%{transform:translateY(-27px)}100%{transform:translateY(27px)}}.item:nth-child(5){animation:right-5 1s infinite alternate;background-color:#8b2850;animation-delay:100ms}@keyframes right-5{0%{transform:translateY(-30px)}100%{transform:translateY(30px)}}";
-
-const MyLoader = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-  }
-  render() {
-    return (h("div", { class: "container" }, h("div", { class: "item" }), h("div", { class: "item" }), h("div", { class: "item" }), h("div", { class: "item" }), h("div", { class: "item" })));
-  }
-  static get style() { return myLoaderCss; }
-}, [0, "my-loader"]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["my-loader"];
-  components.forEach(tagName => { switch (tagName) {
-    case "my-loader":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, MyLoader);
-      }
-      break;
-  } });
-}
-
-export { MyLoader as M, defineCustomElement as d };

package/dist/components/my-modal.js

@@ -1,6 +0,0 @@
-import { M as MyModal$1, d as defineCustomElement$1 } from './my-modal2.js';
-
-const MyModal = MyModal$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MyModal, defineCustomElement };

package/dist/components/my-search.js

@@ -1,6 +0,0 @@
-import { M as MySearch$1, d as defineCustomElement$1 } from './my-search2.js';
-
-const MySearch = MySearch$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MySearch, defineCustomElement };

package/dist/components/my-search2.js

@@ -1,55 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, getAssetPath } from '@stencil/core/internal/client';
-
-const mySearchCss = "html.sc-my-search{font-size:62.5%}body.sc-my-search{font-size:1.5rem}*.sc-my-search{font-family:\"Galatea\", sans-serif}.search.sc-my-search{position:relative;width:400px}@media (max-width: 768px){.search.sc-my-search{width:100%}}.search.sc-my-search input.sc-my-search{margin-bottom:12px;font-size:1.6rem;padding:19px;border-radius:27.35px;border:1px solid #dfdfdf;width:100%}.search.sc-my-search button.sc-my-search{position:absolute;border:none;background-color:transparent;right:-20px;top:0;width:50px;height:calc(100% - 12px);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer}";
-
-const MySearch = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.searchColors = createEvent(this, "searchColors", 7);
-    this.searchIcon = 'search.svg';
-    this.searchText = null;
-    this.fetchColorsByName = (text) => {
-      this.searchColors.emit(text);
-    };
-  }
-  onInputChangeValue(event) {
-    const value = event.target.value;
-    this.searchColors.emit(value);
-    this.searchText = value;
-  }
-  fetchColorsByNameHandle(newValue) {
-    this.fetchColorsByName(newValue);
-  }
-  render() {
-    return (h("div", { class: 'search' }, h("input", { placeholder: this.isMobile ? 'Wyszukaj kolor' : 'Wyszukaj kolor po nazwie bądź numerze', value: this.searchText || '', type: "text", onInput: this.onInputChangeValue.bind(this) }), h("button", { onClick: () => {
-        this.searchText && this.fetchColorsByName(this.searchText);
-        this.searchText = '';
-      } }, h("img", { src: getAssetPath(`./assets/${this.searchIcon}`), alt: "arrow_down" }))));
-  }
-  static get assetsDirs() { return ["assets"]; }
-  static get watchers() { return {
-    "searchText": ["fetchColorsByNameHandle"]
-  }; }
-  static get style() { return mySearchCss; }
-}, [2, "my-search", {
-    "productId": [2, "product-id"],
-    "isMobile": [4, "is-mobile"],
-    "searchIcon": [1, "search-icon"],
-    "searchText": [32]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["my-search"];
-  components.forEach(tagName => { switch (tagName) {
-    case "my-search":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, MySearch);
-      }
-      break;
-  } });
-}
-
-export { MySearch as M, defineCustomElement as d };

package/dist/components/my-slider.js

@@ -1,6 +0,0 @@
-import { J as JcSwiper, d as defineCustomElement$1 } from './index2.js';
-
-const MySlider = JcSwiper;
-const defineCustomElement = defineCustomElement$1;
-
-export { MySlider, defineCustomElement };