@mozaic-ds/web-components 0.1.0

package/public/components/phonenumber/PhoneNumber.svelte

@@ -0,0 +1,259 @@
+<svelte:options tag={null} />
+
+<script lang="ts">
+  import {
+    parsePhoneNumber,
+    formatIncompletePhoneNumber,
+  } from 'libphonenumber-js';
+  import type { CountryItems } from './phonenumber.types';
+  import { EventHandler } from '../../utilities/EventHandler';
+  export let phonenumber: string;
+  export let placeholder = '0102030405';
+  export let buttonId = 'dropdown_country';
+  export let listId = 'phone_number_list';
+  export let countries: string;
+  export let selectedcountry: string;
+  export let isvalid: boolean;
+  export let isinvalid: boolean;
+
+  let isCountriesListOpened = false;
+  let maxlength = 25;
+  let eventHandler = new EventHandler();
+  let phoneNumber: string;
+
+  $: selectedCountry = selectedcountry
+    ? JSON.parse(selectedcountry)
+    : ({
+        isd: '+33',
+        name: 'France',
+        shortName: 'FR',
+      } as CountryItems);
+
+  $: parsedCountries = countries
+    ? (JSON.parse(countries) as CountryItems[])
+    : [];
+
+  $: phoneNumber = phonenumber ? getNumber() : '';
+
+  function getNumber(): string {
+    return parsePhoneNumber(
+      phonenumber,
+      selectedCountry.shortName,
+    ).formatNational();
+  }
+
+  function dispatchEvent(
+    eventName: string,
+    data?: string | CountryItems,
+  ): void {
+    eventHandler.dispatch(eventName, data);
+  }
+
+  function toggleCountriesList(): void {
+    isCountriesListOpened = !isCountriesListOpened;
+  }
+
+  function openCountriesList() {
+    dispatchEvent('open-countries-list');
+    isCountriesListOpened = true;
+  }
+
+  function closeCountriesList() {
+    dispatchEvent('close-countries-list');
+    isCountriesListOpened = false;
+  }
+
+  function hasValue(): boolean {
+    return phoneNumber !== '';
+  }
+
+  function changeCountry(country: CountryItems): void {
+    selectedCountry = country;
+    toggleCountriesList();
+    dispatchEvent('change-country', country);
+    if (hasValue()) {
+      formatPhoneNumber();
+    }
+  }
+
+  function formatPhoneNumber(event?: FocusEvent): void {
+    event?.stopPropagation();
+    const phoneNumberValue = event
+      ? (event.target as HTMLInputElement).value
+      : phoneNumber;
+
+    if (!phoneNumberValue) {
+      dispatchEvent('blur');
+      return;
+    }
+
+    try {
+      const formatInternational: string = parsePhoneNumber(
+        phoneNumberValue,
+        selectedCountry.shortName,
+      ).formatInternational();
+
+      dispatchEvent('blur', formatInternational);
+    } catch (error) {
+      const formatIncomplete: string = formatIncompletePhoneNumber(
+        phoneNumberValue,
+        selectedCountry.shortName,
+      );
+
+      dispatchEvent('blur', formatIncomplete);
+    }
+
+    phoneNumber = parsePhoneNumber(
+      phoneNumberValue,
+      selectedCountry.shortName,
+    ).formatNational();
+
+    if (event && event.target) {
+      (event.target as HTMLInputElement).value = parsePhoneNumber(
+        phoneNumberValue,
+        selectedCountry.shortName,
+      ).formatNational();
+    }
+  }
+
+  function cleanFormat(event: FocusEvent) {
+    const eventTargetValue = (event.target as HTMLInputElement).value;
+    phoneNumber = formatIncompletePhoneNumber(eventTargetValue);
+  }
+
+  function initKeyboardNav(event: KeyboardEvent) {
+    switch (event.key) {
+      case 'ArrowDown':
+      case 'ArrowUp': {
+        if (!isCountriesListOpened) {
+          openCountriesList();
+        }
+
+        /* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment */
+        const tmpIndex: number = parsedCountries.findIndex(
+          (country) => country.isd === selectedCountry.isd,
+        );
+        let index = event.key === 'ArrowDown' ? tmpIndex + 1 : tmpIndex - 1;
+
+        if (index === -1 || index >= parsedCountries.length) {
+          index = index === -1 ? parsedCountries.length - 1 : 0;
+        }
+
+        selectedCountry = parsedCountries[index];
+        /* eslint-enable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment */
+        break;
+      }
+      case 'Enter':
+        isCountriesListOpened
+          ? changeCountry(selectedCountry)
+          : openCountriesList();
+        break;
+      case 'Esc':
+        closeCountriesList();
+        break;
+    }
+  }
+</script>
+
+<div
+  class="mc-phone-number
+  {isCountriesListOpened ? ' mc-phone-number--focused' : ''}"
+>
+  <div
+    class="mc-phone-number__dropdown"
+    on:keydown={initKeyboardNav}
+    {...$$restProps}
+  >
+    <button
+      id={buttonId}
+      type="button"
+      aria-haspopup="listbox"
+      aria-labelledby={buttonId}
+      class="mc-phone-number__button"
+      aria-expanded={isCountriesListOpened}
+      on:click={toggleCountriesList}
+    >
+      <span
+        class="flag flag:{selectedCountry.shortName}"
+        style="--CountryFlagIcon-height:1rem">&nbsp;</span
+      >
+      <span class="mc-phone-number__indicator">{selectedCountry.isd}</span>
+    </button>
+    {#if isCountriesListOpened}
+      <ul
+        id={listId}
+        tabindex="-1"
+        role="listbox"
+        aria-labelledby={listId}
+        class="mc-phone-number__list"
+        aria-activedescendant={selectedCountry.isd}
+      >
+        {#each parsedCountries as country}
+          <li
+            role="option"
+            class="mc-phone-number__item
+            {country.isd === selectedCountry.isd
+              ? 'mc-phone-number__item--focused'
+              : ''}"
+            aria-selected={country.isd === selectedCountry.isd}
+            on:click={() => changeCountry(country)}
+            on:keyup={(e) => {
+              /* eslint-disable @typescript-eslint/no-unsafe-member-access */
+              return e.key === 'Enter' && changeCountry(country);
+            }}
+          >
+            <span
+              class="flag flag:{country.shortName}"
+              style="--CountryFlagIcon-height:1rem"
+            >
+              &nbsp;
+            </span>
+            <span class="mc-phone-number__country">{country.name}</span>
+            &nbsp;
+            <span>{country.isd}</span>
+          </li>
+        {/each}
+      </ul>
+    {/if}
+  </div>
+  <input
+    id="smallField"
+    type="tel"
+    class="mc-phone-number__input mc-text-input mc-text-input--m mc-field__input"
+    name="phone-number-input"
+    spellcheck="false"
+    class:is-valid={isvalid}
+    class:is-invalid={isinvalid}
+    {placeholder}
+    {maxlength}
+    on:blur={formatPhoneNumber}
+    on:focus={cleanFormat}
+    bind:value={phoneNumber}
+  />
+</div>
+
+<style lang="scss">
+  @import 'country-flag-icons/3x2/flags';
+  @import '@mozaic-ds/styles/settings-tools/all-settings';
+  @import '@mozaic-ds/styles/components/c.text-input';
+  @import '@mozaic-ds/styles/components/c.phone-number';
+  // Custom CSS
+  .mc-phone-number {
+    max-width: none;
+
+    &__indicator,
+    &__country {
+      padding-left: 1rem;
+    }
+
+    &__overlay {
+      position: fixed;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      background: transparent;
+      z-index: 10;
+    }
+  }
+</style>

package/public/components/phonenumber/phonenumber.types.d.ts

@@ -0,0 +1,15 @@
+import type { CountryCode } from 'libphonenumber-js';
+export interface CountryItems {
+    isd: string;
+    name: string;
+    shortName?: CountryCode;
+}
+export interface PhoneNumberResponse {
+    codePays: string;
+    isValid: boolean;
+    phoneNumber: {
+        original: string;
+        formatted?: string;
+    };
+}
+//# sourceMappingURL=phonenumber.types.d.ts.map

package/public/components/phonenumber/phonenumber.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"phonenumber.types.d.ts","sourceRoot":"","sources":["../../../src/components/phonenumber/phonenumber.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,WAAW,CAAC;CACzB;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE;QACX,QAAQ,EAAE,MAAM,CAAC;QACjB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;CACH"}

package/public/components/price/Price.js

@@ -0,0 +1,2 @@
+import{S as e,i,a,b as t,f as o,s as r,c as s,e as n,d as l,t as m,n as b,g as d,h as c,z as p,j as x,k as w,m as f,o as g,p as h,q as u,K as k}from"../../index-c33b3772.js";function y(e){let i,a,o,r,s,b;return{c(){i=n("div"),a=n("span"),o=m(e[7]),r=l(),s=n("span"),b=m(e[10]),d(a,"class","price__flag--discount-amount"),d(s,"class","price__flag--discount-label"),d(i,"class","price__flag--discount"),d(i,"aria-label",e[9])},m(e,n){t(e,i,n),x(i,a),x(a,o),x(i,r),x(i,s),x(s,b)},p(e,a){128&a&&w(o,e[7]),1024&a&&w(b,e[10]),512&a&&d(i,"aria-label",e[9])},d(e){e&&g(i)}}}function M(e){let i,a,o,r,s,b;return{c(){i=n("div"),a=n("span"),o=m(e[8]),r=l(),s=n("span"),b=m(e[7]),d(a,"class","price__flag--clearance-label"),d(s,"class","price__flag--clearance-amount"),d(i,"class","price__flag--clearance"),d(i,"aria-label",e[9])},m(e,n){t(e,i,n),x(i,a),x(a,o),x(i,r),x(i,s),x(s,b)},p(e,a){256&a&&w(o,e[8]),128&a&&w(b,e[7]),512&a&&d(i,"aria-label",e[9])},d(e){e&&g(i)}}}function v(e){let i,a,o;return{c(){i=n("span"),a=m(e[8]),d(i,"class",o="price__flag--"+e[1])},m(e,o){t(e,i,o),x(i,a)},p(e,t){256&t&&w(a,e[8]),2&t&&o!==(o="price__flag--"+e[1])&&d(i,"class",o)},d(e){e&&g(i)}}}function I(e){let i,a,o;return{c(){i=n("div"),a=n("span"),o=m(e[11]),d(a,"class","price__from-without-offer"),d(i,"class","price__from"),d(i,"aria-label",e[12])},m(e,r){t(e,i,r),x(i,a),x(a,o)},p(e,a){2048&a&&w(o,e[11]),4096&a&&d(i,"aria-label",e[12])},d(e){e&&g(i)}}}function _(e){let i,a,o;return{c(){i=n("span"),a=m("/ "),o=m(e[4]),d(i,"class","price__main__unit")},m(e,r){t(e,i,r),x(i,a),x(i,o)},p(e,i){16&i&&w(o,e[4])},d(e){e&&g(i)}}}function D(e){let i,a;return{c(){i=n("span"),a=m(e[5]),d(i,"class","price__secondary"),d(i,"aria-label",e[6])},m(e,o){t(e,i,o),x(i,a)},p(e,t){32&t&&w(a,e[5]),64&t&&d(i,"aria-label",e[6])},d(e){e&&g(i)}}}function E(e){let i;function a(e,i){return e[14]?L:j}let o=a(e),r=o(e);return{c(){r.c(),i=k()},m(e,a){r.m(e,a),t(e,i,a)},p(e,t){o===(o=a(e))&&r?r.p(e,t):(r.d(1),r=o(e),r&&(r.c(),r.m(i.parentNode,i)))},d(e){r.d(e),e&&g(i)}}}function j(e){let i,a;return{c(){i=n("span"),a=m(e[13]),d(i,"class","mc-tag-text mc-tag-text--danger mc-tag-text__label")},m(e,o){t(e,i,o),x(i,a)},p(e,i){8192&i&&w(a,e[13])},d(e){e&&g(i)}}}function L(e){let i,a;return{c(){i=n("a"),a=m(e[13]),d(i,"class","mc-tag-link mc-tag-link__label"),d(i,"href",e[14]),d(i,"target","_blank")},m(e,o){t(e,i,o),x(i,a)},p(e,t){8192&t&&w(a,e[13]),16384&t&&d(i,"href",e[14])},d(e){e&&g(i)}}}function A(e){let i,a,o,r,h,u,k,j,L,A,z;function T(e,i){return e[15]?v:"destocking"===e[1]?M:"commercial-operation"===e[1]?y:void 0}let S=T(e),Q=S&&S(e),N=e[16]&&I(e),$=e[4]&&_(e),C=e[5]&&D(e),Y=!e[0]&&e[13]&&E(e),P=[{class:z="mc-price "+e[17].class},e[18]],W={};for(let e=0;e<P.length;e+=1)W=s(W,P[e]);return{c(){i=n("div"),Q&&Q.c(),a=l(),N&&N.c(),o=l(),r=n("div"),h=n("div"),u=n("span"),k=m(e[2]),j=l(),$&&$.c(),L=l(),C&&C.c(),A=l(),Y&&Y.c(),this.c=b,d(u,"data-cerberus","ELEM_PRIX"),d(u,"aria-label",e[3]),d(h,"class","price__main"),d(r,"class","price"),c(i,W),p(i,"light",e[0]),p(i,"mc-price--discount",e[16])},m(e,s){t(e,i,s),Q&&Q.m(i,null),x(i,a),N&&N.m(i,null),x(i,o),x(i,r),x(r,h),x(h,u),x(u,k),x(h,j),$&&$.m(h,null),x(r,L),C&&C.m(r,null),x(i,A),Y&&Y.m(i,null)},p(e,[t]){S===(S=T(e))&&Q?Q.p(e,t):(Q&&Q.d(1),Q=S&&S(e),Q&&(Q.c(),Q.m(i,a))),e[16]?N?N.p(e,t):(N=I(e),N.c(),N.m(i,o)):N&&(N.d(1),N=null),4&t&&w(k,e[2]),8&t&&d(u,"aria-label",e[3]),e[4]?$?$.p(e,t):($=_(e),$.c(),$.m(h,null)):$&&($.d(1),$=null),e[5]?C?C.p(e,t):(C=D(e),C.c(),C.m(r,null)):C&&(C.d(1),C=null),!e[0]&&e[13]?Y?Y.p(e,t):(Y=E(e),Y.c(),Y.m(i,null)):Y&&(Y.d(1),Y=null),c(i,W=f(P,[131072&t&&z!==(z="mc-price "+e[17].class)&&{class:z},262144&t&&e[18]])),p(i,"light",e[0]),p(i,"mc-price--discount",e[16])},i:b,o:b,d(e){e&&g(i),Q&&Q.d(),N&&N.d(),$&&$.d(),C&&C.d(),Y&&Y.d()}}}function z(e,i,a){let t,o;const r=["light","type","mainprice","mainpricearialabel","mainpriceunit","secondarypricelabel","secondarypriceariallabel","flagamount","flaglabel","flagarialabel","priceenddatelabel","pricewithoutoffer","pricewithoutofferarialabel","refundsofferproductlabel","refundsoffermediaurl"];let n=h(i,r),{light:l=!1}=i,{type:m="default"}=i,{mainprice:b}=i,{mainpricearialabel:d}=i,{mainpriceunit:c}=i,{secondarypricelabel:p}=i,{secondarypriceariallabel:x}=i,{flagamount:w}=i,{flaglabel:f}=i,{flagarialabel:g}=i,{priceenddatelabel:k}=i,{pricewithoutoffer:y}=i,{pricewithoutofferarialabel:M}=i,{refundsofferproductlabel:v}=i,{refundsoffermediaurl:I}=i;return e.$$set=e=>{a(17,i=s(s({},i),u(e))),a(18,n=h(i,r)),"light"in e&&a(0,l=e.light),"type"in e&&a(1,m=e.type),"mainprice"in e&&a(2,b=e.mainprice),"mainpricearialabel"in e&&a(3,d=e.mainpricearialabel),"mainpriceunit"in e&&a(4,c=e.mainpriceunit),"secondarypricelabel"in e&&a(5,p=e.secondarypricelabel),"secondarypriceariallabel"in e&&a(6,x=e.secondarypriceariallabel),"flagamount"in e&&a(7,w=e.flagamount),"flaglabel"in e&&a(8,f=e.flaglabel),"flagarialabel"in e&&a(9,g=e.flagarialabel),"priceenddatelabel"in e&&a(10,k=e.priceenddatelabel),"pricewithoutoffer"in e&&a(11,y=e.pricewithoutoffer),"pricewithoutofferarialabel"in e&&a(12,M=e.pricewithoutofferarialabel),"refundsofferproductlabel"in e&&a(13,v=e.refundsofferproductlabel),"refundsoffermediaurl"in e&&a(14,I=e.refundsoffermediaurl)},e.$$.update=()=>{2&e.$$.dirty&&a(16,t="destocking"===m||"commercial-operation"===m),2&e.$$.dirty&&a(15,o="budget-price"===m||"best-value"===m||"high-quality"===m||"star-product"===m)},i=u(i),[l,m,b,d,c,p,x,w,f,g,k,y,M,v,I,o,t,i,n]}class T extends e{constructor(e){super();const s=document.createElement("style");s.textContent='.mc-tag-text{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;background:#ffffff;color:#191919;-webkit-box-shadow:inset 0 0 0 1px #808080;box-shadow:inset 0 0 0 1px #808080}.mc-tag-text::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-text--s{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-text--s::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-text--dark{background:#191919;color:#ffffff;-webkit-box-shadow:inset 0 0 0 1px #ffffff;box-shadow:inset 0 0 0 1px #ffffff}.mc-tag-link{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;text-decoration:none;outline:none;background:#ffffff;-webkit-box-shadow:inset 0 0 0 1px #808080;box-shadow:inset 0 0 0 1px #808080;color:#191919}.mc-tag-link::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-link:hover{background:#e6e6e6}.mc-tag-link:active{background:#cccccc}.mc-tag-link:focus::after{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;-webkit-box-shadow:0 0 0 0.125rem #0b96cc;box-shadow:0 0 0 0.125rem #0b96cc}.mc-tag-link--s{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-link--s::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-link--dark{background:#191919;color:#ffffff;-webkit-box-shadow:inset 0 0 0 1px #ffffff;box-shadow:inset 0 0 0 1px #ffffff}.mc-tag-link--dark:hover{background:#333333}.mc-tag-link--dark:active{background:#4d4d4d}.mc-tag-selectable{display:inline-block;white-space:nowrap}.mc-tag-selectable__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;visibility:visible;white-space:nowrap}.mc-tag-selectable__label{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;background:#ffffff;-webkit-box-shadow:inset 0 0 0 1px #808080;box-shadow:inset 0 0 0 1px #808080;color:#191919;cursor:pointer}.mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable__pill:hover{background:#9ed05f}.mc-tag-selectable__pill:active{background:#035010;-webkit-box-shadow:inset 0 0 0 1px #035010;box-shadow:inset 0 0 0 1px #035010;color:#ffffff}.mc-tag-selectable--dark .mc-tag-selectable__pill{background:#191919;color:#ffffff;cursor:pointer}.mc-tag-selectable--dark .mc-tag-selectable__pill:hover{background:#006902}.mc-tag-selectable--dark .mc-tag-selectable__pill:active{background:#c5e39e;-webkit-box-shadow:inset 0 0 0 1px #c5e39e;box-shadow:inset 0 0 0 1px #c5e39e;color:#191919}.mc-tag-selectable--s .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--s .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--m .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--m .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0;background-color:#333333;color:#ffffff}.mc-tag-removable::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--s::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s .mc-tag-removable__label{padding:calc(0.25rem - 1px) 0.25rem calc(0.25rem - 1px) calc(1rem - 1px)}.mc-tag-removable--s .mc-tag-removable__remove{width:1.5rem;height:1.5rem;background-size:1rem}.mc-tag-removable--m{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--m::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--m .mc-tag-removable__label{padding:calc(0.75rem - 1px) 0.25rem calc(0.75rem - 1px) calc(1.5rem - 1px)}.mc-tag-removable--m .mc-tag-removable__remove{width:2.5rem;height:2.5rem;background-size:1.5rem;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjY2NjY2NjIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==")}.mc-tag-removable--dark{background-color:#cccccc;color:#191919}.mc-tag-removable__label{padding:calc(0.75rem - 1px) 0.25rem calc(0.75rem - 1px) calc(1.5rem - 1px)}.mc-tag-removable__remove{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;width:2.5rem;height:2.5rem;background-size:1.5rem;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjY2NjY2NjIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==");position:relative;background-color:#333333;margin:0;display:block;border-radius:50%;background-repeat:no-repeat;background-position:center}.mc-tag-removable__remove::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:50%;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable__remove-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;visibility:visible;white-space:nowrap}.mc-tag-removable__remove:hover{background-color:#4d4d4d}.mc-tag-removable__remove:focus::after{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;-webkit-box-shadow:0 0 0 0.125rem #0b96cc;box-shadow:0 0 0 0.125rem #0b96cc}.mc-tag-removable__remove:active{background-color:#666666}.mc-tag-removable--dark .mc-tag-removable__remove{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjMTkxOTE5IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==");background-color:#cccccc}.mc-tag-removable--dark .mc-tag-removable__remove:hover{background-color:#b3b3b3}.mc-tag-removable--dark .mc-tag-removable__remove:active{background-color:#999999}.mc-tag-list{list-style:none;margin-left:0;padding-left:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row wrap;flex-flow:row wrap}.mc-tag-list__item{margin:0 1rem 1rem 0}@media screen and (min-width: 680px){.mc-tag-text--s\\@from-m{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-text--s\\@from-m::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-link--s\\@from-m{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-link--s\\@from-m::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--s\\@from-m .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--s\\@from-m .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--m\\@from-m .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--m\\@from-m .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-m{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--s\\@from-m::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-m .mc-tag-removable__label{padding:calc(0.25rem - 1px) 0.25rem calc(0.25rem - 1px) calc(1rem - 1px)}.mc-tag-removable--s\\@from-m .mc-tag-removable__remove{width:1.5rem;height:1.5rem;background-size:1rem}.mc-tag-removable--m\\@from-m{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--m\\@from-m::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--m\\@from-m .mc-tag-removable__label{padding:calc(0.75rem - 1px) 0.25rem calc(0.75rem - 1px) calc(1.5rem - 1px)}.mc-tag-removable--m\\@from-m .mc-tag-removable__remove{width:2.5rem;height:2.5rem;background-size:1.5rem;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjY2NjY2NjIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==")}}@media screen and (min-width: 1024px){.mc-tag-text--s\\@from-l{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-text--s\\@from-l::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-link--s\\@from-l{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-link--s\\@from-l::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--s\\@from-l .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--s\\@from-l .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--m\\@from-l .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--m\\@from-l .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-l{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--s\\@from-l::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-l .mc-tag-removable__label{padding:calc(0.25rem - 1px) 0.25rem calc(0.25rem - 1px) calc(1rem - 1px)}.mc-tag-removable--s\\@from-l .mc-tag-removable__remove{width:1.5rem;height:1.5rem;background-size:1rem}.mc-tag-removable--m\\@from-l{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--m\\@from-l::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--m\\@from-l .mc-tag-removable__label{padding:calc(0.75rem - 1px) 0.25rem calc(0.75rem - 1px) calc(1.5rem - 1px)}.mc-tag-removable--m\\@from-l .mc-tag-removable__remove{width:2.5rem;height:2.5rem;background-size:1.5rem;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjY2NjY2NjIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==")}}@media screen and (min-width: 1280px){.mc-tag-text--s\\@from-xl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-text--s\\@from-xl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-link--s\\@from-xl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-link--s\\@from-xl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--s\\@from-xl .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--s\\@from-xl .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--m\\@from-xl .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--m\\@from-xl .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-xl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--s\\@from-xl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-xl .mc-tag-removable__label{padding:calc(0.25rem - 1px) 0.25rem calc(0.25rem - 1px) calc(1rem - 1px)}.mc-tag-removable--s\\@from-xl .mc-tag-removable__remove{width:1.5rem;height:1.5rem;background-size:1rem}.mc-tag-removable--m\\@from-xl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--m\\@from-xl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--m\\@from-xl .mc-tag-removable__label{padding:calc(0.75rem - 1px) 0.25rem calc(0.75rem - 1px) calc(1.5rem - 1px)}.mc-tag-removable--m\\@from-xl .mc-tag-removable__remove{width:2.5rem;height:2.5rem;background-size:1.5rem;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjY2NjY2NjIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==")}}@media screen and (min-width: 1920px){.mc-tag-text--s\\@from-xxl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-text--s\\@from-xxl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-link--s\\@from-xxl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-link--s\\@from-xxl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--s\\@from-xxl .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--s\\@from-xxl .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-selectable--m\\@from-xxl .mc-tag-selectable__pill{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.mc-tag-selectable--m\\@from-xxl .mc-tag-selectable__pill::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-xxl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:0.75rem;padding:calc(0.25rem - 1px) calc(1rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--s\\@from-xxl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:0.875rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--s\\@from-xxl .mc-tag-removable__label{padding:calc(0.25rem - 1px) 0.25rem calc(0.25rem - 1px) calc(1rem - 1px)}.mc-tag-removable--s\\@from-xxl .mc-tag-removable__remove{width:1.5rem;height:1.5rem;background-size:1rem}.mc-tag-removable--m\\@from-xxl{font-family:"LeroyMerlin", sans-serif;font-weight:400;font-size:0.875rem;line-height:1.2857142857;border-radius:1.25rem;padding:calc(0.75rem - 1px) calc(1.5rem - 1px);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;padding:0}.mc-tag-removable--m\\@from-xxl::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;border-radius:1.375rem;top:-0.125rem;right:-0.125rem;bottom:-0.125rem;left:-0.125rem}.mc-tag-removable--m\\@from-xxl .mc-tag-removable__label{padding:calc(0.75rem - 1px) 0.25rem calc(0.75rem - 1px) calc(1.5rem - 1px)}.mc-tag-removable--m\\@from-xxl .mc-tag-removable__remove{width:2.5rem;height:2.5rem;background-size:1.5rem;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjY2NjY2NjIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMSAwIDEwIDEwQTEwIDEwIDAgMCAwIDEyIDJ6bTQuMTQgMTIuN2ExIDEgMCAwIDEtMS40MSAxLjQybC0yLjY4LTIuNjgtMi43OCAyLjc3YTEgMSAwIDEgMS0xLjQxLTEuNDJMMTAuNjMgMTIgNy43OSA5LjIxYTEgMSAwIDEgMSAxLjQyLTEuNDJsMi44NCAyLjgzIDIuNzQtMi43NGExIDEgMCAxIDEgMS40MiAxLjQyTDEzLjQ2IDEyeiIvPjwvc3ZnPg==")}}.mc-price .price__flag--budget-price,.mc-price .price__flag--best-value,.mc-price .price__flag--high-quality,.mc-price .price__flag--star-product{font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:0.75rem;line-height:1.3333333333;display:inline-block;padding:0.5rem;margin-bottom:0.25rem;line-height:0.5rem;text-transform:uppercase}.mc-price .price__flag--budget-price{background-color:#f8cc1c}.mc-price .price__flag--best-value{background-color:#46a610}.mc-price .price__flag--high-quality{background-color:#0b96cc}.mc-price .price__flag--star-product{padding:0.25rem 0.5rem;line-height:1rem;color:#fff;text-transform:none;background-color:#ea302d}.mc-price .price__flag--clearance{display:-webkit-box;display:-ms-flexbox;display:flex}.mc-price .price__flag--clearance-label{font-size:1rem;line-height:1.375;display:inline-block;vertical-align:middle;padding:calc(0.25rem - 1px) 0.5rem;border:1px solid #ea302d;line-height:1.25rem;text-transform:uppercase;color:#ea302d}.mc-price .price__flag--clearance-amount{font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;display:inline-block;vertical-align:middle;padding:0.25rem 0.5rem;background-color:#ea302d;color:#f8cc1c;line-height:1.25rem}.mc-price .price__flag--discount-amount{font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;display:inline-block;vertical-align:middle;padding:0.25rem 0.5rem;background-color:#ea302d;line-height:1.25rem;color:#fff}.mc-price .price__flag--discount-label{font-size:0.75rem;line-height:1.3333333333;display:inline-block;vertical-align:middle;margin-left:0.5rem;color:#ea302d}.mc-price .price__from{line-height:1.75rem}.mc-price .price__from-without-offer{font-size:0.875rem;line-height:1.2857142857;display:inline-block;vertical-align:middle;color:#000000;text-decoration:line-through}.mc-price .price__main{font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:2.125rem;line-height:1.2941176471}.mc-price .price__main__unit{font-size:1rem;line-height:1.375}.mc-price .price__secondary{font-size:0.75rem;line-height:1.3333333333;color:#191919}.mc-price.mc-price--discount .price__main{color:#ea302d}.mc-price.light .price__flag--budget-price,.mc-price.light .price__flag--best-value,.mc-price.light .price__flag--high-quality{padding:0.25rem;line-height:0.75rem}.mc-price.light .price__flag--clearance{display:-webkit-box;display:-ms-flexbox;display:flex}.mc-price.light .price__flag--clearance-label{font-size:0.75rem;line-height:1.3333333333;line-height:0.75rem}.mc-price.light .price__flag--clearance-amount{font-size:0.75rem;line-height:1.3333333333;line-height:0.75rem;padding:calc(0.25rem - 1px) 0.25rem}.mc-price.light .price__main{font-size:1.4375rem;line-height:1.3913043478}.mc-price.light .price__main__unit{font-size:0.875rem;line-height:1.2857142857}',this.shadowRoot.appendChild(s),i(this,{target:this.shadowRoot,props:a(this.attributes),customElement:!0},z,A,r,{light:0,type:1,mainprice:2,mainpricearialabel:3,mainpriceunit:4,secondarypricelabel:5,secondarypriceariallabel:6,flagamount:7,flaglabel:8,flagarialabel:9,priceenddatelabel:10,pricewithoutoffer:11,pricewithoutofferarialabel:12,refundsofferproductlabel:13,refundsoffermediaurl:14},null),e&&(e.target&&t(e.target,this,e.anchor),e.props&&(this.$set(e.props),o()))}static get observedAttributes(){return["light","type","mainprice","mainpricearialabel","mainpriceunit","secondarypricelabel","secondarypriceariallabel","flagamount","flaglabel","flagarialabel","priceenddatelabel","pricewithoutoffer","pricewithoutofferarialabel","refundsofferproductlabel","refundsoffermediaurl"]}get light(){return this.$$.ctx[0]}set light(e){this.$$set({light:e}),o()}get type(){return this.$$.ctx[1]}set type(e){this.$$set({type:e}),o()}get mainprice(){return this.$$.ctx[2]}set mainprice(e){this.$$set({mainprice:e}),o()}get mainpricearialabel(){return this.$$.ctx[3]}set mainpricearialabel(e){this.$$set({mainpricearialabel:e}),o()}get mainpriceunit(){return this.$$.ctx[4]}set mainpriceunit(e){this.$$set({mainpriceunit:e}),o()}get secondarypricelabel(){return this.$$.ctx[5]}set secondarypricelabel(e){this.$$set({secondarypricelabel:e}),o()}get secondarypriceariallabel(){return this.$$.ctx[6]}set secondarypriceariallabel(e){this.$$set({secondarypriceariallabel:e}),o()}get flagamount(){return this.$$.ctx[7]}set flagamount(e){this.$$set({flagamount:e}),o()}get flaglabel(){return this.$$.ctx[8]}set flaglabel(e){this.$$set({flaglabel:e}),o()}get flagarialabel(){return this.$$.ctx[9]}set flagarialabel(e){this.$$set({flagarialabel:e}),o()}get priceenddatelabel(){return this.$$.ctx[10]}set priceenddatelabel(e){this.$$set({priceenddatelabel:e}),o()}get pricewithoutoffer(){return this.$$.ctx[11]}set pricewithoutoffer(e){this.$$set({pricewithoutoffer:e}),o()}get pricewithoutofferarialabel(){return this.$$.ctx[12]}set pricewithoutofferarialabel(e){this.$$set({pricewithoutofferarialabel:e}),o()}get refundsofferproductlabel(){return this.$$.ctx[13]}set refundsofferproductlabel(e){this.$$set({refundsofferproductlabel:e}),o()}get refundsoffermediaurl(){return this.$$.ctx[14]}set refundsoffermediaurl(e){this.$$set({refundsoffermediaurl:e}),o()}}export{T as default};
+//# sourceMappingURL=Price.js.map

package/public/components/price/Price.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Price.js","sources":["../../../src/components/price/Price.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n  import type { PriceType } from './price.types';\n\n  export let light = false;\n  export let type: PriceType = 'default';\n  export let mainprice: string;\n  export let mainpricearialabel: string | undefined = undefined;\n  export let mainpriceunit: string | undefined = undefined;\n  export let secondarypricelabel: string | undefined = undefined;\n  export let secondarypriceariallabel: string | undefined = undefined;\n  export let flagamount: string | undefined = undefined;\n  export let flaglabel: string | undefined = undefined;\n  export let flagarialabel: string | undefined = undefined;\n  export let priceenddatelabel: string | undefined = undefined;\n  export let pricewithoutoffer: string | undefined = undefined;\n  export let pricewithoutofferarialabel: string | undefined = undefined;\n  export let refundsofferproductlabel: string | undefined = undefined;\n  export let refundsoffermediaurl: string | undefined = undefined;\n\n  $: isDiscount = type === 'destocking' || type === 'commercial-operation';\n  $: isDisplayFlag =\n    type === 'budget-price' ||\n    type === 'best-value' ||\n    type === 'high-quality' ||\n    type === 'star-product';\n</script>\n\n<div\n  class=\"mc-price {$$props.class}\"\n  class:light\n  class:mc-price--discount={isDiscount}\n  {...$$restProps}\n>\n  {#if isDisplayFlag}\n    <span class=\"price__flag--{type}\">\n      {flaglabel}\n    </span>\n  {:else if type === 'destocking'}\n    <div class=\"price__flag--clearance\" aria-label={flagarialabel}>\n      <span class=\"price__flag--clearance-label\">{flaglabel}</span>\n      <span class=\"price__flag--clearance-amount\">{flagamount}</span>\n    </div>\n  {:else if type === 'commercial-operation'}\n    <div class=\"price__flag--discount\" aria-label={flagarialabel}>\n      <span class=\"price__flag--discount-amount\">{flagamount}</span>\n      <span class=\"price__flag--discount-label\">{priceenddatelabel}</span>\n    </div>\n  {/if}\n\n  {#if isDiscount}\n    <div class=\"price__from\" aria-label={pricewithoutofferarialabel}>\n      <span class=\"price__from-without-offer\">{pricewithoutoffer}</span>\n    </div>\n  {/if}\n\n  <div class=\"price\">\n    <div class=\"price__main\">\n      <span data-cerberus=\"ELEM_PRIX\" aria-label={mainpricearialabel}>\n        {mainprice}\n      </span>\n      {#if mainpriceunit}\n        <span class=\"price__main__unit\">/ {mainpriceunit}</span>\n      {/if}\n    </div>\n    {#if secondarypricelabel}\n      <span class=\"price__secondary\" aria-label={secondarypriceariallabel}>\n        {secondarypricelabel}\n      </span>\n    {/if}\n  </div>\n\n  {#if !light && refundsofferproductlabel}\n    {#if refundsoffermediaurl}\n      <a\n        class=\"mc-tag-link mc-tag-link__label\"\n        href={refundsoffermediaurl}\n        target=\"_blank\"\n        >{refundsofferproductlabel}\n      </a>\n    {:else}\n      <span class=\"mc-tag-text mc-tag-text--danger mc-tag-text__label\">\n        {refundsofferproductlabel}\n      </span>\n    {/if}\n  {/if}\n</div>\n\n<style lang=\"scss\">\n  @import '@mozaic-ds/styles/settings-tools/_all-settings';\n  @import '@mozaic-ds/styles/components/c.tag';\n\n  .mc-price {\n    .price__flag {\n      &--budget-price,\n      &--best-value,\n      &--high-quality,\n      &--star-product {\n        @include set-font-face('semi-bold');\n        @include set-font-scale('02', 'm');\n        display: inline-block;\n        padding: $mu050;\n        margin-bottom: $mu025;\n        line-height: 0.5rem;\n        text-transform: uppercase;\n      }\n      &--budget-price {\n        background-color: $color-secondary-yellow-500;\n      }\n      &--best-value {\n        background-color: $color-primary-01-500;\n      }\n      &--high-quality {\n        background-color: $color-secondary-blue-500;\n      }\n      &--star-product {\n        padding: $mu025 $mu050;\n        line-height: 1rem;\n        color: #fff;\n        text-transform: none;\n        background-color: $color-secondary-red-500;\n      }\n      &--clearance {\n        display: flex;\n        &-label {\n          @include set-font-scale('05', 'm');\n          display: inline-block;\n          vertical-align: middle;\n          padding: calc(#{$mu025} - 1px) $mu050;\n          border: get-border(s) solid $color-secondary-red-500;\n          line-height: 1.25rem;\n          text-transform: uppercase;\n          color: $color-secondary-red-500;\n        }\n        &-amount {\n          @include set-font-face('semi-bold');\n          @include set-font-scale('05', 'm');\n          display: inline-block;\n          vertical-align: middle;\n          padding: $mu025 $mu050;\n          background-color: $color-secondary-red-500;\n          color: $color-secondary-yellow-500;\n          line-height: 1.25rem;\n        }\n      }\n      &--discount {\n        &-amount {\n          @include set-font-face('semi-bold');\n          @include set-font-scale('05', 'm');\n          display: inline-block;\n          vertical-align: middle;\n          padding: $mu025 $mu050;\n          background-color: $color-secondary-red-500;\n          line-height: 1.25rem;\n          color: #fff;\n        }\n        &-label {\n          @include set-font-scale('02', 'm');\n          display: inline-block;\n          vertical-align: middle;\n          margin-left: $mu050;\n          color: $color-secondary-red-500;\n        }\n      }\n    }\n    .price__from {\n      line-height: 1.75rem;\n      &-without-offer {\n        @include set-font-scale('04', 'm');\n        display: inline-block;\n        vertical-align: middle;\n        color: $color-grey-999;\n        text-decoration: line-through;\n      }\n    }\n    .price__main {\n      @include set-font-face('semi-bold');\n      @include set-font-scale('09', 'm');\n      &__unit {\n        @include set-font-scale('05', 'm');\n      }\n    }\n    .price__secondary {\n      @include set-font-scale('02', 'm');\n      color: $color-grey-900;\n    }\n\n    &.mc-price--discount {\n      .price__main {\n        color: $color-secondary-red-500;\n      }\n    }\n\n    &.light {\n      .price__flag {\n        &--budget-price,\n        &--best-value,\n        &--high-quality {\n          padding: $mu025;\n          line-height: 0.75rem;\n        }\n        &--clearance {\n          display: flex;\n          &-label {\n            @include set-font-scale('02', 'm');\n            line-height: 0.75rem;\n          }\n          &-amount {\n            @include set-font-scale('02', 'm');\n            line-height: 0.75rem;\n            padding: calc(#{$mu025} - 1px) $mu025;\n          }\n        }\n      }\n      .price__main {\n        @include set-font-scale('07', 'm');\n        &__unit {\n          @include set-font-scale('04', 'm');\n        }\n      }\n    }\n  }\n</style>\n"],"names":["ctx","insert","target","div","anchor","append","span0","span1","span","create_if_block_1","a","create_if_block_5","create_if_block_6","create_if_block_7","create_if_block_4","create_if_block_3","create_if_block_2","if_block4","create_if_block","class","div2_class_value","div2","div1","div0","dirty","light","$$props","type","mainprice","mainpricearialabel","mainpriceunit","secondarypricelabel","secondarypriceariallabel","flagamount","flaglabel","flagarialabel","priceenddatelabel","pricewithoutoffer","pricewithoutofferarialabel","refundsofferproductlabel","refundsoffermediaurl","$$invalidate","isDiscount","isDisplayFlag"],"mappings":"kPA8CkDA,EAAU,0BACXA,EAAiB,kJAFfA,EAAa,YAA5DC,EAGKC,EAAAC,EAAAC,GAFHC,EAA6DF,EAAAG,iBAC7DD,EAAmEF,EAAAI,6BADvBP,EAAU,gBACXA,EAAiB,6BAFfA,EAAa,wFAJdA,EAAS,0BACRA,EAAU,oJAFTA,EAAa,YAA7DC,EAGKC,EAAAC,EAAAC,GAFHC,EAA4DF,EAAAG,iBAC5DD,EAA8DF,EAAAI,6BADlBP,EAAS,eACRA,EAAU,4BAFTA,EAAa,uEAH1DA,EAAS,kCADeA,EAAI,YAA/BC,EAEMC,EAAAM,EAAAJ,6BADHJ,EAAS,gCADeA,EAAI,kGAiBYA,EAAiB,0FADvBA,EAA0B,aAA/DC,EAEKC,EAAAC,EAAAC,GADHC,EAAiEF,EAAAK,8BAAxBR,EAAiB,8BADvBA,EAA0B,wEAW3B,UAAGA,EAAa,6CAAhDC,EAAuDC,EAAAM,EAAAJ,mCAApBJ,EAAa,qEAK/CA,EAAmB,qDADqBA,EAAwB,YAAnEC,EAEMC,EAAAM,EAAAJ,4BADHJ,EAAmB,2BADqBA,EAAwB,+DAOhEA,EAAoB,IAAAS,+NASpBT,EAAwB,+EAD3BC,EAEMC,EAAAM,EAAAJ,8BADHJ,EAAwB,mEAJvBA,EAAwB,8DAFpBA,EAAoB,oCAF5BC,EAKGC,EAAAQ,EAAAN,8BADCJ,EAAwB,yBAFpBA,EAAoB,oFA1C3BA,EAAa,IAAAW,EAIC,eAATX,KAAqBY,EAKZ,yBAATZ,KAA+Ba,OAA/B,yBAOLb,EAAU,KAAAc,EAAAd,KAWNA,EAAa,IAAAe,EAAAf,KAIfA,EAAmB,IAAAgB,EAAAhB,GAOpBiB,GAAAjB,MAASA,EAAwB,KAAAkB,EAAAlB,OA3CtBmB,MAAAC,EAAA,YAAApB,MAAQmB,OAGrBnB,EAAW,4IA2BRA,EAAS,4GADgCA,EAAkB,sGA3BxCA,EAAU,aAHtCC,EA0DKC,EAAAmB,EAAAjB,+CA9BHC,EAcKgB,EAAAC,GAbHjB,EAOKiB,EAAAC,GANHlB,EAEMkB,EAAAf,yJAVLR,EAAU,mEASRA,EAAS,0BADgCA,EAAkB,IAGzDA,EAAa,4DAIfA,EAAmB,6DAOpBA,MAASA,EAAwB,wEA3CtB,OAAAwB,GAAAJ,KAAAA,EAAA,YAAApB,MAAQmB,QAAK,CAAAA,MAAAC,aAG1BpB,EAAW,kDADWA,EAAU,6YA3BzByB,MAAAA,GAAQ,GAAKC,GACbC,KAAAA,EAAkB,WAASD,aAC3BE,GAAiBF,GACjBG,mBAAAA,GAAkDH,GAClDI,cAAAA,GAA6CJ,GAC7CK,oBAAAA,GAAmDL,GACnDM,yBAAAA,GAAwDN,GACxDO,WAAAA,GAA0CP,GAC1CQ,UAAAA,GAAyCR,GACzCS,cAAAA,GAA6CT,GAC7CU,kBAAAA,GAAiDV,GACjDW,kBAAAA,GAAiDX,GACjDY,2BAAAA,GAA0DZ,GAC1Da,yBAAAA,GAAwDb,GACxDc,qBAAAA,GAAoDd,uzBAE9De,EAAA,GAAEC,EAAsB,eAATf,GAAkC,yBAATA,sBACtCgB,EACQ,iBAAThB,GACS,eAATA,GACS,iBAATA,GACS,iBAATA"}

package/public/components/price/Price.svelte

@@ -0,0 +1,224 @@
+<svelte:options tag={null} />
+
+<script lang="ts">
+  import type { PriceType } from './price.types';
+
+  export let light = false;
+  export let type: PriceType = 'default';
+  export let mainprice: string;
+  export let mainpricearialabel: string | undefined = undefined;
+  export let mainpriceunit: string | undefined = undefined;
+  export let secondarypricelabel: string | undefined = undefined;
+  export let secondarypriceariallabel: string | undefined = undefined;
+  export let flagamount: string | undefined = undefined;
+  export let flaglabel: string | undefined = undefined;
+  export let flagarialabel: string | undefined = undefined;
+  export let priceenddatelabel: string | undefined = undefined;
+  export let pricewithoutoffer: string | undefined = undefined;
+  export let pricewithoutofferarialabel: string | undefined = undefined;
+  export let refundsofferproductlabel: string | undefined = undefined;
+  export let refundsoffermediaurl: string | undefined = undefined;
+
+  $: isDiscount = type === 'destocking' || type === 'commercial-operation';
+  $: isDisplayFlag =
+    type === 'budget-price' ||
+    type === 'best-value' ||
+    type === 'high-quality' ||
+    type === 'star-product';
+</script>
+
+<div
+  class="mc-price {$$props.class}"
+  class:light
+  class:mc-price--discount={isDiscount}
+  {...$$restProps}
+>
+  {#if isDisplayFlag}
+    <span class="price__flag--{type}">
+      {flaglabel}
+    </span>
+  {:else if type === 'destocking'}
+    <div class="price__flag--clearance" aria-label={flagarialabel}>
+      <span class="price__flag--clearance-label">{flaglabel}</span>
+      <span class="price__flag--clearance-amount">{flagamount}</span>
+    </div>
+  {:else if type === 'commercial-operation'}
+    <div class="price__flag--discount" aria-label={flagarialabel}>
+      <span class="price__flag--discount-amount">{flagamount}</span>
+      <span class="price__flag--discount-label">{priceenddatelabel}</span>
+    </div>
+  {/if}
+
+  {#if isDiscount}
+    <div class="price__from" aria-label={pricewithoutofferarialabel}>
+      <span class="price__from-without-offer">{pricewithoutoffer}</span>
+    </div>
+  {/if}
+
+  <div class="price">
+    <div class="price__main">
+      <span data-cerberus="ELEM_PRIX" aria-label={mainpricearialabel}>
+        {mainprice}
+      </span>
+      {#if mainpriceunit}
+        <span class="price__main__unit">/ {mainpriceunit}</span>
+      {/if}
+    </div>
+    {#if secondarypricelabel}
+      <span class="price__secondary" aria-label={secondarypriceariallabel}>
+        {secondarypricelabel}
+      </span>
+    {/if}
+  </div>
+
+  {#if !light && refundsofferproductlabel}
+    {#if refundsoffermediaurl}
+      <a
+        class="mc-tag-link mc-tag-link__label"
+        href={refundsoffermediaurl}
+        target="_blank"
+        >{refundsofferproductlabel}
+      </a>
+    {:else}
+      <span class="mc-tag-text mc-tag-text--danger mc-tag-text__label">
+        {refundsofferproductlabel}
+      </span>
+    {/if}
+  {/if}
+</div>
+
+<style lang="scss">
+  @import '@mozaic-ds/styles/settings-tools/_all-settings';
+  @import '@mozaic-ds/styles/components/c.tag';
+
+  .mc-price {
+    .price__flag {
+      &--budget-price,
+      &--best-value,
+      &--high-quality,
+      &--star-product {
+        @include set-font-face('semi-bold');
+        @include set-font-scale('02', 'm');
+        display: inline-block;
+        padding: $mu050;
+        margin-bottom: $mu025;
+        line-height: 0.5rem;
+        text-transform: uppercase;
+      }
+      &--budget-price {
+        background-color: $color-secondary-yellow-500;
+      }
+      &--best-value {
+        background-color: $color-primary-01-500;
+      }
+      &--high-quality {
+        background-color: $color-secondary-blue-500;
+      }
+      &--star-product {
+        padding: $mu025 $mu050;
+        line-height: 1rem;
+        color: #fff;
+        text-transform: none;
+        background-color: $color-secondary-red-500;
+      }
+      &--clearance {
+        display: flex;
+        &-label {
+          @include set-font-scale('05', 'm');
+          display: inline-block;
+          vertical-align: middle;
+          padding: calc(#{$mu025} - 1px) $mu050;
+          border: get-border(s) solid $color-secondary-red-500;
+          line-height: 1.25rem;
+          text-transform: uppercase;
+          color: $color-secondary-red-500;
+        }
+        &-amount {
+          @include set-font-face('semi-bold');
+          @include set-font-scale('05', 'm');
+          display: inline-block;
+          vertical-align: middle;
+          padding: $mu025 $mu050;
+          background-color: $color-secondary-red-500;
+          color: $color-secondary-yellow-500;
+          line-height: 1.25rem;
+        }
+      }
+      &--discount {
+        &-amount {
+          @include set-font-face('semi-bold');
+          @include set-font-scale('05', 'm');
+          display: inline-block;
+          vertical-align: middle;
+          padding: $mu025 $mu050;
+          background-color: $color-secondary-red-500;
+          line-height: 1.25rem;
+          color: #fff;
+        }
+        &-label {
+          @include set-font-scale('02', 'm');
+          display: inline-block;
+          vertical-align: middle;
+          margin-left: $mu050;
+          color: $color-secondary-red-500;
+        }
+      }
+    }
+    .price__from {
+      line-height: 1.75rem;
+      &-without-offer {
+        @include set-font-scale('04', 'm');
+        display: inline-block;
+        vertical-align: middle;
+        color: $color-grey-999;
+        text-decoration: line-through;
+      }
+    }
+    .price__main {
+      @include set-font-face('semi-bold');
+      @include set-font-scale('09', 'm');
+      &__unit {
+        @include set-font-scale('05', 'm');
+      }
+    }
+    .price__secondary {
+      @include set-font-scale('02', 'm');
+      color: $color-grey-900;
+    }
+
+    &.mc-price--discount {
+      .price__main {
+        color: $color-secondary-red-500;
+      }
+    }
+
+    &.light {
+      .price__flag {
+        &--budget-price,
+        &--best-value,
+        &--high-quality {
+          padding: $mu025;
+          line-height: 0.75rem;
+        }
+        &--clearance {
+          display: flex;
+          &-label {
+            @include set-font-scale('02', 'm');
+            line-height: 0.75rem;
+          }
+          &-amount {
+            @include set-font-scale('02', 'm');
+            line-height: 0.75rem;
+            padding: calc(#{$mu025} - 1px) $mu025;
+          }
+        }
+      }
+      .price__main {
+        @include set-font-scale('07', 'm');
+        &__unit {
+          @include set-font-scale('04', 'm');
+        }
+      }
+    }
+  }
+</style>

package/public/components/price/price.types.d.ts

@@ -0,0 +1,2 @@
+export type PriceType = 'default' | 'budget-price' | 'best-value' | 'high-quality' | 'star-product' | 'destocking' | 'commercial-operation';
+//# sourceMappingURL=price.types.d.ts.map

package/public/components/price/price.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"price.types.d.ts","sourceRoot":"","sources":["../../../src/components/price/price.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GACjB,SAAS,GACT,cAAc,GACd,YAAY,GACZ,cAAc,GACd,cAAc,GACd,YAAY,GACZ,sBAAsB,CAAC"}

package/public/components/progressbar/ProgressBar.js

@@ -0,0 +1,2 @@
+import{S as e,i as r,a as s,b as a,f as t,s as i,c as n,e as o,t as c,d as p,n as l,g as d,y as m,h as g,j as b,m as u,o as h,p as v,q as x,k as f}from"../../index-c33b3772.js";function $(e){let r,s,t;return{c(){r=o("div"),s=c(e[0]),t=c("%"),d(r,"class","mc-progressbar__percentage")},m(e,i){a(e,r,i),b(r,s),b(r,t)},p(e,r){1&r&&f(s,e[0])},d(e){e&&h(r)}}}function _(e){let r,s,t,i,v,x=e[3]&&$(e),f=[{class:v=e[4](e[3])+" "+e[5].class},e[6]],_={};for(let e=0;e<f.length;e+=1)_=n(_,f[e]);return{c(){r=o("div"),s=o("div"),t=c(" "),i=p(),x&&x.c(),this.c=l,d(s,"class","mc-progressbar__indicator"),d(s,"role","progressbar"),d(s,"aria-valuenow",e[0]),d(s,"aria-valuemin",e[1]),d(s,"aria-valuemax",e[2]),m(s,"width",e[0]+"%"),g(r,_)},m(e,n){a(e,r,n),b(r,s),b(s,t),b(r,i),x&&x.m(r,null)},p(e,[a]){1&a&&d(s,"aria-valuenow",e[0]),2&a&&d(s,"aria-valuemin",e[1]),4&a&&d(s,"aria-valuemax",e[2]),1&a&&m(s,"width",e[0]+"%"),e[3]?x?x.p(e,a):(x=$(e),x.c(),x.m(r,null)):x&&(x.d(1),x=null),g(r,_=u(f,[40&a&&v!==(v=e[4](e[3])+" "+e[5].class)&&{class:v},64&a&&e[6]]))},i:l,o:l,d(e){e&&h(r),x&&x.d()}}}function w(e,r,s){const a=["value","valuemin","valuemax","displaypercentage","size","branded"];let t=v(r,a),{value:i}=r,{valuemin:o=0}=r,{valuemax:c=100}=r,{displaypercentage:p}=r,{size:l="m"}=r,{branded:d}=r;return e.$$set=e=>{s(5,r=n(n({},r),x(e))),s(6,t=v(r,a)),"value"in e&&s(0,i=e.value),"valuemin"in e&&s(1,o=e.valuemin),"valuemax"in e&&s(2,c=e.valuemax),"displaypercentage"in e&&s(3,p=e.displaypercentage),"size"in e&&s(7,l=e.size),"branded"in e&&s(8,d=e.branded)},r=x(r),[i,o,c,p,function(e){const r=["mc-progressbar"];return e&&r.push("mc-progressbar--percent"),i>=51&&r.push("mc-progressbar--half"),"s"===l?r.push("mc-progressbar--s"):"xs"===l&&r.push("mc-progressbar--xs"),d&&r.push("mc-progressbar--branded"),r.join(" ")},r,t,l,d]}class y extends e{constructor(e){super();const n=document.createElement("style");n.textContent='.mc-progressbar{font-family:"LeroyMerlin", sans-serif;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#cccccc;display:-webkit-box;display:-ms-flexbox;display:flex;height:0.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative}.mc-progressbar,.mc-progressbar__indicator{border-radius:4px;overflow:hidden}.mc-progressbar__indicator{background-color:#007bb4;height:100%;left:0;position:absolute;-webkit-transition:width 0.4s ease;-o-transition:width 0.4s ease;transition:width 0.4s ease;top:0}.mc-progressbar--static .mc-progressbar__indicator{-webkit-transition:none;-o-transition:none;transition:none}.mc-progressbar__percentage{font-size:0.875rem;line-height:1.2857142857;font-weight:600;color:#191919;position:relative;z-index:1}.mc-progressbar--half .mc-progressbar__percentage{color:#ffffff}.mc-progressbar:not(.mc-progressbar--percent) .mc-progressbar__percentage{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;visibility:visible;white-space:nowrap}.mc-progressbar--xs{height:0.125rem}.mc-progressbar--xs,.mc-progressbar--xs .mc-progressbar__indicator{border-radius:1px}.mc-progressbar--s{height:0.25rem}.mc-progressbar--s,.mc-progressbar--s .mc-progressbar__indicator{border-radius:2px}.mc-progressbar--percent{height:1.5rem}.mc-progressbar--percent,.mc-progressbar--percent .mc-progressbar__indicator{border-radius:12px}.mc-progressbar--branded .mc-progressbar__indicator{background-color:#46a610}',this.shadowRoot.appendChild(n),r(this,{target:this.shadowRoot,props:s(this.attributes),customElement:!0},w,_,i,{value:0,valuemin:1,valuemax:2,displaypercentage:3,size:7,branded:8},null),e&&(e.target&&a(e.target,this,e.anchor),e.props&&(this.$set(e.props),t()))}static get observedAttributes(){return["value","valuemin","valuemax","displaypercentage","size","branded"]}get value(){return this.$$.ctx[0]}set value(e){this.$$set({value:e}),t()}get valuemin(){return this.$$.ctx[1]}set valuemin(e){this.$$set({valuemin:e}),t()}get valuemax(){return this.$$.ctx[2]}set valuemax(e){this.$$set({valuemax:e}),t()}get displaypercentage(){return this.$$.ctx[3]}set displaypercentage(e){this.$$set({displaypercentage:e}),t()}get size(){return this.$$.ctx[7]}set size(e){this.$$set({size:e}),t()}get branded(){return this.$$.ctx[8]}set branded(e){this.$$set({branded:e}),t()}}export{y as default};
+//# sourceMappingURL=ProgressBar.js.map