npm - vviinn-widgets - Versions diffs - 2.18.21 → 2.19.0 - Mend

vviinn-widgets 2.18.21 → 2.19.0

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 (503) hide show

package/dist/cjs/highlight-box_22.cjs.entry.js CHANGED Viewed

@@ -2,11 +2,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-7f1325a7.js');
-const imageSearch_store = require('./imageSearch.store-98824653.js');
-const Handler = require('./Handler-176539c8.js');
-const index$1 = require('./index-cb410762.js');
-const customizedSlots = require('./customized-slots-6e56c354.js');
+const index = require('./index-a4becaff.js');
+const imageSearch_store = require('./imageSearch.store-fbe0600a.js');
+const Handler = require('./Handler-de64afa5.js');
+const index$1 = require('./index-610c6c1f.js');
+const customizedSlots = require('./customized-slots-aee3f39d.js');
 const Campaign = require('./Campaign-13258569.js');
 // -------------------------------------------------------------------------------------
@@ -44,9 +44,9 @@ const fromRectangle = (shape, target) => {
 const printClip = (clip) => `inset(${clip.top} ${clip.right} ${clip.bottom} ${clip.left})`;
 const getClipValue = (shape, target) => printClip(fromRectangle(shape, target));
-const highlightBoxCss = ":host{display:grid;position:absolute;box-sizing:border-box;border:none;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;--size:10px;--x-position:0;--y-position:0}img{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pointer{position:absolute;width:var(--size);height:var(--size);background:black;border-radius:50%;z-index:2;cursor:pointer;transform:translate(var(--x-position), var(--y-position)) scale(0);-webkit-animation:0.25s linear fadein;animation:0.25s linear fadein;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.pointer::after{content:\"\";cursor:pointer;border:5px solid black;border-radius:50%;width:var(--size);height:var(--size);display:block;transform:translate(calc(-50% + var(--size) * 0.5), calc(-50% + var(--size) * 0.5));padding:calc(var(--size) * 0.5);opacity:.75}@-webkit-keyframes fadein{from{transform:translate(var(--x-position), var(--y-position)) scale(0)}to{transform:translate(var(--x-position), var(--y-position)) scale(1)}}@keyframes fadein{from{transform:translate(var(--x-position), var(--y-position)) scale(0)}to{transform:translate(var(--x-position), var(--y-position)) scale(1)}}";
+const highlightBoxCss = ":host{display:grid;position:absolute;box-sizing:border-box;border:none;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;--size:10px;--x-position:0;--y-position:0}img{-webkit-user-select:none;-moz-user-select:none;user-select:none}.pointer{position:absolute;width:var(--size);height:var(--size);background:black;border-radius:50%;z-index:2;cursor:pointer;transform:translate(var(--x-position), var(--y-position)) scale(0);animation:0.25s linear fadein;animation-fill-mode:forwards}.pointer::after{content:\"\";cursor:pointer;border:5px solid black;border-radius:50%;width:var(--size);height:var(--size);display:block;transform:translate(calc(-50% + var(--size) * 0.5), calc(-50% + var(--size) * 0.5));padding:calc(var(--size) * 0.5);opacity:.75}@keyframes fadein{from{transform:translate(var(--x-position), var(--y-position)) scale(0)}to{transform:translate(var(--x-position), var(--y-position)) scale(1)}}";
-let HighlightBox = class {
+const HighlightBox = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -69,17 +69,18 @@ const findTarget = (ev) => {
 const imageCropperCss = ":host{display:block;height:100%;left:0;position:absolute;top:0;width:100%}:host(.hidden){visibility:hidden}.crop-area{border:1px solid white;box-sizing:border-box;position:absolute;touch-action:none;transition-property:border-color, opacity;transition-duration:.25s;transition-timing-function:ease-in-out;z-index:2;position:relative;will-change:transform}.crop-area.active{border-color:whitesmoke}.crop-area.disabled{opacity:0.25}";
 const MIN_SEARCHAREA_SIZE = 40;
-let ImageCropper = class {
+const ImageCropper = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnImageCrop = index.createEvent(this, "vviinnImageCrop", 7);
-    this.disabled = false;
-    this.handleMove = false;
     this.mouseStartPoint = undefined;
     this.bounds = undefined;
     this.resizeObserver = new ResizeObserver(() => {
       this.bounds = this.el.getBoundingClientRect();
     });
+    this.disabled = false;
+    this.basicEventData = undefined;
+    this.handleMove = false;
   }
   componentDidLoad() {
     this.resizeObserver.observe(this.el);
@@ -178,16 +179,17 @@ let ImageCropper = class {
 };
 ImageCropper.style = imageCropperCss;
-const searchFiltersCss = ":host{display:grid;grid-gap:1rem}.filters{display:flex;flex-direction:row;flex-wrap:wrap;gap:0.5rem}.filter{align-items:center;-webkit-animation-duration:0.25s;animation-duration:0.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-name:scalein;animation-name:scalein;border:1px solid lightgray;cursor:pointer;display:flex;flex-direction:row;grid-gap:8px;height:-webkit-max-content;height:-moz-max-content;height:max-content;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;padding:0.1rem;transform:scale(0);transition-property:background;transition-duration:0.25s;transition-timing-function:ease-in-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:6px 16px}.filter.active{border:1px solid black;padding:6px 8px}.filter:hover{border:1px solid gray}.show-more{display:flex}.show-more.hidden{display:none}.show-more::after{content:url(\"data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 12.2l-6-6L3.2 5 8 9.8 12.8 5 14 6.2l-6 6z' fill='%23525252'/%3E%3C/svg%3E\");display:block;height:16px;margin-top:1px;margin-left:8px}.show-more.active::after{transform:rotateX(180deg)}@-webkit-keyframes scalein{from{opacity:0;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}@keyframes scalein{from{opacity:0;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}@media (max-width: 415px){.show-more::after{transform:rotate(-90deg)}.show-more.active::after{transform:rotate(90deg)}}@media (max-width: 800px){.filters{flex-wrap:nowrap;overflow-x:scroll;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;grid-gap:unset}.filter{scroll-snap-align:end;margin-right:0.5rem}}";
+const searchFiltersCss = ":host{display:grid;grid-gap:1rem}.filters{display:flex;flex-direction:row;flex-wrap:wrap;gap:0.5rem}.filter{align-items:center;animation-duration:0.25s;animation-fill-mode:forwards;animation-name:scalein;border:1px solid lightgray;cursor:pointer;display:flex;flex-direction:row;grid-gap:8px;height:-moz-max-content;height:max-content;min-width:-moz-max-content;min-width:max-content;padding:0.1rem;transform:scale(0);transition-property:background;transition-duration:0.25s;transition-timing-function:ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:6px 16px}.filter.active{border:1px solid black;padding:6px 8px}.filter:hover{border:1px solid gray}.show-more{display:flex}.show-more.hidden{display:none}.show-more::after{content:url(\"data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 12.2l-6-6L3.2 5 8 9.8 12.8 5 14 6.2l-6 6z' fill='%23525252'/%3E%3C/svg%3E\");display:block;height:16px;margin-top:1px;margin-left:8px}.show-more.active::after{transform:rotateX(180deg)}@keyframes scalein{from{opacity:0;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}@media (max-width: 415px){.show-more::after{transform:rotate(-90deg)}.show-more.active::after{transform:rotate(90deg)}}@media (max-width: 800px){.filters{flex-wrap:nowrap;overflow-x:scroll;scroll-snap-type:x mandatory;grid-gap:unset}.filter{scroll-snap-align:end;margin-right:0.5rem}}";
 const FILTERS_COUNT = 5;
 const ACTIVE_FILTER_CLASSNAME = ".filter.active";
 const getFilterId = (filter) => filter.href.split("/").reverse()[0];
-let SearchFilters = class {
+const SearchFilters = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnSelectFilter = index.createEvent(this, "vviinnSelectFilter", 7);
     this.filter = null;
+    this.basicEventData = undefined;
     this.selectedCategoryId = null;
     this.hideFilters = true;
   }
@@ -247,10 +249,12 @@ SearchFilters.style = searchFiltersCss;
 const vviinnDetectedObjectCss = ":host{--color-primary-system:#0F62FE;--color-primary-hover-system:#014CDA;--color-icons-system:#2F8EDF;--spacer:8px}:host{--size:32px;--x-position:0;--y-position:0;background:rgba(22, 22, 22, 0.5);border-radius:50%;border:none;cursor:pointer;display:block;height:var(--size);position:absolute;transition:opacity 0.25s;width:var(--size);z-index:2;transform:translate(calc(var(--x-position) - (var(--size) * 0.5)), calc(var(--y-position) - (var(--size) * 0.5)));transition:background 0.1 ease-in-out}:host(:hover){background:rgba(22, 22, 22, 0.75)}:host(.active){background:var(--color-primary, var(--color-primary-system))!important;border:2px solid white}:host::after{--size:32px;border-radius:50%;content:\"\";cursor:pointer;display:block;height:calc(var(--size) * 0.25);transform:translate(calc(-50% + var(--size) * 0.5), calc(-50% + var(--size) * 0.5));width:calc(var(--size) * 0.25);background:white}";
-let VviinnDetectedObject = class {
+const VviinnDetectedObject = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnSelectObject = index.createEvent(this, "vviinnSelectObject", 7);
+    this.detectedObject = undefined;
+    this.basicEventData = undefined;
     this.position = ["0", "0"];
   }
   getObjectPosition() {
@@ -293,7 +297,7 @@ VviinnDetectedObject.style = vviinnDetectedObjectCss;
 const vviinnEmptyResultsCss = ":host{display:grid}vviinn-error{justify-items:center}";
-let VviinnEmptyResults = class {
+const VviinnEmptyResults = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -305,7 +309,7 @@ VviinnEmptyResults.style = vviinnEmptyResultsCss;
 const vviinnExampleImageCss = ":host{display:block;margin-bottom:8px;position:relative}:host(:focus){border:2px solid var(--color-primary)}img{width:100%;height:auto;cursor:pointer}.image-preloader{background:rgba(0, 0, 0, 0.25);border-radius:4px;bottom:12px;display:none;padding:4px 6px;position:absolute;right:12px;z-index:4}vviinn-preloader{--preloader-size:12px}@media (max-width: 640px){.image-preloader{display:block}}";
-let VviinnExampleImage = class {
+const VviinnExampleImage = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnImageUpload = index.createEvent(this, "vviinnImageUpload", 7);
@@ -313,6 +317,7 @@ let VviinnExampleImage = class {
     this.src = "";
     this.width = 0;
     this.height = 0;
+    this.basicEventData = undefined;
     this.selected = false;
   }
   async selectImage() {
@@ -340,11 +345,12 @@ VviinnExampleImage.style = vviinnExampleImageCss;
 const vviinnExampleImagesCss = "h3{font-size:22px;font-weight:600;line-height:32px;margin:0;margin-bottom:16px;text-align:center}.images{display:block;-moz-column-count:2;column-count:2;-moz-column-gap:16px;column-gap:16px}";
-let VviinnExampleImages = class {
+const VviinnExampleImages = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnImageUpload = index.createEvent(this, "vviinnImageUpload", 7);
     this.vviinnNoResult = index.createEvent(this, "vviinnNoResult", 7);
+    this.basicEventData = undefined;
   }
   componentWillLoad() {
     customizedSlots.slotChangeListener(this, this.el);
@@ -363,11 +369,14 @@ VviinnExampleImages.style = vviinnExampleImagesCss;
 const vviinnImageSelectorCss = ":host{display:block}:host(::hover){background:whitesmoke}.visually-hidden{clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}label{cursor:pointer;display:grid;width:100%;height:100%;transition:background 0.1s ease-in-out}";
-let VviinnImageSelector = class {
+const VviinnImageSelector = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnImageUpload = index.createEvent(this, "vviinnImageUpload", 7);
     this.vviinnNoResult = index.createEvent(this, "vviinnNoResult", 7);
+    this.basicEventData = undefined;
+    this.startUpload = undefined;
+    this.resetVpsButton = undefined;
   }
   async handleInputChange(event) {
     const input = event.target;
@@ -378,13 +387,22 @@ let VviinnImageSelector = class {
   isLoading() {
     return imageSearch_store.imageSearchState.loading;
   }
+  startUploadWatcher(upload) {
+    if (upload) {
+      this.fileInput.click();
+      this.resetVpsButton();
+    }
+  }
   render() {
-    return (index.h(index.Host, { exportparts: "button" }, this.isLoading() ? index.h("vviinn-preloader", null) : null, this.isLoading() ? null : (index.h("label", { htmlFor: "fileInput", part: "button" }, index.h("slot", { name: "upload-button-text" }, "Upload image"))), index.h("input", { id: "fileInput", class: "visually-hidden", type: "file", accept: "image/*", onChange: (event) => this.handleInputChange(event) })));
+    return (index.h(index.Host, { exportparts: "button" }, this.isLoading() ? index.h("vviinn-preloader", null) : null, this.isLoading() ? null : (index.h("label", { htmlFor: "fileInput", part: "button" }, index.h("slot", { name: "upload-button-text" }, "Upload image"))), index.h("input", { id: "fileInput", class: "visually-hidden", type: "file", accept: "image/*", onChange: (event) => this.handleInputChange(event), ref: (el) => (this.fileInput = el) })));
   }
+  static get watchers() { return {
+    "startUpload": ["startUploadWatcher"]
+  }; }
 };
 VviinnImageSelector.style = vviinnImageSelectorCss;
-const vviinnImageViewCss = ":host{display:grid;position:relative;justify-self:center;direction:ltr}img{box-sizing:border-box;filter:brightness(60%);position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:-1}.image-preloader{background:rgba(0, 0, 0, 0.25);border-radius:4px;bottom:18px;padding:4px 6px;pointer-events:none;position:absolute;right:18px;z-index:4}vviinn-preloader{--preloader-size:12px}";
+const vviinnImageViewCss = ":host{display:grid;position:relative;justify-self:center;direction:ltr}img{box-sizing:border-box;filter:brightness(60%);position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:-1}.image-preloader{background:rgba(0, 0, 0, 0.25);border-radius:4px;bottom:18px;padding:4px 6px;pointer-events:none;position:absolute;right:18px;z-index:4}vviinn-preloader{--preloader-size:12px}";
 const getImageSizes = (i) => {
   const dimensions = imageSearch_store.dimensionsFromImage(i);
@@ -393,9 +411,10 @@ const getImageSizes = (i) => {
   const sizes = newDimensions.map((d) => d.size);
   return [sizes[0], sizes[1]];
 };
-let VviinnImageView = class {
+const VviinnImageView = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.basicEventData = undefined;
   }
   handleInitialImageLoad(ev) {
     const target = ev.target;
@@ -431,13 +450,16 @@ let VviinnImageView = class {
 };
 VviinnImageView.style = vviinnImageViewCss;
-const vviinnModalCss = ":host{background:white;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}@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}:host(.closed){-webkit-animation-name:fade-out;animation-name:fade-out;-webkit-animation-fill-mode:none;animation-fill-mode:none}.body{overflow-y:auto}}@media (max-width: 640px) and (min-width: 415px){:host{max-width:80%}}.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;padding:16px}.title{font-weight:600;font-size:18px;line-height:24px}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;cursor:pointer;display:grid;padding:unset}@-webkit-keyframes fade-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fade-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@-webkit-keyframes fade-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes fade-out{from{transform:translateY(0)}to{transform:translateY(100%)}}";
+const vviinnModalCss = ":host{background:white;border-radius:4px;box-sizing:border-box;display:grid;grid-template-rows:min-content auto;max-width:960px;overflow:auto}@media (max-width: 415px){:host{animation-name:fade-in;animation-duration:0.5s;animation-fill-mode:forwards}:host(.closed){animation-name:fade-out;animation-fill-mode:none}.body{overflow-y:auto}}@media (max-width: 640px) and (min-width: 415px){:host{max-width:80%}}.head{align-items:center;border-bottom:1px solid #f4f4f4;display:flex;padding:16px}.title{font-weight:600;font-size:18px;line-height:24px;margin:0 auto}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;cursor:pointer;display:grid;padding:unset}@keyframes fade-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fade-out{from{transform:translateY(0)}to{transform:translateY(100%)}}";
-let VviinnModal = class {
+const VviinnModal = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnWidgetClose = index.createEvent(this, "vviinnWidgetClose", 7);
     this.active = false;
+    this.resetState = undefined;
+    this.buttonElementId = undefined;
+    this.hideBackButton = false;
     this.slider = false;
   }
   componentWillLoad() {
@@ -460,7 +482,7 @@ let VviinnModal = class {
     this.slider = true;
   }
   render() {
-    return (index.h(index.Host, { exportparts: "secondary-action, title, close-button", class: { closed: !this.active }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, index.h("div", { class: "head" }, index.h("button", { part: "secondary-action", onClick: () => this.resetState() }, index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M20.25 12H3.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M10.5 5.25L3.75 12L10.5 18.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("div", { class: "title", part: "title" }, index.h("slot", { name: "vviinn-image-search-modal-title" }, "Bildsuche")), index.h("button", { onClick: () => this.close(), class: "close-button", part: "close-button" }, index.h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.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" })))), index.h("div", { class: "body" }, index.h("slot", null))));
+    return (index.h(index.Host, { exportparts: "secondary-action, title, close-button", class: { closed: !this.active }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, index.h("div", { class: "head" }, !this.hideBackButton && (index.h("button", { part: "secondary-action", onClick: () => this.resetState() }, index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M20.25 12H3.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M10.5 5.25L3.75 12L10.5 18.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), index.h("div", { class: "title", part: "title" }, index.h("slot", { name: "vviinn-image-search-modal-title" }, "Bildsuche")), index.h("button", { onClick: () => this.close(), class: "close-button", part: "close-button" }, index.h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.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" })))), index.h("div", { class: "body" }, index.h("slot", null))));
   }
   get el() { return index.getElement(this); }
 };
@@ -468,7 +490,7 @@ VviinnModal.style = vviinnModalCss;
 const vviinnOnboardingCss = ":host{--color-primary-system:#0F62FE;--color-primary-hover-system:#014CDA;--color-icons-system:#2F8EDF;--spacer:8px}::host{display:block}h3{font-size:22px;font-weight:600;line-height:32px;margin:0;margin-bottom:16px;text-align:center}vviinn-slide{background:#f4f4f4;padding:24px}svg{padding:16px 0}.text{display:grid;grid-gap:8px}.text>h4{color:#161616;font-size:18px;font-weight:600;line-height:24px;margin:unset;text-align:center}.text>p{color:#525252;font-size:14px;font-style:normal;font-weight:normal;line-height:20px;margin:unset;text-align:center}.colored{fill:var(--color-icons, var(--color-icons-system))}";
-let VviinnOnboarding = class {
+const VviinnOnboarding = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -484,7 +506,7 @@ VviinnOnboarding.style = vviinnOnboardingCss;
 const onboardingCardCss$2 = ":host{align-items:center;background:#f4f4f4;display:grid;grid-template-rows:repeat(2, 1fr);justify-items:center;padding:24px;width:100%}h4{color:#161616;font-size:18px;font-weight:600;line-height:24px;margin:unset;text-align:center}svg{padding:16px 0}p{color:#525252;font-size:14px;font-style:normal;font-weight:normal;line-height:20px;margin:unset;text-align:center}.colored{fill:var(--color-icons, var(--color-icons-system))}.text{display:grid;grid-gap:8px}";
-let VviinnOnboardingCard1 = class {
+const VviinnOnboardingCard1 = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -500,7 +522,7 @@ VviinnOnboardingCard1.style = onboardingCardCss$2;
 const onboardingCardCss$1 = ":host{align-items:center;background:#f4f4f4;display:grid;grid-template-rows:repeat(2, 1fr);justify-items:center;padding:24px;width:100%}h4{color:#161616;font-size:18px;font-weight:600;line-height:24px;margin:unset;text-align:center}svg{padding:16px 0}p{color:#525252;font-size:14px;font-style:normal;font-weight:normal;line-height:20px;margin:unset;text-align:center}.colored{fill:var(--color-icons, var(--color-icons-system))}.text{display:grid;grid-gap:8px}";
-let VviinnOnboardingCard2 = class {
+const VviinnOnboardingCard2 = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -516,7 +538,7 @@ VviinnOnboardingCard2.style = onboardingCardCss$1;
 const onboardingCardCss = ":host{align-items:center;background:#f4f4f4;display:grid;grid-template-rows:repeat(2, 1fr);justify-items:center;padding:24px;width:100%}h4{color:#161616;font-size:18px;font-weight:600;line-height:24px;margin:unset;text-align:center}svg{padding:16px 0}p{color:#525252;font-size:14px;font-style:normal;font-weight:normal;line-height:20px;margin:unset;text-align:center}.colored{fill:var(--color-icons, var(--color-icons-system))}.text{display:grid;grid-gap:8px}";
-let VviinnOnboardingCard3 = class {
+const VviinnOnboardingCard3 = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -530,9 +552,9 @@ let VviinnOnboardingCard3 = class {
 };
 VviinnOnboardingCard3.style = onboardingCardCss;
-const vviinnOverlayCss = ":host{-webkit-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;left:0;overflow:hidden;position:fixed;top:0;width:100vw;z-index:9999}@-webkit-keyframes fade-in{from{opacity:0.1}to{opacity:1}}@keyframes fade-in{from{opacity:0.1}to{opacity:1}}";
+const vviinnOverlayCss = ":host{animation:fade-in 0.5s ease-in-out;background:rgba(0, 0, 0, 0.5);display:block;height:100vh;left:0;overflow:hidden;position:fixed;top:0;width:100vw;z-index:9999}@keyframes fade-in{from{opacity:0.1}to{opacity:1}}";
-let VviinnOverlay = class {
+const VviinnOverlay = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -544,21 +566,24 @@ VviinnOverlay.style = vviinnOverlayCss;
 const vviinnOverlayedModalCss = ":host{display:none}:host(.active){display:block}vviinn-overlay{align-items:center;display:grid;justify-items:center;cursor:default}@media (max-width: 415px){vviinn-modal{border-radius:4px 4px 0 0;height:100vh;margin-top:32px;transform:translateY(100%);width:100vw}vviinn-overlay{align-items:end;display:grid;justify-items:center}}";
-let VviinnOverlayedModal = class {
+const VviinnOverlayedModal = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.vviinnWidgetClose = index.createEvent(this, "vviinnWidgetClose", 7);
     this.active = false;
+    this.resetState = undefined;
+    this.buttonElementId = undefined;
+    this.hideBackButton = false;
   }
   render() {
-    return (index.h(index.Host, { class: { active: this.active } }, index.h("vviinn-overlay", null, index.h("vviinn-modal", { resetState: this.resetState, active: this.active, buttonElementId: this.buttonElementId }, index.h("slot", null, "CONTENT")))));
+    return (index.h(index.Host, { class: { active: this.active } }, index.h("vviinn-overlay", null, index.h("vviinn-modal", { resetState: this.resetState, active: this.active, buttonElementId: this.buttonElementId, hideBackButton: this.hideBackButton }, index.h("slot", null, "CONTENT")))));
   }
 };
 VviinnOverlayedModal.style = vviinnOverlayedModalCss;
-const vviinnPrivacyBadgeCss = ":host{display:block;background:#F4F4F4;padding:17px}.content{display:grid;grid-template-columns:-webkit-min-content auto;grid-template-columns:min-content auto;grid-gap:9px}.content p{color:#525252;font-size:12px;line-height:16px;margin:unset}";
+const vviinnPrivacyBadgeCss = ":host{display:block;background:#F4F4F4;padding:17px}.content{display:grid;grid-template-columns:min-content auto;grid-gap:9px}.content p{color:#525252;font-size:12px;line-height:16px;margin:unset}";
-let VviinnPrivacyBadge = class {
+const VviinnPrivacyBadge = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -574,9 +599,10 @@ VviinnPrivacyBadge.style = vviinnPrivacyBadgeCss;
 const vviinnServerErrorCss = ":host{display:block}";
-let VviinnServerError = class {
+const VviinnServerError = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.handler = undefined;
   }
   render() {
     return (index.h(index.Host, null, index.h("vviinn-error", null, index.h("h4", { slot: "title" }, "Keine Verbindung"), index.h("span", { slot: "text" }, "Etwas hat leider nicht funktioniert. Bitte pr\u00FCfen Sie Ihre Internetverbindung und laden Sie das Bild noch einmal hoch."), index.h("button", { slot: "action", onClick: this.handler }, "Erneut versuchen"))));
@@ -586,7 +612,7 @@ VviinnServerError.style = vviinnServerErrorCss;
 const vviinnSlideCss = ":host{display:grid;justify-items:center}";
-let VviinnSlide = class {
+const VviinnSlide = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -606,9 +632,9 @@ const getStyleMap = (data) => {
 const Arrow = ({ kind, tabindex, disabled, onClick, onKeyDown, }) => (index.h("div", { class: getStyleMap({ kind, disabled }), onClick: onClick, tabindex: tabindex, onKeyDown: onKeyDown },
   index.h(index$1.ArrowIcon, null)));
-const vviinnSliderCss = ":host{--color-primary-system:#0F62FE;--color-primary-hover-system:#014CDA;--color-icons-system:#2F8EDF;--spacer:8px}:host{--num-items:0;--position:0;display:grid;grid-gap:20px;justify-items:center;position:relative}.items-wrapper{overflow:hidden;width:100%}.items{box-sizing:border-box;display:grid;grid-auto-flow:column;grid-template-columns:repeat(var(--num-items), 100%);transform:translateX(calc(-100% * var(--position)));transition:transform 0.33s ease-in-out}.controls{display:grid;grid-gap:16px;grid-template-columns:repeat(var(--num-items), -webkit-min-content);grid-template-columns:repeat(var(--num-items), min-content)}.bullet{background:#e0e0e0;border-radius:50%;box-sizing:border-box;cursor:pointer;height:8px;width:8px;transition:background 0.1s ease-in-out}.bullet:hover{background:#c6c6c6}.bullet.active{background:var(--color-primary, var(--color-primary-system))}.bullet:active{background:transparent;border:2px solid var(--color-primary, var(--color-primary-system))}.arrow-wrapper{align-items:center;cursor:pointer;background:white;border:2px solid white;bottom:0;box-sizing:border-box;display:grid;height:calc(var(--spacer) * 6);justify-items:center;margin:auto;position:absolute;top:0;transform:translate3d(0, -50%, 0);transition:border 0.25ms ease-in-out;width:calc(var(--spacer) * 4)}.arrow-wrapper:active{border-color:var(--color-primary, var(--color-primary-system));opacity:0.75}.arrow-wrapper:focus{border-color:var(--color-primary, var(--color-primary-system));opacity:0.5;outline:none}.prev{left:0}.next{right:0}.next>svg{transform:rotate3d(0, 1, 0, 180deg)}.arrow-wrapper>svg{transition:fill 0.25ms ease-in-out;fill:#a8a8a8}.arrow-wrapper:hover>svg{fill:#8d8d8d}";
+const vviinnSliderCss = ":host{--color-primary-system:#0F62FE;--color-primary-hover-system:#014CDA;--color-icons-system:#2F8EDF;--spacer:8px}:host{--num-items:0;--position:0;display:grid;grid-gap:20px;justify-items:center;position:relative}.items-wrapper{overflow:hidden;width:100%}.items{box-sizing:border-box;display:grid;grid-auto-flow:column;grid-template-columns:repeat(var(--num-items), 100%);transform:translateX(calc(-100% * var(--position)));transition:transform 0.33s ease-in-out}.controls{display:grid;grid-gap:16px;grid-template-columns:repeat(var(--num-items), min-content)}.bullet{background:#e0e0e0;border-radius:50%;box-sizing:border-box;cursor:pointer;height:8px;width:8px;transition:background 0.1s ease-in-out}.bullet:hover{background:#c6c6c6}.bullet.active{background:var(--color-primary, var(--color-primary-system))}.bullet:active{background:transparent;border:2px solid var(--color-primary, var(--color-primary-system))}.arrow-wrapper{align-items:center;cursor:pointer;background:white;border:2px solid white;bottom:0;box-sizing:border-box;display:grid;height:calc(var(--spacer) * 6);justify-items:center;margin:auto;position:absolute;top:0;transform:translate3d(0, -50%, 0);transition:border 0.25ms ease-in-out;width:calc(var(--spacer) * 4)}.arrow-wrapper:active{border-color:var(--color-primary, var(--color-primary-system));opacity:0.75}.arrow-wrapper:focus{border-color:var(--color-primary, var(--color-primary-system));opacity:0.5;outline:none}.prev{left:0}.next{right:0}.next>svg{transform:rotate3d(0, 1, 0, 180deg)}.arrow-wrapper>svg{transition:fill 0.25ms ease-in-out;fill:#a8a8a8}.arrow-wrapper:hover>svg{fill:#8d8d8d}";
-let VviinnSlider = class {
+const VviinnSlider = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.elementsCount = 0;
@@ -720,7 +746,7 @@ VviinnSlider.style = vviinnSliderCss;
 const vviinnTeaserCss = ":host{align-items:center;display:grid;justify-items:center;grid-gap:16px}.vviinn-teaser-text{font-size:28px;font-weight:600;line-height:40px;size:28px;text-align:center}";
-let VviinnTeaser = class {
+const VviinnTeaser = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -736,9 +762,10 @@ VviinnTeaser.style = vviinnTeaserCss;
 const vviinnWrongFormatCss = ":host{display:block}";
-let VviinnWrongFormat = class {
+const VviinnWrongFormat = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.handler = undefined;
   }
   render() {
     return (index.h(index.Host, null, index.h("vviinn-error", null, index.h("h4", { slot: "title" }, "Dateityp wird nicht unterst\u00FCtzt"), index.h("span", { slot: "text" }, "Leider unterst\u00FCtzen wir dieses Format nicht. Bitte laden Sie eine .jpg, .png oder .webp Bilddatei hoch."), index.h("button", { slot: "action", onClick: this.handler }, "Neues Bild hochladen"))));
@@ -768,3 +795,5 @@ exports.vviinn_slide = VviinnSlide;
 exports.vviinn_slider = VviinnSlider;
 exports.vviinn_teaser = VviinnTeaser;
 exports.vviinn_wrong_format = VviinnWrongFormat;
+//# sourceMappingURL=highlight-box_22.cjs.entry.js.map

package/dist/cjs/highlight-box_22.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"highlight-box.image-cropper.search-filters.vviinn-detected-object.vviinn-empty-results.vviinn-example-image.vviinn-example-images.vviinn-image-selector.vviinn-image-view.vviinn-modal.vviinn-onboarding.vviinn-onboarding-card-1.vviinn-onboarding-card-2.vviinn-onboarding-card-3.vviinn-overlay.vviinn-overlayed-modal.vviinn-privacy-badge.vviinn-server-error.vviinn-slide.vviinn-slider.vviinn-teaser.vviinn-wrong-format.entry.cjs.js","mappings":";;;;;;;;;;;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAI,EAAE,GAAG;AAChB,IAAI,MAAM,EAAE,UAAU,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,KAAK,KAAK,MAAM,CAAC,EAAE;AACjE,CAAC,CAAC;AACF;AACA;AACA;AACA;AACO,IAAI,GAAG,GAAG;AACjB,IAAI,MAAM,EAAE,EAAE,CAAC,MAAM;AACrB,IAAI,OAAO,EAAE,UAAU,KAAK,EAAE,MAAM,EAAE,EAAE,QAAQ,KAAK,GAAG,MAAM,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE;AAChG,CAAC;;ACfD,MAAM,aAAa,GAAG,CAAC,KAAgB,EAAE,MAAa;EACpD,MAAM,GAAG,GAAG,GAAG,KAAK,CAAC,CAAC,IAAI,CAAC;EAC3B,MAAM,IAAI,GAAG,GAAG,KAAK,CAAC,CAAC,IAAI,CAAC;EAC5B,MAAM,KAAK,GAAG,GAAG,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;EAC5D,MAAM,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,IAAI,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;EAE/D,OAAO;IACL,GAAG;IACH,KAAK;IACL,MAAM;IACN,IAAI;GACL,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,IAAU,KAC3B,SAAS,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,IAAI,GAAG,CAAC;AAE1D,MAAM,YAAY,GAAG,CAAC,KAAgB,EAAE,MAAa,KAC1D,SAAS,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;;AC5BzC,MAAM,eAAe,GAAG,i7BAAi7B;;MCY57B,YAAY;;;;EACf,aAAa;IACnB,OAAOA,YAAI,CACTC,kCAAgB,CACdC,kCAAgB,CAAC,UAAU,EAC3BA,kCAAgB,CAAC,WAAW,CAC7B,EACDC,4BAAK,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,YAAY,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,EAC7DC,kCAAW,CAAC,MAAM,EAAE,CAAC,CACtB,CAAC;GACH;EAEO,WAAW;IACjB,OAAOJ,YAAI,CACTC,kCAAgB,CAACC,kCAAgB,CAAC,QAAQ,EAAEA,kCAAgB,CAAC,WAAW,CAAC,EACzEC,4BAAK,CAAC,CAAC,CAAC,GAAG,EAAE,MAAM,CAAC,MAClBE,iBACE,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,MAAM,EAAE,MAAM,CAAC,MAAM,EACrB,KAAK,EAAE,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE,EAAE,EAAE,GACjD,CACH,CAAC,EACFD,kCAAW,CAAC,MAAM,EAAE,CAAC,CACtB,CAAC;GACH;EAED,MAAM;IACJ,OAAOC,QAACC,UAAI,QAAE,IAAI,CAAC,WAAW,EAAE,CAAQ,CAAC;GAC1C;;;;ACzCI,MAAM,UAAU,GAAG,CAAC,EAAO;EAChC,OAAO,EAAE,CAAC,MAAM,CAAC;AACnB,CAAC;;ACFD,MAAM,eAAe,GAAG,gbAAgb;;AC2Bxc,MAAM,mBAAmB,GAAG,EAAE,CAAC;MAOlB,YAAY;;;;IAWf,oBAAe,GAAsB,SAAS,CAAC;IAG/C,WAAM,GAAwB,SAAS,CAAC;IACxC,mBAAc,GAAG,IAAI,cAAc,CAAC;MAC1C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC;KAC/C,CAAC,CAAC;oBAdyB,KAAK;;sBAGF,KAAK;;EAapC,gBAAgB;IACd,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;GACtC;EAED,oBAAoB;IAClB,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;GAClC;EAEO,iBAAiB,CAAC,KAAmB;IAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,MAAM,WAAW,GAAGC,sBAAc,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,QAAQ,GAAGC,0BAAkB,CAAC,MAAM,CACxC,WAAW,EACX,IAAI,CAAC,eAAe,CACrB,CAAC;IAEF,MAAM,kBAAkB,GAAG;MACzB,QAAQ,EAAE,QAAQ;MAClB,SAAS,EAAE,IAAI,CAAC,oBAAoB;KACrC,CAAC;IAEFR,gCAAI,CACFE,kCAAgB,CAAC,UAAU,EAC3BC,4BAAK,CAAC,CAAC,IAAI;MACT,MAAM,aAAa,GAAGM,2BAAS,CAAC,IAAI,EAAE,kBAAkB,CAAC,CAAC;MAE1D,IAAI,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC;QAAE,OAAO;MAE5CP,kCAAgB,CAAC,UAAU,GAAGQ,6BAAM,CAAC,aAAa,CAAC,CAAC;MACpD,IAAI,CAAC,eAAe,GAAG,WAAW,CAAC;MACnCR,kCAAgB,CAAC,cAAc,GAAG,SAAS,CAAC;KAC7C,CAAC,CACH,CAAC;GACH;EAEO,WAAW,CAAC,IAAe;IACjC,QACE,IAAI,CAAC,KAAK,GAAG,mBAAmB;MAChC,IAAI,CAAC,MAAM,GAAG,mBAAmB;MACjC,IAAI,CAAC,CAAC,GAAG,CAAC;MACV,IAAI,CAAC,CAAC,GAAG,CAAC;MACV,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC;MAC/C,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAC7C;GACH;EAEO,iBAAiB,CAAC,EAAc;IACtC,EAAE,CAAC,cAAc,EAAE,CAAC;IACpB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrB,MAAM,WAAW,GAAGK,sBAAc,CAAC,EAAE,CAAC,CAAC;IAEvC,MAAM,QAAQ,GAAGC,0BAAkB,CAAC,MAAM,CACxC,WAAW,EACX,IAAI,CAAC,eAAe,CACrB,CAAC;IAEFR,gCAAI,CACFE,kCAAgB,CAAC,UAAU,EAC3BC,4BAAK,CAAC,CAAC,UAAU;MACf,MAAM,aAAa,GAAGQ,sBAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;MAEjD,IACE,aAAa,CAAC,CAAC,GAAG,CAAC;QACnB,aAAa,CAAC,CAAC,GAAG,CAAC;QACnB,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,aAAa,CAAC,CAAC,GAAG,aAAa,CAAC,MAAM,CAAC,GAAG,CAAC;QACjE,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,aAAa,CAAC,CAAC,GAAG,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC;QAE/D,OAAO;MAETT,kCAAgB,CAAC,cAAc,GAAG,SAAS,CAAC;MAC5CA,kCAAgB,CAAC,UAAU,GAAGQ,6BAAM,CAAC,aAAa,CAAC,CAAC;MACpD,IAAI,CAAC,eAAe,GAAG,WAAW,CAAC;KACpC,CAAC,CACH,CAAC;GACH;EAEO,iBAAiB,CAAC,KAAmB;IAC3C,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,eAAe,GAAGH,sBAAc,CAAC,KAAK,CAAC,CAAC;;IAG7C,MAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAQ,CAAC;IAExC,IAAI,MAAM,CAAC,SAAS,KAAK,iBAAiB,EAAE;MAC1C,IAAI,CAAC,oBAAoB,GAAG,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC;MACrD,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC9D;SAAM;MACL,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC9D;IAED,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAEtE,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAClE,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,sBAAsB,EAAE;MAChE,IAAI,EAAE,IAAI;KACX,CAAC,CAAC;GACJ;EAEO,uBAAuB;IAC7B,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACrE,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC;IACvE,IAAI,CAAC,eAAe,GAAG,SAAS,CAAC;IACjCK,8CAA4B,EAAE,CAAC;IAC/B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;GAChD;EAEO,WAAW;IACjB,OAAOZ,gCAAI,CACTE,kCAAgB,CAAC,UAAU,EAC3BC,4BAAK,CAAC,CAAC,SAAS;MACd,OAAO;QACL,KAAK,EAAE,GAAG,SAAS,CAAC,KAAK,IAAI;QAC7B,MAAM,EAAE,GAAG,SAAS,CAAC,MAAM,IAAI;QAC/B,SAAS,EAAE,eAAe,SAAS,CAAC,CAAC,OAAO,SAAS,CAAC,CAAC,QAAQ;QAC/D,MAAM,EAAE,IAAI,CAAC,UAAU,GAAG,MAAM,GAAG,SAAS;OAC7C,CAAC;KACH,CAAC,EACFC,kCAAW,CAAC;MACV,OAAO,EAAE,CAAC;KACX,CAAC,CACH,CAAC;GACH;EAED,MAAM;IACJ,QACEC,QAACC,UAAI,IAAC,WAAW,EAAC,4FAA4F,IAC5GD,iBACE,KAAK,EAAE;QACL,WAAW,EAAE,IAAI;QACjB,MAAM,EAAE,IAAI,CAAC,UAAU;QACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,EACD,SAAS,EAAE,KAAK,EAChB,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,EACzB,aAAa,EAAE,MAAM,KAAK,EAC1B,aAAa,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAEhDH,kCAAgB,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,OAAO,MAC5CG,6BACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,GAChC,CACpB,CAAC,CACE,CACD,EACP;GACH;;;;;AC1MH,MAAM,gBAAgB,GAAG,k6CAAk6C;;ACmB37C,MAAM,aAAa,GAAW,CAAC,CAAC;AAChC,MAAM,uBAAuB,GAAG,gBAAgB,CAAC;AAEjD,MAAM,WAAW,GAAG,CAAC,MAAY,KAC/B,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;MAOzB,aAAa;;;;kBAGqB,IAAI;;8BAGJ,IAAI;uBACjB,IAAI;;EAI5B,qBAAqB,CAAC,MAAY;IACxC,OAAO,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;QAChC,IAAI,CAAC,mBAAmB,EAAE;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;GAC/B;EAEO,YAAY,CAAC,MAAY;IAC/B,IAAI,CAAC,kBAAkB,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9CH,kCAAgB,CAAC,aAAa,GAAG,MAAM,CAAC;IAExC,IAAI,CAAC,kBAAkB,CAAC,IAAI,iCACvB,IAAI,CAAC,cAAc,KACtB,MAAM,EAAE,QAAQ,EAChB,UAAU,EAAE,MAAM,CAAC,IAAI,IACvB,CAAC;GACJ;EAEO,mBAAmB;IACzB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;IAC/BA,kCAAgB,CAAC,aAAa,GAAG,SAAS,CAAC;IAC3C,IAAI,CAAC,kBAAkB,EAAE,CAAC,IAAI,EAAE,CAAC;IAEjC,IAAI,CAAC,kBAAkB,CAAC,IAAI,iCACvB,IAAI,CAAC,cAAc,KACtB,MAAM,EAAE,UAAU,IAClB,CAAC;GACJ;EAEO,kBAAkB;IACxB,OAAO,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;GAClE;EAEO,aAAa;IACnB,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC;GACtC;EAEO,WAAW,CAAC,EAAiB,EAAE,CAAO;IAC5C,IAAI,EAAE,CAAC,GAAG,KAAK,OAAO;MAAE,OAAO;IAC/B,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;GAC/B;EAEO,gBAAgB,CAAC,UAAgB;IACvC,OAAO,IAAI,CAAC,kBAAkB,KAAK,WAAW,CAAC,UAAU,CAAC,CAAC;GAC5D;EAED,MAAM;IACJ,QACEG,QAACC,UAAI,IAAC,WAAW,EAAC,2BAA2B,IAC3CD,iBAAK,KAAK,EAAC,SAAS,IACjB,IAAI,CAAC,MAAM,CAAC,OAAO;OACjB,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,aAAa,GAAG,IAAI,CAAC,CAAC;OAC/D,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MACRA,iBACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAC,GAAG,EACZ,IAAI,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,eAAe,GAAG,QAAQ,EAC3D,KAAK,EAAE;QACL,MAAM,EAAE,IAAI;QACZ,MAAM,EAAE,IAAI,CAAC,kBAAkB,KAAK,WAAW,CAAC,CAAC,CAAC;OACnD,EACD,KAAK,EAAE,EAAE,iBAAiB,EAAE,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,EAC3C,WAAW,EAAE,CAAC,EAAE;QACd,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;OAC/B,EACD,UAAU,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,CAAC,EAAE,EAAE,CAAC,CAAC,IAE1C,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAGA,QAACQ,iBAAS,OAAG,GAAG,IAAI,EAC/C,CAAC,CAAC,IAAI,CACH,CACP,CAAC,EAEJR,iBACE,KAAK,EAAE;QACL,MAAM,EAAE,IAAI;QACZ,WAAW,EAAE,IAAI;QACjB,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,IAAI,aAAa;QACnD,MAAM,EAAE,CAAC,IAAI,CAAC,WAAW;OAC1B,EACD,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAC,GAAG,eACF,QAAQ,EAClB,OAAO,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,EACnC,UAAU,EAAE,CAAC,EAAE;QACb,IAAI,EAAE,CAAC,GAAG,KAAK,OAAO,EAAE;UACtB,IAAI,CAAC,aAAa,EAAE,CAAC;SACtB;OACF,EACD,IAAI,EAAC,mBAAmB,IAEvB,IAAI,CAAC,WAAW,GAAG,YAAY,GAAG,eAAe,CAC9C,CACF,CACD,EACP;GACH;;;;;ACxIH,MAAM,uBAAuB,GAAG,04BAA04B;;MC+B75B,oBAAoB;;;;;;oBAoDO,CAAC,GAAG,EAAE,GAAG,CAAC;;EA9CxC,iBAAiB;IACvB,OAAOL,gCAAI,CACTE,kCAAgB,CAAC,WAAW,EAC5BC,4BAAK,CAAC,CAAC,MAAM;MACX,MAAM,eAAe,GAAGW,yBAAO,CAC7BC,iCAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,SAAS,CAC/C,CAAC;MAEF,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAGf,gCAAI,CAAC,eAAe,EAAEgB,gCAAc,CAAC,MAAM,CAAC,EAAEC,wBAAM,CAAC,CAAC;MAEvE,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;KAC7B,CAAC,EACFb,kCAAW,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAC9B,CAAC;GACH;EAEO,oBAAoB;IAC1BJ,gCAAI,CACFE,kCAAgB,CAAC,WAAW,EAC5BC,4BAAK,CAAC,CAAC,MAAM;MACX,MAAM,SAAS,GAAGY,iCAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,SAAS,CAAC;MACjE,MAAM,eAAe,GAAGD,yBAAO,CAAC,SAAS,CAAC,CAAC;MAC3C,MAAM,UAAU,GAAGE,gCAAc,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,CAAC;MAE3Dd,kCAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;MACtDA,kCAAgB,CAAC,UAAU,GAAGQ,6BAAM,CAAC,UAAU,CAAC,CAAC;KAClD,CAAC,CACH,CAAC;IAEFE,8CAA4B,EAAE,CAAC;IAC/B,IAAI,CAAC,kBAAkB,CAAC,IAAI,iCACvB,IAAI,CAAC,cAAc,KACtB,cAAc,EAAE,IAAI,CAAC,cAAc,IACnC,CAAC;GACJ;EAEO,QAAQ;IACd,IAAI,CAAC,IAAI,CAAC,cAAc;MAAE,OAAO,KAAK,CAAC;IACvC,IAAI,CAACV,kCAAgB,CAAC,cAAc;MAAE,OAAO,KAAK,CAAC;IAEnD,MAAM,UAAU,GAAGa,iCAAe,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IACxD,MAAM,WAAW,GAAGA,iCAAe,CAACb,kCAAgB,CAAC,cAAc,CAAC,CAAC;IAErE,OAAOgB,kCAAgB,CAAC,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;GACzD;EAGD,MAAM;IACJ,QACEb,QAACC,UAAI,IACH,KAAK,EAAE;QACL,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE;OACxB,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,oBAAoB,EAAE,EAC1C,KAAK,EAAE;QACL,cAAc,EAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC;QAC3C,cAAc,EAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC;OAC5C,GACK,EACR;GACH;;;;ACjGH,MAAM,qBAAqB,GAAG,uDAAuD;;MCOxE,kBAAkB;;;;EAC7B,MAAM;IACJ,QACED,QAACC,UAAI,QACHD,8BACEA,iBACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,MAAM,EACZ,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAElCA,kBACE,CAAC,EAAC,kFAAkF,EACpF,IAAI,EAAC,SAAS,GACd,EACFA,kBACE,CAAC,EAAC,6DAA6D,EAC/D,IAAI,EAAC,SAAS,GACd,CACE,EACNA,gBAAI,IAAI,EAAC,OAAO,6BAA4B,EAC5CA,kBAAM,IAAI,EAAC,MAAM,0HAGV,CACM,CACV,EACP;GACH;;;;ACrCH,MAAM,qBAAqB,GAAG,2YAA2Y;;MCuB5Z,kBAAkB;;;;;eACP,EAAE;iBACA,CAAC;kBACA,CAAC;;oBAGG,KAAK;;EAK1B,MAAM,WAAW;IACvB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IAErB,MAAM,IAAI,GAAG,MAAMc,wBAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACpC,MAAM,aAAa,GAAG,MAAMC,qCAAmB,CAAC,IAAI,CAAC,CAAC;IAEtDpB,gCAAI,CACF,aAAa,EACbqB,8BAAO,CACL,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,EACnD,MAAM,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CACvD,CACF,CAAC;IAEF,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;GACvB;EAEO,cAAc,CAAC,EAAE,GAAG,EAAiB;IAC3C,IAAI,GAAG,KAAK,OAAO,IAAI,GAAG,KAAK,GAAG;MAAE,OAAO;IAC3C,IAAI,CAAC,WAAW,EAAE,CAAC;GACpB;EAEO,aAAa;IACnB,QACE,CAACnB,kCAAgB,CAAC,yBAAyB;MACzCA,kCAAgB,CAAC,OAAO;MAC1B,IAAI,CAAC,QAAQ,EACb;GACH;EAED,MAAM;IACJ,QACEG,QAACC,UAAI,IACH,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EACjC,OAAO,EAAE,CAAC,EAAiB,KAAK,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,IAEtD,IAAI,CAAC,aAAa,EAAE,IACnBD,iBAAK,KAAK,EAAC,iBAAiB,IAC1BA,iCAAoB,CAChB,IACJ,IAAI,EACRA,iBACE,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,CAAC,GACX,CACG,EACP;GACH;;;;ACnFH,MAAM,sBAAsB,GAAG,iMAAiM;;MCiBnN,mBAAmB;;;;;;;EAU9B,iBAAiB;IACfiB,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAEO,aAAa;IACnB,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACjD,MAAM,iBAAiB,GAAG,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IAEjD,iBAAiC,CAAC,KAAK,EAAE,CAAC;GAC5C;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,IAAC,OAAO,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,IACvCD,kBAAM,IAAI,EAAC,6BAA6B,IACtCA,4EAA8D,CACzD,EACPA,iBACE,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAoB,CAAC,IAEtDA,kBAAM,IAAI,EAAC,yBAAyB,IAClCA,kCACE,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,GAAG,EACX,GAAG,EAAC,kHAAkH,EACtH,cAAc,EAAE,IAAI,CAAC,cAAc,GACnC,CACG,EACPA,kBAAM,IAAI,EAAC,yBAAyB,IAClCA,kCACE,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,GAAG,EACX,GAAG,EAAC,kHAAkH,EACtH,cAAc,EAAE,IAAI,CAAC,cAAc,GACnC,CACG,EACPA,kBAAM,IAAI,EAAC,yBAAyB,IAClCA,kCACE,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,GAAG,EACX,GAAG,EAAC,kHAAkH,EACtH,cAAc,EAAE,IAAI,CAAC,cAAc,GACnC,CACG,EACPA,kBAAM,IAAI,EAAC,yBAAyB,IAClCA,kCACE,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,GAAG,EACX,GAAG,EAAC,kHAAkH,EACtH,cAAc,EAAE,IAAI,CAAC,cAAc,GACnC,CACG,CACH,CACD,EACP;GACH;;;;;ACnFH,MAAM,sBAAsB,GAAG,2TAA2T;;MCyB7U,mBAAmB;;;;;;;;;EAYtB,MAAM,iBAAiB,CAAC,KAAY;IAC1C,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;IAC/C,MAAM,gBAAgB,GAAG,MAAMe,qCAAmB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAEnEpB,gCAAI,CACF,gBAAgB,EAChBqB,yBAAO,CACL,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,EACnD,MAAM,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CACvD,CACF,CAAC;IAEF,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC;GACpB;EAEO,SAAS;IACf,OAAOnB,kCAAgB,CAAC,OAAO,CAAC;GACjC;EAGD,kBAAkB,CAAC,MAAe;IAChC,IAAI,MAAM,EAAE;MACV,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;MACvB,IAAI,CAAC,cAAc,EAAE,CAAC;KACvB;GACF;EAED,MAAM;IACJ,QACEG,QAACC,UAAI,IAAC,WAAW,EAAC,QAAQ,IACvB,IAAI,CAAC,SAAS,EAAE,GAAGD,iCAAoB,GAAG,IAAI,EAC9C,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,IACtBA,mBAAO,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,QAAQ,IACtCA,kBAAM,IAAI,EAAC,oBAAoB,mBAAoB,CAC7C,CACT,EACDA,mBACE,EAAE,EAAC,WAAW,EACd,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EAChB,QAAQ,EAAE,CAAC,KAAY,KAAK,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,EACzD,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAsB,CAAC,GACtD,CACG,EACP;GACH;;;;;;;ACnFH,MAAM,kBAAkB,GAAG,uZAAuZ;;ACYlb,MAAM,aAAa,GAAG,CAAC,CAAmB;EACxC,MAAM,UAAU,GAAGkB,qCAAmB,CAAC,CAAC,CAAC,CAAC;EAC1C,MAAM,MAAM,GAAGC,oCAAkB,CAAC,GAAG,CAAC,CAAC;EACvC,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;EAEzC,MAAM,KAAK,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC;EAE/C,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC9B,CAAC,CAAC;MAOW,eAAe;;;;;EAG1B,sBAAsB,CAAC,EAAS;IAC9B,MAAM,MAAM,GAAG,EAAE,CAAC,MAA0B,CAAC;IAC7C,MAAM,WAAW,GAAGC,2BAAS,CAAC,MAAM,CAAC,CAAC;IACtC,MAAM,OAAO,GAAG,EAAE,CAAC;IACnB,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAGd,sBAAI,CAAC,WAAW,EAAE,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;IAE/D,MAAM,UAAU,GAAG;MACjB,CAAC;MACD,CAAC;MACD,KAAK,EAAE,WAAW,CAAC,KAAK,GAAG,OAAO,GAAG,CAAC;MACtC,MAAM,EAAE,WAAW,CAAC,MAAM,GAAG,OAAO,GAAG,CAAC;KACzC,CAAC;IAEFT,kCAAgB,CAAC,WAAW,GAAGQ,6BAAM,CAAC,WAAW,CAAC,CAAC;IACnDR,kCAAgB,CAAC,UAAU,GAAGQ,6BAAM,CAAC,UAAU,CAAC,CAAC;GAClD;EAEO,oBAAoB,CAC1B,MAAmC;IAEnC,QACEL,oCACE,cAAc,EAAE,MAAM,EACtB,cAAc,EAAE,IAAI,CAAC,cAAc,GACnC,EACF;GACH;EAEO,WAAW;IACjB,OAAOL,gCAAI,CACTC,kCAAgB,CAACC,kCAAgB,CAAC,QAAQ,EAAEA,kCAAgB,CAAC,KAAK,CAAC,EACnEC,4BAAK,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC;MACpB,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;MAEhD,MAAM,KAAK,IACTE,iBACE,QAAQ,EAAC,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,sBAAsB,CAAC,EAAE,CAAC,EAC/C,SAAS,EAAE,KAAK,GAChB,CACH,CAAC;MAEF,OAAO,KAAK,CAAC;KACd,CAAC,EACFD,kCAAW,CAAC,MAAM,IAAI,CAAC,CACxB,CAAC;GACH;EAEO,aAAa;IACnB,OAAOJ,gCAAI,CACTE,kCAAgB,CAAC,QAAQ,EACzBC,4BAAK,CAAC,MAAME,2BAAe,cAAc,EAAE,IAAI,CAAC,cAAc,GAAI,CAAC,EACnED,kCAAW,CAAC,MAAM,IAAI,CAAC,CACxB,CAAC;GACH;EAED,MAAM;IACJ,QACEC,QAACC,UAAI,QACFJ,kCAAgB,CAAC,OAAO;MACzBA,kCAAgB,CAAC,yBAAyB,IACxCG,iBAAK,KAAK,EAAC,iBAAiB,IAC1BA,iCAAoB,CAChB,IACJ,IAAI,EACRA,8BAAiB,EAChB,IAAI,CAAC,WAAW,EAAE,EAClB,IAAI,CAAC,aAAa,EAAE,EACpBH,kCAAgB,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,KACtC,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAC7B,CACI,EACP;GACH;;;;AC1GH,MAAM,cAAc,GAAG,01BAA01B;;MCmBp2B,WAAW;;;;kBAGoC,KAAK;;;0BAK7B,KAAK;kBAEZ,KAAK;;EAKhC,iBAAiB;IACfoB,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAEO,KAAK;IACX,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IAEpB,UAAU,CACR;MACE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;QAC1B,UAAU,EAAE,KAAK;QACjB,cAAc,EAAE,KAAK;QACrB,gBAAgB,EAAEI,0BAAiB,CAAC,KAAK,CAAC;QAC1C,QAAQ,EAAE,IAAI,CAAC,eAAe;OAC/B,CAAC,CAAC;KACJ,EACD,IAAI,CAAC,MAAM,GAAG,GAAG,GAAG,CAAC,CACtB,CAAC;GACH;EAEO,kBAAkB,CAAC,EAAkB;IAC3C,IAAI,EAAE,CAAC,aAAa,KAAK,SAAS;MAAE,OAAO;IAC3C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;GACpB;EAED,MAAM;IACJ,QACErB,QAACC,UAAI,IACH,WAAW,EAAC,uCAAuC,EACnD,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,EAC/B,cAAc,EAAE,CAAC,EAAkB,KAAK,IAAI,CAAC,kBAAkB,CAAC,EAAE,CAAC,IAEnED,iBAAK,KAAK,EAAC,MAAM,IACd,CAAC,IAAI,CAAC,cAAc,KACnBA,oBAAQ,IAAI,EAAC,kBAAkB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,EAAE,IAC9DA,iBACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAElCA,kBACE,CAAC,EAAC,gBAAgB,EAClB,MAAM,EAAC,SAAS,kBACH,GAAG,oBACD,OAAO,qBACN,OAAO,GACvB,EACFA,kBACE,CAAC,EAAC,+BAA+B,EACjC,MAAM,EAAC,SAAS,kBACH,GAAG,oBACD,OAAO,qBACN,OAAO,GACvB,CACE,CACC,CACV,EAEDA,iBAAK,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,IAC7BA,kBAAM,IAAI,EAAC,iCAAiC,gBAAiB,CACzD,EAENA,oBACE,OAAO,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE,EAC3B,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,cAAc,IAEnBA,iBACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAElCA,kBACE,CAAC,EAAC,0FAA0F,EAC5F,IAAI,EAAC,SAAS,GACd,CACE,CACC,CACL,EACNA,iBAAK,KAAK,EAAC,MAAM,IACfA,qBAAa,CACT,CACD,EACP;GACH;;;;;AC1HH,MAAM,mBAAmB,GAAG,wmBAAwmB;;MCQvnB,gBAAgB;;;;EAG3B,iBAAiB;IACfiB,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,QACHD,kBAAM,IAAI,EAAC,yBAAyB,IAClCA,yCAA2B,CACtB,EACPA,2BAAe,UAAU,EAAE,IAAI,IAC7BA,8BACEA,yCAA4B,CACf,EACfA,8BACEA,yCAA4B,CACf,EACfA,8BACEA,yCAA4B,CACf,CACD,CACV,EACR;GACH;;;;;AClCH,MAAMsB,mBAAiB,GAAG,6cAA6c;;MCS1d,qBAAqB;;;;EAGhC,iBAAiB;IACfL,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,QACHD,kBAAM,IAAI,EAAC,wBAAwB,IACjCA,QAACuB,2BAAmB,OAAG,CAClB,EACPvB,kBAAM,IAAI,EAAC,wBAAwB,IACjCA,iBAAK,KAAK,EAAC,MAAM,IACfA,2CAA6B,EAC7BA,4GAGI,CACA,CACD,CACF,EACP;GACH;;;;;ACjCH,MAAMsB,mBAAiB,GAAG,6cAA6c;;MCS1d,qBAAqB;;;;EAGhC,iBAAiB;IACfL,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,QACHD,kBAAM,IAAI,EAAC,wBAAwB,IACjCA,QAACwB,2BAAmB,OAAG,CAClB,EACPxB,kBAAM,IAAI,EAAC,wBAAwB,IACjCA,iBAAK,KAAK,EAAC,MAAM,IACfA,4CAA8B,EAC9BA,yGAGI,CACA,CACD,CACF,EACP;GACH;;;;;ACjCH,MAAM,iBAAiB,GAAG,6cAA6c;;MCS1d,qBAAqB;;;;EAGhC,iBAAiB;IACfiB,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,QACHD,kBAAM,IAAI,EAAC,wBAAwB,IACjCA,QAACyB,2BAAmB,OAAG,CAClB,EACPzB,kBAAM,IAAI,EAAC,wBAAwB,IACjCA,iBAAK,KAAK,EAAC,MAAM,IACfA,uCAAyB,EACzBA,2IAGI,CACA,CACD,CACF,EACP;GACH;;;;;ACjCH,MAAM,gBAAgB,GAAG,2NAA2N;;MCOvO,aAAa;;;;EACxB,MAAM;IACJ,QACEA,QAACC,UAAI,QACHD,qBAAa,CACR,EACP;GACH;;;;ACdH,MAAM,uBAAuB,GAAG,4UAA4U;;MCO/V,oBAAoB;;;;kBACL,KAAK;;;0BAKG,KAAK;;EAIvC,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,IAClCD,gCACEA,0BACE,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,cAAc,EAAE,IAAI,CAAC,cAAc,IAEnCA,gCAAoB,CACP,CACA,CACZ,EACP;GACH;;;;AChCH,MAAM,qBAAqB,GAAG,sMAAsM;;MCQvN,kBAAkB;;;;EAG7B,iBAAiB;IACfiB,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,QACHD,sBACEA,iBAAK,KAAK,EAAC,SAAS,IAClBA,iBACE,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,IAAI,EAAC,MAAM,IAEXA,qBAAQ,EACRA,kBACE,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,uEAAuE,GACzE,EACFA,kBACE,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,+DAA+D,GACjE,CACE,EACNA,kBAAM,IAAI,EAAC,2BAA2B,IACpCA,yLAII,CACC,CACH,CACD,CACF,EACP;GACH;;;;;AC/CH,MAAM,oBAAoB,GAAG,sBAAsB;;MCOtC,iBAAiB;;;;;EAG5B,MAAM;IACJ,QACEA,QAACC,UAAI,QACHD,8BACEA,gBAAI,IAAI,EAAC,OAAO,uBAAsB,EACtCA,kBAAM,IAAI,EAAC,MAAM,kIAGV,EACPA,oBAAQ,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,uBAElC,CACI,CACV,EACP;GACH;;;;ACzBH,MAAM,cAAc,GAAG,0CAA0C;;MCOpD,WAAW;;;;EACtB,MAAM;IACJ,QACEA,QAACC,UAAI,QACHD,qBAAa,CACR,EACP;GACH;;;;ACDH,MAAM,WAAW,GAAG,CAClB,IAAwB;EAExB,OAAO;IACL,eAAe,EAAE,IAAI;IACrB,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI;IACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ;GACxB,CAAC;AACJ,CAAC,CAAC;AAEK,MAAM,KAAK,GAAmC,CAAC,EACpD,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,SAAS,GACV,MACCA,iBACE,KAAK,EAAE,WAAW,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EACtC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS;EAEpBA,QAAC0B,iBAAS,OAAG,CACT,CACP;;ACtCD,MAAM,eAAe,GAAG,2lDAA2lD;;MCatmD,YAAY;;;yBAGU,CAAC;4BACE,CAAC;8BACWC,6BAAM;iBAC5B,KAAK;uBAEA,IAAI;oBACS,CAAC;sBACf,KAAK;;EAGnC,oBAAoB,CAAC,QAAgB;IACnC,IAAI,CAAC,gBAAgB,GAAG,QAAQ,CAAC;IACjC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CACvB,YAAY,EACZ,GAAG,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,CACtC,CAAC;IACF,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC;GACzC;EAED,iBAAiB;IACf,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,KAAK,KAAK,CAAC;GACrC;EAED,iBAAiB;IACf,IAAI,CAAC,uBAAuB,EAAE,CAAC;GAChC;EAEO,uBAAuB;IAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IACvD,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC;IAClC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;IAClE,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;GAClC;EAEO,wBAAwB,CAAC,KAAa;IAC5C,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IACvD,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;IACnD,KAAK,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;GACtC;EAEO,SAAS,CAAC,KAAa;IAC7B,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;IAC9B,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;IACpD,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;GACtC;EAEO,aAAa;IACnB,OAAO,IAAI,CAAC,WAAW,IACrB3B,iBAAK,KAAK,EAAC,UAAU,IAClB4B,qCAAK,CAAC,CAAC,EAAE,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MACtC5B,iBACE,KAAK,EAAE;QACL,MAAM,EAAE,IAAI;QACZ,MAAM,EAAE,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,aAAa;OAClE,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GAC3B,CACR,CAAC,CACE,IACJ,IAAI,CAAC;GACV;EAEO,SAAS;IACf,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAExB,IAAI,CAAC,mBAAmB,EAAE,CAAC;GAC5B;EAEO,SAAS;IACf,MAAM,WAAW,GAAG,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC;IAE9C,IAAI,CAAC,gBAAgB;MACnB,WAAW,GAAG,CAAC,CAAC,GAAG,WAAW,GAAG,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;IAE1D,IAAI,CAAC,mBAAmB,EAAE,CAAC;GAC5B;EAEO,mBAAmB;IACzB,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,aAAa,CAAC;IAE5D,qBAAqB,CAAC;MACpB,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CACvB,YAAY,EACZ,GAAG,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,CACtC,CAAC;KACH,CAAC,CAAC;GACJ;EAEO,iBAAiB,CAAC,QAAgB;IACxC,OAAO,IAAI,CAAC,KAAK,GAAG,QAAQ,GAAG,CAAC,CAAC,GAAG,QAAQ,CAAC;GAC9C;EAEO,aAAa,CAAC,KAAoB;IACxC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO;MAAE,OAAO;IAC3D,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;IAC3C,MAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,MAAM,GAAG,MAAM,CAAC;IAEtE,QAAQ,SAAS;MACf,KAAK,MAAM;QACT,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,MAAM;MACR,KAAK,MAAM;QACT,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,MAAM;KACT;GACF;EAEO,gBAAgB,CAAC,KAAiB;IACxC,IAAI,CAAC,IAAI,CAAC,WAAW;MAAE,OAAO;IAE9B,IAAI,CAAC,kBAAkB,GAAGL,gCAAI,CAC5B,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAChBkC,qCAAc,EACd/B,4BAAK,CAAC,CAAC,CAAQ,KAAK,CAAC,CAAC,OAAO,CAAC,CAC/B,CAAC;GACH;EAEO,cAAc,CAAC,KAAiB;IACtC,IAAI,CAAC,IAAI,CAAC,WAAW;MAAE,OAAO;IAE9B,MAAM,gBAAgB,GAAGH,gCAAI,CAC3B,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EACvBkC,qCAAc,EACd/B,4BAAK,CAAC,CAAC,CAAQ,KAAK,CAAC,CAAC,OAAO,CAAC,CAC/B,CAAC;IAEFH,gCAAI,CACFC,kCAAgB,CAAC,IAAI,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,EAC3DE,4BAAK,CAAC,CAAC,CAAC,KAAK,EAAE,GAAG,CAAC,KAAKgC,GAAK,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,EAClDhC,4BAAK,CAAC,CAAC,cAAc;MACnB,QAAQ,cAAc;QACpB,KAAK,CAAC;UACJ,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC;QAC1B,KAAK,CAAC,CAAC;UACL,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC;OAC3B;KACF,CAAC,CACH,CAAC;GACH;EAED,MAAM;IACJ,QACEE,QAACC,UAAI,QACHD,iBAAK,KAAK,EAAC,eAAe,IACxBA,iBACE,KAAK,EAAC,OAAO,EACb,YAAY,EAAE,CAAC,CAAa,KAAK,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EACzD,UAAU,EAAE,CAAC,CAAa,KAAK,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,IAErDA,qBAAa,CACT,CACF,EACL,IAAI,CAAC,UAAU;QACZ;QACEA,QAAC,KAAK,IACJ,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,MACP,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,EAAE,EAElD,SAAS,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EACzC,QAAQ,EAAE,CAAC,EACX,QAAQ,EAAE,KAAK,GACf;QACFA,QAAC,KAAK,IACJ,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,MACP,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,EAAE,EAElD,SAAS,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EACzC,QAAQ,EAAE,CAAC,EACX,QAAQ,EAAE,KAAK,GACf;OACH;QACD,IAAI,EACP,IAAI,CAAC,aAAa,EAAE,CAChB,EACP;GACH;;;;;;;;ACjMH,MAAM,eAAe,GAAG,2KAA2K;;MCQtL,YAAY;;;;EAGvB,iBAAiB;IACfiB,kCAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;GACnC;EAED,MAAM;IACJ,QACEjB,QAACC,UAAI,QACHD,sBACEA,iBAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,IACxEA,qBAAQ,EACRA,kBAAM,IAAI,EAAC,SAAS,EAAC,CAAC,EAAC,0MAA0M,GAAG,EACpOA,kBAAM,IAAI,EAAC,SAAS,EAAC,CAAC,EAAC,6KAA6K,GAAG,CACnM,EACNA,kBAAM,KAAK,EAAC,oBAAoB,IAC9BA,kBAAM,IAAI,EAAC,oBAAoB,2BACVA,mBAAM,gBACpB,CACF,CACF,CACF,EACP;GACH;;;;;AChCH,MAAM,oBAAoB,GAAG,sBAAsB;;MCOtC,iBAAiB;;;;;EAG5B,MAAM;IACJ,QACEA,QAACC,UAAI,QACHD,8BACEA,gBAAI,IAAI,EAAC,OAAO,2CAAqC,EACrDA,kBAAM,IAAI,EAAC,MAAM,mHAGV,EACPA,oBAAQ,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,2BAElC,CACI,CACV,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["pipe","sequenceToOption","imageSearchState","O.map","O.getOrElse","h","Host","fromMouseEvent","pointDiffSemigroup","transform","O.some","move","makeRectangularSearchRequest","CheckIcon","fromAlt","foldValueObject","scaleWithSized","center","detectedObjectEq","toFile","processSelectedFile","E.match","slotChangeListener","dimensionsFromImage","scaleByLargestSide","fromImage","campaignTypeNames","onboardingCardCss","OnboardingCard1Icon","OnboardingCard2Icon","OnboardingCard3Icon","ArrowIcon","O.none","range","O.fromNullable","N.Ord"],"sources":["./node_modules/fp-ts/es6/number.js","./src/geometry/Clip.ts","./src/components/image-search/image-view/highlight-box/highlight-box.css?tag=highlight-box&encapsulation=shadow","./src/components/image-search/image-view/highlight-box/highlight-box.tsx","./src/dom/index.ts","./src/components/image-search/image-view/image-cropper/image-cropper.css?tag=image-cropper&encapsulation=shadow","./src/components/image-search/image-view/image-cropper/image-cropper.tsx","./src/components/image-search/search-filters/search-filters.css?tag=search-filters&encapsulation=shadow","./src/components/image-search/search-filters/search-filters.tsx","./src/components/vviinn-image-view/vviinn-detected-object/vviinn-detected-object.css?tag=vviinn-detected-object&encapsulation=shadow","./src/components/vviinn-image-view/vviinn-detected-object/vviinn-detected-object.tsx","./src/components/vviinn-error/vviinn-empty-results/vviinn-empty-results.css?tag=vviinn-empty-results&encapsulation=shadow","./src/components/vviinn-error/vviinn-empty-results/vviinn-empty-results.tsx","./src/components/vviinn-example-images/vviinn-example-image/vviinn-example-image.css?tag=vviinn-example-image&encapsulation=shadow","./src/components/vviinn-example-images/vviinn-example-image/vviinn-example-image.tsx","./src/components/vviinn-example-images/vviinn-example-images.css?tag=vviinn-example-images&encapsulation=shadow","./src/components/vviinn-example-images/vviinn-example-images.tsx","./src/components/vviinn-image-selector/vviinn-image-selector.css?tag=vviinn-image-selector&encapsulation=shadow","./src/components/vviinn-image-selector/vviinn-image-selector.tsx","./src/components/vviinn-image-view/vviinn-image-view.css?tag=vviinn-image-view&encapsulation=shadow","./src/components/vviinn-image-view/vviinn-image-view.tsx","./src/components/vviinn-modal/vviinn-modal.css?tag=vviinn-modal&encapsulation=shadow","./src/components/vviinn-modal/vviinn-modal.tsx","./src/components/vviinn-onboarding/vviinn-onboarding.css?tag=vviinn-onboarding&encapsulation=shadow","./src/components/vviinn-onboarding/vviinn-onboarding.tsx","./src/components/vviinn-onboarding/onboarding-cards/onboarding-card.css?tag=vviinn-onboarding-card-1&encapsulation=shadow","./src/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-1/vviinn-onboarding-card-1.tsx","./src/components/vviinn-onboarding/onboarding-cards/onboarding-card.css?tag=vviinn-onboarding-card-2&encapsulation=shadow","./src/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-2/vviinn-onboarding-card-2.tsx","./src/components/vviinn-onboarding/onboarding-cards/onboarding-card.css?tag=vviinn-onboarding-card-3&encapsulation=shadow","./src/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-3/vviinn-onboarding-card-3.tsx","./src/components/vviinn-overlay/vviinn-overlay.css?tag=vviinn-overlay&encapsulation=shadow","./src/components/vviinn-overlay/vviinn-overlay.tsx","./src/components/vviinn-overlayed-modal/vviinn-overlayed-modal.css?tag=vviinn-overlayed-modal&encapsulation=shadow","./src/components/vviinn-overlayed-modal/vviinn-overlayed-modal.tsx","./src/components/vviinn-privacy-badge/vviinn-privacy-badge.css?tag=vviinn-privacy-badge&encapsulation=shadow","./src/components/vviinn-privacy-badge/vviinn-privacy-badge.tsx","./src/components/vviinn-error/vviinn-server-error/vviinn-server-error.css?tag=vviinn-server-error&encapsulation=shadow","./src/components/vviinn-error/vviinn-server-error/vviinn-server-error.tsx","./src/components/vviinn-slider/vviinn-slide/vviinn-slide.css?tag=vviinn-slide&encapsulation=shadow","./src/components/vviinn-slider/vviinn-slide/vviinn-slide.tsx","./src/components/vviinn-slider/arrow.tsx","./src/components/vviinn-slider/vviinn-slider.css?tag=vviinn-slider&encapsulation=shadow","./src/components/vviinn-slider/vviinn-slider.tsx","./src/components/vviinn-teaser/vviinn-teaser.css?tag=vviinn-teaser&encapsulation=shadow","./src/components/vviinn-teaser/vviinn-teaser.tsx","./src/components/vviinn-error/vviinn-wrong-format/vviinn-wrong-format.css?tag=vviinn-wrong-format&encapsulation=shadow","./src/components/vviinn-error/vviinn-wrong-format/vviinn-wrong-format.tsx"],"sourcesContent":["// -------------------------------------------------------------------------------------\n// refinements\n// -------------------------------------------------------------------------------------\n/**\n * @category refinements\n * @since 2.11.0\n */\nexport var isNumber = function (u) { return typeof u === 'number'; };\n// -------------------------------------------------------------------------------------\n// instances\n// -------------------------------------------------------------------------------------\n/**\n * @category instances\n * @since 2.10.0\n */\nexport var Eq = {\n equals: function (first, second) { return first === second; }\n};\n/**\n * @category instances\n * @since 2.10.0\n */\nexport var Ord = {\n equals: Eq.equals,\n compare: function (first, second) { return (first < second ? -1 : first > second ? 1 : 0); }\n};\n/**\n * @category instances\n * @since 2.10.0\n */\nexport var Bounded = {\n equals: Eq.equals,\n compare: Ord.compare,\n top: Infinity,\n bottom: -Infinity\n};\n/**\n * @category instances\n * @since 2.10.0\n */\nexport var Show = {\n show: function (n) { return JSON.stringify(n); }\n};\n/**\n * @category instances\n * @since 2.11.0\n */\nexport var MagmaSub = {\n concat: function (first, second) { return first - second; }\n};\n/**\n * `number` semigroup under addition.\n *\n * @example\n * import { SemigroupSum } from 'fp-ts/number'\n *\n * assert.deepStrictEqual(SemigroupSum.concat(2, 3), 5)\n *\n * @category instances\n * @since 2.10.0\n */\nexport var SemigroupSum = {\n concat: function (first, second) { return first + second; }\n};\n/**\n * `number` semigroup under multiplication.\n *\n * @example\n * import { SemigroupProduct } from 'fp-ts/number'\n *\n * assert.deepStrictEqual(SemigroupProduct.concat(2, 3), 6)\n *\n * @category instances\n * @since 2.10.0\n */\nexport var SemigroupProduct = {\n concat: function (first, second) { return first * second; }\n};\n/**\n * `number` monoid under addition.\n *\n * The `empty` value is `0`.\n *\n * @example\n * import { MonoidSum } from 'fp-ts/number'\n *\n * assert.deepStrictEqual(MonoidSum.concat(2, MonoidSum.empty), 2)\n *\n * @category instances\n * @since 2.10.0\n */\nexport var MonoidSum = {\n concat: SemigroupSum.concat,\n empty: 0\n};\n/**\n * `number` monoid under multiplication.\n *\n * The `empty` value is `1`.\n *\n * @example\n * import { MonoidProduct } from 'fp-ts/number'\n *\n * assert.deepStrictEqual(MonoidProduct.concat(2, MonoidProduct.empty), 2)\n *\n * @category instances\n * @since 2.10.0\n */\nexport var MonoidProduct = {\n concat: SemigroupProduct.concat,\n empty: 1\n};\n/**\n * @category instances\n * @since 2.10.0\n */\nexport var Field = {\n add: SemigroupSum.concat,\n zero: 0,\n mul: SemigroupProduct.concat,\n one: 1,\n sub: MagmaSub.concat,\n degree: function (_) { return 1; },\n div: function (first, second) { return first / second; },\n mod: function (first, second) { return first % second; }\n};\n","import { Rectangle } from \"./Rectangle\";\nimport { Sized } from \"./Sized\";\n\ninterface Clip {\n readonly top: string;\n readonly right: string;\n readonly bottom: string;\n readonly left: string;\n}\n\nconst fromRectangle = (shape: Rectangle, target: Sized): Clip => {\n const top = `${shape.y}px`;\n const left = `${shape.x}px`;\n const right = `${target.width - (shape.x + shape.width)}px`;\n const bottom = `${target.height - (shape.y + shape.height)}px`;\n\n return {\n top,\n right,\n bottom,\n left,\n };\n};\n\nconst printClip = (clip: Clip): string =>\n `inset(${clip.top} ${clip.right} ${clip.bottom} ${clip.left})`;\n\nexport const getClipValue = (shape: Rectangle, target: Sized): string =>\n printClip(fromRectangle(shape, target));\n",":host {\n display: grid;\n position: absolute;\n box-sizing: border-box;\n border: none;\n width: 100%;\n height: 100%;\n user-select: none;\n\n --size: 10px;\n --x-position: 0;\n --y-position: 0;\n}\n\nimg {\n user-select: none;\n}\n\n.pointer {\n position: absolute;\n width: var(--size);\n height: var(--size);\n background: black;\n border-radius: 50%;\n z-index: 2;\n cursor: pointer;\n transform: translate(var(--x-position), var(--y-position)) scale(0);\n animation: 0.25s linear fadein;\n animation-fill-mode: forwards;\n}\n\n.pointer::after {\n content: \"\";\n cursor: pointer;\n border: 5px solid black;\n border-radius: 50%;\n width: var(--size);\n height: var(--size);\n display: block;\n transform: translate(calc(-50% + var(--size) * 0.5), calc(-50% + var(--size) * 0.5));\n padding: calc(var(--size) * 0.5);\n opacity: .75;\n}\n\n@keyframes fadein {\n from {\n transform: translate(var(--x-position), var(--y-position)) scale(0);\n }\n\n to {\n transform: translate(var(--x-position), var(--y-position)) scale(1);\n }\n}\n","import { Component, Host, h } from \"@stencil/core\";\nimport { getClipValue } from \"../../../../geometry/Clip\";\nimport * as O from \"fp-ts/lib/Option\";\nimport { pipe } from \"fp-ts/function\";\nimport { imageSearchState } from \"../../../../store/imageSearch.store\";\nimport { sequenceToOption } from \"../../../../utils/option/option\";\n\n@Component({\n tag: \"highlight-box\",\n styleUrl: \"highlight-box.css\",\n shadow: true,\n})\nexport class HighlightBox {\n private getInsetValue(): string {\n return pipe(\n sequenceToOption(\n imageSearchState.searchArea,\n imageSearchState.imageBounds\n ),\n O.map(([selection, image]) => getClipValue(selection, image)),\n O.getOrElse(() => \"\")\n );\n }\n\n private renderImage(): HTMLImageElement | string {\n return pipe(\n sequenceToOption(imageSearchState.imageUrl, imageSearchState.imageBounds),\n O.map(([url, bounds]) => (\n <img\n src={url}\n width={bounds.width}\n height={bounds.height}\n style={{ \"clip-path\": `${this.getInsetValue()}` }}\n />\n )),\n O.getOrElse(() => \"\")\n );\n }\n\n render() {\n return <Host>{this.renderImage()}</Host>;\n }\n}\n","export const findTarget = (ev: any) => {\n return ev.target;\n};\n",":host {\n display: block;\n height: 100%;\n left: 0;\n position: absolute;\n top: 0;\n width: 100%;\n}\n\n:host(.hidden) {\n visibility: hidden;\n}\n\n.crop-area {\n border: 1px solid white;\n box-sizing: border-box;\n position: absolute;\n touch-action: none;\n transition-property: border-color, opacity;\n transition-duration: .25s;\n transition-timing-function: ease-in-out;\n z-index: 2;\n position: relative;\n will-change: transform;\n}\n\n.crop-area.active {\n border-color: whitesmoke;\n}\n\n.crop-area.disabled {\n opacity: 0.25;\n}\n","import {\n Component,\n Host,\n h,\n State,\n Element,\n Prop,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport { HandlerDirection } from \"../../../../cropper/Handler\";\nimport { move, Rectangle, transform } from \"../../../../geometry/Rectangle\";\nimport {\n Point,\n fromMouseEvent,\n pointDiffSemigroup,\n} from \"../../../../geometry/Point\";\nimport {\n imageSearchState,\n makeRectangularSearchRequest,\n} from \"../../../../store/imageSearch.store\";\nimport { pipe } from \"fp-ts/lib/function\";\nimport * as O from \"fp-ts/lib/Option\";\nimport { findTarget } from \"../../../../dom\";\nimport styles from \"./image-cropper.css\";\nimport { BasicEventData } from \"../../../../recommendation/events\";\n\nconst MIN_SEARCHAREA_SIZE = 40;\n\n@Component({\n tag: \"image-cropper\",\n shadow: true,\n styles,\n})\nexport class ImageCropper {\n @Element() el: HTMLElement;\n\n @Prop() disabled: boolean = false;\n @Prop() basicEventData: BasicEventData;\n\n @State() handleMove: boolean = false;\n\n @Event() vviinnImageCrop: EventEmitter<BasicEventData>;\n\n private handlerMoveDirection: HandlerDirection | null;\n private mouseStartPoint: Point | undefined = undefined;\n private pointerMoveListener: EventListener;\n private pointerReleaseListener: EventListener;\n private bounds: DOMRect | undefined = undefined;\n private resizeObserver = new ResizeObserver(() => {\n this.bounds = this.el.getBoundingClientRect();\n });\n\n componentDidLoad() {\n this.resizeObserver.observe(this.el);\n }\n\n disconnectedCallback() {\n this.resizeObserver.disconnect();\n }\n\n private handleHandlerMove(event: PointerEvent) {\n event.preventDefault();\n event.stopPropagation();\n\n const destination = fromMouseEvent(event);\n const distance = pointDiffSemigroup.concat(\n destination,\n this.mouseStartPoint\n );\n\n const transformedHandler = {\n position: distance,\n direction: this.handlerMoveDirection,\n };\n\n pipe(\n imageSearchState.searchArea,\n O.map((area) => {\n const newSearchArea = transform(area, transformedHandler);\n\n if (this.outOfBounds(newSearchArea)) return;\n\n imageSearchState.searchArea = O.some(newSearchArea);\n this.mouseStartPoint = destination;\n imageSearchState.detectedObject = undefined;\n })\n );\n }\n\n private outOfBounds(area: Rectangle): boolean {\n return (\n area.width < MIN_SEARCHAREA_SIZE ||\n area.height < MIN_SEARCHAREA_SIZE ||\n area.x < 0 ||\n area.y < 0 ||\n this.bounds.height - (area.y + area.height) < 0 ||\n this.bounds.width - (area.x + area.width) < 0\n );\n }\n\n private handleCropperMove(ev: MouseEvent) {\n ev.preventDefault();\n ev.stopPropagation();\n const destination = fromMouseEvent(ev);\n\n const distance = pointDiffSemigroup.concat(\n destination,\n this.mouseStartPoint\n );\n\n pipe(\n imageSearchState.searchArea,\n O.map((searchArea) => {\n const newSearchArea = move(searchArea, distance);\n\n if (\n newSearchArea.x < 0 ||\n newSearchArea.y < 0 ||\n this.bounds.height - (newSearchArea.y + newSearchArea.height) < 0 ||\n this.bounds.width - (newSearchArea.x + newSearchArea.width) < 0\n )\n return;\n\n imageSearchState.detectedObject = undefined;\n imageSearchState.searchArea = O.some(newSearchArea);\n this.mouseStartPoint = destination;\n })\n );\n }\n\n private handlePointerDown(event: PointerEvent) {\n event.stopPropagation();\n this.mouseStartPoint = fromMouseEvent(event);\n\n // should be htmlelement or handler\n const target = findTarget(event) as any;\n\n if (target.localName === \"cropper-handler\") {\n this.handlerMoveDirection = target.handler.direction;\n this.pointerMoveListener = this.handleHandlerMove.bind(this);\n } else {\n this.pointerMoveListener = this.handleCropperMove.bind(this);\n }\n\n this.pointerReleaseListener = this.handleSearchAreaRelease.bind(this);\n\n this.el.addEventListener(\"pointermove\", this.pointerMoveListener);\n window.addEventListener(\"pointerup\", this.pointerReleaseListener, {\n once: true,\n });\n }\n\n private handleSearchAreaRelease() {\n this.el.removeEventListener(\"pointermove\", this.pointerMoveListener);\n document.removeEventListener(\"pointerup\", this.pointerReleaseListener);\n this.mouseStartPoint = undefined;\n makeRectangularSearchRequest();\n this.vviinnImageCrop.emit(this.basicEventData);\n }\n\n private getStyleMap() {\n return pipe(\n imageSearchState.searchArea,\n O.map((rectangle) => {\n return {\n width: `${rectangle.width}px`,\n height: `${rectangle.height}px`,\n transform: `translate3d(${rectangle.x}px, ${rectangle.y}px, 0)`,\n cursor: this.handleMove ? \"move\" : \"default\",\n };\n }),\n O.getOrElse(() => {\n return {};\n })\n );\n }\n\n render() {\n return (\n <Host exportparts=\"handle, e-resize, n-resize, ne-resize, nw-resize, s-resize, se-resize, sw-resize, w-resize\">\n <div\n class={{\n \"crop-area\": true,\n active: this.handleMove,\n disabled: this.disabled,\n }}\n draggable={false}\n style={this.getStyleMap()}\n onContextMenu={() => false}\n onPointerDown={(ev) => this.handlePointerDown(ev)}\n >\n {imageSearchState.cropperHandlers.map((handler) => (\n <cropper-handler\n disabled={this.disabled}\n handler={handler}\n onPointerDown={(ev) => this.handlePointerDown(ev)}\n ></cropper-handler>\n ))}\n </div>\n </Host>\n );\n }\n}\n",":host {\n display: grid;\n grid-gap: 1rem;\n}\n\n.filters {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 0.5rem;\n}\n\n.filter {\n align-items: center;\n animation-duration: 0.25s;\n animation-fill-mode: forwards;\n animation-name: scalein;\n border: 1px solid lightgray;\n cursor: pointer;\n display: flex;\n flex-direction: row;\n grid-gap: 8px;\n height: max-content;\n min-width: max-content;\n padding: 0.1rem;\n transform: scale(0);\n transition-property: background;\n transition-duration: 0.25s;\n transition-timing-function: ease-in-out;\n user-select: none;\n padding: 6px 16px;\n}\n\n.filter.active {\n border: 1px solid black;\n padding: 6px 8px;\n}\n\n.filter:hover {\n border: 1px solid gray;\n}\n\n.show-more {\n display: flex;\n}\n\n.show-more.hidden {\n display: none;\n}\n\n.show-more::after {\n content: url(\"data:image/svg+xml,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 12.2l-6-6L3.2 5 8 9.8 12.8 5 14 6.2l-6 6z' fill='%23525252'/%3E%3C/svg%3E\");\n display: block;\n height: 16px;\n margin-top: 1px;\n margin-left: 8px;\n}\n\n.show-more.active::after {\n transform: rotateX(180deg);\n}\n\n@keyframes scalein {\n from {\n opacity: 0;\n transform: scale(0.5);\n }\n\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@media (max-width: 415px) {\n .show-more::after {\n transform: rotate(-90deg);\n }\n\n .show-more.active::after {\n transform: rotate(90deg);\n }\n}\n\n@media (max-width: 800px) {\n .filters {\n flex-wrap: nowrap;\n overflow-x: scroll;\n scroll-snap-type: x mandatory;\n grid-gap: unset;\n }\n\n .filter {\n scroll-snap-align: end;\n margin-right: 0.5rem;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n State,\n Element,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport { Link } from \"../../../network/ion/Link\";\nimport { SearchSessionFilter } from \"../../../searchSession/searchSession\";\nimport { imageSearchState } from \"../../../store/imageSearch.store\";\nimport { CheckIcon } from \"../../vviinn-icons\";\nimport {\n BasicEventData,\n SelectFilterEventData,\n} from \"../../../recommendation/events\";\n\nconst FILTERS_COUNT: number = 5;\nconst ACTIVE_FILTER_CLASSNAME = \".filter.active\";\n\nconst getFilterId = (filter: Link): string =>\n filter.href.split(\"/\").reverse()[0];\n\n@Component({\n tag: \"search-filters\",\n styleUrl: \"search-filters.css\",\n shadow: true,\n})\nexport class SearchFilters {\n @Element() el: HTMLElement;\n\n @Prop() filter: SearchSessionFilter | null = null;\n @Prop() basicEventData: BasicEventData;\n\n @State() selectedCategoryId: string | null = null;\n @State() hideFilters: boolean = true;\n\n @Event() vviinnSelectFilter: EventEmitter<SelectFilterEventData>;\n\n private handleFilterSelection(filter: Link): void {\n return this.isFilterSelected(filter)\n ? this.clearSelectedFilter()\n : this.selectFilter(filter);\n }\n\n private selectFilter(filter: Link) {\n this.selectedCategoryId = getFilterId(filter);\n imageSearchState.activeIonLink = filter;\n\n this.vviinnSelectFilter.emit({\n ...this.basicEventData,\n action: \"select\",\n filterName: filter.name,\n });\n }\n\n private clearSelectedFilter() {\n this.selectedCategoryId = null;\n imageSearchState.activeIonLink = undefined;\n this.findSelectedFilter().blur();\n\n this.vviinnSelectFilter.emit({\n ...this.basicEventData,\n action: \"deselect\",\n });\n }\n\n private findSelectedFilter(): HTMLElement {\n return this.el.shadowRoot.querySelector(ACTIVE_FILTER_CLASSNAME);\n }\n\n private toggleFilters() {\n this.hideFilters = !this.hideFilters;\n }\n\n private handleEnter(ev: KeyboardEvent, f: Link) {\n if (ev.key !== \"Enter\") return;\n this.handleFilterSelection(f);\n }\n\n private isFilterSelected(filterLink: Link): boolean {\n return this.selectedCategoryId === getFilterId(filterLink);\n }\n\n render() {\n return (\n <Host exportparts=\"filter, show-more-filters\">\n <div class=\"filters\">\n {this.filter.filters\n .filter((_, i) => (this.hideFilters ? i < FILTERS_COUNT : true))\n .map((f, n) => (\n <div\n role=\"button\"\n tabindex=\"0\"\n part={this.isFilterSelected(f) ? \"filter active\" : \"filter\"}\n class={{\n filter: true,\n active: this.selectedCategoryId === getFilterId(f),\n }}\n style={{ \"animation-delay\": `${n * 10}ms` }}\n onPointerUp={(ev) => {\n ev.stopPropagation();\n this.handleFilterSelection(f);\n }}\n onKeyPress={(ev) => this.handleEnter(ev, f)}\n >\n {this.isFilterSelected(f) ? <CheckIcon /> : null}\n {f.name}\n </div>\n ))}\n\n <div\n class={{\n filter: true,\n \"show-more\": true,\n hidden: this.filter.filters.length <= FILTERS_COUNT,\n active: !this.hideFilters,\n }}\n role=\"button\"\n tabindex=\"0\"\n aria-role=\"button\"\n onClick={() => this.toggleFilters()}\n onKeyPress={(ev) => {\n if (ev.key === \"Enter\") {\n this.toggleFilters();\n }\n }}\n part=\"show-more-filters\"\n >\n {this.hideFilters ? \"Zeige mehr\" : \"Zeige weniger\"}\n </div>\n </div>\n </Host>\n );\n }\n}\n","@import \"../../../variables.css\";\n\n:host {\n --size: 32px;\n --x-position: 0;\n --y-position: 0;\n\n background: rgba(22, 22, 22, 0.5);\n border-radius: 50%;\n border: none;\n cursor: pointer;\n display: block;\n height: var(--size);\n position: absolute;\n transition: opacity 0.25s;\n width: var(--size);\n z-index: 2;\n transform: translate(calc(var(--x-position) - (var(--size) * 0.5)), calc(var(--y-position) - (var(--size) * 0.5)));\n transition: background 0.1 ease-in-out;\n}\n\n:host(:hover) {\n background: rgba(22, 22, 22, 0.75);\n}\n\n:host(.active) {\n background: var(--color-primary, var(--color-primary-system))!important;\n border: 2px solid white;\n}\n\n:host::after {\n --size: 32px;\n border-radius: 50%;\n content: \"\";\n cursor: pointer;\n display: block;\n height: calc(var(--size) * 0.25);\n transform: translate(calc(-50% + var(--size) * 0.5), calc(-50% + var(--size) * 0.5));\n width: calc(var(--size) * 0.25);\n background: white;\n}\n","import {\n Component,\n Host,\n h,\n State,\n Prop,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport { pipe } from \"fp-ts/lib/function\";\nimport * as O from \"fp-ts/lib/Option\";\nimport { ValueObject, foldValueObject } from \"../../../network/ion/ValueObject\";\nimport {\n DetectedObject,\n detectedObjectEq,\n} from \"../../../searchSession/searchSession\";\nimport { fromAlt, scaleWithSized, center } from \"../../../geometry/Rectangle\";\nimport {\n imageSearchState,\n makeRectangularSearchRequest,\n} from \"../../../store/imageSearch.store\";\nimport {\n BasicEventData,\n SelectObjectEventData,\n} from \"../../../recommendation/events\";\n\n@Component({\n tag: \"vviinn-detected-object\",\n styleUrl: \"vviinn-detected-object.css\",\n shadow: true,\n})\nexport class VviinnDetectedObject {\n @Prop() detectedObject: ValueObject<DetectedObject>;\n @Prop() basicEventData: BasicEventData;\n\n @Event() vviinnSelectObject: EventEmitter<SelectObjectEventData>;\n\n private getObjectPosition(): [string, string] {\n return pipe(\n imageSearchState.imageBounds,\n O.map((bounds) => {\n const objectRectangle = fromAlt(\n foldValueObject(this.detectedObject).rectangle\n );\n\n const { x, y } = pipe(objectRectangle, scaleWithSized(bounds), center);\n\n return [`${x}px`, `${y}px`];\n }),\n O.getOrElse(() => [\"0\", \"0\"])\n );\n }\n\n private selectDetectedObject() {\n pipe(\n imageSearchState.imageBounds,\n O.map((bounds) => {\n const rectangle = foldValueObject(this.detectedObject).rectangle;\n const transformedRect = fromAlt(rectangle);\n const scaledRect = scaleWithSized(bounds)(transformedRect);\n\n imageSearchState.detectedObject = this.detectedObject;\n imageSearchState.searchArea = O.some(scaledRect);\n })\n );\n\n makeRectangularSearchRequest();\n this.vviinnSelectObject.emit({\n ...this.basicEventData,\n detectedObject: this.detectedObject,\n });\n }\n\n private isActive(): boolean {\n if (!this.detectedObject) return false;\n if (!imageSearchState.detectedObject) return false;\n\n const thisObject = foldValueObject(this.detectedObject);\n const savedObject = foldValueObject(imageSearchState.detectedObject);\n\n return detectedObjectEq.equals(thisObject, savedObject);\n }\n\n @State() position: [string, string] = [\"0\", \"0\"];\n render() {\n return (\n <Host\n class={{\n active: this.isActive(),\n }}\n onClick={() => this.selectDetectedObject()}\n style={{\n \"--x-position\": this.getObjectPosition()[0],\n \"--y-position\": this.getObjectPosition()[1],\n }}\n ></Host>\n );\n }\n}\n",":host {\n display: grid;\n}\n\nvviinn-error {\n justify-items: center;\n}\n","import { Component, Host, h } from \"@stencil/core\";\n\n@Component({\n tag: \"vviinn-empty-results\",\n styleUrl: \"vviinn-empty-results.css\",\n shadow: true,\n})\nexport class VviinnEmptyResults {\n render() {\n return (\n <Host>\n <vviinn-error>\n <svg\n slot=\"icon\"\n class=\"icon\"\n width=\"32\"\n height=\"32\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M16 2a14 14 0 1 0 0 28 14 14 0 0 0 0-28Zm0 26a12 12 0 1 1 0-24 12 12 0 0 1 0 24Z\"\n fill=\"#525252\"\n />\n <path\n d=\"M17 8h-2v11h2V8Zm-1 14a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z\"\n fill=\"#525252\"\n />\n </svg>\n <h4 slot=\"title\">Leider nichts gefunden</h4>\n <span slot=\"text\">\n Leider konnten wir keine passenden Produkte finden. Bitte versuche\n es mit einem anderen Bildausschnitt noch einmal.\n </span>\n </vviinn-error>\n </Host>\n );\n }\n}\n",":host {\n display: block;\n margin-bottom: 8px;\n position: relative;\n}\n\n:host(:focus) {\n border: 2px solid var(--color-primary);\n}\n\nimg {\n width: 100%;\n height: auto;\n cursor: pointer;\n}\n\n.image-preloader {\n background: rgba(0, 0, 0, 0.25);\n border-radius: 4px;\n bottom: 12px;\n display: none;\n padding: 4px 6px;\n position: absolute;\n right: 12px;\n z-index: 4;\n}\n\nvviinn-preloader {\n --preloader-size: 12px;\n}\n\n@media (max-width: 640px) {\n .image-preloader {\n display: block;\n }\n}\n\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n State,\n} from \"@stencil/core\";\nimport { pipe } from \"fp-ts/lib/function\";\nimport { toFile } from \"../../../Image/toFile\";\nimport {\n imageSearchState,\n processSelectedFile,\n} from \"../../../store/imageSearch.store\";\nimport * as E from \"fp-ts/lib/Either\";\nimport { BasicEventData } from \"../../../recommendation/events\";\n\n@Component({\n tag: \"vviinn-example-image\",\n styleUrl: \"vviinn-example-image.css\",\n shadow: true,\n})\nexport class VviinnExampleImage {\n @Prop() src: string = \"\";\n @Prop() width: number = 0;\n @Prop() height: number = 0;\n @Prop() basicEventData: BasicEventData;\n\n @State() selected: boolean = false;\n\n @Event() vviinnImageUpload: EventEmitter<BasicEventData>;\n @Event() vviinnNoResult: EventEmitter<BasicEventData>;\n\n private async selectImage() {\n this.selected = true;\n\n const file = await toFile(this.src);\n const processResult = await processSelectedFile(file);\n\n pipe(\n processResult,\n E.match(\n () => this.vviinnNoResult.emit(this.basicEventData),\n () => this.vviinnImageUpload.emit(this.basicEventData)\n )\n );\n\n this.selected = false;\n }\n\n private handleKeyPress({ key }: KeyboardEvent) {\n if (key !== \"Enter\" && key !== \" \") return;\n this.selectImage();\n }\n\n private showPreloader(): boolean {\n return (\n (imageSearchState.objectDetectionInProgress ||\n imageSearchState.loading) &&\n this.selected\n );\n }\n\n render() {\n return (\n <Host\n onClick={() => this.selectImage()}\n onKeyUp={(ev: KeyboardEvent) => this.handleKeyPress(ev)}\n >\n {this.showPreloader() ? (\n <div class=\"image-preloader\">\n <vviinn-preloader />\n </div>\n ) : null}\n <img\n src={this.src}\n width={this.width}\n height={this.height}\n tabindex={1}\n />\n </Host>\n );\n }\n}\n",":host {\n}\n\nh3 {\n font-size: 22px;\n font-weight: 600;\n line-height: 32px;\n margin: 0;\n margin-bottom: 16px;\n text-align: center;\n}\n\n.images {\n display: block;\n column-count: 2;\n column-gap: 16px; \n}\n","import {\n Component,\n Host,\n h,\n Event,\n EventEmitter,\n Element,\n Prop,\n} from \"@stencil/core\";\nimport { slotChangeListener } from \"../customized-slots\";\nimport { BasicEventData } from \"../../recommendation/events\";\n\n@Component({\n tag: \"vviinn-example-images\",\n styleUrl: \"vviinn-example-images.css\",\n shadow: true,\n})\nexport class VviinnExampleImages {\n @Element() el: HTMLElement;\n\n @Event() vviinnImageUpload: EventEmitter<BasicEventData>;\n @Event() vviinnNoResult: EventEmitter<BasicEventData>;\n\n @Prop() basicEventData: BasicEventData;\n\n private imagesBlock!: HTMLDivElement;\n\n componentWillLoad() {\n slotChangeListener(this, this.el);\n }\n\n private delegateFocus() {\n const firstSlot = this.imagesBlock.childNodes[0];\n const firstExampleImage = firstSlot.childNodes[0];\n\n (firstExampleImage as HTMLElement).focus();\n }\n\n render() {\n return (\n <Host onFocus={() => this.delegateFocus()}>\n <slot name=\"vviinn-example-images-title\">\n <h3>Mit den Beispielbildern die Suche direkt ausprobieren</h3>\n </slot>\n <div\n class=\"images\"\n ref={(el) => (this.imagesBlock = el as HTMLDivElement)}\n >\n <slot name=\"vviinn-example-images-1\">\n <vviinn-example-image\n width={480}\n height={640}\n src=\"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDEtTC5qcGc=\"\n basicEventData={this.basicEventData}\n />\n </slot>\n <slot name=\"vviinn-example-images-2\">\n <vviinn-example-image\n width={280}\n height={480}\n src=\"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDItTS5qcGc=\"\n basicEventData={this.basicEventData}\n />\n </slot>\n <slot name=\"vviinn-example-images-3\">\n <vviinn-example-image\n width={280}\n height={480}\n src=\"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDMtTS5qcGc=\"\n basicEventData={this.basicEventData}\n />\n </slot>\n <slot name=\"vviinn-example-images-4\">\n <vviinn-example-image\n width={480}\n height={640}\n src=\"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDQtTC5qcGc=\"\n basicEventData={this.basicEventData}\n />\n </slot>\n </div>\n </Host>\n );\n }\n}\n",":host {\n display: block;\n}\n\n:host(::hover) {\n background: whitesmoke;\n}\n\n.visually-hidden {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\nlabel {\n cursor: pointer;\n display: grid;\n width: 100%;\n height: 100%;\n transition: background 0.1s ease-in-out;\n}\n","import {\n Component,\n Host,\n h,\n Event,\n EventEmitter,\n Prop,\n Watch,\n} from \"@stencil/core\";\nimport * as E from \"fp-ts/Either\";\nimport { pipe } from \"fp-ts/lib/function\";\nimport {\n imageSearchState,\n processSelectedFile,\n} from \"../../store/imageSearch.store\";\nimport { BasicEventData } from \"../../recommendation/events\";\n\n/**\n * @part button - button look and feel\n */\n@Component({\n tag: \"vviinn-image-selector\",\n styleUrl: \"vviinn-image-selector.css\",\n shadow: true,\n})\nexport class VviinnImageSelector {\n /** Event fires when user select file */\n @Event() vviinnImageUpload: EventEmitter<BasicEventData>;\n /** Event fires when user select file that no .jpg, .jpeg or png */\n @Event() vviinnNoResult: EventEmitter<BasicEventData>;\n\n @Prop() basicEventData: BasicEventData;\n @Prop() startUpload: boolean;\n @Prop() resetVpsButton: () => void;\n\n private fileInput: HTMLInputElement;\n\n private async handleInputChange(event: Event) {\n const input = event.target as HTMLInputElement;\n const processingResult = await processSelectedFile(input.files[0]);\n\n pipe(\n processingResult,\n E.match(\n () => this.vviinnNoResult.emit(this.basicEventData),\n () => this.vviinnImageUpload.emit(this.basicEventData)\n )\n );\n\n input.value = null;\n }\n\n private isLoading(): boolean {\n return imageSearchState.loading;\n }\n\n @Watch(\"startUpload\")\n startUploadWatcher(upload: boolean) {\n if (upload) {\n this.fileInput.click();\n this.resetVpsButton();\n }\n }\n\n render() {\n return (\n <Host exportparts=\"button\">\n {this.isLoading() ? <vviinn-preloader /> : null}\n {this.isLoading() ? null : (\n <label htmlFor=\"fileInput\" part=\"button\">\n <slot name=\"upload-button-text\">Upload image</slot>\n </label>\n )}\n <input\n id=\"fileInput\"\n class=\"visually-hidden\"\n type=\"file\"\n accept=\"image/*\"\n onChange={(event: Event) => this.handleInputChange(event)}\n ref={(el) => (this.fileInput = el as HTMLInputElement)}\n />\n </Host>\n );\n }\n}\n",":host {\n display: grid;\n position: relative;\n justify-self: center;\n direction: ltr;\n}\n\nimg {\n box-sizing: border-box;\n filter: brightness(60%);\n position: relative;\n user-select: none;\n z-index: -1;\n}\n\n.image-preloader {\n background: rgba(0, 0, 0, 0.25);\n border-radius: 4px;\n bottom: 18px;\n padding: 4px 6px;\n pointer-events: none;\n position: absolute;\n right: 18px;\n z-index: 4;\n}\n\nvviinn-preloader {\n --preloader-size: 12px;\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\nimport { imageSearchState } from \"../../store/imageSearch.store\";\nimport { ValueObject } from \"../../network/ion/ValueObject\";\nimport { DetectedObject } from \"../../searchSession/searchSession\";\nimport { pipe } from \"fp-ts/lib/function\";\nimport * as O from \"fp-ts/lib/Option\";\nimport { sequenceToOption } from \"../../utils/option/option\";\nimport { fromImage, move } from \"../../geometry/Rectangle\";\nimport { dimensionsFromImage, scaleByLargestSide } from \"../../Image/sizing\";\nimport styles from \"./vviinn-image-view.css\";\nimport { BasicEventData } from \"../../recommendation/events\";\n\nconst getImageSizes = (i: HTMLImageElement): [number, number] => {\n const dimensions = dimensionsFromImage(i);\n const resize = scaleByLargestSide(288);\n const newDimensions = resize(dimensions);\n\n const sizes = newDimensions.map((d) => d.size);\n\n return [sizes[0], sizes[1]];\n};\n\n@Component({\n tag: \"vviinn-image-view\",\n shadow: true,\n styles,\n})\nexport class VviinnImageView {\n @Prop() basicEventData: BasicEventData;\n\n handleInitialImageLoad(ev: Event) {\n const target = ev.target as HTMLImageElement;\n const imageBounds = fromImage(target);\n const padding = 12;\n const { x, y } = move(imageBounds, { x: padding, y: padding });\n\n const searchArea = {\n x,\n y,\n width: imageBounds.width - padding * 2,\n height: imageBounds.height - padding * 2,\n };\n\n imageSearchState.imageBounds = O.some(imageBounds);\n imageSearchState.searchArea = O.some(searchArea);\n }\n\n private renderDetectedObject(\n object: ValueObject<DetectedObject>\n ): HTMLElement {\n return (\n <vviinn-detected-object\n detectedObject={object}\n basicEventData={this.basicEventData}\n />\n );\n }\n\n private renderImage(): HTMLImageElement | null {\n return pipe(\n sequenceToOption(imageSearchState.imageUrl, imageSearchState.image),\n O.map(([url, refImage]) => {\n const [width, height] = getImageSizes(refImage);\n\n const image = (\n <img\n decoding=\"async\"\n width={width}\n height={height}\n src={url}\n onLoad={(el) => this.handleInitialImageLoad(el)}\n draggable={false}\n />\n );\n\n return image;\n }),\n O.getOrElse(() => null)\n );\n }\n\n private renderCropper(): HTMLImageCropperElement | null {\n return pipe(\n imageSearchState.imageUrl,\n O.map(() => <image-cropper basicEventData={this.basicEventData} />),\n O.getOrElse(() => null)\n );\n }\n\n render() {\n return (\n <Host>\n {imageSearchState.loading ||\n imageSearchState.objectDetectionInProgress ? (\n <div class=\"image-preloader\">\n <vviinn-preloader />\n </div>\n ) : null}\n <highlight-box />\n {this.renderImage()}\n {this.renderCropper()}\n {imageSearchState.detectedObjects.map((o) =>\n this.renderDetectedObject(o)\n )}\n </Host>\n );\n }\n}\n",":host {\n background: white;\n border-radius: 4px;\n box-sizing: border-box;\n display: grid;\n grid-template-rows: min-content auto;\n max-width: 960px;\n overflow: auto;\n}\n\n@media (max-width: 415px) {\n :host {\n animation-name: fade-in;\n animation-duration: 0.5s;\n animation-fill-mode: forwards;\n }\n\n :host(.closed) {\n animation-name: fade-out;\n animation-fill-mode: none;\n }\n\n .body {\n overflow-y: auto;\n }\n}\n\n@media (max-width: 640px) and (min-width: 415px) {\n :host {\n max-width: 80%;\n }\n}\n\n.head {\n align-items: center;\n border-bottom: 1px solid #f4f4f4;\n display: flex;\n padding: 16px;\n}\n\n.title {\n font-weight: 600;\n font-size: 18px;\n line-height: 24px;\n margin: 0 auto;\n}\n\nbutton {\n appearance: none;\n background: none;\n border: none;\n cursor: pointer;\n display: grid;\n padding: unset;\n}\n\n@keyframes fade-in {\n from {\n transform: translateY(100%);\n }\n\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fade-out {\n from {\n transform: translateY(0);\n }\n\n to {\n transform: translateY(100%);\n }\n}\n","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","@import \"../../variables.css\";\n\n::host {\n display: block;\n}\n\nh3 {\n font-size: 22px;\n font-weight: 600;\n line-height: 32px;\n margin: 0;\n margin-bottom: 16px;\n text-align: center;\n}\n\nvviinn-slide {\n background: #f4f4f4;\n padding: 24px;\n}\n\nsvg {\n padding: 16px 0;\n}\n\n.text {\n display: grid;\n grid-gap: 8px;\n}\n\n.text > h4 {\n color: #161616;\n font-size: 18px;\n font-weight: 600;\n line-height: 24px;\n margin: unset;\n text-align: center;\n}\n\n.text > p {\n color: #525252;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n line-height: 20px;\n margin: unset;\n text-align: center;\n}\n\n.colored {\n fill: var(--color-icons, var(--color-icons-system));\n}\n\n","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",":host {\n align-items: center;\n background: #f4f4f4;\n display: grid;\n grid-template-rows: repeat(2, 1fr);\n justify-items: center;\n padding: 24px;\n width: 100%;\n}\n\nh4 {\n color: #161616;\n font-size: 18px;\n font-weight: 600;\n line-height: 24px;\n margin: unset;\n text-align: center;\n}\n\nsvg {\n padding: 16px 0;\n}\n\np {\n color: #525252;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n line-height: 20px;\n margin: unset;\n text-align: center;\n}\n\n.colored {\n fill: var(--color-icons, var(--color-icons-system));\n}\n\n.text {\n display: grid;\n grid-gap: 8px;\n}\n","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",":host {\n align-items: center;\n background: #f4f4f4;\n display: grid;\n grid-template-rows: repeat(2, 1fr);\n justify-items: center;\n padding: 24px;\n width: 100%;\n}\n\nh4 {\n color: #161616;\n font-size: 18px;\n font-weight: 600;\n line-height: 24px;\n margin: unset;\n text-align: center;\n}\n\nsvg {\n padding: 16px 0;\n}\n\np {\n color: #525252;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n line-height: 20px;\n margin: unset;\n text-align: center;\n}\n\n.colored {\n fill: var(--color-icons, var(--color-icons-system));\n}\n\n.text {\n display: grid;\n grid-gap: 8px;\n}\n","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",":host {\n align-items: center;\n background: #f4f4f4;\n display: grid;\n grid-template-rows: repeat(2, 1fr);\n justify-items: center;\n padding: 24px;\n width: 100%;\n}\n\nh4 {\n color: #161616;\n font-size: 18px;\n font-weight: 600;\n line-height: 24px;\n margin: unset;\n text-align: center;\n}\n\nsvg {\n padding: 16px 0;\n}\n\np {\n color: #525252;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n line-height: 20px;\n margin: unset;\n text-align: center;\n}\n\n.colored {\n fill: var(--color-icons, var(--color-icons-system));\n}\n\n.text {\n display: grid;\n grid-gap: 8px;\n}\n","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",":host {\n animation: fade-in 0.5s ease-in-out;\n background: rgba(0, 0, 0, 0.5);\n display: block;\n height: 100vh;\n left: 0;\n overflow: hidden;\n position: fixed;\n top: 0;\n width: 100vw;\n z-index: 9999;\n}\n\n@keyframes fade-in {\n from {\n opacity: 0.1;\n }\n\n to {\n opacity: 1;\n }\n}\n","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",":host {\n display: none;\n}\n\n:host(.active) {\n display: block;\n}\n\nvviinn-overlay {\n align-items: center;\n display: grid;\n justify-items: center;\n cursor: default;\n}\n\n@media (max-width: 415px) {\n vviinn-modal {\n border-radius: 4px 4px 0 0;\n height: 100vh;\n margin-top: 32px;\n transform: translateY(100%);\n width: 100vw;\n }\n\n vviinn-overlay {\n align-items: end;\n display: grid;\n justify-items: center;\n }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n tag: \"vviinn-overlayed-modal\",\n styleUrl: \"vviinn-overlayed-modal.css\",\n shadow: true,\n})\nexport class VviinnOverlayedModal {\n @Prop() active: boolean = false;\n @Prop() resetState: () => void;\n /** @internal */\n @Prop() buttonElementId?: string;\n /** @internal */\n @Prop() hideBackButton: boolean = false;\n\n @Event() vviinnWidgetClose: EventEmitter<void>;\n\n render() {\n return (\n <Host class={{ active: this.active }}>\n <vviinn-overlay>\n <vviinn-modal\n resetState={this.resetState}\n active={this.active}\n buttonElementId={this.buttonElementId}\n hideBackButton={this.hideBackButton}\n >\n <slot>CONTENT</slot>\n </vviinn-modal>\n </vviinn-overlay>\n </Host>\n );\n }\n}\n",":host {\n display: block;\n background: #F4F4F4;\n padding: 17px;\n}\n\n.content {\n display: grid;\n grid-template-columns: min-content auto;\n grid-gap: 9px;\n}\n\n.content p {\n color: #525252;\n font-size: 12px;\n line-height: 16px;\n margin: unset;\n}\n","import { Component, Host, h, Element } from \"@stencil/core\";\nimport { slotChangeListener } from \"../customized-slots\";\n\n@Component({\n tag: \"vviinn-privacy-badge\",\n styleUrl: \"vviinn-privacy-badge.css\",\n shadow: true,\n})\nexport class VviinnPrivacyBadge {\n @Element() el: HTMLElement;\n\n componentWillLoad() {\n slotChangeListener(this, this.el);\n }\n\n render() {\n return (\n <Host>\n <slot>\n <div class=\"content\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"none\"\n >\n <defs />\n <path\n fill=\"#525252\"\n d=\"M8.5 11V7h-2v1h1v3H6v1h4v-1H8.5zM8 4a.75.75 0 100 1.5A.75.75 0 008 4z\"\n />\n <path\n fill=\"#525252\"\n d=\"M8 15A7 7 0 118 1a7 7 0 010 14zM8 2a6 6 0 100 12A6 6 0 008 2z\"\n />\n </svg>\n <slot name=\"vviinn-privacy-badge-text\">\n <p>\n Durch das Hochladen eines Bildes willigen Sie in die\n Verarbeitung durch unseren Partner Vviinn ein. Das Bild wird\n nach einer Stunde Inaktivität gelöscht.\n </p>\n </slot>\n </div>\n </slot>\n </Host>\n );\n }\n}\n",":host {\n display: block;\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\n\n@Component({\n tag: \"vviinn-server-error\",\n styleUrl: \"vviinn-server-error.css\",\n shadow: true,\n})\nexport class VviinnServerError {\n @Prop() handler: VoidFunction;\n\n render() {\n return (\n <Host>\n <vviinn-error>\n <h4 slot=\"title\">Keine Verbindung</h4>\n <span slot=\"text\">\n Etwas hat leider nicht funktioniert. Bitte prüfen Sie Ihre\n Internetverbindung und laden Sie das Bild noch einmal hoch.\n </span>\n <button slot=\"action\" onClick={this.handler}>\n Erneut versuchen\n </button>\n </vviinn-error>\n </Host>\n );\n }\n}\n",":host {\n display: grid;\n justify-items: center;\n}\n","import { Component, Host, h } from \"@stencil/core\";\n\n@Component({\n tag: \"vviinn-slide\",\n styleUrl: \"vviinn-slide.css\",\n shadow: true,\n})\nexport class VviinnSlide {\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","import { FunctionalComponent, h } from \"@stencil/core\";\nimport { ArrowIcon } from \"../vviinn-icons\";\n\nexport type ArrowKind = \"prev\" | \"next\";\n\ntype ArrowProp = {\n kind: ArrowKind;\n tabindex: number;\n disabled: boolean;\n onClick: () => void;\n onKeyDown: (ev: KeyboardEvent) => void;\n};\n\nconst getStyleMap = (\n data: Partial<ArrowProp>\n): { [className: string]: boolean } => {\n return {\n \"arrow-wrapper\": true,\n [data.kind]: true,\n disabled: data.disabled,\n };\n};\n\nexport const Arrow: FunctionalComponent<ArrowProp> = ({\n kind,\n tabindex,\n disabled,\n onClick,\n onKeyDown,\n}) => (\n <div\n class={getStyleMap({ kind, disabled })}\n onClick={onClick}\n tabindex={tabindex}\n onKeyDown={onKeyDown}\n >\n <ArrowIcon />\n </div>\n);\n","@import \"../../variables.css\";\n\n:host {\n --num-items: 0;\n --position: 0;\n display: grid;\n grid-gap: 20px;\n justify-items: center;\n position: relative;\n}\n\n.items-wrapper {\n overflow: hidden;\n width: 100%;\n}\n\n.items {\n box-sizing: border-box;\n display: grid;\n grid-auto-flow: column;\n grid-template-columns: repeat(var(--num-items), 100%);\n transform: translateX(calc(-100% * var(--position)));\n transition: transform 0.33s ease-in-out;\n}\n\n.controls {\n display: grid;\n grid-gap: 16px;\n grid-template-columns: repeat(var(--num-items), min-content);\n}\n\n.bullet {\n background: #e0e0e0;\n border-radius: 50%;\n box-sizing: border-box;\n cursor: pointer;\n height: 8px;\n width: 8px;\n transition: background 0.1s ease-in-out;\n}\n\n.bullet:hover {\n background: #c6c6c6;\n}\n\n.bullet.active {\n background: var(--color-primary, var(--color-primary-system));\n}\n\n.bullet:active {\n background: transparent;\n border: 2px solid var(--color-primary, var(--color-primary-system));\n}\n\n.arrow-wrapper {\n align-items: center;\n cursor: pointer;\n background: white;\n border: 2px solid white;\n bottom: 0;\n box-sizing: border-box;\n display: grid;\n height: calc(var(--spacer) * 6);\n justify-items: center;\n margin: auto;\n position: absolute;\n top: 0;\n transform: translate3d(0, -50%, 0);\n transition: border 0.25ms ease-in-out;\n width: calc(var(--spacer) * 4);\n}\n\n.arrow-wrapper:active {\n border-color: var(--color-primary, var(--color-primary-system));\n opacity: 0.75;\n}\n\n.arrow-wrapper:focus {\n border-color: var(--color-primary, var(--color-primary-system));\n opacity: 0.5;\n outline: none;\n}\n\n.prev {\n left: 0;\n}\n\n.next {\n right: 0;\n}\n\n.next > svg {\n transform: rotate3d(0, 1, 0, 180deg);\n}\n\n.arrow-wrapper > svg {\n transition: fill 0.25ms ease-in-out;\n fill: #a8a8a8;\n}\n\n.arrow-wrapper:hover > svg {\n fill: #8d8d8d;\n}\n","import { Component, Host, h, Element, State, Prop, Watch } from \"@stencil/core\";\nimport { range } from \"fp-ts/lib/NonEmptyArray\";\nimport { pipe } from \"fp-ts/lib/function\";\nimport * as O from \"fp-ts/lib/Option\";\nimport * as N from \"fp-ts/number\";\nimport { sequenceToOption } from \"../../utils/option/option\";\nimport { Arrow } from \"./arrow\";\n\n@Component({\n tag: \"vviinn-slider\",\n styleUrl: \"vviinn-slider.css\",\n shadow: true,\n})\nexport class VviinnSlider {\n @Element() el: HTMLElement;\n\n @State() elementsCount: number = 0;\n @State() internalPosition: number = 0;\n @State() swipeStartPosition: O.Option<number> = O.none;\n @State() isRTL: boolean = false;\n\n @Prop() showBullets: boolean = true;\n @Prop({ reflect: true }) position: number = 0;\n @Prop() showArrows: boolean = false;\n\n @Watch(\"position\")\n positionWatchHandler(newValue: number) {\n this.internalPosition = newValue;\n this.el.style.setProperty(\n \"--position\",\n `${this.calculatePosition(newValue)}`\n );\n this.setActiveCssClassToSlide(newValue);\n }\n\n componentWillLoad() {\n this.isRTL = document.dir === \"rtl\";\n }\n\n connectedCallback() {\n this.handleDomContentChanges();\n }\n\n private handleDomContentChanges() {\n const items = this.el.querySelectorAll(\"vviinn-slide\");\n this.elementsCount = items.length;\n this.el.style.setProperty(\"--num-items\", `${this.elementsCount}`);\n this.setActiveCssClassToSlide(0);\n }\n\n private setActiveCssClassToSlide(index: number) {\n const items = this.el.querySelectorAll(\"vviinn-slide\");\n items.forEach((i) => i.classList.remove(\"active\"));\n items[index].classList.add(\"active\");\n }\n\n private goToSlide(index: number) {\n this.internalPosition = index;\n this.el.style.setProperty(\"--position\", `${index}`);\n this.setActiveCssClassToSlide(index);\n }\n\n private renderBullets() {\n return this.showBullets ? (\n <div class=\"controls\">\n {range(0, this.elementsCount - 1).map((i) => (\n <div\n class={{\n bullet: true,\n active: i == Math.abs(this.internalPosition) % this.elementsCount,\n }}\n onClick={() => this.goToSlide(i)}\n ></div>\n ))}\n </div>\n ) : null;\n }\n\n private nextSlide() {\n this.internalPosition++;\n\n this.renderSlidePosition();\n }\n\n private prevSlide() {\n const nextPostion = this.internalPosition - 1;\n\n this.internalPosition =\n nextPostion > -1 ? nextPostion : this.elementsCount - 1;\n\n this.renderSlidePosition();\n }\n\n private renderSlidePosition() {\n const position = this.internalPosition % this.elementsCount;\n\n requestAnimationFrame(() => {\n this.el.style.setProperty(\n \"--position\",\n `${this.calculatePosition(position)}`\n );\n });\n }\n\n private calculatePosition(position: number) {\n return this.isRTL ? position * -1 : position;\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (event.key !== \"Space\" && event.key !== \"Enter\") return;\n const target = event.target as HTMLElement;\n const direction = target.className.includes(\"prev\") ? \"prev\" : \"next\";\n\n switch (direction) {\n case \"prev\":\n this.prevSlide();\n break;\n case \"next\":\n this.nextSlide();\n break;\n }\n }\n\n private handleTouchStart(event: TouchEvent) {\n if (!this.showBullets) return;\n\n this.swipeStartPosition = pipe(\n event.touches[0],\n O.fromNullable,\n O.map((t: Touch) => t.clientX)\n );\n }\n\n private handleTouchEnd(event: TouchEvent) {\n if (!this.showBullets) return;\n\n const swipeEndPosition = pipe(\n event.changedTouches[0],\n O.fromNullable,\n O.map((t: Touch) => t.clientX)\n );\n\n pipe(\n sequenceToOption(this.swipeStartPosition, swipeEndPosition),\n O.map(([start, end]) => N.Ord.compare(start, end)),\n O.map((swipeDirection) => {\n switch (swipeDirection) {\n case 1:\n return this.nextSlide();\n case -1:\n return this.prevSlide();\n }\n })\n );\n }\n\n render() {\n return (\n <Host>\n <div class=\"items-wrapper\">\n <div\n class=\"items\"\n onTouchStart={(e: TouchEvent) => this.handleTouchStart(e)}\n onTouchEnd={(e: TouchEvent) => this.handleTouchEnd(e)}\n >\n <slot></slot>\n </div>\n </div>\n {this.showArrows\n ? [\n <Arrow\n kind=\"prev\"\n onClick={() =>\n this.isRTL ? this.nextSlide() : this.prevSlide()\n }\n onKeyDown={(ev) => this.handleKeyDown(ev)}\n tabindex={1}\n disabled={false}\n />,\n <Arrow\n kind=\"next\"\n onClick={() =>\n this.isRTL ? this.prevSlide() : this.nextSlide()\n }\n onKeyDown={(ev) => this.handleKeyDown(ev)}\n tabindex={0}\n disabled={false}\n />,\n ]\n : null}\n {this.renderBullets()}\n </Host>\n );\n }\n}\n",":host {\n align-items: center;\n display: grid;\n justify-items: center;\n grid-gap: 16px;\n}\n\n.vviinn-teaser-text {\n font-size: 28px;\n font-weight: 600;\n line-height: 40px;\n size: 28px;\n text-align: center;\n}\n","import { Component, Host, h, Element } from \"@stencil/core\";\nimport { slotChangeListener } from \"../customized-slots\";\n\n@Component({\n tag: \"vviinn-teaser\",\n styleUrl: \"vviinn-teaser.css\",\n shadow: true,\n})\nexport class VviinnTeaser {\n @Element() el: HTMLElement;\n \n componentWillLoad() {\n slotChangeListener(this, this.el);\n }\n\n render() {\n return (\n <Host>\n <slot>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"64\" height=\"64\" fill=\"none\">\n <defs />\n <path fill=\"#C6C6C6\" d=\"M48 28a11.98 11.98 0 00-9.77 18.942L28 57.172 30.828 60l10.23-10.23A11.994 11.994 0 1048 28zm0 20a8 8 0 118-8 8.009 8.009 0 01-8 8zM34 24a6 6 0 10-6-6 6.006 6.006 0 006 6zm0-8a2 2 0 110 4 2 2 0 010-4z\" />\n <path fill=\"#C6C6C6\" d=\"M24 48H8V35.993L18 26l11.172 11.172L32 34.336 20.828 23.165a4 4 0 00-5.656 0L8 30.336V8h40v12h4V8a4.004 4.004 0 00-4-4H8a4.004 4.004 0 00-4 4v40a4.005 4.005 0 004 4h16v-4z\" />\n </svg>\n <span class=\"vviinn-teaser-text\">\n <slot name=\"vviinn-teaser-text\">\n Finde Produkte auf <br /> einem Foto\n </slot>\n </span>\n </slot>\n </Host>\n );\n }\n}\n",":host {\n display: block;\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\n\n@Component({\n tag: \"vviinn-wrong-format\",\n styleUrl: \"vviinn-wrong-format.css\",\n shadow: true,\n})\nexport class VviinnWrongFormat {\n @Prop() handler: VoidFunction;\n\n render() {\n return (\n <Host>\n <vviinn-error>\n <h4 slot=\"title\">Dateityp wird nicht unterstützt</h4>\n <span slot=\"text\">\n Leider unterstützen wir dieses Format nicht. Bitte laden Sie eine\n .jpg, .png oder .webp Bilddatei hoch.\n </span>\n <button slot=\"action\" onClick={this.handler}>\n Neues Bild hochladen\n </button>\n </vviinn-error>\n </Host>\n );\n }\n}\n"],"version":3}