vviinn-widgets 2.18.21 → 2.19.0

package/www/build/p-c012ef97.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["vviinnButtonCss","VviinnButton","render","h","Host","exportparts","class","this","addStyle","part","VisualSearchIcon"],"sources":["./src/components/vviinn-button/vviinn-button.css?tag=vviinn-button&encapsulation=shadow","./src/components/vviinn-button/vviinn-button.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.open-button {\n  align-items: center;\n  background: rgba(255, 255, 255, 0.8);\n  border-radius: 50%;\n  border: none;\n  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.15);\n  box-sizing: border-box;\n  cursor: pointer;\n  display: grid;\n  height: 40px;\n  justify-items: center;\n  padding: 0;\n  width: 40px;\n  transition: all 0.25s ease-in-out;\n}\n\n.raw-open-button {\n  background: none;\n  border: none;\n  cursor: pointer;\n}\n\n.open-button:hover {\n  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);\n}\n\n.open-button:focus {\n  border: 2px solid rgba(15, 98, 254, 0.5);\n  outline: none;\n}\n\n.open-button:active {\n  background: #f4f4f4;\n  outline: none;\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\nimport { VisualSearchIcon } from \"../vviinn-icons\";\n\n/**\n *\n * @part button - clickable button element\n */\n@Component({\n  tag: \"vviinn-button\",\n  styleUrl: \"vviinn-button.css\",\n  shadow: true,\n})\nexport class VviinnButton {\n  @Prop() addStyle: boolean = true;\n\n  render() {\n    return (\n      <Host exportparts=\"button\">\n        <button\n          class={this.addStyle ? \"open-button\" : \"raw-open-button\"}\n          part=\"button\"\n        >\n          <slot>\n            <VisualSearchIcon />\n          </slot>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAkB,miB,MCYXC,EAAY,M,uCACK,I,CAE5BC,SACE,OACEC,EAACC,EAAI,CAACC,YAAY,UAChBF,EAAA,UACEG,MAAOC,KAAKC,SAAW,cAAgB,kBACvCC,KAAK,UAELN,EAAA,YACEA,EAACO,EAAgB,Q"}

package/www/build/p-c24caccd.js

@@ -0,0 +1,2 @@
+import{h as a}from"./p-fa17e81f.js";const l=()=>a("svg",{width:"12",height:"20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M0 10 10 0l1.4 1.4L2.8 10l8.6 8.6L10 20 0 10Z"}));const h=()=>a("svg",{width:"22",height:"20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M16.567 3H19A3.01 3.01 0 0 1 22 6v7.69h-2V6c0-.55-.451-1-1.001-1h-3.502l-2.03-3H8.543L6.603 5H3.001c-.55 0-1 .45-1 1v11c0 .55.45 1 1 1h5.933v2H3.001A3.01 3.01 0 0 1 0 17V6c0-1.65 1.35-3 3.001-3h2.522l1.94-3h7.074l2.03 3Zm-5.562 3c1.28 0 2.561.48 3.542 1.46h-.01a4.992 4.992 0 0 1 .64 6.29l3.051 3.05-1.41 1.41-3.052-3.05c-.84.55-1.8.83-2.76.83-1.282 0-2.562-.48-3.543-1.46a5.002 5.002 0 0 1 0-7.07A5.026 5.026 0 0 1 11.005 6Zm-2.771 5a2.763 2.763 0 0 0 2.771 2.77A2.763 2.763 0 0 0 13.776 11a2.763 2.763 0 0 0-2.771-2.77A2.763 2.763 0 0 0 8.234 11Z",fill:"#161616"}));const t=()=>a("svg",{xmlns:"http://www.w3.org/2000/svg",width:"120",height:"120",fill:"none"},a("defs",null),a("path",{fill:"#393939",d:"M74.55 20a5.06 5.06 0 014.14 2l4.72 9.32.1.18.11.17A5.07 5.07 0 0087.93 34h13.87c5.07 0 9.2 3.59 9.2 8v50c0 4.41-4.13 8-9.2 8H18.2c-5.07 0-9.2-3.59-9.2-8V42c0-4.41 4.13-8 9.2-8h13.87a5.072 5.072 0 004.31-2.34l.11-.17.1-.18L41.31 22a5.06 5.06 0 014.14-2h29.1zm0-4h-29.1a9 9 0 00-7.6 4L33 29.5a1.13 1.13 0 01-1 .5H18.2C10.91 30 5 35.37 5 42v50c0 6.63 5.91 12 13.2 12h83.6c7.29 0 13.2-5.37 13.2-12V42c0-6.63-5.91-12-13.2-12H87.93a1.13 1.13 0 01-1-.5L82.15 20a9 9 0 00-7.6-4z"}),a("path",{fill:"#393939",d:"M96 46a4 4 0 110 8 4 4 0 010-8zm0-4a8 8 0 100 16.001A8 8 0 0096 42z"}),a("path",{class:"colored",d:"M60 42a24 24 0 100 48.001A24 24 0 0060 42zm12 26H62v10a2 2 0 01-4 0V68H48a2 2 0 010-4h10V54a2 2 0 014 0v10h10a2 2 0 110 4z"}));const s=()=>a("svg",{xmlns:"http://www.w3.org/2000/svg",width:"120",height:"120",fill:"none"},a("defs",null),a("path",{fill:"#393939",d:"M110.35 96.52l-24.8-22.66a6.22 6.22 0 00-8.14-.27l-.09.07-10.57 8.93-18.33-17.88a6.001 6.001 0 00-8.51-.35L8.69 91.49a2 2 0 002.62 3l31.3-27.2a2 2 0 012.233-.359 2 2 0 01.637.479l.1.1 45 43.9a2.005 2.005 0 002.83-.03 2.003 2.003 0 00-.03-2.83L69.63 85.39l10.22-8.63a2.3 2.3 0 013 .07l24.77 22.65c.377.343.871.529 1.38.52a2 2 0 001.35-3.48zM75 31a10 10 0 110 20 10 10 0 010-20zm0-4a14 14 0 100 28 14 14 0 000-28z"}),a("path",{class:"colored",d:"M12 36H8V20A12 12 0 0120 8h16v4H20a8 8 0 00-8 8v16zM112 36h-4V20a8.001 8.001 0 00-8-8H84V8h16a11.998 11.998 0 0112 12v16zM36 112H20a11.998 11.998 0 01-12-12V84h4v16a8 8 0 008 8h16v4zM100 112H84v-4h16a8 8 0 008-8V84h4v16c0 3.183-1.264 6.235-3.515 8.485A11.996 11.996 0 01100 112z"}));const v=()=>a("svg",{xmlns:"http://www.w3.org/2000/svg",width:"120",height:"120",fill:"none"},a("defs",null),a("path",{class:"colored",d:"M84.09 43.24a.53.53 0 00-.29-.48L60.28 29.4a.522.522 0 00-.27-.07.531.531 0 00-.28.07L36.2 42.76a.54.54 0 000 1l23.53 13.3a.54.54 0 00.55 0L83.8 43.72a.53.53 0 00.29-.48zM57.28 61.23L33.73 47.88a.569.569 0 00-.85.48V75a.54.54 0 00.29.48L56.72 88.8a.56.56 0 00.56 0 .53.53 0 00.28-.48V61.71a.56.56 0 00-.28-.48zM86.84 47.88a.63.63 0 00-.29-.08.55.55 0 00-.28.08L62.73 61.23a.56.56 0 00-.28.48v26.61a.53.53 0 00.28.48.56.56 0 00.56 0l23.54-13.29a.54.54 0 00.29-.48V48.36a.55.55 0 00-.28-.48z"}),a("path",{class:"colored",d:"M100 7.94H20a12 12 0 00-12 12v80a11.998 11.998 0 0012 12h80c3.183 0 6.235-1.264 8.485-3.515A11.996 11.996 0 00112 99.94v-80a11.998 11.998 0 00-12-12zm-8 69.24a1.69 1.69 0 01-.85 1.45l-30.31 17.1a1.77 1.77 0 01-1.67 0l-30.32-17.1a1.689 1.689 0 01-.85-1.45V42.82a1.66 1.66 0 01.85-1.45l30.32-17.21a1.71 1.71 0 011.67 0l30.31 17.21a1.67 1.67 0 01.85 1.45v34.36z"}));const c=()=>a("svg",{width:"14",height:"11",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M5 10.414 0 5.413 1.413 4 5 7.586 12.585 0 14 1.415l-9 8.999Z",fill:"var(--color-primary, var(--color-primary-system))"}));const o=()=>a("svg",{width:"9",height:"16",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"m9 8-7.895 8L0 14.88 6.79 8 0 1.12 1.105 0 9 8Z"}));const w=()=>a("svg",{width:"20",height:"20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M5 2C3.35 2 2 3.35 2 5v2H0V5c0-2.76 2.24-5 5-5h2v2H5Zm5 3c1.28 0 2.56.48 3.54 1.46h-.01a4.994 4.994 0 0 1 .64 6.29l3.05 3.05-1.41 1.41-3.05-3.05c-.84.55-1.8.83-2.76.83a4.98 4.98 0 0 1-3.54-1.46 5.003 5.003 0 0 1 0-7.07C7.44 5.49 8.72 5 10 5Zm-2.77 5c0 .74.29 1.44.81 1.96s1.22.81 1.96.81 1.44-.29 1.96-.81.81-1.22.81-1.96-.29-1.44-.81-1.96-1.22-.81-1.96-.81-1.44.29-1.96.81-.81 1.22-.81 1.96ZM2 15v-2H0v2c0 2.76 2.24 5 5 5h2v-2H5c-1.65 0-3-1.35-3-3ZM13 0h2c2.76 0 5 2.24 5 5v2h-2V5c0-1.65-1.35-3-3-3h-2V0Z",fill:"#161616"}));const e=()=>a("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("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:"#161616"}));export{l as A,o as C,t as O,w as V,h as a,e as b,c,s as d,v as e};
+//# sourceMappingURL=p-c24caccd.js.map

package/www/build/p-c24caccd.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ArrowIcon","h","width","height","fill","xmlns","d","CameraIcon","OnboardingCard1Icon","class","OnboardingCard2Icon","OnboardingCard3Icon","CheckIcon","ChevronIcon","VisualSearchIcon","CrossIcon","viewBox"],"sources":["./src/components/vviinn-icons/index.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\n\nexport const ArrowIcon = () => (\n  <svg width=\"12\" height=\"20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M0 10 10 0l1.4 1.4L2.8 10l8.6 8.6L10 20 0 10Z\" />\n  </svg>\n);\n\nexport const CameraIcon = () => (\n  <svg width=\"22\" height=\"20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M16.567 3H19A3.01 3.01 0 0 1 22 6v7.69h-2V6c0-.55-.451-1-1.001-1h-3.502l-2.03-3H8.543L6.603 5H3.001c-.55 0-1 .45-1 1v11c0 .55.45 1 1 1h5.933v2H3.001A3.01 3.01 0 0 1 0 17V6c0-1.65 1.35-3 3.001-3h2.522l1.94-3h7.074l2.03 3Zm-5.562 3c1.28 0 2.561.48 3.542 1.46h-.01a4.992 4.992 0 0 1 .64 6.29l3.051 3.05-1.41 1.41-3.052-3.05c-.84.55-1.8.83-2.76.83-1.282 0-2.562-.48-3.543-1.46a5.002 5.002 0 0 1 0-7.07A5.026 5.026 0 0 1 11.005 6Zm-2.771 5a2.763 2.763 0 0 0 2.771 2.77A2.763 2.763 0 0 0 13.776 11a2.763 2.763 0 0 0-2.771-2.77A2.763 2.763 0 0 0 8.234 11Z\"\n      fill=\"#161616\"\n    />\n  </svg>\n);\n\nexport const OnboardingCard1Icon = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"120\" height=\"120\" fill=\"none\">\n    <defs />\n    <path\n      fill=\"#393939\"\n      d=\"M74.55 20a5.06 5.06 0 014.14 2l4.72 9.32.1.18.11.17A5.07 5.07 0 0087.93 34h13.87c5.07 0 9.2 3.59 9.2 8v50c0 4.41-4.13 8-9.2 8H18.2c-5.07 0-9.2-3.59-9.2-8V42c0-4.41 4.13-8 9.2-8h13.87a5.072 5.072 0 004.31-2.34l.11-.17.1-.18L41.31 22a5.06 5.06 0 014.14-2h29.1zm0-4h-29.1a9 9 0 00-7.6 4L33 29.5a1.13 1.13 0 01-1 .5H18.2C10.91 30 5 35.37 5 42v50c0 6.63 5.91 12 13.2 12h83.6c7.29 0 13.2-5.37 13.2-12V42c0-6.63-5.91-12-13.2-12H87.93a1.13 1.13 0 01-1-.5L82.15 20a9 9 0 00-7.6-4z\"\n    />\n    <path\n      fill=\"#393939\"\n      d=\"M96 46a4 4 0 110 8 4 4 0 010-8zm0-4a8 8 0 100 16.001A8 8 0 0096 42z\"\n    />\n    <path\n      class=\"colored\"\n      d=\"M60 42a24 24 0 100 48.001A24 24 0 0060 42zm12 26H62v10a2 2 0 01-4 0V68H48a2 2 0 010-4h10V54a2 2 0 014 0v10h10a2 2 0 110 4z\"\n    />\n  </svg>\n);\n\nexport const OnboardingCard2Icon = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"120\" height=\"120\" fill=\"none\">\n    <defs />\n    <path\n      fill=\"#393939\"\n      d=\"M110.35 96.52l-24.8-22.66a6.22 6.22 0 00-8.14-.27l-.09.07-10.57 8.93-18.33-17.88a6.001 6.001 0 00-8.51-.35L8.69 91.49a2 2 0 002.62 3l31.3-27.2a2 2 0 012.233-.359 2 2 0 01.637.479l.1.1 45 43.9a2.005 2.005 0 002.83-.03 2.003 2.003 0 00-.03-2.83L69.63 85.39l10.22-8.63a2.3 2.3 0 013 .07l24.77 22.65c.377.343.871.529 1.38.52a2 2 0 001.35-3.48zM75 31a10 10 0 110 20 10 10 0 010-20zm0-4a14 14 0 100 28 14 14 0 000-28z\"\n    />\n    <path\n      class=\"colored\"\n      d=\"M12 36H8V20A12 12 0 0120 8h16v4H20a8 8 0 00-8 8v16zM112 36h-4V20a8.001 8.001 0 00-8-8H84V8h16a11.998 11.998 0 0112 12v16zM36 112H20a11.998 11.998 0 01-12-12V84h4v16a8 8 0 008 8h16v4zM100 112H84v-4h16a8 8 0 008-8V84h4v16c0 3.183-1.264 6.235-3.515 8.485A11.996 11.996 0 01100 112z\"\n    />\n  </svg>\n);\n\nexport const OnboardingCard3Icon = () => (\n  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"120\" height=\"120\" fill=\"none\">\n    <defs />\n    <path\n      class=\"colored\"\n      d=\"M84.09 43.24a.53.53 0 00-.29-.48L60.28 29.4a.522.522 0 00-.27-.07.531.531 0 00-.28.07L36.2 42.76a.54.54 0 000 1l23.53 13.3a.54.54 0 00.55 0L83.8 43.72a.53.53 0 00.29-.48zM57.28 61.23L33.73 47.88a.569.569 0 00-.85.48V75a.54.54 0 00.29.48L56.72 88.8a.56.56 0 00.56 0 .53.53 0 00.28-.48V61.71a.56.56 0 00-.28-.48zM86.84 47.88a.63.63 0 00-.29-.08.55.55 0 00-.28.08L62.73 61.23a.56.56 0 00-.28.48v26.61a.53.53 0 00.28.48.56.56 0 00.56 0l23.54-13.29a.54.54 0 00.29-.48V48.36a.55.55 0 00-.28-.48z\"\n    />\n    <path\n      class=\"colored\"\n      d=\"M100 7.94H20a12 12 0 00-12 12v80a11.998 11.998 0 0012 12h80c3.183 0 6.235-1.264 8.485-3.515A11.996 11.996 0 00112 99.94v-80a11.998 11.998 0 00-12-12zm-8 69.24a1.69 1.69 0 01-.85 1.45l-30.31 17.1a1.77 1.77 0 01-1.67 0l-30.32-17.1a1.689 1.689 0 01-.85-1.45V42.82a1.66 1.66 0 01.85-1.45l30.32-17.21a1.71 1.71 0 011.67 0l30.31 17.21a1.67 1.67 0 01.85 1.45v34.36z\"\n    />\n  </svg>\n);\n\nexport const CheckIcon = () => (\n  <svg width=\"14\" height=\"11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M5 10.414 0 5.413 1.413 4 5 7.586 12.585 0 14 1.415l-9 8.999Z\"\n      fill=\"var(--color-primary, var(--color-primary-system))\"\n    />\n  </svg>\n);\n\nexport const LoaderIcon = () => (\n  <svg\n    width=\"100%\"\n    height=\"100%\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 28 28\"\n  >\n    <path fill=\"#fff\" d=\"M23,14a9,9,0,1,1-9-9V2A12,12,0,1,0,26,14Z\" />\n  </svg>\n);\n\nexport const ChevronIcon = () => (\n  <svg width=\"9\" height=\"16\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"m9 8-7.895 8L0 14.88 6.79 8 0 1.12 1.105 0 9 8Z\" />\n  </svg>\n);\n\nexport const VisualSearchIcon = () => (\n  <svg width=\"20\" height=\"20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M5 2C3.35 2 2 3.35 2 5v2H0V5c0-2.76 2.24-5 5-5h2v2H5Zm5 3c1.28 0 2.56.48 3.54 1.46h-.01a4.994 4.994 0 0 1 .64 6.29l3.05 3.05-1.41 1.41-3.05-3.05c-.84.55-1.8.83-2.76.83a4.98 4.98 0 0 1-3.54-1.46 5.003 5.003 0 0 1 0-7.07C7.44 5.49 8.72 5 10 5Zm-2.77 5c0 .74.29 1.44.81 1.96s1.22.81 1.96.81 1.44-.29 1.96-.81.81-1.22.81-1.96-.29-1.44-.81-1.96-1.22-.81-1.96-.81-1.44.29-1.96.81-.81 1.22-.81 1.96ZM2 15v-2H0v2c0 2.76 2.24 5 5 5h2v-2H5c-1.65 0-3-1.35-3-3ZM13 0h2c2.76 0 5 2.24 5 5v2h-2V5c0-1.65-1.35-3-3-3h-2V0Z\"\n      fill=\"#161616\"\n    />\n  </svg>\n);\n\nexport const CrossIcon = () => (\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=\"#161616\"\n    />\n  </svg>\n);\n"],"mappings":"0CAEaA,EAAY,IACvBC,EAAA,OAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAC5CJ,EAAA,QAAMK,EAAE,mD,MAICC,EAAa,IACxBN,EAAA,OAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAC5CJ,EAAA,oBACY,UAAS,YACT,UACVK,EAAE,uiBACFF,KAAK,a,MAKEI,EAAsB,IACjCP,EAAA,OAAKI,MAAM,6BAA6BH,MAAM,MAAMC,OAAO,MAAMC,KAAK,QACpEH,EAAA,aACAA,EAAA,QACEG,KAAK,UACLE,EAAE,4dAEJL,EAAA,QACEG,KAAK,UACLE,EAAE,wEAEJL,EAAA,QACEQ,MAAM,UACNH,EAAE,gI,MAKKI,EAAsB,IACjCT,EAAA,OAAKI,MAAM,6BAA6BH,MAAM,MAAMC,OAAO,MAAMC,KAAK,QACpEH,EAAA,aACAA,EAAA,QACEG,KAAK,UACLE,EAAE,gaAEJL,EAAA,QACEQ,MAAM,UACNH,EAAE,4R,MAKKK,EAAsB,IACjCV,EAAA,OAAKI,MAAM,6BAA6BH,MAAM,MAAMC,OAAO,MAAMC,KAAK,QACpEH,EAAA,aACAA,EAAA,QACEQ,MAAM,UACNH,EAAE,8eAEJL,EAAA,QACEQ,MAAM,UACNH,EAAE,4W,MAKKM,EAAY,IACvBX,EAAA,OAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAC5CJ,EAAA,QACEK,EAAE,gEACFF,KAAK,uD,MAgBES,EAAc,IACzBZ,EAAA,OAAKC,MAAM,IAAIC,OAAO,KAAKE,MAAM,8BAC/BJ,EAAA,QAAMK,EAAE,qD,MAICQ,EAAmB,IAC9Bb,EAAA,OAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAC5CJ,EAAA,oBACY,UAAS,YACT,UACVK,EAAE,4fACFF,KAAK,a,MAKEW,EAAY,IACvBd,EAAA,OACEC,MAAM,KACNC,OAAO,KACPa,QAAQ,YACRZ,KAAK,OACLC,MAAM,8BAENJ,EAAA,QACEK,EAAE,2FACFF,KAAK,oB"}

package/www/build/p-d20a9a96.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as i,c as n,g as s}from"./p-fa17e81f.js";import{O as r,n as o,i as a,a as l,t as c,o as d,p as h,q as p,r as u,u as m,v as g,w as v,x as f,y as x,E as b,z as w,B as y,C as k,D as z,N as C}from"./p-3abc679c.js";import{p as L,q as _,u as D}from"./p-3b99c62d.js";import{c as F,O as j,d as S,e as E,A as W}from"./p-c24caccd.js";import{s as M}from"./p-53eacbe3.js";import{c as B}from"./p-18fd769b.js";var I={equals:function(t,e){return t===e}};var $={equals:I.equals,compare:function(t,e){return t<e?-1:t>e?1:0}};const O=(t,e)=>{const i=`${t.y}px`;const n=`${t.x}px`;const s=`${e.width-(t.x+t.width)}px`;const r=`${e.height-(t.y+t.height)}px`;return{top:i,right:s,bottom:r,left:n}};const P=t=>`inset(${t.top} ${t.right} ${t.bottom} ${t.left})`;const G=(t,e)=>P(O(t,e));const T=':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)}}';const A=class{constructor(e){t(this,e)}getInsetValue(){return L(o(a.searchArea,a.imageBounds),r.map((([t,e])=>G(t,e))),r.getOrElse((()=>"")))}renderImage(){return L(o(a.imageUrl,a.imageBounds),r.map((([t,i])=>e("img",{src:t,width:i.width,height:i.height,style:{"clip-path":`${this.getInsetValue()}`}}))),r.getOrElse((()=>"")))}render(){return e(i,null,this.renderImage())}};A.style=T;const H=t=>t.target;const V=":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 K=40;const Z=class{constructor(e){t(this,e);this.vviinnImageCrop=n(this,"vviinnImageCrop",7);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)}disconnectedCallback(){this.resizeObserver.disconnect()}handleHandlerMove(t){t.preventDefault();t.stopPropagation();const e=D(t);const i=_.concat(e,this.mouseStartPoint);const n={position:i,direction:this.handlerMoveDirection};l.pipe(a.searchArea,r.map((t=>{const i=c(t,n);if(this.outOfBounds(i))return;a.searchArea=r.some(i);this.mouseStartPoint=e;a.detectedObject=undefined})))}outOfBounds(t){return t.width<K||t.height<K||t.x<0||t.y<0||this.bounds.height-(t.y+t.height)<0||this.bounds.width-(t.x+t.width)<0}handleCropperMove(t){t.preventDefault();t.stopPropagation();const e=D(t);const i=_.concat(e,this.mouseStartPoint);l.pipe(a.searchArea,r.map((t=>{const n=d(t,i);if(n.x<0||n.y<0||this.bounds.height-(n.y+n.height)<0||this.bounds.width-(n.x+n.width)<0)return;a.detectedObject=undefined;a.searchArea=r.some(n);this.mouseStartPoint=e})))}handlePointerDown(t){t.stopPropagation();this.mouseStartPoint=D(t);const e=H(t);if(e.localName==="cropper-handler"){this.handlerMoveDirection=e.handler.direction;this.pointerMoveListener=this.handleHandlerMove.bind(this)}else{this.pointerMoveListener=this.handleCropperMove.bind(this)}this.pointerReleaseListener=this.handleSearchAreaRelease.bind(this);this.el.addEventListener("pointermove",this.pointerMoveListener);window.addEventListener("pointerup",this.pointerReleaseListener,{once:true})}handleSearchAreaRelease(){this.el.removeEventListener("pointermove",this.pointerMoveListener);document.removeEventListener("pointerup",this.pointerReleaseListener);this.mouseStartPoint=undefined;h();this.vviinnImageCrop.emit(this.basicEventData)}getStyleMap(){return l.pipe(a.searchArea,r.map((t=>({width:`${t.width}px`,height:`${t.height}px`,transform:`translate3d(${t.x}px, ${t.y}px, 0)`,cursor:this.handleMove?"move":"default"}))),r.getOrElse((()=>({}))))}render(){return e(i,{exportparts:"handle, e-resize, n-resize, ne-resize, nw-resize, s-resize, se-resize, sw-resize, w-resize"},e("div",{class:{"crop-area":true,active:this.handleMove,disabled:this.disabled},draggable:false,style:this.getStyleMap(),onContextMenu:()=>false,onPointerDown:t=>this.handlePointerDown(t)},a.cropperHandlers.map((t=>e("cropper-handler",{disabled:this.disabled,handler:t,onPointerDown:t=>this.handlePointerDown(t)})))))}get el(){return s(this)}};Z.style=V;const q=":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 N=5;const R=".filter.active";const U=t=>t.href.split("/").reverse()[0];const Y=class{constructor(e){t(this,e);this.vviinnSelectFilter=n(this,"vviinnSelectFilter",7);this.filter=null;this.basicEventData=undefined;this.selectedCategoryId=null;this.hideFilters=true}handleFilterSelection(t){return this.isFilterSelected(t)?this.clearSelectedFilter():this.selectFilter(t)}selectFilter(t){this.selectedCategoryId=U(t);a.activeIonLink=t;this.vviinnSelectFilter.emit(Object.assign(Object.assign({},this.basicEventData),{action:"select",filterName:t.name}))}clearSelectedFilter(){this.selectedCategoryId=null;a.activeIonLink=undefined;this.findSelectedFilter().blur();this.vviinnSelectFilter.emit(Object.assign(Object.assign({},this.basicEventData),{action:"deselect"}))}findSelectedFilter(){return this.el.shadowRoot.querySelector(R)}toggleFilters(){this.hideFilters=!this.hideFilters}handleEnter(t,e){if(t.key!=="Enter")return;this.handleFilterSelection(e)}isFilterSelected(t){return this.selectedCategoryId===U(t)}render(){return e(i,{exportparts:"filter, show-more-filters"},e("div",{class:"filters"},this.filter.filters.filter(((t,e)=>this.hideFilters?e<N:true)).map(((t,i)=>e("div",{role:"button",tabindex:"0",part:this.isFilterSelected(t)?"filter active":"filter",class:{filter:true,active:this.selectedCategoryId===U(t)},style:{"animation-delay":`${i*10}ms`},onPointerUp:e=>{e.stopPropagation();this.handleFilterSelection(t)},onKeyPress:e=>this.handleEnter(e,t)},this.isFilterSelected(t)?e(F,null):null,t.name))),e("div",{class:{filter:true,"show-more":true,hidden:this.filter.filters.length<=N,active:!this.hideFilters},role:"button",tabindex:"0","aria-role":"button",onClick:()=>this.toggleFilters(),onKeyPress:t=>{if(t.key==="Enter"){this.toggleFilters()}},part:"show-more-filters"},this.hideFilters?"Zeige mehr":"Zeige weniger")))}get el(){return s(this)}};Y.style=q;const X=':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}';const Q=class{constructor(e){t(this,e);this.vviinnSelectObject=n(this,"vviinnSelectObject",7);this.detectedObject=undefined;this.basicEventData=undefined;this.position=["0","0"]}getObjectPosition(){return l.pipe(a.imageBounds,r.map((t=>{const e=p(u(this.detectedObject).rectangle);const{x:i,y:n}=l.pipe(e,m(t),g);return[`${i}px`,`${n}px`]})),r.getOrElse((()=>["0","0"])))}selectDetectedObject(){l.pipe(a.imageBounds,r.map((t=>{const e=u(this.detectedObject).rectangle;const i=p(e);const n=m(t)(i);a.detectedObject=this.detectedObject;a.searchArea=r.some(n)})));h();this.vviinnSelectObject.emit(Object.assign(Object.assign({},this.basicEventData),{detectedObject:this.detectedObject}))}isActive(){if(!this.detectedObject)return false;if(!a.detectedObject)return false;const t=u(this.detectedObject);const e=u(a.detectedObject);return v.equals(t,e)}render(){return e(i,{class:{active:this.isActive()},onClick:()=>this.selectDetectedObject(),style:{"--x-position":this.getObjectPosition()[0],"--y-position":this.getObjectPosition()[1]}})}};Q.style=X;const J=":host{display:grid}vviinn-error{justify-items:center}";const tt=class{constructor(e){t(this,e)}render(){return e(i,null,e("vviinn-error",null,e("svg",{slot:"icon",class:"icon",width:"32",height:"32",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("path",{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",fill:"#525252"}),e("path",{d:"M17 8h-2v11h2V8Zm-1 14a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z",fill:"#525252"})),e("h4",{slot:"title"},"Leider nichts gefunden"),e("span",{slot:"text"},"Leider konnten wir keine passenden Produkte finden. Bitte versuche es mit einem anderen Bildausschnitt noch einmal.")))}};tt.style=J;const et=":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}}";const it=class{constructor(e){t(this,e);this.vviinnImageUpload=n(this,"vviinnImageUpload",7);this.vviinnNoResult=n(this,"vviinnNoResult",7);this.src="";this.width=0;this.height=0;this.basicEventData=undefined;this.selected=false}async selectImage(){this.selected=true;const t=await f(this.src);const e=await x(t);l.pipe(e,b.match((()=>this.vviinnNoResult.emit(this.basicEventData)),(()=>this.vviinnImageUpload.emit(this.basicEventData))));this.selected=false}handleKeyPress({key:t}){if(t!=="Enter"&&t!==" ")return;this.selectImage()}showPreloader(){return(a.objectDetectionInProgress||a.loading)&&this.selected}render(){return e(i,{onClick:()=>this.selectImage(),onKeyUp:t=>this.handleKeyPress(t)},this.showPreloader()?e("div",{class:"image-preloader"},e("vviinn-preloader",null)):null,e("img",{src:this.src,width:this.width,height:this.height,tabindex:1}))}};it.style=et;const nt="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}";const st=class{constructor(e){t(this,e);this.vviinnImageUpload=n(this,"vviinnImageUpload",7);this.vviinnNoResult=n(this,"vviinnNoResult",7);this.basicEventData=undefined}componentWillLoad(){M(this,this.el)}delegateFocus(){const t=this.imagesBlock.childNodes[0];const e=t.childNodes[0];e.focus()}render(){return e(i,{onFocus:()=>this.delegateFocus()},e("slot",{name:"vviinn-example-images-title"},e("h3",null,"Mit den Beispielbildern die Suche direkt ausprobieren")),e("div",{class:"images",ref:t=>this.imagesBlock=t},e("slot",{name:"vviinn-example-images-1"},e("vviinn-example-image",{width:480,height:640,src:"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDEtTC5qcGc=",basicEventData:this.basicEventData})),e("slot",{name:"vviinn-example-images-2"},e("vviinn-example-image",{width:280,height:480,src:"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDItTS5qcGc=",basicEventData:this.basicEventData})),e("slot",{name:"vviinn-example-images-3"},e("vviinn-example-image",{width:280,height:480,src:"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDMtTS5qcGc=",basicEventData:this.basicEventData})),e("slot",{name:"vviinn-example-images-4"},e("vviinn-example-image",{width:480,height:640,src:"https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDQtTC5qcGc=",basicEventData:this.basicEventData}))))}get el(){return s(this)}};st.style=nt;const rt=":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}";const ot=class{constructor(e){t(this,e);this.vviinnImageUpload=n(this,"vviinnImageUpload",7);this.vviinnNoResult=n(this,"vviinnNoResult",7);this.basicEventData=undefined;this.startUpload=undefined;this.resetVpsButton=undefined}async handleInputChange(t){const e=t.target;const i=await x(e.files[0]);l.pipe(i,w((()=>this.vviinnNoResult.emit(this.basicEventData)),(()=>this.vviinnImageUpload.emit(this.basicEventData))));e.value=null}isLoading(){return a.loading}startUploadWatcher(t){if(t){this.fileInput.click();this.resetVpsButton()}}render(){return e(i,{exportparts:"button"},this.isLoading()?e("vviinn-preloader",null):null,this.isLoading()?null:e("label",{htmlFor:"fileInput",part:"button"},e("slot",{name:"upload-button-text"},"Upload image")),e("input",{id:"fileInput",class:"visually-hidden",type:"file",accept:"image/*",onChange:t=>this.handleInputChange(t),ref:t=>this.fileInput=t}))}static get watchers(){return{startUpload:["startUploadWatcher"]}}};ot.style=rt;const at=":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 lt=t=>{const e=k(t);const i=z(288);const n=i(e);const s=n.map((t=>t.size));return[s[0],s[1]]};const ct=class{constructor(e){t(this,e);this.basicEventData=undefined}handleInitialImageLoad(t){const e=t.target;const i=y(e);const n=12;const{x:s,y:o}=d(i,{x:n,y:n});const l={x:s,y:o,width:i.width-n*2,height:i.height-n*2};a.imageBounds=r.some(i);a.searchArea=r.some(l)}renderDetectedObject(t){return e("vviinn-detected-object",{detectedObject:t,basicEventData:this.basicEventData})}renderImage(){return l.pipe(o(a.imageUrl,a.image),r.map((([t,i])=>{const[n,s]=lt(i);const r=e("img",{decoding:"async",width:n,height:s,src:t,onLoad:t=>this.handleInitialImageLoad(t),draggable:false});return r})),r.getOrElse((()=>null)))}renderCropper(){return l.pipe(a.imageUrl,r.map((()=>e("image-cropper",{basicEventData:this.basicEventData}))),r.getOrElse((()=>null)))}render(){return e(i,null,a.loading||a.objectDetectionInProgress?e("div",{class:"image-preloader"},e("vviinn-preloader",null)):null,e("highlight-box",null),this.renderImage(),this.renderCropper(),a.detectedObjects.map((t=>this.renderDetectedObject(t))))}};ct.style=at;const dt=":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%)}}";const ht=class{constructor(e){t(this,e);this.vviinnWidgetClose=n(this,"vviinnWidgetClose",7);this.active=false;this.resetState=undefined;this.buttonElementId=undefined;this.hideBackButton=false;this.slider=false}componentWillLoad(){M(this,this.el)}close(){this.active=false;setTimeout((()=>{this.vviinnWidgetClose.emit({widgetType:"VPS",campaignTypeId:"VPS",campaignTypeName:B["VPS"],widgetId:this.buttonElementId})}),this.slider?500:0)}handleAnimationEnd(t){if(t.animationName!=="fade-in")return;this.slider=true}render(){return e(i,{exportparts:"secondary-action, title, close-button",class:{closed:!this.active},onAnimationEnd:t=>this.handleAnimationEnd(t)},e("div",{class:"head"},!this.hideBackButton&&e("button",{part:"secondary-action",onClick:()=>this.resetState()},e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("path",{d:"M20.25 12H3.75",stroke:"#161616","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M10.5 5.25L3.75 12L10.5 18.75",stroke:"#161616","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}))),e("div",{class:"title",part:"title"},e("slot",{name:"vviinn-image-search-modal-title"},"Bildsuche")),e("button",{onClick:()=>this.close(),class:"close-button",part:"close-button"},e("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("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"})))),e("div",{class:"body"},e("slot",null)))}get el(){return s(this)}};ht.style=dt;const pt=":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))}";const ut=class{constructor(e){t(this,e)}componentWillLoad(){M(this,this.el)}render(){return e(i,null,e("slot",{name:"vviinn-onboarding-title"},e("h3",null,"So funktioniert es")),e("vviinn-slider",{showArrows:true},e("vviinn-slide",null,e("vviinn-onboarding-card-1",null)),e("vviinn-slide",null,e("vviinn-onboarding-card-2",null)),e("vviinn-slide",null,e("vviinn-onboarding-card-3",null))))}get el(){return s(this)}};ut.style=pt;const mt=":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}";const gt=class{constructor(e){t(this,e)}componentWillLoad(){M(this,this.el)}render(){return e(i,null,e("slot",{name:"onboarding-card-1-icon"},e(j,null)),e("slot",{name:"onboarding-card-1-text"},e("div",{class:"text"},e("h4",null,"Starte die Bildsuche"),e("p",null,"Lade ein Bild aus Deiner Galerie hoch oder fotografiere ein Produkt mit Deiner Kamera."))))}get el(){return s(this)}};gt.style=mt;const vt=":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}";const ft=class{constructor(e){t(this,e)}componentWillLoad(){M(this,this.el)}render(){return e(i,null,e("slot",{name:"onboarding-card-2-icon"},e(S,null)),e("slot",{name:"onboarding-card-2-text"},e("div",{class:"text"},e("h4",null,"Verfeiner deine Suche"),e("p",null,"Du kannst den Bildrahmen selber festlegen und so die Produkte genau auswählen."))))}get el(){return s(this)}};ft.style=vt;const xt=":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}";const bt=class{constructor(e){t(this,e)}componentWillLoad(){M(this,this.el)}render(){return e(i,null,e("slot",{name:"onboarding-card-3-icon"},e(E,null)),e("slot",{name:"onboarding-card-3-text"},e("div",{class:"text"},e("h4",null,"Ohne Hintergrund"),e("p",null,"Die besten Ergebnisse erhältst Du, wenn das gesuchte Objekt mit einfarbigem und hellem Hintergrund zu sehen ist."))))}get el(){return s(this)}};bt.style=xt;const wt=":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}}";const yt=class{constructor(e){t(this,e)}render(){return e(i,null,e("slot",null))}};yt.style=wt;const kt=":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}}";const zt=class{constructor(e){t(this,e);this.vviinnWidgetClose=n(this,"vviinnWidgetClose",7);this.active=false;this.resetState=undefined;this.buttonElementId=undefined;this.hideBackButton=false}render(){return e(i,{class:{active:this.active}},e("vviinn-overlay",null,e("vviinn-modal",{resetState:this.resetState,active:this.active,buttonElementId:this.buttonElementId,hideBackButton:this.hideBackButton},e("slot",null,"CONTENT"))))}};zt.style=kt;const Ct=":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}";const Lt=class{constructor(e){t(this,e)}componentWillLoad(){M(this,this.el)}render(){return e(i,null,e("slot",null,e("div",{class:"content"},e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",fill:"none"},e("defs",null),e("path",{fill:"#525252",d:"M8.5 11V7h-2v1h1v3H6v1h4v-1H8.5zM8 4a.75.75 0 100 1.5A.75.75 0 008 4z"}),e("path",{fill:"#525252",d:"M8 15A7 7 0 118 1a7 7 0 010 14zM8 2a6 6 0 100 12A6 6 0 008 2z"})),e("slot",{name:"vviinn-privacy-badge-text"},e("p",null,"Durch das Hochladen eines Bildes willigen Sie in die Verarbeitung durch unseren Partner Vviinn ein. Das Bild wird nach einer Stunde Inaktivität gelöscht.")))))}get el(){return s(this)}};Lt.style=Ct;const _t=":host{display:block}";const Dt=class{constructor(e){t(this,e);this.handler=undefined}render(){return e(i,null,e("vviinn-error",null,e("h4",{slot:"title"},"Keine Verbindung"),e("span",{slot:"text"},"Etwas hat leider nicht funktioniert. Bitte prüfen Sie Ihre Internetverbindung und laden Sie das Bild noch einmal hoch."),e("button",{slot:"action",onClick:this.handler},"Erneut versuchen")))}};Dt.style=_t;const Ft=":host{display:grid;justify-items:center}";const jt=class{constructor(e){t(this,e)}render(){return e(i,null,e("slot",null))}};jt.style=Ft;const St=t=>({"arrow-wrapper":true,[t.kind]:true,disabled:t.disabled});const Et=({kind:t,tabindex:i,disabled:n,onClick:s,onKeyDown:r})=>e("div",{class:St({kind:t,disabled:n}),onClick:s,tabindex:i,onKeyDown:r},e(W,null));const Wt=":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}";const Mt=class{constructor(e){t(this,e);this.elementsCount=0;this.internalPosition=0;this.swipeStartPosition=r.none;this.isRTL=false;this.showBullets=true;this.position=0;this.showArrows=false}positionWatchHandler(t){this.internalPosition=t;this.el.style.setProperty("--position",`${this.calculatePosition(t)}`);this.setActiveCssClassToSlide(t)}componentWillLoad(){this.isRTL=document.dir==="rtl"}connectedCallback(){this.handleDomContentChanges()}handleDomContentChanges(){const t=this.el.querySelectorAll("vviinn-slide");this.elementsCount=t.length;this.el.style.setProperty("--num-items",`${this.elementsCount}`);this.setActiveCssClassToSlide(0)}setActiveCssClassToSlide(t){const e=this.el.querySelectorAll("vviinn-slide");e.forEach((t=>t.classList.remove("active")));e[t].classList.add("active")}goToSlide(t){this.internalPosition=t;this.el.style.setProperty("--position",`${t}`);this.setActiveCssClassToSlide(t)}renderBullets(){return this.showBullets?e("div",{class:"controls"},C.range(0,this.elementsCount-1).map((t=>e("div",{class:{bullet:true,active:t==Math.abs(this.internalPosition)%this.elementsCount},onClick:()=>this.goToSlide(t)})))):null}nextSlide(){this.internalPosition++;this.renderSlidePosition()}prevSlide(){const t=this.internalPosition-1;this.internalPosition=t>-1?t:this.elementsCount-1;this.renderSlidePosition()}renderSlidePosition(){const t=this.internalPosition%this.elementsCount;requestAnimationFrame((()=>{this.el.style.setProperty("--position",`${this.calculatePosition(t)}`)}))}calculatePosition(t){return this.isRTL?t*-1:t}handleKeyDown(t){if(t.key!=="Space"&&t.key!=="Enter")return;const e=t.target;const i=e.className.includes("prev")?"prev":"next";switch(i){case"prev":this.prevSlide();break;case"next":this.nextSlide();break}}handleTouchStart(t){if(!this.showBullets)return;this.swipeStartPosition=l.pipe(t.touches[0],r.fromNullable,r.map((t=>t.clientX)))}handleTouchEnd(t){if(!this.showBullets)return;const e=l.pipe(t.changedTouches[0],r.fromNullable,r.map((t=>t.clientX)));l.pipe(o(this.swipeStartPosition,e),r.map((([t,e])=>$.compare(t,e))),r.map((t=>{switch(t){case 1:return this.nextSlide();case-1:return this.prevSlide()}})))}render(){return e(i,null,e("div",{class:"items-wrapper"},e("div",{class:"items",onTouchStart:t=>this.handleTouchStart(t),onTouchEnd:t=>this.handleTouchEnd(t)},e("slot",null))),this.showArrows?[e(Et,{kind:"prev",onClick:()=>this.isRTL?this.nextSlide():this.prevSlide(),onKeyDown:t=>this.handleKeyDown(t),tabindex:1,disabled:false}),e(Et,{kind:"next",onClick:()=>this.isRTL?this.prevSlide():this.nextSlide(),onKeyDown:t=>this.handleKeyDown(t),tabindex:0,disabled:false})]:null,this.renderBullets())}get el(){return s(this)}static get watchers(){return{position:["positionWatchHandler"]}}};Mt.style=Wt;const Bt=":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}";const It=class{constructor(e){t(this,e)}componentWillLoad(){M(this,this.el)}render(){return e(i,null,e("slot",null,e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"64",height:"64",fill:"none"},e("defs",null),e("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"}),e("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"})),e("span",{class:"vviinn-teaser-text"},e("slot",{name:"vviinn-teaser-text"},"Finde Produkte auf ",e("br",null)," einem Foto"))))}get el(){return s(this)}};It.style=Bt;const $t=":host{display:block}";const Ot=class{constructor(e){t(this,e);this.handler=undefined}render(){return e(i,null,e("vviinn-error",null,e("h4",{slot:"title"},"Dateityp wird nicht unterstützt"),e("span",{slot:"text"},"Leider unterstützen wir dieses Format nicht. Bitte laden Sie eine .jpg, .png oder .webp Bilddatei hoch."),e("button",{slot:"action",onClick:this.handler},"Neues Bild hochladen")))}};Ot.style=$t;export{A as highlight_box,Z as image_cropper,Y as search_filters,Q as vviinn_detected_object,tt as vviinn_empty_results,it as vviinn_example_image,st as vviinn_example_images,ot as vviinn_image_selector,ct as vviinn_image_view,ht as vviinn_modal,ut as vviinn_onboarding,gt as vviinn_onboarding_card_1,ft as vviinn_onboarding_card_2,bt as vviinn_onboarding_card_3,yt as vviinn_overlay,zt as vviinn_overlayed_modal,Lt as vviinn_privacy_badge,Dt as vviinn_server_error,jt as vviinn_slide,Mt as vviinn_slider,It as vviinn_teaser,Ot as vviinn_wrong_format};
+//# sourceMappingURL=p-d20a9a96.entry.js.map

package/www/build/p-d20a9a96.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Eq","equals","first","second","Ord","compare","fromRectangle","shape","target","top","y","left","x","right","width","bottom","height","printClip","clip","getClipValue","highlightBoxCss","HighlightBox","getInsetValue","pipe","sequenceToOption","imageSearchState","searchArea","imageBounds","O.map","selection","image","O.getOrElse","renderImage","imageUrl","url","bounds","h","src","style","this","render","Host","findTarget","ev","imageCropperCss","MIN_SEARCHAREA_SIZE","ImageCropper","mouseStartPoint","undefined","resizeObserver","ResizeObserver","el","getBoundingClientRect","componentDidLoad","observe","disconnectedCallback","disconnect","handleHandlerMove","event","preventDefault","stopPropagation","destination","fromMouseEvent","distance","pointDiffSemigroup","concat","transformedHandler","position","direction","handlerMoveDirection","area","newSearchArea","transform","outOfBounds","O.some","detectedObject","handleCropperMove","move","handlePointerDown","localName","handler","pointerMoveListener","bind","pointerReleaseListener","handleSearchAreaRelease","addEventListener","window","once","removeEventListener","document","makeRectangularSearchRequest","vviinnImageCrop","emit","basicEventData","getStyleMap","rectangle","cursor","handleMove","exportparts","class","active","disabled","draggable","onContextMenu","onPointerDown","cropperHandlers","map","searchFiltersCss","FILTERS_COUNT","ACTIVE_FILTER_CLASSNAME","getFilterId","filter","href","split","reverse","SearchFilters","handleFilterSelection","isFilterSelected","clearSelectedFilter","selectFilter","selectedCategoryId","activeIonLink","vviinnSelectFilter","Object","assign","action","filterName","name","findSelectedFilter","blur","shadowRoot","querySelector","toggleFilters","hideFilters","handleEnter","f","key","filterLink","filters","_","i","n","role","tabindex","part","onPointerUp","onKeyPress","CheckIcon","hidden","length","onClick","vviinnDetectedObjectCss","VviinnDetectedObject","getObjectPosition","objectRectangle","fromAlt","foldValueObject","scaleWithSized","center","selectDetectedObject","transformedRect","scaledRect","vviinnSelectObject","isActive","thisObject","savedObject","detectedObjectEq","vviinnEmptyResultsCss","VviinnEmptyResults","slot","fill","xmlns","d","vviinnExampleImageCss","VviinnExampleImage","async","selected","file","toFile","processResult","processSelectedFile","E.match","vviinnNoResult","vviinnImageUpload","handleKeyPress","selectImage","showPreloader","objectDetectionInProgress","loading","onKeyUp","vviinnExampleImagesCss","VviinnExampleImages","componentWillLoad","slotChangeListener","delegateFocus","firstSlot","imagesBlock","childNodes","firstExampleImage","focus","onFocus","ref","vviinnImageSelectorCss","VviinnImageSelector","input","processingResult","files","value","isLoading","startUploadWatcher","upload","fileInput","click","resetVpsButton","htmlFor","id","type","accept","onChange","handleInputChange","vviinnImageViewCss","getImageSizes","dimensions","dimensionsFromImage","resize","scaleByLargestSide","newDimensions","sizes","size","VviinnImageView","handleInitialImageLoad","fromImage","padding","renderDetectedObject","object","refImage","decoding","onLoad","renderCropper","detectedObjects","o","vviinnModalCss","VviinnModal","close","setTimeout","vviinnWidgetClose","widgetType","campaignTypeId","campaignTypeName","campaignTypeNames","widgetId","buttonElementId","slider","handleAnimationEnd","animationName","closed","onAnimationEnd","hideBackButton","resetState","viewBox","stroke","vviinnOnboardingCss","VviinnOnboarding","showArrows","onboardingCardCss","VviinnOnboardingCard1","OnboardingCard1Icon","VviinnOnboardingCard2","OnboardingCard2Icon","VviinnOnboardingCard3","OnboardingCard3Icon","vviinnOverlayCss","VviinnOverlay","vviinnOverlayedModalCss","VviinnOverlayedModal","vviinnPrivacyBadgeCss","VviinnPrivacyBadge","vviinnServerErrorCss","VviinnServerError","vviinnSlideCss","VviinnSlide","data","kind","Arrow","onKeyDown","ArrowIcon","vviinnSliderCss","VviinnSlider","O.none","positionWatchHandler","newValue","internalPosition","setProperty","calculatePosition","setActiveCssClassToSlide","isRTL","dir","connectedCallback","handleDomContentChanges","items","querySelectorAll","elementsCount","index","forEach","classList","remove","add","goToSlide","renderBullets","showBullets","range","bullet","Math","abs","nextSlide","renderSlidePosition","prevSlide","nextPostion","requestAnimationFrame","handleKeyDown","className","includes","handleTouchStart","swipeStartPosition","touches","O.fromNullable","t","clientX","handleTouchEnd","swipeEndPosition","changedTouches","start","end","N.Ord","swipeDirection","onTouchStart","e","onTouchEnd","vviinnTeaserCss","VviinnTeaser","vviinnWrongFormatCss","VviinnWrongFormat"],"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"],"mappings":"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"}

package/www/build/p-d95d7c38.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as s,H as e,g as n}from"./p-fa17e81f.js";import{a}from"./p-c24caccd.js";import{S as h}from"./p-53eacbe3.js";import{c as o}from"./p-18fd769b.js";const r=":host{display:block}";const d=class{constructor(s){i(this,s);this.globalSlotsChanged=t(this,"globalSlotsChanged",7);this.vviinnWidgetOpen=t(this,"vviinnWidgetOpen",7);this.vviinnImageUpload=t(this,"vviinnImageUpload",7);this.vviinnNoResult=t(this,"vviinnNoResult",7);this.vviinnWidgetLoad=t(this,"vviinnWidgetLoad",7);this.vviinnWidgetClose=t(this,"vviinnWidgetClose",7);this.vviinnProductClick=t(this,"vviinnProductClick",7);this.vviinnProductView=t(this,"vviinnProductView",7);this.vviinnProductLoad=t(this,"vviinnProductLoad",7);this.vviinnImageCrop=t(this,"vviinnImageCrop",7);this.vviinnSelectObject=t(this,"vviinnSelectObject",7);this.vviinnSelectFilter=t(this,"vviinnSelectFilter",7);this.getBasicEventData=()=>({widgetType:"VPS",campaignTypeId:"VPS",campaignTypeName:o["VPS"],widgetId:this.el.id});this.token=undefined;this.currencySign="€";this.locale="de-DE";this.campaignId=undefined;this.addStyle=false;this.mode="modal";this.apiPath=undefined;this.buttonPressed=false}handleModalClosed(){this.buttonPressed=false}componentDidLoad(){const i=this.el.querySelectorAll("[slot]");this.globalSlotsChanged.emit(Array.from(i))}handleClick(){this.buttonPressed=true}resetButton(){this.buttonPressed=false}render(){return s(e,{tabindex:"0",role:"button"},s("vviinn-button",{onClick:()=>{this.handleClick()},addStyle:this.addStyle,part:"vviinn-button"},s("slot",null,s(a,null))),s(h,null),s("vviinn-vps-widget",{mode:this.mode,"currency-sign":this.currencySign,token:this.token,locale:this.locale,apiPath:this.apiPath,exportparts:"brand, deeplink, currency, image, image-link, price-amount-sale, price-amount-outdated, price-amount-regular, price-container, price-outdated, price-regular, price-sale, price-prefix, title, product-card, example-images",campaignId:this.campaignId,showingInButton:true,buttonPressed:this.buttonPressed,resetVpsButton:this.resetButton.bind(this),buttonElementId:this.el.id}))}get el(){return n(this)}};d.style=r;export{d as vviinn_vps_button};
+//# sourceMappingURL=p-d95d7c38.entry.js.map

package/www/build/p-d95d7c38.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["vviinnVpsButtonCss","VviinnVpsButton","this","getBasicEventData","widgetType","campaignTypeId","campaignTypeName","campaignTypeNames","widgetId","el","id","handleModalClosed","buttonPressed","componentDidLoad","slots","querySelectorAll","globalSlotsChanged","emit","Array","from","handleClick","resetButton","render","h","Host","tabindex","role","onClick","addStyle","part","CameraIcon","SlotSkeleton","mode","currencySign","token","locale","apiPath","exportparts","campaignId","showingInButton","resetVpsButton","bind","buttonElementId"],"sources":["./src/components/vviinn-vps-button/vviinn-vps-button.css?tag=vviinn-vps-button&encapsulation=shadow","./src/components/vviinn-vps-button/vviinn-vps-button.tsx"],"sourcesContent":[":host {\n  /**\n    * @prop --color-primary: set color of search button and bullets in onboarding block\n    * @prop --color-primary-hover: set color of search button and bullets in onboarding block on mouse hover\n    * @prop --color-icons: set fill color of svg icons in onboarding block \n    */\n\n  display: block;\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Listen,\n  Element,\n  Event,\n  EventEmitter,\n} from \"@stencil/core\";\nimport { CameraIcon } from \"../vviinn-icons\";\nimport { SlotSkeleton } from \"../customized-slots\";\nimport { BasicEventData } from \"../../recommendation/events\";\nimport { campaignTypeNames } from \"../../campaign/Campaign\";\n\n/**\n * @slot vviinn-onboarding-title - Title of onboarding section\n * @slot onboarding-card-1-icon - Icon (or other graphics) on first onboarding slide\n * @slot onboarding-card-1-text - Text content of first onboarding slide\n * @slot onboarding-card-2-icon - Icon (or other graphics) on second onboarding slide\n * @slot onboarding-card-2-text - Text content of second onboarding slide\n * @slot onboarding-card-3-icon - Icon (or other graphics) on third onboarding slide\n * @slot onboarding-card-3-text - Text content of third onboarding slide\n * @slot vviinn-example-images-title - Header of example images block\n * @slot vviinn-example-images-1 - First image in example images block\n * @slot vviinn-example-images-2 - Second image in example images block\n * @slot vviinn-example-images-3 - Third image in example images block\n * @slot vviinn-example-images-4 - Fourth image in example images block\n * @slot vviinn-teaser-text - Text on widget's main screen\n * @slot vviinn-image-upload-button-text - Title of upload button\n * @slot vviinn-privacy-badge-text - Text content of privacy notification block\n * @slot vviinn-image-search-modal-title - Image search modal title\n *\n * @part brand - product brand.\n * @part deeplink - anchor element for title. Rendered only if \"deeplink\" property filled.\n * @part image - product image.\n * @part image-link - anchor element for image. Rendered only if \"deeplink\" property filled.\n * @part price-amount-sale - numeric part of price.\n * @part price-amount-outdated - numeric part of price.\n * @part price-amount-regular - numeric part of price.\n * @part price-container - block contains all prices.\n * @part price-outdated - renders inside price-container when \"sale-price\" property filled. Contains regular price.\n * @part price-regular - renders inside price-container when \"sale-price\" property is empty.\n * @part price-sale - renders inside price-container when \"sale-price\" property filled. Contains sale price.\n * @part title - product title\n * @part example-images - example images block\n * @part button - button\n */\n@Component({\n  tag: \"vviinn-vps-button\",\n  styleUrl: \"vviinn-vps-button.css\",\n  shadow: true,\n})\nexport class VviinnVpsButton {\n  @Element() el: HTMLElement;\n  /** vviinn customer token */\n  @Prop() token: string;\n  /** Currency sign will shown after price */\n  @Prop() currencySign: string = \"€\";\n  /** Locale for currency formatting */\n  @Prop() locale: string = \"de-DE\";\n  /** Campaign using for visual search */\n  @Prop() campaignId?: string;\n  /** Add style to the button */\n  @Prop() addStyle: boolean = false;\n  /** Add style to the button */\n  @Prop() mode: \"modal\" | \"upload\" = \"modal\";\n\n  /** @internal */\n  @Prop() apiPath: string | undefined;\n\n  @State() buttonPressed: boolean = false;\n\n  /** @internal */\n  @Event({ bubbles: true, composed: true })\n  globalSlotsChanged: EventEmitter<any>;\n\n  /** Event emitted when vps-button clicked */\n  @Event() vviinnWidgetOpen: EventEmitter<BasicEventData>;\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  // List to show in the Storybook:\n  @Event() vviinnWidgetLoad: EventEmitter;\n  @Event() vviinnWidgetClose: EventEmitter;\n  @Event() vviinnProductClick: EventEmitter;\n  @Event() vviinnProductView: EventEmitter;\n  @Event() vviinnProductLoad: EventEmitter;\n  @Event() vviinnImageCrop: EventEmitter;\n  @Event() vviinnSelectObject: EventEmitter;\n  @Event() vviinnSelectFilter: EventEmitter;\n\n  getBasicEventData = (): BasicEventData => {\n    return {\n      widgetType: \"VPS\",\n      campaignTypeId: \"VPS\",\n      campaignTypeName: campaignTypeNames[\"VPS\"],\n      widgetId: this.el.id,\n    };\n  };\n\n  @Listen(\"vviinnWidgetClose\")\n  handleModalClosed() {\n    this.buttonPressed = false;\n  }\n\n  componentDidLoad() {\n    const slots = this.el.querySelectorAll(\"[slot]\");\n    this.globalSlotsChanged.emit(Array.from(slots));\n  }\n\n  private handleClick() {\n    this.buttonPressed = true;\n  }\n\n  private resetButton() {\n    this.buttonPressed = false;\n  }\n\n  render() {\n    return (\n      <Host tabindex=\"0\" role=\"button\">\n        <vviinn-button\n          onClick={() => {\n            this.handleClick();\n          }}\n          addStyle={this.addStyle}\n          part=\"vviinn-button\"\n        >\n          <slot>\n            <CameraIcon />\n          </slot>\n        </vviinn-button>\n\n        <SlotSkeleton />\n        <vviinn-vps-widget\n          mode={this.mode}\n          currency-sign={this.currencySign}\n          token={this.token}\n          locale={this.locale}\n          apiPath={this.apiPath}\n          exportparts=\"brand, deeplink, currency, image, image-link, price-amount-sale, price-amount-outdated, price-amount-regular, price-container, price-outdated, price-regular, price-sale, price-prefix, title, product-card, example-images\"\n          campaignId={this.campaignId}\n          showingInButton={true}\n          buttonPressed={this.buttonPressed}\n          resetVpsButton={this.resetButton.bind(this)}\n          buttonElementId={this.el.id}\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"uKAAA,MAAMA,EAAqB,uB,MCsDdC,EAAe,M,+oBAyC1BC,KAAAC,kBAAoB,KACX,CACLC,WAAY,MACZC,eAAgB,MAChBC,iBAAkBC,EAAkB,OACpCC,SAAUN,KAAKO,GAAGC,K,uCAzCS,I,YAEN,Q,wCAIG,M,UAEO,Q,0CAKD,K,CAiClCC,oBACET,KAAKU,cAAgB,K,CAGvBC,mBACE,MAAMC,EAAQZ,KAAKO,GAAGM,iBAAiB,UACvCb,KAAKc,mBAAmBC,KAAKC,MAAMC,KAAKL,G,CAGlCM,cACNlB,KAAKU,cAAgB,I,CAGfS,cACNnB,KAAKU,cAAgB,K,CAGvBU,SACE,OACEC,EAACC,EAAI,CAACC,SAAS,IAAIC,KAAK,UACtBH,EAAA,iBACEI,QAAS,KACPzB,KAAKkB,aAAa,EAEpBQ,SAAU1B,KAAK0B,SACfC,KAAK,iBAELN,EAAA,YACEA,EAACO,EAAU,QAIfP,EAACQ,EAAY,MACbR,EAAA,qBACES,KAAM9B,KAAK8B,KAAI,gBACA9B,KAAK+B,aACpBC,MAAOhC,KAAKgC,MACZC,OAAQjC,KAAKiC,OACbC,QAASlC,KAAKkC,QACdC,YAAY,8NACZC,WAAYpC,KAAKoC,WACjBC,gBAAiB,KACjB3B,cAAeV,KAAKU,cACpB4B,eAAgBtC,KAAKmB,YAAYoB,KAAKvC,MACtCwC,gBAAiBxC,KAAKO,GAAGC,K"}

package/www/build/p-e5e67a5f.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as n}from"./p-fa17e81f.js";const r=":host{background:#F4F4F4;border-radius:8px;display:grid;grid-gap:20px;padding:24px;text-align:center}::slotted(svg){display:grid;align-self:center}::slotted(h4){margin:unset;font-weight:600;font-size:18px;line-height:24px}::slotted(span){font-size:14px;line-height:20px}::slotted(button){-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:var(--color-primary, var(--color-primary-system));font-weight:600;font-size:16px;line-height:20px;cursor:pointer}";const o=class{constructor(t){e(this,t)}render(){return t(n,null,t("slot",{name:"icon"}),t("slot",{name:"title"}),t("slot",{name:"text"}),t("slot",{name:"action"}))}};o.style=r;export{o as vviinn_error};
+//# sourceMappingURL=p-e5e67a5f.entry.js.map

package/www/build/p-e5e67a5f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["vviinnErrorCss","VviinnError","render","h","Host","name"],"sources":["./src/components/vviinn-error/vviinn-error.css?tag=vviinn-error&encapsulation=shadow","./src/components/vviinn-error/vviinn-error.tsx"],"sourcesContent":[":host {\n  background: #F4F4F4;\n  border-radius: 8px;\n  display: grid;\n  grid-gap: 20px;\n  padding: 24px;\n  text-align: center;\n}\n\n::slotted(svg) {\n  display: grid;\n  align-self: center;\n}\n\n::slotted(h4) {\n  margin: unset;\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 24px;\n}\n\n::slotted(span) {\n  font-size: 14px;\n  line-height: 20px;\n}\n\n::slotted(button) {\n  appearance: none;\n  border: none;\n  background: transparent;\n  color: var(--color-primary, var(--color-primary-system));\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 20px;\n  cursor: pointer;\n}\n","import { Component, Host, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"vviinn-error\",\n  styleUrl: \"vviinn-error.css\",\n  shadow: true,\n})\nexport class VviinnError {\n  render() {\n    return (\n      <Host>\n        <slot name=\"icon\"></slot>\n        <slot name=\"title\"></slot>\n        <slot name=\"text\"></slot>\n        <slot name=\"action\"></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAiB,0f,MCOVC,EAAW,M,yBACtBC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,QAAME,KAAK,SACXF,EAAA,QAAME,KAAK,UACXF,EAAA,QAAME,KAAK,SACXF,EAAA,QAAME,KAAK,W"}

package/www/build/p-e6d67de3.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as o,H as t}from"./p-fa17e81f.js";import{v as r}from"./p-3b99c62d.js";const s=":host{--size:20px;background:transparent;border:4px solid white;box-sizing:content-box;display:block;height:var(--size);touch-action:none;position:absolute;width:var(--size);z-index:4;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host(.disabled){opacity:0.25}:host(.nw-resize){border-bottom:none;border-right:none;top:0;left:0}:host(.ne-resize){border-left:none;border-bottom:none;right:0;top:0}:host(.sw-resize){border-right:none;border-top:none;left:0;bottom:0}:host(.se-resize){border-left:none;border-top:none;bottom:0;right:0}";const n=class{constructor(o){e(this,o);this.handler=undefined;this.disabled=false}render(){return o(t,{part:`handle ${r(this.handler.direction)}`,class:{disabled:this.disabled,[r(this.handler.direction)]:true},style:{"--size":"20px",cursor:r(this.handler.direction)},draggable:false})}};n.style=s;export{n as cropper_handler};
+//# sourceMappingURL=p-e6d67de3.entry.js.map

package/www/build/p-e6d67de3.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cropperHandlerCss","CropperHandler","render","h","Host","part","getCursorValue","this","handler","direction","class","disabled","style","cursor","draggable"],"sources":["./src/components/image-search/image-view/image-cropper/cropper-handler/cropper-handler.css?tag=cropper-handler&encapsulation=shadow","./src/components/image-search/image-view/image-cropper/cropper-handler/cropper-handler.tsx"],"sourcesContent":[":host {\n  --size: 20px;\n\n  background: transparent;\n  border: 4px solid white;\n  box-sizing: content-box;\n  display: block;\n  height: var(--size);\n  touch-action: none;\n  position: absolute;\n  width: var(--size);\n  z-index: 4;\n  user-select: none;\n}\n\n:host(.disabled) {\n  opacity: 0.25;\n}\n\n:host(.nw-resize) {\n  border-bottom: none;\n  border-right: none;\n  top: 0;\n  left: 0;\n}\n\n:host(.ne-resize) {\n  border-left: none;\n  border-bottom: none;\n  right: 0;\n  top: 0;\n}\n\n:host(.sw-resize) {\n  border-right: none;\n  border-top: none;\n  left: 0;\n  bottom: 0;\n}\n\n:host(.se-resize) {\n  border-left: none;\n  border-top: none;\n  bottom: 0;\n  right: 0;\n}\n","import { Component, Host, h, Prop } from \"@stencil/core\";\nimport { Handler, getCursorValue } from \"../../../../../cropper/Handler\";\nimport styles from \"./cropper-handler.css\";\n\n@Component({\n  tag: \"cropper-handler\",\n  shadow: true,\n  styles,\n})\nexport class CropperHandler {\n  @Prop() handler: Handler;\n  @Prop() disabled: boolean = false;\n\n  render() {\n    return (\n      <Host\n        part={`handle ${getCursorValue(this.handler.direction)}`}\n        class={{\n          disabled: this.disabled,\n          [getCursorValue(this.handler.direction)]: true,\n        }}\n        style={{\n          \"--size\": \"20px\",\n          cursor: getCursorValue(this.handler.direction),\n        }}\n        draggable={false}\n      ></Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAoB,yiB,MCSbC,EAAc,M,8DAEG,K,CAE5BC,SACE,OACEC,EAACC,EAAI,CACHC,KAAM,UAAUC,EAAeC,KAAKC,QAAQC,aAC5CC,MAAO,CACLC,SAAUJ,KAAKI,SACf,CAACL,EAAeC,KAAKC,QAAQC,YAAa,MAE5CG,MAAO,CACL,SAAU,OACVC,OAAQP,EAAeC,KAAKC,QAAQC,YAEtCK,UAAW,O"}

package/www/build/p-fa17e81f.js

@@ -0,0 +1,3 @@
+const t="vviinn-widgets";let n;let e;let s=false;let o=null;let l=false;const c=(t,n="")=>{{return()=>{}}};const i=(t,n)=>{{return()=>{}}};const f="{visibility:hidden}.hydrated{visibility:inherit}";const r={};const u="http://www.w3.org/2000/svg";const a="http://www.w3.org/1999/xhtml";const d=t=>t!=null;const h=t=>{t=typeof t;return t==="object"||t==="function"};function p(t){var n,e,s;return(s=(e=(n=t.head)===null||n===void 0?void 0:n.querySelector('meta[name="csp-nonce"]'))===null||e===void 0?void 0:e.getAttribute("content"))!==null&&s!==void 0?s:undefined}const y=(t,n,...e)=>{let s=null;let o=null;let l=false;let c=false;const i=[];const f=n=>{for(let e=0;e<n.length;e++){s=n[e];if(Array.isArray(s)){f(s)}else if(s!=null&&typeof s!=="boolean"){if(l=typeof t!=="function"&&!h(s)){s=String(s)}if(l&&c){i[i.length-1].t+=s}else{i.push(l?m(null,s):s)}c=l}}};f(e);if(n){if(n.key){o=n.key}{const t=n.className||n.class;if(t){n.class=typeof t!=="object"?t:Object.keys(t).filter((n=>t[n])).join(" ")}}}if(typeof t==="function"){return t(n===null?{}:n,i,w)}const r=m(t,null);r.o=n;if(i.length>0){r.l=i}{r.i=o}return r};const m=(t,n)=>{const e={u:0,h:t,t:n,p:null,l:null};{e.o=null}{e.i=null}return e};const b={};const $=t=>t&&t.h===b;const w={forEach:(t,n)=>t.map(v).forEach(n),map:(t,n)=>t.map(v).map(n).map(g)};const v=t=>({vattrs:t.o,vchildren:t.l,vkey:t.i,vname:t.m,vtag:t.h,vtext:t.t});const g=t=>{if(typeof t.vtag==="function"){const n=Object.assign({},t.vattrs);if(t.vkey){n.key=t.vkey}if(t.vname){n.name=t.vname}return y(t.vtag,n,...t.vchildren||[])}const n=m(t.vtag,t.vtext);n.o=t.vattrs;n.l=t.vchildren;n.i=t.vkey;n.m=t.vname;return n};const S=(t,n)=>{if(t!=null&&!h(t)){if(n&4){return t==="false"?false:t===""||!!t}if(n&2){return parseFloat(t)}if(n&1){return String(t)}return t}return t};const j=t=>mt(t).$;const k=(t,n,e)=>{const s=j(t);return{emit:t=>O(s,n,{bubbles:!!(e&4),composed:!!(e&2),cancelable:!!(e&1),detail:t})}};const O=(t,n,e)=>{const s=Ct.ce(n,e);t.dispatchEvent(s);return s};const C=new WeakMap;const M=(t,n,e)=>{let s=jt.get(t);if(xt&&e){s=s||new CSSStyleSheet;if(typeof s==="string"){s=n}else{s.replaceSync(n)}}else{s=n}jt.set(t,s)};const x=(t,n,e,s)=>{var o;let l=E(n);const c=jt.get(l);t=t.nodeType===11?t:Ot;if(c){if(typeof c==="string"){t=t.head||t;let n=C.get(t);let e;if(!n){C.set(t,n=new Set)}if(!n.has(l)){{{e=Ot.createElement("style");e.innerHTML=c}const n=(o=Ct.v)!==null&&o!==void 0?o:p(Ot);if(n!=null){e.setAttribute("nonce",n)}t.insertBefore(e,t.querySelector("link"))}if(n){n.add(l)}}}else if(!t.adoptedStyleSheets.includes(c)){t.adoptedStyleSheets=[...t.adoptedStyleSheets,c]}}return l};const P=t=>{const n=t.g;const e=t.$;const s=n.u;const o=c("attachStyles",n.S);const l=x(e.shadowRoot?e.shadowRoot:e.getRootNode(),n);if(s&10){e["s-sc"]=l;e.classList.add(l+"-h")}o()};const E=(t,n)=>"sc-"+t.S;const L=(t,n,e,s,o,l)=>{if(e!==s){let c=wt(t,n);let i=n.toLowerCase();if(n==="class"){const n=t.classList;const o=F(e);const l=F(s);n.remove(...o.filter((t=>t&&!l.includes(t))));n.add(...l.filter((t=>t&&!o.includes(t))))}else if(n==="style"){{for(const n in e){if(!s||s[n]==null){if(n.includes("-")){t.style.removeProperty(n)}else{t.style[n]=""}}}}for(const n in s){if(!e||s[n]!==e[n]){if(n.includes("-")){t.style.setProperty(n,s[n])}else{t.style[n]=s[n]}}}}else if(n==="key");else if(n==="ref"){if(s){s(t)}}else if(!c&&n[0]==="o"&&n[1]==="n"){if(n[2]==="-"){n=n.slice(3)}else if(wt(kt,i)){n=i.slice(2)}else{n=i[2]+n.slice(3)}if(e){Ct.rel(t,n,e,false)}if(s){Ct.ael(t,n,s,false)}}else{const i=h(s);if((c||i&&s!==null)&&!o){try{if(!t.tagName.includes("-")){const o=s==null?"":s;if(n==="list"){c=false}else if(e==null||t[n]!=o){t[n]=o}}else{t[n]=s}}catch(t){}}if(s==null||s===false){if(s!==false||t.getAttribute(n)===""){{t.removeAttribute(n)}}}else if((!c||l&4||o)&&!i){s=s===true?"":s;{t.setAttribute(n,s)}}}}};const U=/\s/;const F=t=>!t?[]:t.split(U);const N=(t,n,e,s)=>{const o=n.p.nodeType===11&&n.p.host?n.p.host:n.p;const l=t&&t.o||r;const c=n.o||r;{for(s in l){if(!(s in c)){L(o,s,l[s],undefined,e,n.u)}}}for(s in c){L(o,s,l[s],c[s],e,n.u)}};const T=(t,e,o,l)=>{const c=e.l[o];let i=0;let f;let r;if(c.t!==null){f=c.p=Ot.createTextNode(c.t)}else{if(!s){s=c.h==="svg"}f=c.p=Ot.createElementNS(s?u:a,c.h);if(s&&c.h==="foreignObject"){s=false}{N(null,c,s)}if(d(n)&&f["s-si"]!==n){f.classList.add(f["s-si"]=n)}if(c.l){for(i=0;i<c.l.length;++i){r=T(t,c,i);if(r){f.appendChild(r)}}}{if(c.h==="svg"){s=false}else if(f.tagName==="foreignObject"){s=true}}}return f};const W=(t,n,s,o,l,c)=>{let i=t;let f;if(i.shadowRoot&&i.tagName===e){i=i.shadowRoot}for(;l<=c;++l){if(o[l]){f=T(null,s,l);if(f){o[l].p=f;i.insertBefore(f,n)}}}};const A=(t,n,e)=>{for(let s=n;s<=e;++s){const n=t[s];if(n){const t=n.p;D(n);if(t){t.remove()}}}};const H=(t,n,e,s)=>{let o=0;let l=0;let c=0;let i=0;let f=n.length-1;let r=n[0];let u=n[f];let a=s.length-1;let d=s[0];let h=s[a];let p;let y;while(o<=f&&l<=a){if(r==null){r=n[++o]}else if(u==null){u=n[--f]}else if(d==null){d=s[++l]}else if(h==null){h=s[--a]}else if(R(r,d)){q(r,d);r=n[++o];d=s[++l]}else if(R(u,h)){q(u,h);u=n[--f];h=s[--a]}else if(R(r,h)){q(r,h);t.insertBefore(r.p,u.p.nextSibling);r=n[++o];h=s[--a]}else if(R(u,d)){q(u,d);t.insertBefore(u.p,r.p);u=n[--f];d=s[++l]}else{c=-1;{for(i=o;i<=f;++i){if(n[i]&&n[i].i!==null&&n[i].i===d.i){c=i;break}}}if(c>=0){y=n[c];if(y.h!==d.h){p=T(n&&n[l],e,c)}else{q(y,d);n[c]=undefined;p=y.p}d=s[++l]}else{p=T(n&&n[l],e,l);d=s[++l]}if(p){{r.p.parentNode.insertBefore(p,r.p)}}}}if(o>f){W(t,s[a+1]==null?null:s[a+1].p,e,s,l,a)}else if(l>a){A(n,o,f)}};const R=(t,n)=>{if(t.h===n.h){{return t.i===n.i}}return false};const q=(t,n)=>{const e=n.p=t.p;const o=t.l;const l=n.l;const c=n.h;const i=n.t;if(i===null){{s=c==="svg"?true:c==="foreignObject"?false:s}{if(c==="slot");else{N(t,n,s)}}if(o!==null&&l!==null){H(e,o,n,l)}else if(l!==null){if(t.t!==null){e.textContent=""}W(e,null,n,l,0,l.length-1)}else if(o!==null){A(o,0,o.length-1)}if(s&&c==="svg"){s=false}}else if(t.t!==i){e.data=i}};const D=t=>{{t.o&&t.o.ref&&t.o.ref(null);t.l&&t.l.map(D)}};const I=(t,s)=>{const o=t.$;const l=t.g;const c=t.j||m(null,null);const i=$(s)?s:y(null,null,s);e=o.tagName;if(l.k){i.o=i.o||{};l.k.map((([t,n])=>i.o[n]=o[t]))}i.h=null;i.u|=4;t.j=i;i.p=c.p=o.shadowRoot||o;{n=o["s-sc"]}q(c,i)};const V=(t,n)=>{if(n&&!t.O&&n["s-p"]){n["s-p"].push(new Promise((n=>t.O=n)))}};const _=(t,n)=>{{t.u|=16}if(t.u&4){t.u|=512;return}V(t,t.C);const e=()=>z(t,n);return Tt(e)};const z=(t,n)=>{const e=c("scheduleUpdate",t.g.S);const s=t.M;let o;if(n){{t.u|=256;if(t.P){t.P.map((([t,n])=>Z(s,t,n)));t.P=undefined}}{o=Z(s,"componentWillLoad")}}e();return B(o,(()=>G(t,s,n)))};const B=(t,n)=>t instanceof Promise?t.then(n):n();const G=async(t,n,e)=>{var s;const o=t.$;const l=c("update",t.g.S);const i=o["s-rc"];if(e){P(t)}const f=c("render",t.g.S);{J(t,n)}if(i){i.map((t=>t()));o["s-rc"]=undefined}f();l();{const n=(s=o["s-p"])!==null&&s!==void 0?s:[];const e=()=>Q(t);if(n.length===0){e()}else{Promise.all(n).then(e);t.u|=4;n.length=0}}};const J=(t,n,e)=>{try{o=n;n=n.render();{t.u&=~16}{t.u|=2}{{{I(t,n)}}}}catch(n){vt(n,t.$)}o=null;return null};const K=()=>o;const Q=t=>{const n=t.g.S;const e=t.$;const s=c("postUpdate",n);const o=t.M;const l=t.C;if(!(t.u&64)){t.u|=64;{tt(e)}{Z(o,"componentDidLoad")}s();{t.L(e);if(!l){Y()}}}else{s()}{if(t.O){t.O();t.O=undefined}if(t.u&512){Nt((()=>_(t,false)))}t.u&=~(4|512)}};const X=t=>{{const n=mt(t);const e=n.$.isConnected;if(e&&(n.u&(2|16))===2){_(n,false)}return e}};const Y=n=>{{tt(Ot.documentElement)}Nt((()=>O(kt,"appload",{detail:{namespace:t}})))};const Z=(t,n,e)=>{if(t&&t[n]){try{return t[n](e)}catch(t){vt(t)}}return undefined};const tt=t=>t.classList.add("hydrated");const nt=(t,n)=>mt(t).U.get(n);const et=(t,n,e,s)=>{const o=mt(t);const l=o.$;const c=o.U.get(n);const i=o.u;const f=o.M;e=S(e,s.F[n][0]);const r=Number.isNaN(c)&&Number.isNaN(e);const u=e!==c&&!r;if((!(i&8)||c===undefined)&&u){o.U.set(n,e);if(f){if(s.N&&i&128){const t=s.N[n];if(t){t.map((t=>{try{f[t](e,c,n)}catch(t){vt(t,l)}}))}}if((i&(2|16))===2){_(o,false)}}}};const st=(t,n,e)=>{if(n.F){if(t.watchers){n.N=t.watchers}const s=Object.entries(n.F);const o=t.prototype;s.map((([t,[s]])=>{if(s&31||e&2&&s&32){Object.defineProperty(o,t,{get(){return nt(this,t)},set(e){et(this,t,e,n)},configurable:true,enumerable:true})}}));if(e&1){const e=new Map;o.attributeChangedCallback=function(t,n,s){Ct.jmp((()=>{const n=e.get(t);if(this.hasOwnProperty(n)){s=this[n];delete this[n]}else if(o.hasOwnProperty(n)&&typeof this[n]==="number"&&this[n]==s){return}this[n]=s===null&&typeof this[n]==="boolean"?false:s}))};t.observedAttributes=s.filter((([t,n])=>n[0]&15)).map((([t,s])=>{const o=s[1]||t;e.set(o,t);if(s[0]&512){n.k.push([t,o])}return o}))}}return t};const ot=async(t,n,e,s,o)=>{if((n.u&32)===0){n.u|=32;{o=St(e);if(o.then){const t=i();o=await o;t()}if(!o.isProxied){{e.N=o.watchers}st(o,e,2);o.isProxied=true}const t=c("createInstance",e.S);{n.u|=8}try{new o(n)}catch(t){vt(t)}{n.u&=~8}{n.u|=128}t();lt(n.M)}if(o.style){let t=o.style;const n=E(e);if(!jt.has(n)){const s=c("registerStyles",e.S);M(n,t,!!(e.u&1));s()}}}const l=n.C;const f=()=>_(n,true);if(l&&l["s-rc"]){l["s-rc"].push(f)}else{f()}};const lt=t=>{{Z(t,"connectedCallback")}};const ct=t=>{if((Ct.u&1)===0){const n=mt(t);const e=n.g;const s=c("connectedCallback",e.S);if(!(n.u&1)){n.u|=1;{let e=t;while(e=e.parentNode||e.host){if(e["s-p"]){V(n,n.C=e);break}}}if(e.F){Object.entries(e.F).map((([n,[e]])=>{if(e&31&&t.hasOwnProperty(n)){const e=t[n];delete t[n];t[n]=e}}))}{ot(t,n,e)}}else{ut(t,n,e.T);lt(n.M)}s()}};const it=t=>{if((Ct.u&1)===0){const n=mt(t);const e=n.M;{if(n.W){n.W.map((t=>t()));n.W=undefined}}{Z(e,"disconnectedCallback")}}};const ft=(t,n={})=>{var e;const s=c();const o=[];const l=n.exclude||[];const i=kt.customElements;const r=Ot.head;const u=r.querySelector("meta[charset]");const a=Ot.createElement("style");const d=[];let h;let y=true;Object.assign(Ct,n);Ct.A=new URL(n.resourcesUrl||"./",Ot.baseURI).href;t.map((t=>{t[1].map((n=>{const e={u:n[0],S:n[1],F:n[2],T:n[3]};{e.F=n[2]}{e.T=n[3]}{e.k=[]}{e.N={}}const s=e.S;const c=class extends HTMLElement{constructor(t){super(t);t=this;$t(t,e);if(e.u&1){{{t.attachShadow({mode:"open"})}}}}connectedCallback(){if(h){clearTimeout(h);h=null}if(y){d.push(this)}else{Ct.jmp((()=>ct(this)))}}disconnectedCallback(){Ct.jmp((()=>it(this)))}componentOnReady(){return mt(this).H}};e.R=t[0];if(!l.includes(s)&&!i.get(s)){o.push(s);i.define(s,st(c,e,1))}}))}));{a.innerHTML=o+f;a.setAttribute("data-styles","");const t=(e=Ct.v)!==null&&e!==void 0?e:p(Ot);if(t!=null){a.setAttribute("nonce",t)}r.insertBefore(a,u?u.nextSibling:r.firstChild)}y=false;if(d.length){d.map((t=>t.connectedCallback()))}else{{Ct.jmp((()=>h=setTimeout(Y,30)))}}s()};const rt=(t,n)=>n;const ut=(t,n,e,s)=>{if(e){e.map((([e,s,o])=>{const l=dt(t,e);const c=at(n,o);const i=ht(e);Ct.ael(l,s,c,i);(n.W=n.W||[]).push((()=>Ct.rel(l,s,c,i)))}))}};const at=(t,n)=>e=>{try{{if(t.u&256){t.M[n](e)}else{(t.P=t.P||[]).push([n,e])}}}catch(t){vt(t)}};const dt=(t,n)=>{if(n&16)return Ot.body;return t};const ht=t=>(t&2)!==0;const pt=t=>Ct.v=t;const yt=new WeakMap;const mt=t=>yt.get(t);const bt=(t,n)=>yt.set(n.M=t,n);const $t=(t,n)=>{const e={u:0,$:t,g:n,U:new Map};{e.H=new Promise((t=>e.L=t));t["s-p"]=[];t["s-rc"]=[]}ut(t,e,n.T);return yt.set(t,e)};const wt=(t,n)=>n in t;const vt=(t,n)=>(0,console.error)(t,n);const gt=new Map;const St=(t,n,e)=>{const s=t.S.replace(/-/g,"_");const o=t.R;const l=gt.get(o);if(l){return l[s]}
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${o}.entry.js${""}`).then((t=>{{gt.set(o,t)}return t[s]}),vt)};const jt=new Map;const kt=typeof window!=="undefined"?window:{};const Ot=kt.document||{head:{}};const Ct={u:0,A:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,n,e,s)=>t.addEventListener(n,e,s),rel:(t,n,e,s)=>t.removeEventListener(n,e,s),ce:(t,n)=>new CustomEvent(t,n)};const Mt=t=>Promise.resolve(t);const xt=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(t){}return false})();const Pt=[];const Et=[];const Lt=(t,n)=>e=>{t.push(e);if(!l){l=true;if(n&&Ct.u&4){Nt(Ft)}else{Ct.raf(Ft)}}};const Ut=t=>{for(let n=0;n<t.length;n++){try{t[n](performance.now())}catch(t){vt(t)}}t.length=0};const Ft=()=>{Ut(Pt);{Ut(Et);if(l=Pt.length>0){Ct.raf(Ft)}}};const Nt=t=>Mt().then(t);const Tt=Lt(Et,true);export{rt as F,b as H,K as a,ft as b,k as c,X as f,j as g,y as h,Mt as p,bt as r,pt as s};
+//# sourceMappingURL=p-fa17e81f.js.map