@jumpgroup/jump-design-system 0.3.24 → 0.3.26

package/dist/cjs/jump-card-ecommerce.cjs.entry.js

@@ -70,19 +70,6 @@ const JumpCardEcommerce = class {
         }
         this.formatPrices();
     }
-    /**
-     * Format prices in locale currency
-     */
-    formatPrices() {
-        var _a;
-        let locale = (_a = document.documentElement.lang) !== null && _a !== void 0 ? _a : 'it-IT';
-        if (locale.length == 2) {
-            locale = `${locale}-${locale.toUpperCase()}`;
-        }
-        // Format price with 2 decimal digits and in locale
-        this.priceFormatted = this.price.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-        this.salePriceFormatted = this.salePrice.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-    }
     disconnectedCallback() {
         this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');
         if (this.jumpQuantityEl) {
@@ -126,6 +113,16 @@ const JumpCardEcommerce = class {
             addToWaitingList: this.addToWaitingList
         });
     }
+    formatPrices() {
+        var _a;
+        let locale = (_a = document.documentElement.lang) !== null && _a !== void 0 ? _a : 'it-IT';
+        if (locale.length == 2) {
+            locale = `${locale}-${locale.toUpperCase()}`;
+        }
+        // Format price with 2 decimal digits and in locale
+        this.priceFormatted = this.price.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+        this.salePriceFormatted = this.salePrice.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+    }
     render() {
         const backgroundClass = this.hasBackground && !this.isMini ? 'hasBackground' : '';
         const iconOnlyClass = this.onlyIconButton && !this.isMini ? 'iconOnly' : '';

package/dist/cjs/jump-card-ecommerce.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"jump-card-ecommerce.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/jump-card-ecommerce/jump-card-ecommerce.scss?tag=jump-card-ecommerce&encapsulation=shadow","src/components/jump-card-ecommerce/jump-card-ecommerce.tsx"],"sourcesContent":[":host {\n  --card-max-width: 450px;\n  --jump-card-max-width-horizontal: 100%;\n  --jump-card-color: var(--neutral-grey-primary);\n  --jump-card-background: transparent;\n  --jump-card-border-color: var(--neutral-grey-background);\n  --jump-card-padding: 0.5rem;\n\n  max-width: var(--card-max-width);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  font-family: var(--ff-primary, 'Arial'), sans-serif;\n  line-height: var(--lh-400, 1.3);\n  background-color: var(--jump-card-background);\n  color: var(--jump-card-color);\n\n  .Footer,\n  .Body {\n    display: flex;\n    width: 100%;\n  }\n\n  jump-badge {\n    position: absolute;\n    top: 1rem;\n    left: 1rem;\n    z-index: 2;\n\n    &.hasBackground.iconOnly {\n      top: calc(1rem + 8px);\n      left: calc(1rem + 8px);\n    }\n  }\n\n  .Favorite {\n    position: absolute;\n    top: 1rem;\n    right: 1rem;\n    z-index: 2;\n\n    &.hasBackground.iconOnly {\n      top: calc(1rem + 8px);\n      right: calc(1rem + 8px);\n    }\n  }\n\n  .Media {\n    // aspect-ratio: 3/4;\n    overflow: hidden;\n    position: relative;\n    border-radius: 3px;\n    aspect-ratio: 1/1;\n\n    .Images {\n      height: 100%;\n      margin: 0;\n      position: relative;\n\n      img {\n        height: 100%;\n        width: 100%;\n        object-fit: cover;\n        position: absolute;\n        top: 0;\n        left: 0;\n        overflow: hidden;\n      }\n\n      &__Front {\n        z-index: 1;\n        transition: opacity 0.5s linear;\n        cursor: pointer;\n      }\n\n      &.has-hover-image {\n        &:hover .Images__Front {\n          opacity: 0;\n        }\n      }\n    }\n\n    &.hasBackground {\n      background-color: var(--neutral-white);\n\n      &.iconOnly {\n        border-top-left-radius: 6px;\n        border-top-right-radius: 6px;\n        padding: var(--jump-card-padding) var(--jump-card-padding) 0;\n\n        img {\n          border-radius: 6px;\n        }\n      }\n    }\n\n    &.iconOnly {\n      border-bottom-right-radius: 0;\n    }\n\n    &.is-mini {\n      max-width: 180px;\n    }\n  }\n\n  .NotificationCart {\n    display: none;\n    position: absolute;\n    bottom: 0px;\n    width: 100%;\n    padding: 2rem 1rem;\n    background-color: hsl(0 0% 0% / 35%);\n    box-sizing: border-box;\n    z-index: 2;\n    transform: translate3d(0, 0, 0);\n\n    &.is-active {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n\n  .Content {\n    &.hasBackground {\n      background-color: var(--neutral-white);\n      padding: calc(var(--jump-card-padding) * 2);\n    }\n\n    &.iconOnly {\n      padding: calc(var(--jump-card-padding) * 2) var(--jump-card-padding);\n    }\n\n    &.is-mini {\n      max-width: 180px;\n    }\n  }\n\n  .Body {\n    display: flex;\n    flex-direction: column;\n    gap: 0.75rem;\n    padding: var(--jump-card-padding) 0;\n\n    & > * {\n      display: flex;\n      flex-direction: row;\n      justify-content: space-between;\n\n      & > * {\n        flex: 0 1 auto;\n      }\n    }\n\n    &.hasBackground {\n      padding: 0 0 var(--jump-card-padding);\n    }\n\n    &.iconOnly {\n      padding: 0;\n    }\n\n    &.is-mini {\n      & > * {\n        flex-direction: column;\n      }\n\n      padding: calc(var(--jump-card-padding) / 2) 0;\n    }\n  }\n\n  .Product {\n    font-size: var(--fs-400);\n  }\n\n  .Subtitle {\n    font-size: var(--fs-300);\n    color: var(--neutral-grey-secondary);\n    line-height: 1.2;\n  }\n\n  .Footer {\n    line-height: var(--lh-400);\n    justify-content: end;\n    padding: var(--jump-card-padding) 0;\n    align-items: flex-end;\n\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    &.hasBackground {\n      padding-bottom: 0;\n    }\n\n    &.iconOnly {\n      padding: 0;\n    }\n\n    &.is-mini {\n      padding: calc(var(--jump-card-padding) / 2) 0;\n    }\n  }\n\n  .OutOfStock {\n    justify-items: start;\n    font-size: var(--fs-300);\n    font-weight: var(--fw-900);\n    color: var(--status-danger-standard);\n  }\n\n  .OnlyIconButton {\n    position: absolute;\n    bottom: 0;\n    right: 0;\n    background: var(--neutral-white);\n    border-top-left-radius: 20px;\n    padding: 8px 8px 0px 8px;\n    z-index: 2;\n  }\n\n  .Price {\n    position: relative;\n    display: grid;\n    grid-template-columns: auto auto;\n    grid-template-rows: 1.5rem 1.5rem auto;\n    justify-items: end;\n    align-items: end;\n    column-gap: 0.5rem;\n\n    font-size: var(--fs-500);\n    font-weight: var(--fw-900);\n    line-height: var(--lh-400);\n\n    & > * {\n      display: inline-flex;\n    }\n\n    &__Regular {\n      text-align: right;\n\n      &.sale {\n        text-decoration: line-through;\n        color: var(--neutral-grey-secondary);\n        font-weight: var(--fw-400);\n        font-size: var(--fs-400);\n        grid-column: 2;\n        grid-row: 1;\n      }\n    }\n\n    &__Sale {\n      grid-column: 2;\n      grid-row: 2;\n    }\n\n    &__Discount {\n      color: var(--status-danger-standard);\n      font-weight: var(--fw-400);\n      font-size: var(--fs-300);\n      grid-column: 1;\n      grid-row: 1;\n    }\n\n    &.is-mini {\n      display: flex;\n      font-size: var(--fs-400);\n    }\n  }\n\n  .SelectVariations {\n    select {\n      appearance: none;\n      background-color: transparent;\n      border: 1px solid var(--neutral-grey-secondary);\n      border-radius: 3px;\n      color: var(--neutral-grey-secondary);\n      font-size: var(--fs-300);\n      padding: 0.5rem 0.75rem;\n      max-width: 100%;\n      background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E\");\n      background-position: right 0.5rem center;\n      background-repeat: no-repeat;\n      background-size: 1.5em 1.5em;\n      padding-right: 2.5rem;\n      -webkit-print-color-adjust: exact;\n    }\n  }\n}\n\n.slide-in-bottom {\n  animation: slide-in-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.slide-out-bottom {\n  animation: slide-out-bottom 0.5s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;\n}\n\n.fade-in-out {\n  animation-name: fade-in-out;\n  animation-duration: 6s;\n  animation-timing-function: ease-in-out;\n}\n\n@keyframes fade-in-out {\n  from {\n    opacity: 0;\n    transform: translateY(100px);\n  }\n\n  50% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  to {\n    opacity: 0;\n    transform: translateY(100px);\n  }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Listen} from '@stencil/core';\n\ninterface Variation {\n  code: string;\n  imgUrl: string;\n  label: string;\n  taxonomy: string;\n  // Add more keys as needed\n}\n\n@Component({\n  tag: 'jump-card-ecommerce',\n  styleUrl: 'jump-card-ecommerce.scss',\n  shadow: true,\n})\nexport class JumpCardEcommerce {\n\n  @Element() JumpCardEcommerce: HTMLElement;\n  jumpQuantityEl;\n\n  /* ---------------------- @PROPERTIES ------------------------- */\n\n  /** Indicate if card has only icon button*/\n  @Prop() onlyIconButton: boolean = false;\n\n  /** Indicate if card has background*/\n  @Prop() hasBackground: boolean = false;\n\n  /** Indicates the badge of the card*/\n  @Prop() badge: string;\n\n  /**  Indicates if the product is favorite */\n\n  @Prop({mutable:true, reflect: true}) favorite: boolean = false;\n\n  /** Indicate if the whislist is active in shop*/\n  @Prop() hasFavorite: boolean = false;\n\n  /** Indicate if the whislist will be slotted*/\n  @Prop() hasSlotForFavorite: boolean = false;\n\n  /** Indicates if the favorite button is render as an anchor, and define the url*/\n  @Prop() favoriteHref: string;\n\n  /** Indicates the link of the card*/\n  @Prop() link: string;\n\n  /** Indicates the image's src of the card*/\n  @Prop() img: string ;\n\n  /** Indicates the img's alt of the card*/\n  @Prop() imgAlt: string;\n\n  /** Indicates the over image's src of the card*/\n  @Prop() hoverImg: string ;\n\n  /** Indicates the hover img's alt of the card*/\n  @Prop() hoverImgAlt: string;\n\n  /** Indicates the videoSrc of the card*/\n  @Prop() videoSrc: string;\n\n  /** Indicates the notificationUrl of the card*/\n  @Prop() notificationUrl: string;\n\n  /** Indicates the notificationText of the card*/\n  @Prop() notificationText: string = '';\n\n  /** Indicates the title of the card*/\n  @Prop() productName: string ;\n\n  /** Indicates the subtitle of the card*/\n  @Prop() subtitle: string;\n\n  /** Indicates the ID of the product, can be also a SKU*/\n  @Prop() productId: string ;\n\n  /**  Indicates the price of the card */\n  @Prop() price: number;\n\n  /** Indicates the sale price of the card */\n  @Prop() salePrice: number;\n\n  /** Indicates the currency of the card */\n  @Prop() currency: string = '€';\n\n  /** Indicates if the product is outOfStock */\n  @Prop({mutable:true, reflect: true}) outOfStock: boolean = false;\n\n  /** Indicates the outOfStockText of the product*/\n  @Prop() outOfStockText: string;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() addToCartText: string ;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() waitingListText: string ;\n\n  /** Indicate if the user request to be notified when te product is avaible*/\n  @Prop() addToWaitingList: boolean = false;\n\n  /** Indicate if the card is Mini Card*/\n  @Prop() isMini: boolean = false;\n\n  /* ---------------------- @STATE ------------------------- */\n\n  /** Indicate if the product is added to cart --> non deve esserci nelle storie! */\n  @Prop() addedToCart: boolean = false;\n\n  @Prop() endAddedToCart: boolean = false;\n\n  @State() variations: Variation[] = [];\n\n  @State() selectedVariation: Variation;\n\n  @State() priceFormatted: string;\n  @State() salePriceFormatted: string;\n\n  // è una proprietà che viene cambiata solo da dentro\n  quantity: number;\n\n  variationSelectEl: HTMLSelectElement;\n\n /* ---------------------- @EVENTS ------------------------- */\n\n  @Event({eventName: 'jump-toggle-favorite'}) toggleFavorite: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-cart'}) productAddToCart: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-waiting-list'}) productWaitingList: EventEmitter;\n\n  @Event({ eventName: 'jump-variation-selected' }) variationSelected: EventEmitter; // verificare se corretto: aggiungo un evento\n\n  @Listen(\"jump-card-ecommerce-option-connected\")\n  addOption(e) {\n    let props = e.detail; // es {code: 'sku1', imageUrl: 'https://google.com/'}\n    this.variations = [...this.variations, { ...props }];\n  }\n\n  onVariationSelected() {\n    let currentValue = this.variationSelectEl.value;\n    let variation = this.variations.find(\n      (variation) => variation.code == currentValue,\n    );\n    this.selectedVariation = variation;\n    this.variationSelected.emit(variation); // verificare se corretto: emetto l'evento\n  }\n\n\n  /* ---------------------- @LIFECYCLE ------------------------- */\n\n  componentWillLoad() {}\n\n  componentDidLoad() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.addEventListener('jump-change',  this.onQuantityChange.bind(this));\n      this.quantity = this.jumpQuantityEl.getValue().then((quantity) => {\n        this.quantity = quantity;\n      });\n    }\n    this.formatPrices();\n  }\n\n  /**\n   * Format prices in locale currency\n   */\n  formatPrices() {\n    let locale = document.documentElement.lang ?? 'it-IT';\n    if(locale.length == 2) {\n      locale = `${locale}-${locale.toUpperCase()}`;\n    }\n\n    // Format price with 2 decimal digits and in locale\n    this.priceFormatted = this.price.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n    this.salePriceFormatted = this.salePrice.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n  }\n\n  disconnectedCallback() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.removeEventListener('jump-change',this.onQuantityChange);\n    }\n  }\n\n  /* ---------------------- @METHODS ------------------------- */\n  onQuantityChange(e) {\n    this.quantity = e.detail.value ?? false;\n  }\n\n  onToggleFavorite() {\n    this.favorite = !this.favorite;\n    this.toggleFavorite.emit(\n      {\n        productId: this.productId,\n        favorite: this.favorite\n      }\n    );\n  }\n\n  addProductToCart() {\n    this.addedToCart = true;\n    let variations = this.selectedVariation;\n    if(!variations && this.variations.length > 0) {\n      variations = this.variations[0];\n    }\n\n    const payload = {\n      productId: this.productId,\n      addedToCart: this.addedToCart,\n      quantity: this.quantity ?? null,\n      variation: variations ?? null\n    };\n    this.productAddToCart.emit(payload);\n\n    setTimeout(() => {\n      this.addedToCart = false;\n    }, 6000);\n  }\n\n  waitingList() {\n    this.addToWaitingList = true;\n    this.productWaitingList.emit(\n      {\n        productId: this.productId,\n        addToWaitingList: this.addToWaitingList\n      }\n    )\n  }\n\n  render() {\n    const backgroundClass = this.hasBackground && !this.isMini ? 'hasBackground' : '';\n    const iconOnlyClass = this.onlyIconButton && !this.isMini ? 'iconOnly' : '';\n    const justifyClass = this.outOfStock ? 'justify-between' : '';\n    const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\n    const miniCard = this.isMini ? 'is-mini' : '';\n\n    function calculateDiscount(price: number, salePrice: number): string {\n      const discount = ((price - salePrice) / price) * 100;\n      return discount.toFixed(0);\n    };\n\n    return (\n      <Host>\n        { !this.isMini && this.badge ? <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant=\"secondary\" dimension=\"small\" label={this.badge}></jump-badge> : ''}\n\n        { !this.isMini && this.hasFavorite ?\n          this.favoriteHref != '' ?\n          <jump-button href={this.favoriteHref} onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n              :\n          <jump-button onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n        :\n          this.hasSlotForFavorite ? <div class=\"Favorite\"><slot name=\"favorite\"></slot> </div> : null\n        }\n\n        <div class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}>\n          <a href={this.link}>\n            <figure class={`Images ${hasImageOnHover} `}>\n              {this.img && !this.videoSrc ? <img class=\"Images__Front\" src={this.img} alt={this.imgAlt}></img> : ''}\n              {this.hoverImg && !this.videoSrc ? <img class=\"Images__OnHover\" src={this.hoverImg} alt={this.hoverImgAlt}></img> : ''}\n            </figure>\n            {this.videoSrc && !this.img ?\n              <video autoplay>\n                <source src={this.videoSrc} type=\"video/mp4\"/>\n                <source src={this.videoSrc} type=\"video/mov\"/>\n                <source src={this.videoSrc} type=\"video/webm\"/>\n              </video> : ''}\n          </a>\n          { !this.isMini ?\n            <div class={`NotificationCart ${this.addedToCart == true ? 'is-active fade-in-out' : ''}`}>\n              <jump-button href={this.notificationUrl} variant=\"white\" text>\n                <jump-icon slot=\"prefix\" name=\"check\"></jump-icon>\n                <span> {this.notificationText} </span>\n              </jump-button>\n            </div>\n          : null}\n          { !this.isMini && this.onlyIconButton ?\n            <div class=\"OnlyIconButton\">\n              <jump-button variant=\"secondary\" size=\"large\" pill onlyIcon onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name='cart-shopping' category=\"regular\"></jump-icon>\n              </jump-button>\n            </div>\n            : ''\n          }\n        </div>\n\n        <div class={`Content ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n          <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n            <div>\n              <div class=\"Info\">\n                <div class=\"Product\">{this.productName}</div>\n                { !this.isMini && this.subtitle ? <div class=\"Subtitle\">{this.subtitle}</div> : null}\n              </div>\n\n              {this.price ?\n                <div class={`Price ${miniCard}`}>\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Discount\"> {calculateDiscount(this.price, this.salePrice)}% </div>\n                  : null}\n\n                  {!this.isMini ?\n                    <div class={`Price__Regular ${this.salePrice && this.salePrice < this.price ? 'sale' : ''}`}>\n                      {this.currency}{this.priceFormatted}\n                    </div>\n                  :\n                    <div class={`Price__Regular`}>\n                      {this.currency}{ this.salePrice && this.salePrice < this.price ? this.salePriceFormatted : this.priceFormatted}\n                    </div>\n                  }\n\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Sale\">{this.currency}{this.salePriceFormatted}</div>\n                  : null}\n                </div>\n                : null}\n            </div>\n\n            {!this.isMini ?\n              <div class=\"SelectVariations\">\n                {this.variations.length != 0 ?\n                  <select\n                    ref={(el) => (this.variationSelectEl = el)} //salvo questo elemento in this.variationSelectEl\n                    onChange={() => {\n                      this.onVariationSelected();\n                    }}\n                  >\n                    {this.variations\n                      .filter((variation) => !variation.imgUrl)\n                      .map((variation) => (\n                        <option value={variation.code}>{variation.label}</option>\n                    ))}\n                  </select>\n                : null }\n              </div>\n            : null}\n\n            {!this.isMini ? <slot name=\"quantity\"></slot> : null}\n          </div>\n\n          <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n            {this.outOfStock ? <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n            { this.outOfStock ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.waitingList()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.waitingListText ? this.waitingListText : 'Notifica disponibilità'}\n              </jump-button> : ''\n            }\n\n            { !this.outOfStock && !this.onlyIconButton ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.addToCartText ? this.addToCartText : 'Aggiungi al carrello'}\n              </jump-button> : ''\n            }\n\n          </div>\n\n        </div>\n      </Host>\n    );\n  }\n\n}\n"],"version":3}
+{"file":"jump-card-ecommerce.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/jump-card-ecommerce/jump-card-ecommerce.scss?tag=jump-card-ecommerce&encapsulation=shadow","src/components/jump-card-ecommerce/jump-card-ecommerce.tsx"],"sourcesContent":[":host {\n  --card-max-width: 450px;\n  --jump-card-max-width-horizontal: 100%;\n  --jump-card-color: var(--neutral-grey-primary);\n  --jump-card-background: transparent;\n  --jump-card-border-color: var(--neutral-grey-background);\n  --jump-card-padding: 0.5rem;\n\n  max-width: var(--card-max-width);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  font-family: var(--ff-primary, 'Arial'), sans-serif;\n  line-height: var(--lh-400, 1.3);\n  background-color: var(--jump-card-background);\n  color: var(--jump-card-color);\n\n  .Footer,\n  .Body {\n    display: flex;\n    width: 100%;\n  }\n\n  jump-badge {\n    position: absolute;\n    top: 1rem;\n    left: 1rem;\n    z-index: 2;\n\n    &.hasBackground.iconOnly {\n      top: calc(1rem + 8px);\n      left: calc(1rem + 8px);\n    }\n  }\n\n  .Favorite {\n    position: absolute;\n    top: 1rem;\n    right: 1rem;\n    z-index: 2;\n\n    &.hasBackground.iconOnly {\n      top: calc(1rem + 8px);\n      right: calc(1rem + 8px);\n    }\n  }\n\n  .Media {\n    // aspect-ratio: 3/4;\n    overflow: hidden;\n    position: relative;\n    border-radius: 3px;\n    aspect-ratio: 1/1;\n\n    .Images {\n      height: 100%;\n      margin: 0;\n      position: relative;\n\n      img {\n        height: 100%;\n        width: 100%;\n        object-fit: cover;\n        position: absolute;\n        top: 0;\n        left: 0;\n        overflow: hidden;\n      }\n\n      &__Front {\n        z-index: 1;\n        transition: opacity 0.5s linear;\n        cursor: pointer;\n      }\n\n      &.has-hover-image {\n        &:hover .Images__Front {\n          opacity: 0;\n        }\n      }\n    }\n\n    &.hasBackground {\n      background-color: var(--neutral-white);\n\n      &.iconOnly {\n        border-top-left-radius: 6px;\n        border-top-right-radius: 6px;\n        padding: var(--jump-card-padding) var(--jump-card-padding) 0;\n\n        img {\n          border-radius: 6px;\n        }\n      }\n    }\n\n    &.iconOnly {\n      border-bottom-right-radius: 0;\n    }\n\n    &.is-mini {\n      max-width: 180px;\n    }\n  }\n\n  .NotificationCart {\n    display: none;\n    position: absolute;\n    bottom: 0px;\n    width: 100%;\n    padding: 2rem 1rem;\n    background-color: hsl(0 0% 0% / 35%);\n    box-sizing: border-box;\n    z-index: 2;\n    transform: translate3d(0, 0, 0);\n\n    &.is-active {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n  }\n\n  .Content {\n    &.hasBackground {\n      background-color: var(--neutral-white);\n      padding: calc(var(--jump-card-padding) * 2);\n    }\n\n    &.iconOnly {\n      padding: calc(var(--jump-card-padding) * 2) var(--jump-card-padding);\n    }\n\n    &.is-mini {\n      max-width: 180px;\n    }\n  }\n\n  .Body {\n    display: flex;\n    flex-direction: column;\n    gap: 0.75rem;\n    padding: var(--jump-card-padding) 0;\n\n    & > * {\n      display: flex;\n      flex-direction: row;\n      justify-content: space-between;\n\n      & > * {\n        flex: 0 1 auto;\n      }\n    }\n\n    &.hasBackground {\n      padding: 0 0 var(--jump-card-padding);\n    }\n\n    &.iconOnly {\n      padding: 0;\n    }\n\n    &.is-mini {\n      & > * {\n        flex-direction: column;\n      }\n\n      padding: calc(var(--jump-card-padding) / 2) 0;\n    }\n  }\n\n  .Product {\n    font-size: var(--fs-400);\n  }\n\n  .Subtitle {\n    font-size: var(--fs-300);\n    color: var(--neutral-grey-secondary);\n    line-height: 1.2;\n  }\n\n  .Footer {\n    line-height: var(--lh-400);\n    justify-content: end;\n    padding: var(--jump-card-padding) 0;\n    align-items: flex-end;\n\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    &.hasBackground {\n      padding-bottom: 0;\n    }\n\n    &.iconOnly {\n      padding: 0;\n    }\n\n    &.is-mini {\n      padding: calc(var(--jump-card-padding) / 2) 0;\n    }\n  }\n\n  .OutOfStock {\n    justify-items: start;\n    font-size: var(--fs-300);\n    font-weight: var(--fw-900);\n    color: var(--status-danger-standard);\n  }\n\n  .OnlyIconButton {\n    position: absolute;\n    bottom: 0;\n    right: 0;\n    background: var(--neutral-white);\n    border-top-left-radius: 20px;\n    padding: 8px 8px 0px 8px;\n    z-index: 2;\n  }\n\n  .Price {\n    position: relative;\n    display: grid;\n    grid-template-columns: auto auto;\n    grid-template-rows: 1.5rem 1.5rem auto;\n    justify-items: end;\n    align-items: end;\n    column-gap: 0.5rem;\n\n    font-size: var(--fs-500);\n    font-weight: var(--fw-900);\n    line-height: var(--lh-400);\n\n    & > * {\n      display: inline-flex;\n    }\n\n    &__Regular {\n      text-align: right;\n\n      &.sale {\n        text-decoration: line-through;\n        color: var(--neutral-grey-secondary);\n        font-weight: var(--fw-400);\n        font-size: var(--fs-400);\n        grid-column: 2;\n        grid-row: 1;\n      }\n    }\n\n    &__Sale {\n      grid-column: 2;\n      grid-row: 2;\n    }\n\n    &__Discount {\n      color: var(--status-danger-standard);\n      font-weight: var(--fw-400);\n      font-size: var(--fs-300);\n      grid-column: 1;\n      grid-row: 1;\n    }\n\n    &.is-mini {\n      display: flex;\n      font-size: var(--fs-400);\n    }\n  }\n\n  .SelectVariations {\n    select {\n      appearance: none;\n      background-color: transparent;\n      border: 1px solid var(--neutral-grey-secondary);\n      border-radius: 3px;\n      color: var(--neutral-grey-secondary);\n      font-size: var(--fs-300);\n      padding: 0.5rem 0.75rem;\n      max-width: 100%;\n      background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E\");\n      background-position: right 0.5rem center;\n      background-repeat: no-repeat;\n      background-size: 1.5em 1.5em;\n      padding-right: 2.5rem;\n      -webkit-print-color-adjust: exact;\n    }\n  }\n}\n\n.slide-in-bottom {\n  animation: slide-in-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.slide-out-bottom {\n  animation: slide-out-bottom 0.5s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;\n}\n\n.fade-in-out {\n  animation-name: fade-in-out;\n  animation-duration: 6s;\n  animation-timing-function: ease-in-out;\n}\n\n@keyframes fade-in-out {\n  from {\n    opacity: 0;\n    transform: translateY(100px);\n  }\n\n  50% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  to {\n    opacity: 0;\n    transform: translateY(100px);\n  }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Listen} from '@stencil/core';\n\ninterface Variation {\n  code: string;\n  imgUrl: string;\n  label: string;\n  taxonomy: string;\n  // Add more keys as needed\n}\n\n@Component({\n  tag: 'jump-card-ecommerce',\n  styleUrl: 'jump-card-ecommerce.scss',\n  shadow: true,\n})\nexport class JumpCardEcommerce {\n\n  @Element() JumpCardEcommerce: HTMLElement;\n  jumpQuantityEl;\n\n  /* ---------------------- @PROPERTIES ------------------------- */\n\n  /** Indicate if card has only icon button*/\n  @Prop() onlyIconButton: boolean = false;\n\n  /** Indicate if card has background*/\n  @Prop() hasBackground: boolean = false;\n\n  /** Indicates the badge of the card*/\n  @Prop() badge: string;\n\n  /**  Indicates if the product is favorite */\n\n  @Prop({mutable:true, reflect: true}) favorite: boolean = false;\n\n  /** Indicate if the whislist is active in shop*/\n  @Prop() hasFavorite: boolean = false;\n\n  /** Indicate if the whislist will be slotted*/\n  @Prop() hasSlotForFavorite: boolean = false;\n\n  /** Indicates if the favorite button is render as an anchor, and define the url*/\n  @Prop() favoriteHref: string;\n\n  /** Indicates the link of the card*/\n  @Prop() link: string;\n\n  /** Indicates the image's src of the card*/\n  @Prop() img: string ;\n\n  /** Indicates the img's alt of the card*/\n  @Prop() imgAlt: string;\n\n  /** Indicates the over image's src of the card*/\n  @Prop() hoverImg: string ;\n\n  /** Indicates the hover img's alt of the card*/\n  @Prop() hoverImgAlt: string;\n\n  /** Indicates the videoSrc of the card*/\n  @Prop() videoSrc: string;\n\n  /** Indicates the notificationUrl of the card*/\n  @Prop() notificationUrl: string;\n\n  /** Indicates the notificationText of the card*/\n  @Prop() notificationText: string = '';\n\n  /** Indicates the title of the card*/\n  @Prop() productName: string ;\n\n  /** Indicates the subtitle of the card*/\n  @Prop() subtitle: string;\n\n  /** Indicates the ID of the product, can be also a SKU*/\n  @Prop() productId: string ;\n\n  /**  Indicates the price of the card */\n  @Prop() price: number;\n\n  /** Indicates the sale price of the card */\n  @Prop() salePrice: number;\n\n  /** Indicates the currency of the card */\n  @Prop() currency: string = '€';\n\n  /** Indicates if the product is outOfStock */\n  @Prop({mutable:true, reflect: true}) outOfStock: boolean = false;\n\n  /** Indicates the outOfStockText of the product*/\n  @Prop() outOfStockText: string;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() addToCartText: string ;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() waitingListText: string ;\n\n  /** Indicate if the user request to be notified when te product is avaible*/\n  @Prop() addToWaitingList: boolean = false;\n\n  /** Indicate if the card is Mini Card*/\n  @Prop() isMini: boolean = false;\n\n  /* ---------------------- @STATE ------------------------- */\n\n  /** Indicate if the product is added to cart --> non deve esserci nelle storie! */\n  @Prop() addedToCart: boolean = false;\n\n  @Prop() endAddedToCart: boolean = false;\n\n  @State() variations: Variation[] = [];\n\n  @State() selectedVariation: Variation;\n\n  @State() priceFormatted: string;\n\n  @State() salePriceFormatted: string;\n\n  // è una proprietà che viene cambiata solo da dentro\n  quantity: number;\n\n  variationSelectEl: HTMLSelectElement;\n\n /* ---------------------- @EVENTS ------------------------- */\n\n  @Event({eventName: 'jump-toggle-favorite'}) toggleFavorite: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-cart'}) productAddToCart: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-waiting-list'}) productWaitingList: EventEmitter;\n\n  @Event({ eventName: 'jump-variation-selected' }) variationSelected: EventEmitter; // verificare se corretto: aggiungo un evento\n\n  @Listen(\"jump-card-ecommerce-option-connected\")\n  addOption(e) {\n    let props = e.detail; // es {code: 'sku1', imageUrl: 'https://google.com/'}\n    this.variations = [...this.variations, { ...props }];\n  }\n\n  onVariationSelected() {\n    let currentValue = this.variationSelectEl.value;\n    let variation = this.variations.find(\n      (variation) => variation.code == currentValue,\n    );\n    this.selectedVariation = variation;\n    this.variationSelected.emit(variation); // verificare se corretto: emetto l'evento\n  }\n\n\n  /* ---------------------- @LIFECYCLE ------------------------- */\n\n  componentWillLoad() {}\n\n  componentDidLoad() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.addEventListener('jump-change',  this.onQuantityChange.bind(this));\n      this.quantity = this.jumpQuantityEl.getValue().then((quantity) => {\n        this.quantity = quantity;\n      });\n    }\n\n    this.formatPrices();\n  }\n\n  disconnectedCallback() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.removeEventListener('jump-change',this.onQuantityChange);\n    }\n  }\n\n  /* ---------------------- @METHODS ------------------------- */\n  onQuantityChange(e) {\n    this.quantity = e.detail.value ?? false;\n  }\n\n  onToggleFavorite() {\n    this.favorite = !this.favorite;\n    this.toggleFavorite.emit(\n      {\n        productId: this.productId,\n        favorite: this.favorite\n      }\n    );\n  }\n\n  addProductToCart() {\n    this.addedToCart = true;\n    let variations = this.selectedVariation;\n    if(!variations && this.variations.length > 0) {\n      variations = this.variations[0];\n    }\n\n    const payload = {\n      productId: this.productId,\n      addedToCart: this.addedToCart,\n      quantity: this.quantity ?? null,\n      variation: variations ?? null\n    };\n    this.productAddToCart.emit(payload);\n\n    setTimeout(() => {\n      this.addedToCart = false;\n    }, 6000);\n  }\n\n  waitingList() {\n    this.addToWaitingList = true;\n    this.productWaitingList.emit(\n      {\n        productId: this.productId,\n        addToWaitingList: this.addToWaitingList\n      }\n    )\n  }\n\n  formatPrices() {\n    let locale = document.documentElement.lang ?? 'it-IT';\n    if(locale.length == 2) {\n      locale = `${locale}-${locale.toUpperCase()}`;\n    }\n\n    // Format price with 2 decimal digits and in locale\n    this.priceFormatted = this.price.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n    this.salePriceFormatted = this.salePrice.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n  }\n\n  render() {\n    const backgroundClass = this.hasBackground && !this.isMini ? 'hasBackground' : '';\n    const iconOnlyClass = this.onlyIconButton && !this.isMini ? 'iconOnly' : '';\n    const justifyClass = this.outOfStock ? 'justify-between' : '';\n    const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\n    const miniCard = this.isMini ? 'is-mini' : '';\n\n    function calculateDiscount(price: number, salePrice: number): string {\n      const discount = ((price - salePrice) / price) * 100;\n      return discount.toFixed(0);\n    };\n\n    return (\n      <Host>\n        { !this.isMini && this.badge ? <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant=\"secondary\" dimension=\"small\" label={this.badge}></jump-badge> : ''}\n\n        { !this.isMini && this.hasFavorite ?\n          this.favoriteHref != '' ?\n          <jump-button href={this.favoriteHref} onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n              :\n          <jump-button onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n        :\n          this.hasSlotForFavorite ? <div class=\"Favorite\"><slot name=\"favorite\"></slot> </div> : null\n        }\n\n        <div class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}>\n          <a href={this.link}>\n            <figure class={`Images ${hasImageOnHover} `}>\n              {this.img && !this.videoSrc ? <img class=\"Images__Front\" src={this.img} alt={this.imgAlt}></img> : ''}\n              {this.hoverImg && !this.videoSrc ? <img class=\"Images__OnHover\" src={this.hoverImg} alt={this.hoverImgAlt}></img> : ''}\n            </figure>\n            {this.videoSrc && !this.img ?\n              <video autoplay>\n                <source src={this.videoSrc} type=\"video/mp4\"/>\n                <source src={this.videoSrc} type=\"video/mov\"/>\n                <source src={this.videoSrc} type=\"video/webm\"/>\n              </video> : ''}\n          </a>\n          { !this.isMini ?\n            <div class={`NotificationCart ${this.addedToCart == true ? 'is-active fade-in-out' : ''}`}>\n              <jump-button href={this.notificationUrl} variant=\"white\" text>\n                <jump-icon slot=\"prefix\" name=\"check\"></jump-icon>\n                <span> {this.notificationText} </span>\n              </jump-button>\n            </div>\n          : null}\n          { !this.isMini && this.onlyIconButton ?\n            <div class=\"OnlyIconButton\">\n              <jump-button variant=\"secondary\" size=\"large\" pill onlyIcon onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name='cart-shopping' category=\"regular\"></jump-icon>\n              </jump-button>\n            </div>\n            : ''\n          }\n        </div>\n\n        <div class={`Content ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n          <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n            <div>\n              <div class=\"Info\">\n                <div class=\"Product\">{this.productName}</div>\n                { !this.isMini && this.subtitle ? <div class=\"Subtitle\">{this.subtitle}</div> : null}\n              </div>\n\n              {this.price ?\n                <div class={`Price ${miniCard}`}>\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Discount\"> {calculateDiscount(this.price, this.salePrice)}% </div>\n                  : null}\n\n                  {!this.isMini ?\n                    <div class={`Price__Regular ${this.salePrice && this.salePrice < this.price ? 'sale' : ''}`}>\n                      {this.currency}{this.priceFormatted}\n                    </div>\n                  :\n                    <div class={`Price__Regular`}>\n                      {this.currency}{ this.salePrice && this.salePrice < this.price ? this.salePriceFormatted : this.priceFormatted}\n                    </div>\n                  }\n\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Sale\">{this.currency}{this.salePriceFormatted}</div>\n                  : null}\n                </div>\n                : null}\n            </div>\n\n            {!this.isMini ?\n              <div class=\"SelectVariations\">\n                {this.variations.length != 0 ?\n                  <select\n                    ref={(el) => (this.variationSelectEl = el)} //salvo questo elemento in this.variationSelectEl\n                    onChange={() => {\n                      this.onVariationSelected();\n                    }}\n                  >\n                    {this.variations\n                      .filter((variation) => !variation.imgUrl)\n                      .map((variation) => (\n                        <option value={variation.code}>{variation.label}</option>\n                    ))}\n                  </select>\n                : null }\n              </div>\n            : null}\n\n            {!this.isMini ? <slot name=\"quantity\"></slot> : null}\n          </div>\n\n          <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n            {this.outOfStock ? <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n            { this.outOfStock ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.waitingList()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.waitingListText ? this.waitingListText : 'Notifica disponibilità'}\n              </jump-button> : ''\n            }\n\n            { !this.outOfStock && !this.onlyIconButton ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.addToCartText ? this.addToCartText : 'Aggiungi al carrello'}\n              </jump-button> : ''\n            }\n\n          </div>\n\n        </div>\n      </Host>\n    );\n  }\n\n}\n"],"version":3}

package/dist/cjs/jump-design-system.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["jump-button_2.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}],[1,"jump-icon",{"class":[1],"library":[1],"name":[1],"category":[1],"size":[1],"label":[1],"src":[1]}]]],["jump-card-ecommerce.cjs",[[1,"jump-card-ecommerce",{"onlyIconButton":[4,"only-icon-button"],"hasBackground":[4,"has-background"],"badge":[1],"favorite":[1540],"hasFavorite":[4,"has-favorite"],"hasSlotForFavorite":[4,"has-slot-for-favorite"],"favoriteHref":[1,"favorite-href"],"link":[1],"img":[1],"imgAlt":[1,"img-alt"],"hoverImg":[1,"hover-img"],"hoverImgAlt":[1,"hover-img-alt"],"videoSrc":[1,"video-src"],"notificationUrl":[1,"notification-url"],"notificationText":[1,"notification-text"],"productName":[1,"product-name"],"subtitle":[1],"productId":[1,"product-id"],"price":[2],"salePrice":[2,"sale-price"],"currency":[1],"outOfStock":[1540,"out-of-stock"],"outOfStockText":[1,"out-of-stock-text"],"addToCartText":[1,"add-to-cart-text"],"waitingListText":[1,"waiting-list-text"],"addToWaitingList":[4,"add-to-waiting-list"],"isMini":[4,"is-mini"],"addedToCart":[4,"added-to-cart"],"endAddedToCart":[4,"end-added-to-cart"],"variations":[32],"selectedVariation":[32],"priceFormatted":[32],"salePriceFormatted":[32]},[[0,"jump-card-ecommerce-option-connected","addOption"]]]]],["jump-filter.cjs",[[1,"jump-filter",{"direction":[1],"filterHeading":[1,"filter-heading"],"filterButtonLabel":[1,"filter-button-label"],"filterButtonIcon":[1,"filter-button-icon"],"mobileThreshold":[2,"mobile-threshold"],"filters":[8],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]]]]],["jump-filtergroup.cjs",[[1,"jump-filtergroup",{"name":[1],"heading":[1],"otherLabel":[1,"other-label"],"lessLabel":[1,"less-label"],"maxElements":[2,"max-elements"],"variant":[1],"values":[32],"value":[32],"slotItems":[32],"inputs":[32],"showMore":[32],"getValues":[64],"getActiveAmount":[64],"getInputs":[64],"getName":[64]}]]],["jump-pagination.cjs",[[1,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[1,"elements-ranges"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[32],"elPerPage":[32]},null,{"elementsRanges":["elementsRangesChanged"],"elPerPage":["elPerPageChanged"]}]]],["jump-quantity.cjs",[[65,"jump-quantity",{"min":[2],"max":[2],"step":[2],"label":[1],"type":[1],"variant":[1],"showButtons":[4,"show-buttons"],"value":[2],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-accordion.cjs",[[1,"jump-accordion",{"variant":[1],"summary":[1],"disabled":[4],"open":[516],"icon":[1],"identifier":[1]},[[0,"sl-show","handleShow"]]]]],["jump-tab-item.cjs",[[1,"jump-tab-item",{"identifier":[1],"iconName":[1,"icon-name"],"iconPosition":[1,"icon-position"],"label":[1],"active":[4],"disabled":[4],"variant":[32]}]]],["jump-accordion-group.cjs",[[1,"jump-accordion-group",{"variant":[1],"groupIdentifier":[1,"group-identifier"]}]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-card-ecommerce-option.cjs",[[1,"jump-card-ecommerce-option",{"code":[1],"imgUrl":[1,"img-url"],"label":[1],"sku":[1],"taxonomy":[1]}]]],["jump-filter-checkbox.cjs",[[1,"jump-filter-checkbox",{"value":[1],"label":[1],"checked":[516],"count":[8],"isChecked":[64]}]]],["jump-tab.cjs",[[1,"jump-tab",{"tabGroupName":[1,"tab-group-name"],"variant":[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["jump-tab-panel.cjs",[[1,"jump-tab-panel",{"identifier":[1],"active":[4]}]]],["jump-badge.cjs",[[1,"jump-badge",{"label":[1],"variant":[513],"dimension":[513],"soft":[516],"outline":[516]}]]]], options);
+  return index.bootstrapLazy([["jump-button_2.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}],[1,"jump-icon",{"class":[1],"library":[1],"name":[1],"category":[1],"size":[1],"label":[1],"src":[1]}]]],["jump-card-ecommerce.cjs",[[1,"jump-card-ecommerce",{"onlyIconButton":[4,"only-icon-button"],"hasBackground":[4,"has-background"],"badge":[1],"favorite":[1540],"hasFavorite":[4,"has-favorite"],"hasSlotForFavorite":[4,"has-slot-for-favorite"],"favoriteHref":[1,"favorite-href"],"link":[1],"img":[1],"imgAlt":[1,"img-alt"],"hoverImg":[1,"hover-img"],"hoverImgAlt":[1,"hover-img-alt"],"videoSrc":[1,"video-src"],"notificationUrl":[1,"notification-url"],"notificationText":[1,"notification-text"],"productName":[1,"product-name"],"subtitle":[1],"productId":[1,"product-id"],"price":[2],"salePrice":[2,"sale-price"],"currency":[1],"outOfStock":[1540,"out-of-stock"],"outOfStockText":[1,"out-of-stock-text"],"addToCartText":[1,"add-to-cart-text"],"waitingListText":[1,"waiting-list-text"],"addToWaitingList":[4,"add-to-waiting-list"],"isMini":[4,"is-mini"],"addedToCart":[4,"added-to-cart"],"endAddedToCart":[4,"end-added-to-cart"],"variations":[32],"selectedVariation":[32],"priceFormatted":[32],"salePriceFormatted":[32]},[[0,"jump-card-ecommerce-option-connected","addOption"]]]]],["jump-filter.cjs",[[1,"jump-filter",{"direction":[1],"filterHeading":[1,"filter-heading"],"filterButtonLabel":[1,"filter-button-label"],"filterButtonIcon":[1,"filter-button-icon"],"mobileThreshold":[2,"mobile-threshold"],"filters":[8],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]]]]],["jump-filtergroup.cjs",[[1,"jump-filtergroup",{"name":[1],"heading":[1],"otherLabel":[1,"other-label"],"lessLabel":[1,"less-label"],"maxElements":[2,"max-elements"],"variant":[1],"label":[32],"values":[32],"value":[32],"slotItems":[32],"inputs":[32],"showMore":[32],"getValues":[64],"getActiveAmount":[64],"getInputs":[64],"getName":[64]},null,{"showMore":["watchShowMore"]}]]],["jump-pagination.cjs",[[1,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[1,"elements-ranges"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[32],"elPerPage":[32]},null,{"elementsRanges":["elementsRangesChanged"],"elPerPage":["elPerPageChanged"]}]]],["jump-quantity.cjs",[[65,"jump-quantity",{"min":[2],"max":[2],"step":[2],"label":[1],"type":[1],"variant":[1],"showButtons":[4,"show-buttons"],"value":[2],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-accordion.cjs",[[1,"jump-accordion",{"variant":[1],"summary":[1],"disabled":[4],"open":[516],"icon":[1],"identifier":[1]},[[0,"sl-show","handleShow"]]]]],["jump-tab-item.cjs",[[1,"jump-tab-item",{"identifier":[1],"iconName":[1,"icon-name"],"iconPosition":[1,"icon-position"],"label":[1],"active":[4],"disabled":[4],"variant":[32]}]]],["jump-accordion-group.cjs",[[1,"jump-accordion-group",{"variant":[1],"groupIdentifier":[1,"group-identifier"]}]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-card-ecommerce-option.cjs",[[1,"jump-card-ecommerce-option",{"code":[1],"imgUrl":[1,"img-url"],"label":[1],"sku":[1],"taxonomy":[1]}]]],["jump-filter-checkbox.cjs",[[1,"jump-filter-checkbox",{"value":[1],"label":[1],"checked":[516],"count":[8],"isChecked":[64]}]]],["jump-tab.cjs",[[1,"jump-tab",{"tabGroupName":[1,"tab-group-name"],"variant":[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["jump-tab-panel.cjs",[[1,"jump-tab-panel",{"identifier":[1],"active":[4]}]]],["jump-badge.cjs",[[1,"jump-badge",{"label":[1],"variant":[513],"dimension":[513],"soft":[516],"outline":[516]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/jump-filtergroup.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-86f59981.js');
 
-const jumpFiltergroupCss = ":host{--hidden-display:none;display:block}:host h5{font-family:var(--ff-primary), serif;font-size:var(--fs-400);line-height:var(--lh-300);font-weight:var(--fw-900)}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}*[data-hide=true]{display:var(--hidden-display)}h5{margin:0 0 0.25rem}";
+const jumpFiltergroupCss = ":host{--hidden-display:none;--font-family:var(--ff-primary, \"Inter\"), serif;--font-size:var(--fs-400, 16px);--line-height:var(--lh-300, 1.2);--font-weight:var(--fw-900, 700);--color:var(--neutral-grey-primary, #282828);--distance-items:.25rem;display:block}:host h5{font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);color:var(--color);margin:0 0 var(--distance-items, 0.25rem)}:host slot{display:flex;flex-direction:column;margin-bottom:1rem}:host ::slotted(.item){max-height:500px;transition:all 0.3s ease-in-out;margin-top:var(--distance-items, 0.25rem);display:flex;align-items:center;justify-content:flex-start;gap:0.25rem}:host ::slotted(.hidden){max-height:0;overflow:hidden}";
 const JumpFiltergroupStyle0 = jumpFiltergroupCss;
 
 const JumpFiltergroup = class {
@@ -17,11 +17,15 @@ const JumpFiltergroup = class {
         this.lessLabel = 'Mostra meno';
         this.maxElements = 8;
         this.variant = 'default';
+        this.label = this.otherLabel;
         this.values = [];
         this.value = '';
         this.slotItems = undefined;
         this.inputs = [];
-        this.showMore = true;
+        this.showMore = false;
+    }
+    watchShowMore(newValue) {
+        this.label = newValue ? this.lessLabel : this.otherLabel;
     }
     async getValues() {
         return this.values;
@@ -35,19 +39,21 @@ const JumpFiltergroup = class {
     async getName() {
         return this.name;
     }
-    toggleHiddenItems(showAll = true) {
+    toggleHiddenItems() {
         this.slotItemsWrapper.assignedElements().forEach((item, index) => {
-            if (index > this.maxElements && !showAll) {
-                item.setAttribute('style', 'display: none');
-            }
-            else {
-                item.setAttribute('style', 'display: initial');
+            if (index > this.maxElements) {
+                if (this.showMore) {
+                    item.classList.remove('hidden');
+                }
+                else {
+                    item.classList.add('hidden');
+                }
             }
         });
     }
     handleShowMore() {
         this.showMore = !this.showMore;
-        this.toggleHiddenItems(this.showMore);
+        this.toggleHiddenItems();
     }
     handleChange(event) {
         const target = event.target;
@@ -103,11 +109,12 @@ const JumpFiltergroup = class {
         this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));
         let index = 0;
         this.slotItems.forEach((item) => {
+            item.classList.add('item');
             if (index > this.maxElements) {
-                //item.setAttribute('data-hide', 'true');
-                item.style.display = 'none';
+                item.classList.add('hidden');
             }
-            if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {
+            //if (item.tagName start with jump-
+            if (item.tagName === 'INPUT' || item.tagName === 'SELECT' || item.tagName.startsWith('JUMP-') || item.tagName === 'LABEL') {
                 this.inputs.push(item);
                 if (item.tagName === 'INPUT' && item.type === 'radio') {
                     item.name = this.name;
@@ -129,11 +136,14 @@ const JumpFiltergroup = class {
         //this.toggleHiddenItems();
     }
     render() {
-        return (index.h(index.Host, { key: '045985358fca061c90927a20b4c151cfd2fa9f99' }, this.heading && index.h("h5", { key: '8555c17428efebcc4fe267556d058f344821125c' }, this.heading), index.h("div", { key: '7053c6a0eb8df8242e7eec49c1eb08c81354b1d6', class: "filterGroup" }, index.h("slot", { key: '22bef57eb5de8599d85950c8c54fd2d4b33380a1', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
-            index.h("jump-button", { key: '59007765335212a6c5377dd74ed0111d8d19e290', variant: "primary", size: "small", text: true, name: this.showMore ? this.otherLabel : this.lessLabel, "aria-label": this.showMore ? this.otherLabel : this.lessLabel, ref: (showMoreBtn) => {
+        return (index.h(index.Host, { key: '7d3b79b574cb9b46501ea0482c6d3cc1fbb98e1f' }, this.heading && index.h("h5", { key: '68f2dd39f94fb905d9ea151cfbf946080abf1883' }, this.heading), index.h("div", { key: '3975c6ca04b3bd077eef48dd93311299c4cb2308', class: "filterGroup" }, index.h("slot", { key: 'c45798ed4fa32dc7baa18aa183740b5ad589b87b', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
+            index.h("jump-button", { key: '068c3456f098fd7d58f943964338ff0416507797', variant: "primary", size: "small", text: true, name: this.label, "aria-label": this.label, ref: (showMoreBtn) => {
                     this.showMoreBtn = showMoreBtn;
-                }, onClick: () => this.handleShowMore() }, this.showMore ? this.otherLabel : this.lessLabel, index.h("jump-icon", { key: 'cdb2ebb1458763cfd456eaf223213802a449ba96', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-up' }))));
+                }, onClick: () => this.handleShowMore() }, this.label, index.h("jump-icon", { key: '7e0b01f499ff2af6948120711d09f84dd70e4039', slot: "suffix", name: !this.showMore ? 'chevron-down' : 'chevron-up' }))));
     }
+    static get watchers() { return {
+        "showMore": ["watchShowMore"]
+    }; }
 };
 JumpFiltergroup.style = JumpFiltergroupStyle0;
 

package/dist/cjs/jump-filtergroup.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"jump-filtergroup.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n  --hidden-display: none;\n\n  display: block;\n\n  h5{\n    font-family: var(--ff-primary), serif;\n    font-size: var(--fs-400);\n    line-height: var(--lh-300);\n    font-weight: var(--fw-900);\n  }\n\n  slot {\n    display: flex;\n    flex-direction: column;\n    gap: .25rem;\n    margin-bottom: 1rem;\n  }\n\n}\n\n*[data-hide=\"true\"] {\n  display: var(--hidden-display);\n}\n\nh5 {\n  margin: 0 0 .25rem;\n}\n\n//TODO: capire perché non prende questo stile\n\n\n","import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n  tag: 'jump-filtergroup',\n  styleUrl: 'jump-filtergroup.scss',\n  shadow: true,\n})\nexport class JumpFiltergroup {\n  @Prop() name: string = 'tax-name';\n  @Prop() heading: string = 'Titolo del filtro';\n  @Prop() otherLabel: string = 'Mostra altro';\n  @Prop() lessLabel: string = 'Mostra meno';\n  @Prop() maxElements: number = 8;\n  //TODO: Add Accordion variant within jump-acccordion component\n  @Prop() variant: 'accordion' | 'default' = 'default';\n\n  @State() values: string[] = [];\n  @State() value: string = '';\n  @State() slotItems: any;\n  @State() inputs: any = [];\n  @State() showMore: boolean = true;\n\n  @Event({ eventName: 'jump-filterchange' }) change;\n\n  slotItemsWrapper: HTMLSlotElement;\n  showMoreBtn: HTMLElement;\n\n  @Method('getValues')\n  async getValues() {\n    return this.values;\n  }\n\n  @Method('getActiveAmount')\n  async getActiveAmount() {\n    return this.values.length;\n  }\n\n  @Method('getInputs')\n  async getInputs() {\n    return this.inputs;\n  }\n\n  @Method('getName')\n  async getName() {\n    return this.name;\n  }\n\n  toggleHiddenItems(showAll = true) {\n    this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n      if (index > this.maxElements && !showAll) {\n        item.setAttribute('style', 'display: none');\n      } else {\n        item.setAttribute('style', 'display: initial');\n      }\n    });\n  }\n\n  handleShowMore() {\n    this.showMore = !this.showMore;\n    this.toggleHiddenItems(this.showMore);\n  }\n\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement | HTMLSelectElement;\n    const newValue = target.value;\n\n    if (target.tagName === 'INPUT') {\n      if (target.type === 'checkbox') {\n        // @ts-ignore\n        if (target.checked) {\n          this.values.push(newValue);\n        } else {\n          const index = this.values.indexOf(newValue);\n          if (index !== -1) {\n            this.values.splice(index, 1);\n          }\n        }\n      } else if (target.type === 'radio') {\n        // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n        this.value = newValue;\n        this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n      }\n    } else if (target.tagName === 'SELECT') {\n      // Se è un select, aggiorna semplicemente il valore\n      this.value = newValue;\n      this.values = [newValue];\n    }\n\n    // Emit event con i valori aggiornati\n    this.change.emit({\n      name: this.name,\n      values: this.values,\n    });\n  }\n\n  handleCheckboxChange(event: CustomEvent) {\n    if (event.detail.checked && !this.values.includes(event.detail.value)) {\n      this.values.push(event.detail.value);\n    } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n      const index = this.values.indexOf(event.detail.value);\n      if (index !== -1) {\n        this.values.splice(index, 1);\n      }\n    }\n    this.change.emit({\n      name: this.name,\n      values: this.values,\n    });\n  }\n\n  componentDidLoad() {\n    this.slotItems = this.slotItemsWrapper.assignedElements();\n    this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n    this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n    let index = 0;\n    this.slotItems.forEach((item) => {\n      if (index > this.maxElements) {\n        //item.setAttribute('data-hide', 'true');\n        item.style.display = 'none';\n      }\n      if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n        this.inputs.push(item);\n        if (item.tagName === 'INPUT' && item.type === 'radio') {\n          item.name = this.name;\n        }\n      } else {\n        const inputs = item.querySelectorAll('input, select');\n        if (inputs.length > 0) {\n          inputs.forEach((input) => {\n            this.inputs.push(input);\n\n            if (input.tagName === 'INPUT' && input.type === 'radio') {\n              input.name = this.name;\n            }\n          });\n        }\n      }\n      index++;\n    });\n\n    //this.toggleHiddenItems();\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.heading && <h5>{this.heading}</h5>}\n        <div class=\"filterGroup\">\n          <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n        </div>\n        {this.inputs.length > this.maxElements &&\n          <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n                       aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n                       ref={(showMoreBtn) => {\n                         this.showMoreBtn = showMoreBtn;\n                       }}\n                       onClick={() => this.handleShowMore()}>\n            {this.showMore ? this.otherLabel : this.lessLabel}\n            <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n          </jump-button>\n        }\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"jump-filtergroup.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n  --hidden-display: none;\n  --font-family: var(--ff-primary, 'Inter'), serif;\n  --font-size: var(--fs-400, 16px);\n  --line-height: var(--lh-300, 1.2);\n  --font-weight: var(--fw-900, 700);\n  --color: var(--neutral-grey-primary, #282828);\n  --distance-items: .25rem;\n\n  display: block;\n\n  h5 {\n    font-family: var(--font-family);\n    font-size: var(--font-size);\n    line-height: var(--line-height);\n    font-weight: var(--font-weight);\n    color: var(--color);\n    margin: 0 0 var(--distance-items, .25rem);\n  }\n\n  slot {\n    display: flex;\n    flex-direction: column;\n    margin-bottom: 1rem;\n  }\n\n  ::slotted(.item) {\n    max-height: 500px;\n    transition: all 0.3s ease-in-out;\n    margin-top: var(--distance-items, .25rem);\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: .25rem;\n  }\n\n  ::slotted(.hidden) {\n    max-height: 0;\n    overflow: hidden;\n  }\n}\n\n\n","import { Component, Host, h, Prop, State, Event, Method, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'jump-filtergroup',\n  styleUrl: 'jump-filtergroup.scss',\n  shadow: true,\n})\nexport class JumpFiltergroup {\n  @Prop() name: string = 'tax-name';\n  @Prop() heading: string = 'Titolo del filtro';\n  @Prop() otherLabel: string = 'Mostra altro';\n  @Prop() lessLabel: string = 'Mostra meno';\n  @Prop() maxElements: number = 8;\n  //TODO: Add Accordion variant within jump-acccordion component\n  @Prop() variant: 'accordion' | 'default' = 'default';\n\n  @State() label: string = this.otherLabel;\n  @State() values: string[] = [];\n  @State() value: string = '';\n  @State() slotItems: any;\n  @State() inputs: any = [];\n  @State() showMore: boolean = false;\n\n  @Event({ eventName: 'jump-filterchange' }) change;\n\n  slotItemsWrapper: HTMLSlotElement;\n  showMoreBtn: HTMLElement;\n\n  @Watch('showMore')\n  watchShowMore(newValue: boolean) {\n    this.label = newValue ? this.lessLabel : this.otherLabel;\n  }\n\n  @Method('getValues')\n  async getValues() {\n    return this.values;\n  }\n\n  @Method('getActiveAmount')\n  async getActiveAmount() {\n    return this.values.length;\n  }\n\n  @Method('getInputs')\n  async getInputs() {\n    return this.inputs;\n  }\n\n  @Method('getName')\n  async getName() {\n    return this.name;\n  }\n\n  toggleHiddenItems() {\n    this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n      if (index > this.maxElements) {\n        if (this.showMore) {\n          item.classList.remove('hidden');\n        } else {\n          item.classList.add('hidden');\n        }\n      }\n    });\n  }\n\n  handleShowMore() {\n    this.showMore = !this.showMore;\n    this.toggleHiddenItems();\n  }\n\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement | HTMLSelectElement;\n    const newValue = target.value;\n\n    if (target.tagName === 'INPUT') {\n      if (target.type === 'checkbox') {\n        // @ts-ignore\n        if (target.checked) {\n          this.values.push(newValue);\n        } else {\n          const index = this.values.indexOf(newValue);\n          if (index !== -1) {\n            this.values.splice(index, 1);\n          }\n        }\n      } else if (target.type === 'radio') {\n        // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n        this.value = newValue;\n        this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n      }\n    } else if (target.tagName === 'SELECT') {\n      // Se è un select, aggiorna semplicemente il valore\n      this.value = newValue;\n      this.values = [newValue];\n    }\n\n    // Emit event con i valori aggiornati\n    this.change.emit({\n      name: this.name,\n      values: this.values,\n    });\n  }\n\n  handleCheckboxChange(event: CustomEvent) {\n    if (event.detail.checked && !this.values.includes(event.detail.value)) {\n      this.values.push(event.detail.value);\n    } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n      const index = this.values.indexOf(event.detail.value);\n      if (index !== -1) {\n        this.values.splice(index, 1);\n      }\n    }\n    this.change.emit({\n      name: this.name,\n      values: this.values,\n    });\n  }\n\n  componentDidLoad() {\n    this.slotItems = this.slotItemsWrapper.assignedElements();\n    this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n    this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n    let index = 0;\n    this.slotItems.forEach((item) => {\n      item.classList.add('item');\n      if (index > this.maxElements) {\n        item.classList.add('hidden');\n      }\n      //if (item.tagName start with jump-\n      if (item.tagName === 'INPUT' || item.tagName === 'SELECT' || item.tagName.startsWith('JUMP-') || item.tagName === 'LABEL') {\n        this.inputs.push(item);\n        if (item.tagName === 'INPUT' && item.type === 'radio') {\n          item.name = this.name;\n        }\n      } else {\n        const inputs = item.querySelectorAll('input, select');\n        if (inputs.length > 0) {\n          inputs.forEach((input) => {\n            this.inputs.push(input);\n\n            if (input.tagName === 'INPUT' && input.type === 'radio') {\n              input.name = this.name;\n            }\n          });\n        }\n      }\n      index++;\n    });\n\n    //this.toggleHiddenItems();\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.heading && <h5>{this.heading}</h5>}\n        <div class=\"filterGroup\">\n          <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n        </div>\n        {this.inputs.length > this.maxElements &&\n          <jump-button variant=\"primary\" size=\"small\" text name={this.label}\n                       aria-label={this.label}\n                       ref={(showMoreBtn) => {\n                         this.showMoreBtn = showMoreBtn;\n                       }}\n                       onClick={() => this.handleShowMore()}>\n            {this.label}\n            <jump-icon slot=\"suffix\" name={!this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n          </jump-button>\n        }\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["jump-button_2.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}],[1,"jump-icon",{"class":[1],"library":[1],"name":[1],"category":[1],"size":[1],"label":[1],"src":[1]}]]],["jump-card-ecommerce.cjs",[[1,"jump-card-ecommerce",{"onlyIconButton":[4,"only-icon-button"],"hasBackground":[4,"has-background"],"badge":[1],"favorite":[1540],"hasFavorite":[4,"has-favorite"],"hasSlotForFavorite":[4,"has-slot-for-favorite"],"favoriteHref":[1,"favorite-href"],"link":[1],"img":[1],"imgAlt":[1,"img-alt"],"hoverImg":[1,"hover-img"],"hoverImgAlt":[1,"hover-img-alt"],"videoSrc":[1,"video-src"],"notificationUrl":[1,"notification-url"],"notificationText":[1,"notification-text"],"productName":[1,"product-name"],"subtitle":[1],"productId":[1,"product-id"],"price":[2],"salePrice":[2,"sale-price"],"currency":[1],"outOfStock":[1540,"out-of-stock"],"outOfStockText":[1,"out-of-stock-text"],"addToCartText":[1,"add-to-cart-text"],"waitingListText":[1,"waiting-list-text"],"addToWaitingList":[4,"add-to-waiting-list"],"isMini":[4,"is-mini"],"addedToCart":[4,"added-to-cart"],"endAddedToCart":[4,"end-added-to-cart"],"variations":[32],"selectedVariation":[32],"priceFormatted":[32],"salePriceFormatted":[32]},[[0,"jump-card-ecommerce-option-connected","addOption"]]]]],["jump-filter.cjs",[[1,"jump-filter",{"direction":[1],"filterHeading":[1,"filter-heading"],"filterButtonLabel":[1,"filter-button-label"],"filterButtonIcon":[1,"filter-button-icon"],"mobileThreshold":[2,"mobile-threshold"],"filters":[8],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]]]]],["jump-filtergroup.cjs",[[1,"jump-filtergroup",{"name":[1],"heading":[1],"otherLabel":[1,"other-label"],"lessLabel":[1,"less-label"],"maxElements":[2,"max-elements"],"variant":[1],"values":[32],"value":[32],"slotItems":[32],"inputs":[32],"showMore":[32],"getValues":[64],"getActiveAmount":[64],"getInputs":[64],"getName":[64]}]]],["jump-pagination.cjs",[[1,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[1,"elements-ranges"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[32],"elPerPage":[32]},null,{"elementsRanges":["elementsRangesChanged"],"elPerPage":["elPerPageChanged"]}]]],["jump-quantity.cjs",[[65,"jump-quantity",{"min":[2],"max":[2],"step":[2],"label":[1],"type":[1],"variant":[1],"showButtons":[4,"show-buttons"],"value":[2],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-accordion.cjs",[[1,"jump-accordion",{"variant":[1],"summary":[1],"disabled":[4],"open":[516],"icon":[1],"identifier":[1]},[[0,"sl-show","handleShow"]]]]],["jump-tab-item.cjs",[[1,"jump-tab-item",{"identifier":[1],"iconName":[1,"icon-name"],"iconPosition":[1,"icon-position"],"label":[1],"active":[4],"disabled":[4],"variant":[32]}]]],["jump-accordion-group.cjs",[[1,"jump-accordion-group",{"variant":[1],"groupIdentifier":[1,"group-identifier"]}]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-card-ecommerce-option.cjs",[[1,"jump-card-ecommerce-option",{"code":[1],"imgUrl":[1,"img-url"],"label":[1],"sku":[1],"taxonomy":[1]}]]],["jump-filter-checkbox.cjs",[[1,"jump-filter-checkbox",{"value":[1],"label":[1],"checked":[516],"count":[8],"isChecked":[64]}]]],["jump-tab.cjs",[[1,"jump-tab",{"tabGroupName":[1,"tab-group-name"],"variant":[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["jump-tab-panel.cjs",[[1,"jump-tab-panel",{"identifier":[1],"active":[4]}]]],["jump-badge.cjs",[[1,"jump-badge",{"label":[1],"variant":[513],"dimension":[513],"soft":[516],"outline":[516]}]]]], options);
+  return index.bootstrapLazy([["jump-button_2.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}],[1,"jump-icon",{"class":[1],"library":[1],"name":[1],"category":[1],"size":[1],"label":[1],"src":[1]}]]],["jump-card-ecommerce.cjs",[[1,"jump-card-ecommerce",{"onlyIconButton":[4,"only-icon-button"],"hasBackground":[4,"has-background"],"badge":[1],"favorite":[1540],"hasFavorite":[4,"has-favorite"],"hasSlotForFavorite":[4,"has-slot-for-favorite"],"favoriteHref":[1,"favorite-href"],"link":[1],"img":[1],"imgAlt":[1,"img-alt"],"hoverImg":[1,"hover-img"],"hoverImgAlt":[1,"hover-img-alt"],"videoSrc":[1,"video-src"],"notificationUrl":[1,"notification-url"],"notificationText":[1,"notification-text"],"productName":[1,"product-name"],"subtitle":[1],"productId":[1,"product-id"],"price":[2],"salePrice":[2,"sale-price"],"currency":[1],"outOfStock":[1540,"out-of-stock"],"outOfStockText":[1,"out-of-stock-text"],"addToCartText":[1,"add-to-cart-text"],"waitingListText":[1,"waiting-list-text"],"addToWaitingList":[4,"add-to-waiting-list"],"isMini":[4,"is-mini"],"addedToCart":[4,"added-to-cart"],"endAddedToCart":[4,"end-added-to-cart"],"variations":[32],"selectedVariation":[32],"priceFormatted":[32],"salePriceFormatted":[32]},[[0,"jump-card-ecommerce-option-connected","addOption"]]]]],["jump-filter.cjs",[[1,"jump-filter",{"direction":[1],"filterHeading":[1,"filter-heading"],"filterButtonLabel":[1,"filter-button-label"],"filterButtonIcon":[1,"filter-button-icon"],"mobileThreshold":[2,"mobile-threshold"],"filters":[8],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]]]]],["jump-filtergroup.cjs",[[1,"jump-filtergroup",{"name":[1],"heading":[1],"otherLabel":[1,"other-label"],"lessLabel":[1,"less-label"],"maxElements":[2,"max-elements"],"variant":[1],"label":[32],"values":[32],"value":[32],"slotItems":[32],"inputs":[32],"showMore":[32],"getValues":[64],"getActiveAmount":[64],"getInputs":[64],"getName":[64]},null,{"showMore":["watchShowMore"]}]]],["jump-pagination.cjs",[[1,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[1,"elements-ranges"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[32],"elPerPage":[32]},null,{"elementsRanges":["elementsRangesChanged"],"elPerPage":["elPerPageChanged"]}]]],["jump-quantity.cjs",[[65,"jump-quantity",{"min":[2],"max":[2],"step":[2],"label":[1],"type":[1],"variant":[1],"showButtons":[4,"show-buttons"],"value":[2],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-accordion.cjs",[[1,"jump-accordion",{"variant":[1],"summary":[1],"disabled":[4],"open":[516],"icon":[1],"identifier":[1]},[[0,"sl-show","handleShow"]]]]],["jump-tab-item.cjs",[[1,"jump-tab-item",{"identifier":[1],"iconName":[1,"icon-name"],"iconPosition":[1,"icon-position"],"label":[1],"active":[4],"disabled":[4],"variant":[32]}]]],["jump-accordion-group.cjs",[[1,"jump-accordion-group",{"variant":[1],"groupIdentifier":[1,"group-identifier"]}]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-card-ecommerce-option.cjs",[[1,"jump-card-ecommerce-option",{"code":[1],"imgUrl":[1,"img-url"],"label":[1],"sku":[1],"taxonomy":[1]}]]],["jump-filter-checkbox.cjs",[[1,"jump-filter-checkbox",{"value":[1],"label":[1],"checked":[516],"count":[8],"isChecked":[64]}]]],["jump-tab.cjs",[[1,"jump-tab",{"tabGroupName":[1,"tab-group-name"],"variant":[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["jump-tab-panel.cjs",[[1,"jump-tab-panel",{"identifier":[1],"active":[4]}]]],["jump-badge.cjs",[[1,"jump-badge",{"label":[1],"variant":[513],"dimension":[513],"soft":[516],"outline":[516]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/jump-card-ecommerce/jump-card-ecommerce.js

@@ -57,19 +57,6 @@ export class JumpCardEcommerce {
         }
         this.formatPrices();
     }
-    /**
-     * Format prices in locale currency
-     */
-    formatPrices() {
-        var _a;
-        let locale = (_a = document.documentElement.lang) !== null && _a !== void 0 ? _a : 'it-IT';
-        if (locale.length == 2) {
-            locale = `${locale}-${locale.toUpperCase()}`;
-        }
-        // Format price with 2 decimal digits and in locale
-        this.priceFormatted = this.price.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-        this.salePriceFormatted = this.salePrice.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-    }
     disconnectedCallback() {
         this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');
         if (this.jumpQuantityEl) {
@@ -113,6 +100,16 @@ export class JumpCardEcommerce {
             addToWaitingList: this.addToWaitingList
         });
     }
+    formatPrices() {
+        var _a;
+        let locale = (_a = document.documentElement.lang) !== null && _a !== void 0 ? _a : 'it-IT';
+        if (locale.length == 2) {
+            locale = `${locale}-${locale.toUpperCase()}`;
+        }
+        // Format price with 2 decimal digits and in locale
+        this.priceFormatted = this.price.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+        this.salePriceFormatted = this.salePrice.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+    }
     render() {
         const backgroundClass = this.hasBackground && !this.isMini ? 'hasBackground' : '';
         const iconOnlyClass = this.onlyIconButton && !this.isMini ? 'iconOnly' : '';

package/dist/collection/components/jump-card-ecommerce/jump-card-ecommerce.js.map

@@ -1 +1 @@
-{"version":3,"file":"jump-card-ecommerce.js","sourceRoot":"","sources":["../../../src/components/jump-card-ecommerce/jump-card-ecommerce.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Listen} from '@stencil/core';\n\ninterface Variation {\n  code: string;\n  imgUrl: string;\n  label: string;\n  taxonomy: string;\n  // Add more keys as needed\n}\n\n@Component({\n  tag: 'jump-card-ecommerce',\n  styleUrl: 'jump-card-ecommerce.scss',\n  shadow: true,\n})\nexport class JumpCardEcommerce {\n\n  @Element() JumpCardEcommerce: HTMLElement;\n  jumpQuantityEl;\n\n  /* ---------------------- @PROPERTIES ------------------------- */\n\n  /** Indicate if card has only icon button*/\n  @Prop() onlyIconButton: boolean = false;\n\n  /** Indicate if card has background*/\n  @Prop() hasBackground: boolean = false;\n\n  /** Indicates the badge of the card*/\n  @Prop() badge: string;\n\n  /**  Indicates if the product is favorite */\n\n  @Prop({mutable:true, reflect: true}) favorite: boolean = false;\n\n  /** Indicate if the whislist is active in shop*/\n  @Prop() hasFavorite: boolean = false;\n\n  /** Indicate if the whislist will be slotted*/\n  @Prop() hasSlotForFavorite: boolean = false;\n\n  /** Indicates if the favorite button is render as an anchor, and define the url*/\n  @Prop() favoriteHref: string;\n\n  /** Indicates the link of the card*/\n  @Prop() link: string;\n\n  /** Indicates the image's src of the card*/\n  @Prop() img: string ;\n\n  /** Indicates the img's alt of the card*/\n  @Prop() imgAlt: string;\n\n  /** Indicates the over image's src of the card*/\n  @Prop() hoverImg: string ;\n\n  /** Indicates the hover img's alt of the card*/\n  @Prop() hoverImgAlt: string;\n\n  /** Indicates the videoSrc of the card*/\n  @Prop() videoSrc: string;\n\n  /** Indicates the notificationUrl of the card*/\n  @Prop() notificationUrl: string;\n\n  /** Indicates the notificationText of the card*/\n  @Prop() notificationText: string = '';\n\n  /** Indicates the title of the card*/\n  @Prop() productName: string ;\n\n  /** Indicates the subtitle of the card*/\n  @Prop() subtitle: string;\n\n  /** Indicates the ID of the product, can be also a SKU*/\n  @Prop() productId: string ;\n\n  /**  Indicates the price of the card */\n  @Prop() price: number;\n\n  /** Indicates the sale price of the card */\n  @Prop() salePrice: number;\n\n  /** Indicates the currency of the card */\n  @Prop() currency: string = '€';\n\n  /** Indicates if the product is outOfStock */\n  @Prop({mutable:true, reflect: true}) outOfStock: boolean = false;\n\n  /** Indicates the outOfStockText of the product*/\n  @Prop() outOfStockText: string;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() addToCartText: string ;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() waitingListText: string ;\n\n  /** Indicate if the user request to be notified when te product is avaible*/\n  @Prop() addToWaitingList: boolean = false;\n\n  /** Indicate if the card is Mini Card*/\n  @Prop() isMini: boolean = false;\n\n  /* ---------------------- @STATE ------------------------- */\n\n  /** Indicate if the product is added to cart --> non deve esserci nelle storie! */\n  @Prop() addedToCart: boolean = false;\n\n  @Prop() endAddedToCart: boolean = false;\n\n  @State() variations: Variation[] = [];\n\n  @State() selectedVariation: Variation;\n\n  @State() priceFormatted: string;\n  @State() salePriceFormatted: string;\n\n  // è una proprietà che viene cambiata solo da dentro\n  quantity: number;\n\n  variationSelectEl: HTMLSelectElement;\n\n /* ---------------------- @EVENTS ------------------------- */\n\n  @Event({eventName: 'jump-toggle-favorite'}) toggleFavorite: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-cart'}) productAddToCart: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-waiting-list'}) productWaitingList: EventEmitter;\n\n  @Event({ eventName: 'jump-variation-selected' }) variationSelected: EventEmitter; // verificare se corretto: aggiungo un evento\n\n  @Listen(\"jump-card-ecommerce-option-connected\")\n  addOption(e) {\n    let props = e.detail; // es {code: 'sku1', imageUrl: 'https://google.com/'}\n    this.variations = [...this.variations, { ...props }];\n  }\n\n  onVariationSelected() {\n    let currentValue = this.variationSelectEl.value;\n    let variation = this.variations.find(\n      (variation) => variation.code == currentValue,\n    );\n    this.selectedVariation = variation;\n    this.variationSelected.emit(variation); // verificare se corretto: emetto l'evento\n  }\n\n\n  /* ---------------------- @LIFECYCLE ------------------------- */\n\n  componentWillLoad() {}\n\n  componentDidLoad() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.addEventListener('jump-change',  this.onQuantityChange.bind(this));\n      this.quantity = this.jumpQuantityEl.getValue().then((quantity) => {\n        this.quantity = quantity;\n      });\n    }\n    this.formatPrices();\n  }\n\n  /**\n   * Format prices in locale currency\n   */\n  formatPrices() {\n    let locale = document.documentElement.lang ?? 'it-IT';\n    if(locale.length == 2) {\n      locale = `${locale}-${locale.toUpperCase()}`;\n    }\n\n    // Format price with 2 decimal digits and in locale\n    this.priceFormatted = this.price.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n    this.salePriceFormatted = this.salePrice.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n  }\n\n  disconnectedCallback() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.removeEventListener('jump-change',this.onQuantityChange);\n    }\n  }\n\n  /* ---------------------- @METHODS ------------------------- */\n  onQuantityChange(e) {\n    this.quantity = e.detail.value ?? false;\n  }\n\n  onToggleFavorite() {\n    this.favorite = !this.favorite;\n    this.toggleFavorite.emit(\n      {\n        productId: this.productId,\n        favorite: this.favorite\n      }\n    );\n  }\n\n  addProductToCart() {\n    this.addedToCart = true;\n    let variations = this.selectedVariation;\n    if(!variations && this.variations.length > 0) {\n      variations = this.variations[0];\n    }\n\n    const payload = {\n      productId: this.productId,\n      addedToCart: this.addedToCart,\n      quantity: this.quantity ?? null,\n      variation: variations ?? null\n    };\n    this.productAddToCart.emit(payload);\n\n    setTimeout(() => {\n      this.addedToCart = false;\n    }, 6000);\n  }\n\n  waitingList() {\n    this.addToWaitingList = true;\n    this.productWaitingList.emit(\n      {\n        productId: this.productId,\n        addToWaitingList: this.addToWaitingList\n      }\n    )\n  }\n\n  render() {\n    const backgroundClass = this.hasBackground && !this.isMini ? 'hasBackground' : '';\n    const iconOnlyClass = this.onlyIconButton && !this.isMini ? 'iconOnly' : '';\n    const justifyClass = this.outOfStock ? 'justify-between' : '';\n    const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\n    const miniCard = this.isMini ? 'is-mini' : '';\n\n    function calculateDiscount(price: number, salePrice: number): string {\n      const discount = ((price - salePrice) / price) * 100;\n      return discount.toFixed(0);\n    };\n\n    return (\n      <Host>\n        { !this.isMini && this.badge ? <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant=\"secondary\" dimension=\"small\" label={this.badge}></jump-badge> : ''}\n\n        { !this.isMini && this.hasFavorite ?\n          this.favoriteHref != '' ?\n          <jump-button href={this.favoriteHref} onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n              :\n          <jump-button onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n        :\n          this.hasSlotForFavorite ? <div class=\"Favorite\"><slot name=\"favorite\"></slot> </div> : null\n        }\n\n        <div class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}>\n          <a href={this.link}>\n            <figure class={`Images ${hasImageOnHover} `}>\n              {this.img && !this.videoSrc ? <img class=\"Images__Front\" src={this.img} alt={this.imgAlt}></img> : ''}\n              {this.hoverImg && !this.videoSrc ? <img class=\"Images__OnHover\" src={this.hoverImg} alt={this.hoverImgAlt}></img> : ''}\n            </figure>\n            {this.videoSrc && !this.img ?\n              <video autoplay>\n                <source src={this.videoSrc} type=\"video/mp4\"/>\n                <source src={this.videoSrc} type=\"video/mov\"/>\n                <source src={this.videoSrc} type=\"video/webm\"/>\n              </video> : ''}\n          </a>\n          { !this.isMini ?\n            <div class={`NotificationCart ${this.addedToCart == true ? 'is-active fade-in-out' : ''}`}>\n              <jump-button href={this.notificationUrl} variant=\"white\" text>\n                <jump-icon slot=\"prefix\" name=\"check\"></jump-icon>\n                <span> {this.notificationText} </span>\n              </jump-button>\n            </div>\n          : null}\n          { !this.isMini && this.onlyIconButton ?\n            <div class=\"OnlyIconButton\">\n              <jump-button variant=\"secondary\" size=\"large\" pill onlyIcon onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name='cart-shopping' category=\"regular\"></jump-icon>\n              </jump-button>\n            </div>\n            : ''\n          }\n        </div>\n\n        <div class={`Content ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n          <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n            <div>\n              <div class=\"Info\">\n                <div class=\"Product\">{this.productName}</div>\n                { !this.isMini && this.subtitle ? <div class=\"Subtitle\">{this.subtitle}</div> : null}\n              </div>\n\n              {this.price ?\n                <div class={`Price ${miniCard}`}>\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Discount\"> {calculateDiscount(this.price, this.salePrice)}% </div>\n                  : null}\n\n                  {!this.isMini ?\n                    <div class={`Price__Regular ${this.salePrice && this.salePrice < this.price ? 'sale' : ''}`}>\n                      {this.currency}{this.priceFormatted}\n                    </div>\n                  :\n                    <div class={`Price__Regular`}>\n                      {this.currency}{ this.salePrice && this.salePrice < this.price ? this.salePriceFormatted : this.priceFormatted}\n                    </div>\n                  }\n\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Sale\">{this.currency}{this.salePriceFormatted}</div>\n                  : null}\n                </div>\n                : null}\n            </div>\n\n            {!this.isMini ?\n              <div class=\"SelectVariations\">\n                {this.variations.length != 0 ?\n                  <select\n                    ref={(el) => (this.variationSelectEl = el)} //salvo questo elemento in this.variationSelectEl\n                    onChange={() => {\n                      this.onVariationSelected();\n                    }}\n                  >\n                    {this.variations\n                      .filter((variation) => !variation.imgUrl)\n                      .map((variation) => (\n                        <option value={variation.code}>{variation.label}</option>\n                    ))}\n                  </select>\n                : null }\n              </div>\n            : null}\n\n            {!this.isMini ? <slot name=\"quantity\"></slot> : null}\n          </div>\n\n          <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n            {this.outOfStock ? <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n            { this.outOfStock ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.waitingList()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.waitingListText ? this.waitingListText : 'Notifica disponibilità'}\n              </jump-button> : ''\n            }\n\n            { !this.outOfStock && !this.onlyIconButton ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.addToCartText ? this.addToCartText : 'Aggiungi al carrello'}\n              </jump-button> : ''\n            }\n\n          </div>\n\n        </div>\n      </Host>\n    );\n  }\n\n}\n"]}
+{"version":3,"file":"jump-card-ecommerce.js","sourceRoot":"","sources":["../../../src/components/jump-card-ecommerce/jump-card-ecommerce.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Listen} from '@stencil/core';\n\ninterface Variation {\n  code: string;\n  imgUrl: string;\n  label: string;\n  taxonomy: string;\n  // Add more keys as needed\n}\n\n@Component({\n  tag: 'jump-card-ecommerce',\n  styleUrl: 'jump-card-ecommerce.scss',\n  shadow: true,\n})\nexport class JumpCardEcommerce {\n\n  @Element() JumpCardEcommerce: HTMLElement;\n  jumpQuantityEl;\n\n  /* ---------------------- @PROPERTIES ------------------------- */\n\n  /** Indicate if card has only icon button*/\n  @Prop() onlyIconButton: boolean = false;\n\n  /** Indicate if card has background*/\n  @Prop() hasBackground: boolean = false;\n\n  /** Indicates the badge of the card*/\n  @Prop() badge: string;\n\n  /**  Indicates if the product is favorite */\n\n  @Prop({mutable:true, reflect: true}) favorite: boolean = false;\n\n  /** Indicate if the whislist is active in shop*/\n  @Prop() hasFavorite: boolean = false;\n\n  /** Indicate if the whislist will be slotted*/\n  @Prop() hasSlotForFavorite: boolean = false;\n\n  /** Indicates if the favorite button is render as an anchor, and define the url*/\n  @Prop() favoriteHref: string;\n\n  /** Indicates the link of the card*/\n  @Prop() link: string;\n\n  /** Indicates the image's src of the card*/\n  @Prop() img: string ;\n\n  /** Indicates the img's alt of the card*/\n  @Prop() imgAlt: string;\n\n  /** Indicates the over image's src of the card*/\n  @Prop() hoverImg: string ;\n\n  /** Indicates the hover img's alt of the card*/\n  @Prop() hoverImgAlt: string;\n\n  /** Indicates the videoSrc of the card*/\n  @Prop() videoSrc: string;\n\n  /** Indicates the notificationUrl of the card*/\n  @Prop() notificationUrl: string;\n\n  /** Indicates the notificationText of the card*/\n  @Prop() notificationText: string = '';\n\n  /** Indicates the title of the card*/\n  @Prop() productName: string ;\n\n  /** Indicates the subtitle of the card*/\n  @Prop() subtitle: string;\n\n  /** Indicates the ID of the product, can be also a SKU*/\n  @Prop() productId: string ;\n\n  /**  Indicates the price of the card */\n  @Prop() price: number;\n\n  /** Indicates the sale price of the card */\n  @Prop() salePrice: number;\n\n  /** Indicates the currency of the card */\n  @Prop() currency: string = '€';\n\n  /** Indicates if the product is outOfStock */\n  @Prop({mutable:true, reflect: true}) outOfStock: boolean = false;\n\n  /** Indicates the outOfStockText of the product*/\n  @Prop() outOfStockText: string;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() addToCartText: string ;\n\n  /** Indicates the button class of the add to cart / notification button */\n  @Prop() waitingListText: string ;\n\n  /** Indicate if the user request to be notified when te product is avaible*/\n  @Prop() addToWaitingList: boolean = false;\n\n  /** Indicate if the card is Mini Card*/\n  @Prop() isMini: boolean = false;\n\n  /* ---------------------- @STATE ------------------------- */\n\n  /** Indicate if the product is added to cart --> non deve esserci nelle storie! */\n  @Prop() addedToCart: boolean = false;\n\n  @Prop() endAddedToCart: boolean = false;\n\n  @State() variations: Variation[] = [];\n\n  @State() selectedVariation: Variation;\n\n  @State() priceFormatted: string;\n\n  @State() salePriceFormatted: string;\n\n  // è una proprietà che viene cambiata solo da dentro\n  quantity: number;\n\n  variationSelectEl: HTMLSelectElement;\n\n /* ---------------------- @EVENTS ------------------------- */\n\n  @Event({eventName: 'jump-toggle-favorite'}) toggleFavorite: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-cart'}) productAddToCart: EventEmitter;\n\n  @Event({eventName: 'jump-add-to-waiting-list'}) productWaitingList: EventEmitter;\n\n  @Event({ eventName: 'jump-variation-selected' }) variationSelected: EventEmitter; // verificare se corretto: aggiungo un evento\n\n  @Listen(\"jump-card-ecommerce-option-connected\")\n  addOption(e) {\n    let props = e.detail; // es {code: 'sku1', imageUrl: 'https://google.com/'}\n    this.variations = [...this.variations, { ...props }];\n  }\n\n  onVariationSelected() {\n    let currentValue = this.variationSelectEl.value;\n    let variation = this.variations.find(\n      (variation) => variation.code == currentValue,\n    );\n    this.selectedVariation = variation;\n    this.variationSelected.emit(variation); // verificare se corretto: emetto l'evento\n  }\n\n\n  /* ---------------------- @LIFECYCLE ------------------------- */\n\n  componentWillLoad() {}\n\n  componentDidLoad() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.addEventListener('jump-change',  this.onQuantityChange.bind(this));\n      this.quantity = this.jumpQuantityEl.getValue().then((quantity) => {\n        this.quantity = quantity;\n      });\n    }\n\n    this.formatPrices();\n  }\n\n  disconnectedCallback() {\n    this.jumpQuantityEl = this.JumpCardEcommerce.querySelector('jump-quantity');\n    if(this.jumpQuantityEl){\n      this.jumpQuantityEl.removeEventListener('jump-change',this.onQuantityChange);\n    }\n  }\n\n  /* ---------------------- @METHODS ------------------------- */\n  onQuantityChange(e) {\n    this.quantity = e.detail.value ?? false;\n  }\n\n  onToggleFavorite() {\n    this.favorite = !this.favorite;\n    this.toggleFavorite.emit(\n      {\n        productId: this.productId,\n        favorite: this.favorite\n      }\n    );\n  }\n\n  addProductToCart() {\n    this.addedToCart = true;\n    let variations = this.selectedVariation;\n    if(!variations && this.variations.length > 0) {\n      variations = this.variations[0];\n    }\n\n    const payload = {\n      productId: this.productId,\n      addedToCart: this.addedToCart,\n      quantity: this.quantity ?? null,\n      variation: variations ?? null\n    };\n    this.productAddToCart.emit(payload);\n\n    setTimeout(() => {\n      this.addedToCart = false;\n    }, 6000);\n  }\n\n  waitingList() {\n    this.addToWaitingList = true;\n    this.productWaitingList.emit(\n      {\n        productId: this.productId,\n        addToWaitingList: this.addToWaitingList\n      }\n    )\n  }\n\n  formatPrices() {\n    let locale = document.documentElement.lang ?? 'it-IT';\n    if(locale.length == 2) {\n      locale = `${locale}-${locale.toUpperCase()}`;\n    }\n\n    // Format price with 2 decimal digits and in locale\n    this.priceFormatted = this.price.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n    this.salePriceFormatted = this.salePrice.toLocaleString(locale, {minimumFractionDigits: 2, maximumFractionDigits: 2});\n  }\n\n  render() {\n    const backgroundClass = this.hasBackground && !this.isMini ? 'hasBackground' : '';\n    const iconOnlyClass = this.onlyIconButton && !this.isMini ? 'iconOnly' : '';\n    const justifyClass = this.outOfStock ? 'justify-between' : '';\n    const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\n    const miniCard = this.isMini ? 'is-mini' : '';\n\n    function calculateDiscount(price: number, salePrice: number): string {\n      const discount = ((price - salePrice) / price) * 100;\n      return discount.toFixed(0);\n    };\n\n    return (\n      <Host>\n        { !this.isMini && this.badge ? <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant=\"secondary\" dimension=\"small\" label={this.badge}></jump-badge> : ''}\n\n        { !this.isMini && this.hasFavorite ?\n          this.favoriteHref != '' ?\n          <jump-button href={this.favoriteHref} onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n              :\n          <jump-button onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass}`} variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n              <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'} size=\"medium\"></jump-icon>\n          </jump-button>\n        :\n          this.hasSlotForFavorite ? <div class=\"Favorite\"><slot name=\"favorite\"></slot> </div> : null\n        }\n\n        <div class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}>\n          <a href={this.link}>\n            <figure class={`Images ${hasImageOnHover} `}>\n              {this.img && !this.videoSrc ? <img class=\"Images__Front\" src={this.img} alt={this.imgAlt}></img> : ''}\n              {this.hoverImg && !this.videoSrc ? <img class=\"Images__OnHover\" src={this.hoverImg} alt={this.hoverImgAlt}></img> : ''}\n            </figure>\n            {this.videoSrc && !this.img ?\n              <video autoplay>\n                <source src={this.videoSrc} type=\"video/mp4\"/>\n                <source src={this.videoSrc} type=\"video/mov\"/>\n                <source src={this.videoSrc} type=\"video/webm\"/>\n              </video> : ''}\n          </a>\n          { !this.isMini ?\n            <div class={`NotificationCart ${this.addedToCart == true ? 'is-active fade-in-out' : ''}`}>\n              <jump-button href={this.notificationUrl} variant=\"white\" text>\n                <jump-icon slot=\"prefix\" name=\"check\"></jump-icon>\n                <span> {this.notificationText} </span>\n              </jump-button>\n            </div>\n          : null}\n          { !this.isMini && this.onlyIconButton ?\n            <div class=\"OnlyIconButton\">\n              <jump-button variant=\"secondary\" size=\"large\" pill onlyIcon onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name='cart-shopping' category=\"regular\"></jump-icon>\n              </jump-button>\n            </div>\n            : ''\n          }\n        </div>\n\n        <div class={`Content ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n          <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n            <div>\n              <div class=\"Info\">\n                <div class=\"Product\">{this.productName}</div>\n                { !this.isMini && this.subtitle ? <div class=\"Subtitle\">{this.subtitle}</div> : null}\n              </div>\n\n              {this.price ?\n                <div class={`Price ${miniCard}`}>\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Discount\"> {calculateDiscount(this.price, this.salePrice)}% </div>\n                  : null}\n\n                  {!this.isMini ?\n                    <div class={`Price__Regular ${this.salePrice && this.salePrice < this.price ? 'sale' : ''}`}>\n                      {this.currency}{this.priceFormatted}\n                    </div>\n                  :\n                    <div class={`Price__Regular`}>\n                      {this.currency}{ this.salePrice && this.salePrice < this.price ? this.salePriceFormatted : this.priceFormatted}\n                    </div>\n                  }\n\n                  {!this.isMini && this.salePrice && this.salePrice < this.price ?\n                    <div class=\"Price__Sale\">{this.currency}{this.salePriceFormatted}</div>\n                  : null}\n                </div>\n                : null}\n            </div>\n\n            {!this.isMini ?\n              <div class=\"SelectVariations\">\n                {this.variations.length != 0 ?\n                  <select\n                    ref={(el) => (this.variationSelectEl = el)} //salvo questo elemento in this.variationSelectEl\n                    onChange={() => {\n                      this.onVariationSelected();\n                    }}\n                  >\n                    {this.variations\n                      .filter((variation) => !variation.imgUrl)\n                      .map((variation) => (\n                        <option value={variation.code}>{variation.label}</option>\n                    ))}\n                  </select>\n                : null }\n              </div>\n            : null}\n\n            {!this.isMini ? <slot name=\"quantity\"></slot> : null}\n          </div>\n\n          <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n            {this.outOfStock ? <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n            { this.outOfStock ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.waitingList()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.waitingListText ? this.waitingListText : 'Notifica disponibilità'}\n              </jump-button> : ''\n            }\n\n            { !this.outOfStock && !this.onlyIconButton ?\n              <jump-button variant=\"secondary\" size=\"small\" text onClick={() => this.addProductToCart()}>\n                <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\" size=\"small\"></jump-icon>\n                {this.addToCartText ? this.addToCartText : 'Aggiungi al carrello'}\n              </jump-button> : ''\n            }\n\n          </div>\n\n        </div>\n      </Host>\n    );\n  }\n\n}\n"]}

package/dist/collection/components/jump-card-ecommerce-option/jump-card-ecommerce-option.stories.js

@@ -14,6 +14,10 @@ const TemplateWithCardEcommerceOption = () => {
   window.addEventListener('jump-variation-selected', (e) => {
     console.log('jump-variation-selected', e.detail);
   });
+
+  window.addEventListener('jump-add-to-cart', (e) => {
+    console.log('jump-add-to-cart', e.detail);
+  });
 </script>
 <jump-card-ecommerce class="JumpCardEcommerce hydrated" badge="" link="https://robinsonb2b.test/prodotto/home/top-quality/prodotti-green-ecologici-biologici-per-cani-e-gatti/cibo-da-filiere-ecosostenibili-per-cani/proteine-di-insetto-per-cani/canagan-insect-protein-all-breeds-per-cani/" img="https://media.robinsonpetshop.it/robinsonb2b/uploads/2023/04/25025-Canagan-Insect-Protein-All-Breeds-per-Cani.jpg" img-alt="Canagan Insect Protein All Breeds per Cani" notification-url="https://robinsonb2b.test/carrello/" notification-text="Added to cart" product-name="Canagan" subtitle="Canagan Insect Protein All Breeds per Cani" product-id="84122" price="25.33" sale-price="15.198" currency="€" out-of-stock-text="Expired" addto-cart-text="Add to cart" waiting-list-text="Notify availability" quantity="">