vviinn-widgets 2.18.21 → 2.19.0

package/dist/collection/components/vviinn-modal/vviinn-modal.css

@@ -3,7 +3,6 @@
   border-radius: 4px;
   box-sizing: border-box;
   display: grid;
-  grid-template-rows: -webkit-min-content auto;
   grid-template-rows: min-content auto;
   max-width: 960px;
   overflow: auto;
@@ -11,19 +10,14 @@
 
 @media (max-width: 415px) {
   :host {
-    -webkit-animation-name: fade-in;
-            animation-name: fade-in;
-    -webkit-animation-duration: 0.5s;
-            animation-duration: 0.5s;
-    -webkit-animation-fill-mode: forwards;
-            animation-fill-mode: forwards;
+    animation-name: fade-in;
+    animation-duration: 0.5s;
+    animation-fill-mode: forwards;
   }
 
   :host(.closed) {
-    -webkit-animation-name: fade-out;
-            animation-name: fade-out;
-    -webkit-animation-fill-mode: none;
-            animation-fill-mode: none;
+    animation-name: fade-out;
+    animation-fill-mode: none;
   }
 
   .body {
@@ -40,11 +34,7 @@
 .head {
   align-items: center;
   border-bottom: 1px solid #f4f4f4;
-  display: grid;
-  grid-gap: 16px;
-  grid-template-columns: -webkit-min-content auto -webkit-min-content;
-  grid-template-columns: min-content auto min-content;
-  justify-items: center;
+  display: flex;
   padding: 16px;
 }
 
@@ -52,6 +42,7 @@
   font-weight: 600;
   font-size: 18px;
   line-height: 24px;
+  margin: 0 auto;
 }
 
 button {
@@ -65,16 +56,6 @@ button {
   padding: unset;
 }
 
-@-webkit-keyframes fade-in {
-  from {
-    transform: translateY(100%);
-  }
-
-  to {
-    transform: translateY(0);
-  }
-}
-
 @keyframes fade-in {
   from {
     transform: translateY(100%);
@@ -85,16 +66,6 @@ button {
   }
 }
 
-@-webkit-keyframes fade-out {
-  from {
-    transform: translateY(0);
-  }
-
-  to {
-    transform: translateY(100%);
-  }
-}
-
 @keyframes fade-out {
   from {
     transform: translateY(0);

package/dist/collection/components/vviinn-modal/vviinn-modal.js

@@ -1,9 +1,12 @@
-import { Component, Host, h, State, Event, Prop, Element, } from "@stencil/core";
+import { Host, h, } from "@stencil/core";
 import { slotChangeListener } from "../customized-slots";
 import { campaignTypeNames } from "../../campaign/Campaign";
 export class VviinnModal {
   constructor() {
     this.active = false;
+    this.resetState = undefined;
+    this.buttonElementId = undefined;
+    this.hideBackButton = false;
     this.slider = false;
   }
   componentWillLoad() {
@@ -26,106 +29,126 @@ export class VviinnModal {
     this.slider = true;
   }
   render() {
-    return (h(Host, { exportparts: "secondary-action, title, close-button", class: { closed: !this.active }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) },
-      h("div", { class: "head" },
-        h("button", { part: "secondary-action", onClick: () => this.resetState() },
-          h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-            h("path", { d: "M20.25 12H3.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }),
-            h("path", { d: "M10.5 5.25L3.75 12L10.5 18.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))),
-        h("div", { class: "title", part: "title" },
-          h("slot", { name: "vviinn-image-search-modal-title" }, "Bildsuche")),
-        h("button", { onClick: () => this.close(), class: "close-button", part: "close-button" },
-          h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-            h("path", { d: "M16 1.4L14.6 0L8 6.6L1.4 0L0 1.4L6.6 8L0 14.6L1.4 16L8 9.4L14.6 16L16 14.6L9.4 8L16 1.4Z", fill: "#333333" })))),
-      h("div", { class: "body" },
-        h("slot", null))));
+    return (h(Host, { exportparts: "secondary-action, title, close-button", class: { closed: !this.active }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, h("div", { class: "head" }, !this.hideBackButton && (h("button", { part: "secondary-action", onClick: () => this.resetState() }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M20.25 12H3.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M10.5 5.25L3.75 12L10.5 18.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { class: "title", part: "title" }, h("slot", { name: "vviinn-image-search-modal-title" }, "Bildsuche")), h("button", { onClick: () => this.close(), class: "close-button", part: "close-button" }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M16 1.4L14.6 0L8 6.6L1.4 0L0 1.4L6.6 8L0 14.6L1.4 16L8 9.4L14.6 16L16 14.6L9.4 8L16 1.4Z", fill: "#333333" })))), h("div", { class: "body" }, h("slot", null))));
   }
   static get is() { return "vviinn-modal"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["vviinn-modal.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["vviinn-modal.css"]
-  }; }
-  static get properties() { return {
-    "active": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["vviinn-modal.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["vviinn-modal.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "active": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "active",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "resetState": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "() => void",
+          "resolved": "() => void",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
       },
-      "attribute": "active",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "resetState": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "() => void",
-        "resolved": "() => void",
-        "references": {}
+      "buttonElementId": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "button-element-id",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "hideBackButton": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "hide-back-button",
+        "reflect": false,
+        "defaultValue": "false"
       }
-    },
-    "buttonElementId": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "text": undefined,
-            "name": "internal"
-          }],
-        "text": ""
-      },
-      "attribute": "button-element-id",
-      "reflect": false
-    }
-  }; }
-  static get states() { return {
-    "slider": {}
-  }; }
-  static get events() { return [{
-      "method": "vviinnWidgetClose",
-      "name": "vviinnWidgetClose",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Event emitted when close button clicked and close animation ends"
-      },
-      "complexType": {
-        "original": "BasicEventData",
-        "resolved": "{ widgetType: WidgetType; campaignTypeId: CampaignTypeId; campaignTypeName: CampaignTypeTitle; widgetId?: string; }",
-        "references": {
-          "BasicEventData": {
-            "location": "import",
-            "path": "../../recommendation/events"
+    };
+  }
+  static get states() {
+    return {
+      "slider": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "vviinnWidgetClose",
+        "name": "vviinnWidgetClose",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Event emitted when close button clicked and close animation ends"
+        },
+        "complexType": {
+          "original": "BasicEventData",
+          "resolved": "{ widgetType: WidgetType; campaignTypeId: CampaignTypeId; campaignTypeName: CampaignTypeTitle; widgetId?: string; }",
+          "references": {
+            "BasicEventData": {
+              "location": "import",
+              "path": "../../recommendation/events"
+            }
           }
         }
-      }
-    }]; }
+      }];
+  }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=vviinn-modal.js.map

package/dist/collection/components/vviinn-modal/vviinn-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-modal.js","sourceRoot":"","sources":["../../../src/components/vviinn-modal/vviinn-modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,CAAC,EACD,KAAK,EACL,KAAK,EAEL,IAAI,EACJ,OAAO,GACR,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAEzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAO5D,MAAM,OAAO,WAAW;;kBAGoC,KAAK;;;0BAK7B,KAAK;kBAEZ,KAAK;;EAKhC,iBAAiB;IACf,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;EACpC,CAAC;EAEO,KAAK;IACX,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IAEpB,UAAU,CACR,GAAG,EAAE;MACH,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;QAC1B,UAAU,EAAE,KAAK;QACjB,cAAc,EAAE,KAAK;QACrB,gBAAgB,EAAE,iBAAiB,CAAC,KAAK,CAAC;QAC1C,QAAQ,EAAE,IAAI,CAAC,eAAe;OAC/B,CAAC,CAAC;IACL,CAAC,EACD,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CACtB,CAAC;EACJ,CAAC;EAEO,kBAAkB,CAAC,EAAkB;IAC3C,IAAI,EAAE,CAAC,aAAa,KAAK,SAAS;MAAE,OAAO;IAC3C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;EACrB,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,WAAW,EAAC,uCAAuC,EACnD,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,EAC/B,cAAc,EAAE,CAAC,EAAkB,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,EAAE,CAAC;MAEnE,WAAK,KAAK,EAAC,MAAM;QACd,CAAC,IAAI,CAAC,cAAc,IAAI,CACvB,cAAQ,IAAI,EAAC,kBAAkB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE;UAC9D,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B;YAElC,YACE,CAAC,EAAC,gBAAgB,EAClB,MAAM,EAAC,SAAS,kBACH,GAAG,oBACD,OAAO,qBACN,OAAO,GACvB;YACF,YACE,CAAC,EAAC,+BAA+B,EACjC,MAAM,EAAC,SAAS,kBACH,GAAG,oBACD,OAAO,qBACN,OAAO,GACvB,CACE,CACC,CACV;QAED,WAAK,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO;UAC7B,YAAM,IAAI,EAAC,iCAAiC,gBAAiB,CACzD;QAEN,cACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,EAC3B,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,cAAc;UAEnB,WACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B;YAElC,YACE,CAAC,EAAC,0FAA0F,EAC5F,IAAI,EAAC,SAAS,GACd,CACE,CACC,CACL;MACN,WAAK,KAAK,EAAC,MAAM;QACf,eAAa,CACT,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  State,\n  Event,\n  EventEmitter,\n  Prop,\n  Element,\n} from \"@stencil/core\";\nimport { slotChangeListener } from \"../customized-slots\";\nimport { BasicEventData } from \"../../recommendation/events\";\nimport { campaignTypeNames } from \"../../campaign/Campaign\";\n\n@Component({\n  tag: \"vviinn-modal\",\n  styleUrl: \"vviinn-modal.css\",\n  shadow: true,\n})\nexport class VviinnModal {\n  @Element() el: HTMLElement;\n\n  @Prop({ mutable: true, reflect: true }) active: boolean = false;\n  @Prop() resetState: () => void;\n  /** @internal */\n  @Prop() buttonElementId?: string;\n  /** @internal */\n  @Prop() hideBackButton: boolean = false;\n\n  @State() slider: boolean = false;\n\n  /** Event emitted when close button clicked and close animation ends */\n  @Event() vviinnWidgetClose: EventEmitter<BasicEventData>;\n\n  componentWillLoad() {\n    slotChangeListener(this, this.el);\n  }\n\n  private close() {\n    this.active = false;\n\n    setTimeout(\n      () => {\n        this.vviinnWidgetClose.emit({\n          widgetType: \"VPS\",\n          campaignTypeId: \"VPS\",\n          campaignTypeName: campaignTypeNames[\"VPS\"],\n          widgetId: this.buttonElementId,\n        });\n      },\n      this.slider ? 500 : 0\n    );\n  }\n\n  private handleAnimationEnd(ev: AnimationEvent) {\n    if (ev.animationName !== \"fade-in\") return;\n    this.slider = true;\n  }\n\n  render() {\n    return (\n      <Host\n        exportparts=\"secondary-action, title, close-button\"\n        class={{ closed: !this.active }}\n        onAnimationEnd={(ev: AnimationEvent) => this.handleAnimationEnd(ev)}\n      >\n        <div class=\"head\">\n          {!this.hideBackButton && (\n            <button part=\"secondary-action\" onClick={() => this.resetState()}>\n              <svg\n                width=\"24\"\n                height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  d=\"M20.25 12H3.75\"\n                  stroke=\"#161616\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n                <path\n                  d=\"M10.5 5.25L3.75 12L10.5 18.75\"\n                  stroke=\"#161616\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </svg>\n            </button>\n          )}\n\n          <div class=\"title\" part=\"title\">\n            <slot name=\"vviinn-image-search-modal-title\">Bildsuche</slot>\n          </div>\n\n          <button\n            onClick={() => this.close()}\n            class=\"close-button\"\n            part=\"close-button\"\n          >\n            <svg\n              width=\"16\"\n              height=\"16\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M16 1.4L14.6 0L8 6.6L1.4 0L0 1.4L6.6 8L0 14.6L1.4 16L8 9.4L14.6 16L16 14.6L9.4 8L16 1.4Z\"\n                fill=\"#333333\"\n              />\n            </svg>\n          </button>\n        </div>\n        <div class=\"body\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-1/vviinn-onboarding-card-1.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Element } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 import { slotChangeListener } from "../../../customized-slots";
 import { OnboardingCard1Icon } from "../../../vviinn-icons";
 export class VviinnOnboardingCard1 {
@@ -6,21 +6,20 @@ export class VviinnOnboardingCard1 {
     slotChangeListener(this, this.el);
   }
   render() {
-    return (h(Host, null,
-      h("slot", { name: "onboarding-card-1-icon" },
-        h(OnboardingCard1Icon, null)),
-      h("slot", { name: "onboarding-card-1-text" },
-        h("div", { class: "text" },
-          h("h4", null, "Starte die Bildsuche"),
-          h("p", null, "Lade ein Bild aus Deiner Galerie hoch oder fotografiere ein Produkt mit Deiner Kamera.")))));
+    return (h(Host, null, h("slot", { name: "onboarding-card-1-icon" }, h(OnboardingCard1Icon, null)), h("slot", { name: "onboarding-card-1-text" }, h("div", { class: "text" }, h("h4", null, "Starte die Bildsuche"), h("p", null, "Lade ein Bild aus Deiner Galerie hoch oder fotografiere ein Produkt mit Deiner Kamera.")))));
   }
   static get is() { return "vviinn-onboarding-card-1"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["../onboarding-card.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["../onboarding-card.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["../onboarding-card.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["../onboarding-card.css"]
+    };
+  }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=vviinn-onboarding-card-1.js.map

package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-1/vviinn-onboarding-card-1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-onboarding-card-1.js","sourceRoot":"","sources":["../../../../../src/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-1/vviinn-onboarding-card-1.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAO5D,MAAM,OAAO,qBAAqB;EAGhC,iBAAiB;IACf,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;EACpC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,YAAM,IAAI,EAAC,wBAAwB;QACjC,EAAC,mBAAmB,OAAG,CAClB;MACP,YAAM,IAAI,EAAC,wBAAwB;QACjC,WAAK,KAAK,EAAC,MAAM;UACf,qCAA6B;UAC7B,sGAGI,CACA,CACD,CACF,CACR,CAAC;EACJ,CAAC;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element } from \"@stencil/core\";\nimport { slotChangeListener } from \"../../../customized-slots\";\nimport { OnboardingCard1Icon } from \"../../../vviinn-icons\";\n\n@Component({\n  tag: \"vviinn-onboarding-card-1\",\n  styleUrl: \"../onboarding-card.css\",\n  shadow: true,\n})\nexport class VviinnOnboardingCard1 {\n  @Element() el: HTMLElement;\n\n  componentWillLoad() {\n    slotChangeListener(this, this.el);\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot name=\"onboarding-card-1-icon\">\n          <OnboardingCard1Icon />\n        </slot>\n        <slot name=\"onboarding-card-1-text\">\n          <div class=\"text\">\n            <h4>Starte die Bildsuche</h4>\n            <p>\n              Lade ein Bild aus Deiner Galerie hoch oder fotografiere ein\n              Produkt mit Deiner Kamera.\n            </p>\n          </div>\n        </slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-2/vviinn-onboarding-card-2.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Element } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 import { OnboardingCard2Icon } from "../../../vviinn-icons";
 import { slotChangeListener } from "../../../customized-slots";
 export class VviinnOnboardingCard2 {
@@ -6,21 +6,20 @@ export class VviinnOnboardingCard2 {
     slotChangeListener(this, this.el);
   }
   render() {
-    return (h(Host, null,
-      h("slot", { name: "onboarding-card-2-icon" },
-        h(OnboardingCard2Icon, null)),
-      h("slot", { name: "onboarding-card-2-text" },
-        h("div", { class: "text" },
-          h("h4", null, "Verfeiner deine Suche"),
-          h("p", null, "Du kannst den Bildrahmen selber festlegen und so die Produkte genau ausw\u00E4hlen.")))));
+    return (h(Host, null, h("slot", { name: "onboarding-card-2-icon" }, h(OnboardingCard2Icon, null)), h("slot", { name: "onboarding-card-2-text" }, h("div", { class: "text" }, h("h4", null, "Verfeiner deine Suche"), h("p", null, "Du kannst den Bildrahmen selber festlegen und so die Produkte genau ausw\u00E4hlen.")))));
   }
   static get is() { return "vviinn-onboarding-card-2"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["../onboarding-card.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["../onboarding-card.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["../onboarding-card.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["../onboarding-card.css"]
+    };
+  }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=vviinn-onboarding-card-2.js.map

package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-2/vviinn-onboarding-card-2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-onboarding-card-2.js","sourceRoot":"","sources":["../../../../../src/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-2/vviinn-onboarding-card-2.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAO/D,MAAM,OAAO,qBAAqB;EAGhC,iBAAiB;IACf,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;EACpC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,YAAM,IAAI,EAAC,wBAAwB;QACjC,EAAC,mBAAmB,OAAG,CAClB;MACP,YAAM,IAAI,EAAC,wBAAwB;QACjC,WAAK,KAAK,EAAC,MAAM;UACf,sCAA8B;UAC9B,mGAGI,CACA,CACD,CACF,CACR,CAAC;EACJ,CAAC;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element } from \"@stencil/core\";\nimport { OnboardingCard2Icon } from \"../../../vviinn-icons\";\nimport { slotChangeListener } from \"../../../customized-slots\";\n\n@Component({\n  tag: \"vviinn-onboarding-card-2\",\n  styleUrl: \"../onboarding-card.css\",\n  shadow: true,\n})\nexport class VviinnOnboardingCard2 {\n  @Element() el: HTMLElement;\n\n  componentWillLoad() {\n    slotChangeListener(this, this.el);\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot name=\"onboarding-card-2-icon\">\n          <OnboardingCard2Icon />\n        </slot>\n        <slot name=\"onboarding-card-2-text\">\n          <div class=\"text\">\n            <h4>Verfeiner deine Suche</h4>\n            <p>\n              Du kannst den Bildrahmen selber festlegen und so die Produkte\n              genau auswählen.\n            </p>\n          </div>\n        </slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-3/vviinn-onboarding-card-3.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Element } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 import { OnboardingCard3Icon } from "../../../vviinn-icons";
 import { slotChangeListener } from "../../../customized-slots";
 export class VviinnOnboardingCard3 {
@@ -6,21 +6,20 @@ export class VviinnOnboardingCard3 {
     slotChangeListener(this, this.el);
   }
   render() {
-    return (h(Host, null,
-      h("slot", { name: "onboarding-card-3-icon" },
-        h(OnboardingCard3Icon, null)),
-      h("slot", { name: "onboarding-card-3-text" },
-        h("div", { class: "text" },
-          h("h4", null, "Ohne Hintergrund"),
-          h("p", null, "Die besten Ergebnisse erh\u00E4ltst Du, wenn das gesuchte Objekt mit einfarbigem und hellem Hintergrund zu sehen ist.")))));
+    return (h(Host, null, h("slot", { name: "onboarding-card-3-icon" }, h(OnboardingCard3Icon, null)), h("slot", { name: "onboarding-card-3-text" }, h("div", { class: "text" }, h("h4", null, "Ohne Hintergrund"), h("p", null, "Die besten Ergebnisse erh\u00E4ltst Du, wenn das gesuchte Objekt mit einfarbigem und hellem Hintergrund zu sehen ist.")))));
   }
   static get is() { return "vviinn-onboarding-card-3"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["../onboarding-card.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["../onboarding-card.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["../onboarding-card.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["../onboarding-card.css"]
+    };
+  }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=vviinn-onboarding-card-3.js.map

package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-3/vviinn-onboarding-card-3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-onboarding-card-3.js","sourceRoot":"","sources":["../../../../../src/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-3/vviinn-onboarding-card-3.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAO/D,MAAM,OAAO,qBAAqB;EAGhC,iBAAiB;IACf,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;EACpC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,YAAM,IAAI,EAAC,wBAAwB;QACjC,EAAC,mBAAmB,OAAG,CAClB;MACP,YAAM,IAAI,EAAC,wBAAwB;QACjC,WAAK,KAAK,EAAC,MAAM;UACf,iCAAyB;UACzB,qIAGI,CACA,CACD,CACF,CACR,CAAC;EACJ,CAAC;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element } from \"@stencil/core\";\nimport { OnboardingCard3Icon } from \"../../../vviinn-icons\";\nimport { slotChangeListener } from \"../../../customized-slots\";\n\n@Component({\n  tag: \"vviinn-onboarding-card-3\",\n  styleUrl: \"../onboarding-card.css\",\n  shadow: true,\n})\nexport class VviinnOnboardingCard3 {\n  @Element() el: HTMLElement;\n\n  componentWillLoad() {\n    slotChangeListener(this, this.el);\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot name=\"onboarding-card-3-icon\">\n          <OnboardingCard3Icon />\n        </slot>\n        <slot name=\"onboarding-card-3-text\">\n          <div class=\"text\">\n            <h4>Ohne Hintergrund</h4>\n            <p>\n              Die besten Ergebnisse erhältst Du, wenn das gesuchte Objekt mit\n              einfarbigem und hellem Hintergrund zu sehen ist.\n            </p>\n          </div>\n        </slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/vviinn-onboarding/vviinn-onboarding.js

@@ -1,28 +1,24 @@
-import { Component, Host, h, Element } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 import { slotChangeListener } from "../customized-slots";
 export class VviinnOnboarding {
   componentWillLoad() {
     slotChangeListener(this, this.el);
   }
   render() {
-    return (h(Host, null,
-      h("slot", { name: "vviinn-onboarding-title" },
-        h("h3", null, "So funktioniert es")),
-      h("vviinn-slider", { showArrows: true },
-        h("vviinn-slide", null,
-          h("vviinn-onboarding-card-1", null)),
-        h("vviinn-slide", null,
-          h("vviinn-onboarding-card-2", null)),
-        h("vviinn-slide", null,
-          h("vviinn-onboarding-card-3", null)))));
+    return (h(Host, null, h("slot", { name: "vviinn-onboarding-title" }, h("h3", null, "So funktioniert es")), h("vviinn-slider", { showArrows: true }, h("vviinn-slide", null, h("vviinn-onboarding-card-1", null)), h("vviinn-slide", null, h("vviinn-onboarding-card-2", null)), h("vviinn-slide", null, h("vviinn-onboarding-card-3", null)))));
   }
   static get is() { return "vviinn-onboarding"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["vviinn-onboarding.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["vviinn-onboarding.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["vviinn-onboarding.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["vviinn-onboarding.css"]
+    };
+  }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=vviinn-onboarding.js.map

package/dist/collection/components/vviinn-onboarding/vviinn-onboarding.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-onboarding.js","sourceRoot":"","sources":["../../../src/components/vviinn-onboarding/vviinn-onboarding.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAOzD,MAAM,OAAO,gBAAgB;EAG3B,iBAAiB;IACf,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;EACpC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,YAAM,IAAI,EAAC,yBAAyB;QAClC,mCAA2B,CACtB;MACP,qBAAe,UAAU,EAAE,IAAI;QAC7B;UACE,mCAA4B,CACf;QACf;UACE,mCAA4B,CACf;QACf;UACE,mCAA4B,CACf,CACD,CACV,CACT,CAAC;EACJ,CAAC;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element } from \"@stencil/core\";\nimport { slotChangeListener } from \"../customized-slots\";\n\n@Component({\n  tag: \"vviinn-onboarding\",\n  styleUrl: \"vviinn-onboarding.css\",\n  shadow: true,\n})\nexport class VviinnOnboarding {\n  @Element() el: HTMLElement;\n\n  componentWillLoad() {\n    slotChangeListener(this, this.el);\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot name=\"vviinn-onboarding-title\">\n          <h3>So funktioniert es</h3>\n        </slot>\n        <vviinn-slider showArrows={true}>\n          <vviinn-slide>\n            <vviinn-onboarding-card-1 />\n          </vviinn-slide>\n          <vviinn-slide>\n            <vviinn-onboarding-card-2 />\n          </vviinn-slide>\n          <vviinn-slide>\n            <vviinn-onboarding-card-3 />\n          </vviinn-slide>\n        </vviinn-slider>\n      </Host >\n    );\n  }\n}\n"]}

package/dist/collection/components/vviinn-overlay/vviinn-overlay.css

@@ -1,6 +1,5 @@
 :host {
-  -webkit-animation: fade-in 0.5s ease-in-out;
-          animation: fade-in 0.5s ease-in-out;
+  animation: fade-in 0.5s ease-in-out;
   background: rgba(0, 0, 0, 0.5);
   display: block;
   height: 100vh;
@@ -12,16 +11,6 @@
   z-index: 9999;
 }
 
-@-webkit-keyframes fade-in {
-  from {
-    opacity: 0.1;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
 @keyframes fade-in {
   from {
     opacity: 0.1;

package/dist/collection/components/vviinn-overlay/vviinn-overlay.js

@@ -1,15 +1,19 @@
-import { Component, Host, h } from '@stencil/core';
+import { Host, h } from '@stencil/core';
 export class VviinnOverlay {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h(Host, null, h("slot", null)));
   }
   static get is() { return "vviinn-overlay"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["vviinn-overlay.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["vviinn-overlay.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["vviinn-overlay.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["vviinn-overlay.css"]
+    };
+  }
 }
+//# sourceMappingURL=vviinn-overlay.js.map

package/dist/collection/components/vviinn-overlay/vviinn-overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-overlay.js","sourceRoot":"","sources":["../../../src/components/vviinn-overlay/vviinn-overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,aAAa;EACxB,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'vviinn-overlay',\n  styleUrl: 'vviinn-overlay.css',\n  shadow: true,\n})\nexport class VviinnOverlay {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}