@jumpgroup/jump-design-system 0.3.6 → 0.3.8

package/dist/jump-design-system/p-23fb306d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jumpCardEcommerceCss","JumpCardEcommerceStyle0","JumpCardEcommerce","addOption","e","props","detail","this","variations","Object","assign","onVariationSelected","variation","selectedVariation","variationSelected","emit","componentWillLoad","componentDidLoad","jumpQuantityEl","querySelector","addEventListener","onQuantityChange","bind","quantity","getValue","then","disconnectedCallback","removeEventListener","_a","value","onToggleFavorite","favorite","toggleFavorite","productId","addProductToCart","addedToCart","payload","_b","productAddToCart","setTimeout","waitingList","addToWaitingList","productWaitingList","render","backgroundClass","hasBackground","iconOnlyClass","onlyIconButton","justifyClass","outOfStock","hasImageOnHover","hoverImg","calculateDiscount","price","salePrice","discount","toFixed","h","Host","badge","class","variant","dimension","label","hasFavorite","onClick","favoriteBtnClass","size","text","onlyIcon","slot","name","category","href","link","img","videoSrc","src","alt","imgAlt","hoverImgAlt","autoplay","type","notificationUrl","notificationText","pill","productName","subtitle","currency","length","ref","el","variationSelectEl","onChange","currentValue","currentVariation","find","code","filter","imgUrl","map","outOfStockText","waitingListText","addToCartText"],"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-top-left-radius: 3px;\n    border-top-right-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\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\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\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\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\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  /** Give possibility to add classes to icon favorite*/\n  @Prop() favoriteBtnClass: 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  /* ---------------------- @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  // è 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(variation) {\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\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    const payload = {\n      productId: this.productId,\n      addedToCart: this.addedToCart,\n      quantity: this.quantity ?? null,\n      variation: this.selectedVariation ?? 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 ? 'hasBackground' : '';\n    const iconOnlyClass = this.onlyIconButton ? 'iconOnly' : '';\n    const justifyClass = this.outOfStock ? 'justify-between' : '';\n    const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\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.badge ? <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant=\"secondary\" dimension=\"small\" label={this.badge}></jump-badge> : ''}\n  \n        {this.hasFavorite ? \n          <jump-button onClick={ () => this.onToggleFavorite() } class={`Favorite ${backgroundClass} ${iconOnlyClass} ${this.favoriteBtnClass}`} 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        : null}\n\n        <div class={`Media ${iconOnlyClass} ${backgroundClass}`}>\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          <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            {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}`}>\n          <div class={`Body ${backgroundClass} ${iconOnlyClass}`}>\n            <div>\n              <div class=\"Info\">\n                <div class=\"Product\">{this.productName}</div>\n                {this.subtitle ? <div class=\"Subtitle\">{this.subtitle}</div> : null}\n              </div>\n\n              {this.price ?\n                <div class=\"Price\">\n                  {this.salePrice && this.salePrice != 0 ?\n                    <div class=\"Price__Discount\"> {calculateDiscount(this.price, this.salePrice)}% </div>\n                  : null}\n                  <div class={`Price__Regular ${this.salePrice ? 'sale' : ''}`}>\n                    {this.currency}{this.price}\n                  </div>\n                  {this.salePrice ?\n                    <div class=\"Price__Sale\">{this.currency}{this.salePrice}</div>\n                  : null}\n                </div>\n              : null}\n            </div>\n\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                    let currentValue = this.variationSelectEl.value;\n                    let currentVariation = this.variations.find(\n                      (variation) => variation.code == currentValue,\n                    );\n                    this.onVariationSelected(currentVariation);\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            <slot name=\"quantity\"></slot>\n          </div>\n\n          <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass}`}>\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"],"mappings":"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"}

package/dist/jump-design-system/p-a5aaa1dd.entry.js

@@ -0,0 +1,2 @@
+import{r as s,c as t,h as e,H as i}from"./p-4d6cc90d.js";const n=":host{display:none}";const o=n;const c=class{constructor(e){s(this,e);this.connectedEvent=t(this,"jump-card-ecommerce-option-connected",7);this.code=undefined;this.imgUrl=undefined;this.label=undefined;this.sku=undefined;this.taxonomy=undefined}componentWillLoad(){this.connectedEvent.emit({code:this.code,label:this.label,imgUrl:this.imgUrl,sku:this.sku,taxonomy:this.taxonomy})}render(){return e(i,{key:"2cb613a6943ff85b11b3daf50591377c464009c7"})}};c.style=o;export{c as jump_card_ecommerce_option};
+//# sourceMappingURL=p-a5aaa1dd.entry.js.map

package/dist/jump-design-system/p-a5aaa1dd.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jumpCardEcommerceOptionCss","JumpCardEcommerceOptionStyle0","CardEcommerceOption","componentWillLoad","this","connectedEvent","emit","code","label","imgUrl","sku","taxonomy","render","h","Host","key"],"sources":["src/components/jump-card-ecommerce-option/jump-card-ecommerce-option.scss?tag=jump-card-ecommerce-option&encapsulation=shadow","src/components/jump-card-ecommerce-option/jump-card-ecommerce-option.tsx"],"sourcesContent":[":host {\n  display: none;\n}\n","import { Component, Host, Event, Prop, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"jump-card-ecommerce-option\",\n  styleUrl: \"jump-card-ecommerce-option.scss\",\n  shadow: true,\n})\nexport class CardEcommerceOption {\n  @Prop() code: string;\n  @Prop() imgUrl: string;\n  @Prop() label: string;\n  @Prop() sku: string;\n  @Prop() taxonomy: string;\n\n  @Event({ eventName: \"jump-card-ecommerce-option-connected\" }) connectedEvent;\n\n  componentWillLoad() {\n    this.connectedEvent.emit({\n      code: this.code,\n      label: this.label,\n      imgUrl: this.imgUrl,\n      sku: this.sku,\n      taxonomy: this.taxonomy,\n    });\n  }\n\n  render() {\n    return <Host></Host>;\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAA6B,sBACnC,MAAAC,EAAeD,E,MCMFE,EAAmB,M,wMAS9B,iBAAAC,GACEC,KAAKC,eAAeC,KAAK,CACvBC,KAAMH,KAAKG,KACXC,MAAOJ,KAAKI,MACZC,OAAQL,KAAKK,OACbC,IAAKN,KAAKM,IACVC,SAAUP,KAAKO,U,CAInB,MAAAC,GACE,OAAOC,EAACC,EAAI,CAAAC,IAAA,4C"}

package/dist/jump-design-system/p-d1e411fd.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,H as e}from"./p-4d6cc90d.js";const h=":host{display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}h5{margin:0 0 0.25rem}[data-hide=true]{display:none}";const a=h;const n=class{constructor(s){t(this,s);this.change=i(this,"jump-filterchange",7);this.name="tax-name";this.title="Titolo del filtro";this.otherLabel="Mostra altro";this.lessLabel="Mostra meno";this.maxElements=8;this.variant="default";this.values=[];this.value="";this.slotItems=undefined;this.inputs=[];this.showMore=true}async getValues(){return this.values}async getActiveAmount(){return this.values.length}async getInputs(){return this.inputs}async getName(){return this.name}toggleHiddenItems(){this.slotItemsWrapper.assignedElements().forEach(((t,i)=>{if(i>this.maxElements){t.setAttribute("data-hide",this.showMore?"true":"false")}}))}handleShowMore(){this.showMore=!this.showMore;this.toggleHiddenItems()}handleChange(t){const i=t.target;const s=i.value;if(i.tagName==="INPUT"){if(i.type==="checkbox"){if(i.checked){this.values.push(s)}else{const t=this.values.indexOf(s);if(t!==-1){this.values.splice(t,1)}}}else if(i.type==="radio"){this.value=s;this.values=[s]}}else if(i.tagName==="SELECT"){this.value=s;this.values=[s]}this.change.emit({name:this.name,values:this.values})}componentDidLoad(){this.slotItems=this.slotItemsWrapper.assignedElements();this.slotItemsWrapper.addEventListener("change",this.handleChange.bind(this));let t=0;this.slotItems.forEach((i=>{if(t>this.maxElements){i.setAttribute("data-hide","true")}if(i.tagName==="INPUT"||i.tagName==="SELECT"){this.inputs.push(i);if(i.tagName==="INPUT"&&i.type==="radio"){i.name=this.name}}else{const t=i.querySelectorAll("input, select");if(t.length>0){t.forEach((t=>{this.inputs.push(t);if(t.tagName==="INPUT"&&t.type==="radio"){t.name=this.name}}))}}t++}))}render(){return s(e,{key:"aa5959350948a2325f4b646ab8e6d31311df03a0"},this.title&&s("h5",{key:"43dff28c8b63b311b673390fabfec1dfaf933386"},this.title),s("div",{key:"4b93f3ab110f6646977e00590eb8bee9e7b1ce28",class:"filterGroup"},s("slot",{key:"459320fd46540ac84ab5e2ba3cd911e0bfcd663c",ref:t=>this.slotItemsWrapper=t})),this.inputs.length>this.maxElements&&s("jump-button",{key:"24999d7f0a79eeefd25ecd6c677f1170e14df6b5",variant:"primary",size:"small",text:true,name:this.showMore?this.otherLabel:this.lessLabel,"aria-label":this.showMore?this.otherLabel:this.lessLabel,onClick:()=>this.handleShowMore()},this.showMore?this.otherLabel:this.lessLabel,s("jump-icon",{key:"7731006e80030c6d6a9fc8ce4b49fc60f792834e",slot:"suffix",name:this.showMore?"chevron-down":"chevron-down"})))}};n.style=a;export{n as jump_filtergroup};
+//# sourceMappingURL=p-d1e411fd.entry.js.map

package/dist/jump-design-system/p-d1e411fd.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jumpFiltergroupCss","JumpFiltergroupStyle0","JumpFiltergroup","getValues","this","values","getActiveAmount","length","getInputs","inputs","getName","name","toggleHiddenItems","slotItemsWrapper","assignedElements","forEach","item","index","maxElements","setAttribute","showMore","handleShowMore","handleChange","event","target","newValue","value","tagName","type","checked","push","indexOf","splice","change","emit","componentDidLoad","slotItems","addEventListener","bind","querySelectorAll","input","render","h","Host","key","title","class","ref","el","variant","size","text","otherLabel","lessLabel","onClick","slot"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n  display: block;\n\n  slot {\n    display: flex;\n    flex-direction: column;\n    gap: .25rem;\n    margin-bottom: 1rem;\n  }\n}\n\nh5 {\n  margin: 0 0 .25rem;\n}\n//TODO: capire perché non prende questo stile\n[data-hide=\"true\"] {\n  display: none;\n}\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() title: 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\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        item.setAttribute('data-hide', this.showMore ? 'true' : 'false');\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  componentDidLoad() {\n    this.slotItems = this.slotItemsWrapper.assignedElements();\n    this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n\n    let index = 0;\n    this.slotItems.forEach((item) => {\n      if(index > this.maxElements) {\n        item.setAttribute('data-hide', 'true');\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\n  render() {\n    return (\n      <Host>\n        {this.title && <h5>{this.title}</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                       onClick={() => this.handleShowMore() }>\n            {this.showMore ? this.otherLabel : this.lessLabel}\n            <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-down'}></jump-icon>\n          </jump-button>\n        }\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAqB,wJAC3B,MAAAC,EAAeD,E,MCMFE,EAAe,M,6EACH,W,WACC,oB,gBACK,e,eACD,c,iBACE,E,aAEa,U,YAEf,G,WACH,G,qCAEF,G,cACM,I,CAO7B,eAAMC,GACJ,OAAOC,KAAKC,M,CAId,qBAAMC,GACJ,OAAOF,KAAKC,OAAOE,M,CAIrB,eAAMC,GACJ,OAAOJ,KAAKK,M,CAId,aAAMC,GACJ,OAAON,KAAKO,I,CAGd,iBAAAC,GACER,KAAKS,iBAAiBC,mBAAmBC,SAAQ,CAACC,EAAMC,KACtD,GAAGA,EAAQb,KAAKc,YAAa,CAC3BF,EAAKG,aAAa,YAAaf,KAAKgB,SAAW,OAAS,Q,KAK9D,cAAAC,GACEjB,KAAKgB,UAAYhB,KAAKgB,SACtBhB,KAAKQ,mB,CAGP,YAAAU,CAAaC,GACX,MAAMC,EAASD,EAAMC,OACrB,MAAMC,EAAWD,EAAOE,MAExB,GAAIF,EAAOG,UAAY,QAAS,CAC9B,GAAIH,EAAOI,OAAS,WAAY,CAE9B,GAAIJ,EAAOK,QAAS,CAClBzB,KAAKC,OAAOyB,KAAKL,E,KACZ,CACL,MAAMR,EAAQb,KAAKC,OAAO0B,QAAQN,GAClC,GAAIR,KAAW,EAAG,CAChBb,KAAKC,OAAO2B,OAAOf,EAAO,E,QAGzB,GAAIO,EAAOI,OAAS,QAAS,CAElCxB,KAAKsB,MAAQD,EACbrB,KAAKC,OAAS,CAACoB,E,OAEZ,GAAID,EAAOG,UAAY,SAAU,CAEtCvB,KAAKsB,MAAQD,EACbrB,KAAKC,OAAS,CAACoB,E,CAIjBrB,KAAK6B,OAAOC,KAAK,CACfvB,KAAMP,KAAKO,KACXN,OAAQD,KAAKC,Q,CAIjB,gBAAA8B,GACE/B,KAAKgC,UAAYhC,KAAKS,iBAAiBC,mBACvCV,KAAKS,iBAAiBwB,iBAAiB,SAAUjC,KAAKkB,aAAagB,KAAKlC,OAExE,IAAIa,EAAQ,EACZb,KAAKgC,UAAUrB,SAASC,IACtB,GAAGC,EAAQb,KAAKc,YAAa,CAC3BF,EAAKG,aAAa,YAAa,O,CAEjC,GAAIH,EAAKW,UAAY,SAAWX,EAAKW,UAAY,SAAU,CACzDvB,KAAKK,OAAOqB,KAAKd,GACjB,GAAIA,EAAKW,UAAY,SAAWX,EAAKY,OAAS,QAAS,CACrDZ,EAAKL,KAAOP,KAAKO,I,MAEd,CACL,MAAMF,EAASO,EAAKuB,iBAAiB,iBACrC,GAAI9B,EAAOF,OAAS,EAAG,CACrBE,EAAOM,SAASyB,IACdpC,KAAKK,OAAOqB,KAAKU,GAEjB,GAAIA,EAAMb,UAAY,SAAWa,EAAMZ,OAAS,QAAS,CACvDY,EAAM7B,KAAOP,KAAKO,I,MAK1BM,GAAO,G,CAIX,MAAAwB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFxC,KAAKyC,OAASH,EAAA,MAAAE,IAAA,4CAAKxC,KAAKyC,OACzBH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,eACTJ,EAAA,QAAAE,IAAA,2CAAMG,IAAMC,GAAQ5C,KAAKS,iBAAmBmC,KAE7C5C,KAAKK,OAAOF,OAASH,KAAKc,aACzBwB,EAAA,eAAAE,IAAA,2CAAaK,QAAQ,UAAUC,KAAK,QAAQC,KAAI,KAACxC,KAAMP,KAAKgB,SAAWhB,KAAKgD,WAAahD,KAAKiD,UAAS,aAC9EjD,KAAKgB,SAAWhB,KAAKgD,WAAahD,KAAKiD,UACnDC,QAAS,IAAMlD,KAAKiB,kBAC9BjB,KAAKgB,SAAWhB,KAAKgD,WAAahD,KAAKiD,UACxCX,EAAA,aAAAE,IAAA,2CAAWW,KAAK,SAAS5C,KAAMP,KAAKgB,SAAW,eAAiB,kB"}

package/dist/jump-design-system-elements.json

@@ -272,6 +272,10 @@
           "name": "favorite",
           "description": "Indicates if the product is favorite"
         },
+        {
+          "name": "favorite-btn-class",
+          "description": "Give possibility to add classes to icon favorite"
+        },
         {
           "name": "has-background",
           "description": "Indicate if card has background"
@@ -372,6 +376,10 @@
         {
           "name": "sku",
           "description": ""
+        },
+        {
+          "name": "taxonomy",
+          "description": ""
         }
       ]
     },
@@ -423,10 +431,6 @@
         "value": ""
       },
       "attributes": [
-        {
-          "name": "heading",
-          "description": ""
-        },
         {
           "name": "less-label",
           "description": ""
@@ -443,6 +447,10 @@
           "name": "other-label",
           "description": ""
         },
+        {
+          "name": "title",
+          "description": ""
+        },
         {
           "name": "variant",
           "description": "",

package/dist/types/components/jump-card-ecommerce/jump-card-ecommerce.d.ts

@@ -3,6 +3,7 @@ interface Variation {
     code: string;
     imgUrl: string;
     label: string;
+    taxonomy: string;
 }
 export declare class JumpCardEcommerce {
     JumpCardEcommerce: HTMLElement;
@@ -17,6 +18,8 @@ export declare class JumpCardEcommerce {
     favorite: boolean;
     /** Indicate if the whislist is active in shop*/
     hasFavorite: boolean;
+    /** Give possibility to add classes to icon favorite*/
+    favoriteBtnClass: string;
     /** Indicates the link of the card*/
     link: string;
     /** Indicates the image's src of the card*/
@@ -59,6 +62,7 @@ export declare class JumpCardEcommerce {
     addedToCart: boolean;
     endAddedToCart: boolean;
     variations: Variation[];
+    selectedVariation: Variation;
     quantity: number;
     variationSelectEl: HTMLSelectElement;
     toggleFavorite: EventEmitter;

package/dist/types/components/jump-card-ecommerce/jump-card-ecommerce.stories.d.ts

@@ -27,6 +27,11 @@ declare const _default: {
             description: string;
             control: string;
         };
+        favoriteBtnClass: {
+            name: string;
+            description: string;
+            control: string;
+        };
         link: {
             name: string;
             description: string;

package/dist/types/components/jump-card-ecommerce-option/jump-card-ecommerce-option.d.ts

@@ -3,6 +3,7 @@ export declare class CardEcommerceOption {
     imgUrl: string;
     label: string;
     sku: string;
+    taxonomy: string;
     connectedEvent: any;
     componentWillLoad(): void;
     render(): any;

package/dist/types/components/jump-filtergroup/jump-filtergroup.d.ts

@@ -1,6 +1,6 @@
 export declare class JumpFiltergroup {
     name: string;
-    heading: string;
+    title: string;
     otherLabel: string;
     lessLabel: string;
     maxElements: number;

package/dist/types/components.d.ts

@@ -168,6 +168,10 @@ export namespace Components {
           * Indicates if the product is favorite
          */
         "favorite": boolean;
+        /**
+          * Give possibility to add classes to icon favorite
+         */
+        "favoriteBtnClass": string;
         /**
           * Indicate if card has background
          */
@@ -250,6 +254,7 @@ export namespace Components {
         "imgUrl": string;
         "label": string;
         "sku": string;
+        "taxonomy": string;
     }
     interface JumpFilter {
         "direction": 'horizontal' | 'vertical';
@@ -268,11 +273,11 @@ export namespace Components {
         "getInputs": () => Promise<any>;
         "getName": () => Promise<string>;
         "getValues": () => Promise<string[]>;
-        "heading": string;
         "lessLabel": string;
         "maxElements": number;
         "name": string;
         "otherLabel": string;
+        "title": string;
         "variant": 'accordion' | 'default';
     }
     interface JumpIcon {
@@ -790,6 +795,10 @@ declare namespace LocalJSX {
           * Indicates if the product is favorite
          */
         "favorite"?: boolean;
+        /**
+          * Give possibility to add classes to icon favorite
+         */
+        "favoriteBtnClass"?: string;
         /**
           * Indicate if card has background
          */
@@ -877,6 +886,7 @@ declare namespace LocalJSX {
         "label"?: string;
         "onJump-card-ecommerce-option-connected"?: (event: JumpCardEcommerceOptionCustomEvent<any>) => void;
         "sku"?: string;
+        "taxonomy"?: string;
     }
     interface JumpFilter {
         "direction"?: 'horizontal' | 'vertical';
@@ -887,12 +897,12 @@ declare namespace LocalJSX {
         "mobileThreshold"?: number;
     }
     interface JumpFiltergroup {
-        "heading"?: string;
         "lessLabel"?: string;
         "maxElements"?: number;
         "name"?: string;
         "onJump-filterchange"?: (event: JumpFiltergroupCustomEvent<any>) => void;
         "otherLabel"?: string;
+        "title"?: string;
         "variant"?: 'accordion' | 'default';
     }
     interface JumpIcon {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jumpgroup/jump-design-system",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/jump-design-system/p-65ac4e72.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as s,H as e}from"./p-4d6cc90d.js";const h=":host{display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}h5{margin:0 0 0.25rem}[data-hide=true]{display:none}";const a=h;const n=class{constructor(s){t(this,s);this.change=i(this,"jump-filterchange",7);this.name="tax-name";this.heading="Titolo del filtro";this.otherLabel="Mostra altro";this.lessLabel="Mostra meno";this.maxElements=8;this.variant="default";this.values=[];this.value="";this.slotItems=undefined;this.inputs=[];this.showMore=true}async getValues(){return this.values}async getActiveAmount(){return this.values.length}async getInputs(){return this.inputs}async getName(){return this.name}toggleHiddenItems(){this.slotItemsWrapper.assignedElements().forEach(((t,i)=>{if(i>this.maxElements){t.setAttribute("data-hide",this.showMore?"true":"false")}}))}handleShowMore(){this.showMore=!this.showMore;this.toggleHiddenItems()}handleChange(t){const i=t.target;const s=i.value;if(i.tagName==="INPUT"){if(i.type==="checkbox"){if(i.checked){this.values.push(s)}else{const t=this.values.indexOf(s);if(t!==-1){this.values.splice(t,1)}}}else if(i.type==="radio"){this.value=s;this.values=[s]}}else if(i.tagName==="SELECT"){this.value=s;this.values=[s]}this.change.emit({name:this.name,values:this.values})}componentDidLoad(){this.slotItems=this.slotItemsWrapper.assignedElements();this.slotItemsWrapper.addEventListener("change",this.handleChange.bind(this));let t=0;this.slotItems.forEach((i=>{if(t>this.maxElements){i.setAttribute("data-hide","true")}if(i.tagName==="INPUT"||i.tagName==="SELECT"){this.inputs.push(i);if(i.tagName==="INPUT"&&i.type==="radio"){i.name=this.name}}else{const t=i.querySelectorAll("input, select");if(t.length>0){t.forEach((t=>{this.inputs.push(t);if(t.tagName==="INPUT"&&t.type==="radio"){t.name=this.name}}))}}t++}))}render(){return s(e,{key:"d830aaa7f43d5c7b8bd0f3fd031fc05feb6992a6"},this.heading&&s("h5",{key:"6cc93095701fd3661c080f3d90fcee49b6331b3e"},this.heading),s("div",{key:"4a530aaf6ca0dc513b30a4fa71fe742d8880106a",class:"filterGroup"},s("slot",{key:"aa1a4a654084bae835eef9c73d1575c8b46c3307",ref:t=>this.slotItemsWrapper=t})),this.inputs.length>this.maxElements&&s("jump-button",{key:"daebaf36924d7f7a62a169b37d1c9f216800b5c9",variant:"primary",size:"small",text:true,name:this.showMore?this.otherLabel:this.lessLabel,"aria-label":this.showMore?this.otherLabel:this.lessLabel,onClick:()=>this.handleShowMore()},this.showMore?this.otherLabel:this.lessLabel,s("jump-icon",{key:"3d6440909b8247a717c2fbc54e94009ef8dbc539",slot:"suffix",name:this.showMore?"chevron-down":"chevron-down"})))}};n.style=a;export{n as jump_filtergroup};
-//# sourceMappingURL=p-65ac4e72.entry.js.map

package/dist/jump-design-system/p-65ac4e72.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["jumpFiltergroupCss","JumpFiltergroupStyle0","JumpFiltergroup","getValues","this","values","getActiveAmount","length","getInputs","inputs","getName","name","toggleHiddenItems","slotItemsWrapper","assignedElements","forEach","item","index","maxElements","setAttribute","showMore","handleShowMore","handleChange","event","target","newValue","value","tagName","type","checked","push","indexOf","splice","change","emit","componentDidLoad","slotItems","addEventListener","bind","querySelectorAll","input","render","h","Host","key","heading","class","ref","el","variant","size","text","otherLabel","lessLabel","onClick","slot"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n  display: block;\n\n  slot {\n    display: flex;\n    flex-direction: column;\n    gap: .25rem;\n    margin-bottom: 1rem;\n  }\n}\n\nh5 {\n  margin: 0 0 .25rem;\n}\n//TODO: capire perché non prende questo stile\n[data-hide=\"true\"] {\n  display: none;\n}\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\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        item.setAttribute('data-hide', this.showMore ? 'true' : 'false');\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  componentDidLoad() {\n    this.slotItems = this.slotItemsWrapper.assignedElements();\n    this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n\n    let index = 0;\n    this.slotItems.forEach((item) => {\n      if(index > this.maxElements) {\n        item.setAttribute('data-hide', 'true');\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\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                       onClick={() => this.handleShowMore() }>\n            {this.showMore ? this.otherLabel : this.lessLabel}\n            <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-down'}></jump-icon>\n          </jump-button>\n        }\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAqB,wJAC3B,MAAAC,EAAeD,E,MCMFE,EAAe,M,6EACH,W,aACG,oB,gBACG,e,eACD,c,iBACE,E,aAEa,U,YAEf,G,WACH,G,qCAEF,G,cACM,I,CAO7B,eAAMC,GACJ,OAAOC,KAAKC,M,CAId,qBAAMC,GACJ,OAAOF,KAAKC,OAAOE,M,CAIrB,eAAMC,GACJ,OAAOJ,KAAKK,M,CAId,aAAMC,GACJ,OAAON,KAAKO,I,CAGd,iBAAAC,GACER,KAAKS,iBAAiBC,mBAAmBC,SAAQ,CAACC,EAAMC,KACtD,GAAGA,EAAQb,KAAKc,YAAa,CAC3BF,EAAKG,aAAa,YAAaf,KAAKgB,SAAW,OAAS,Q,KAK9D,cAAAC,GACEjB,KAAKgB,UAAYhB,KAAKgB,SACtBhB,KAAKQ,mB,CAGP,YAAAU,CAAaC,GACX,MAAMC,EAASD,EAAMC,OACrB,MAAMC,EAAWD,EAAOE,MAExB,GAAIF,EAAOG,UAAY,QAAS,CAC9B,GAAIH,EAAOI,OAAS,WAAY,CAE9B,GAAIJ,EAAOK,QAAS,CAClBzB,KAAKC,OAAOyB,KAAKL,E,KACZ,CACL,MAAMR,EAAQb,KAAKC,OAAO0B,QAAQN,GAClC,GAAIR,KAAW,EAAG,CAChBb,KAAKC,OAAO2B,OAAOf,EAAO,E,QAGzB,GAAIO,EAAOI,OAAS,QAAS,CAElCxB,KAAKsB,MAAQD,EACbrB,KAAKC,OAAS,CAACoB,E,OAEZ,GAAID,EAAOG,UAAY,SAAU,CAEtCvB,KAAKsB,MAAQD,EACbrB,KAAKC,OAAS,CAACoB,E,CAIjBrB,KAAK6B,OAAOC,KAAK,CACfvB,KAAMP,KAAKO,KACXN,OAAQD,KAAKC,Q,CAIjB,gBAAA8B,GACE/B,KAAKgC,UAAYhC,KAAKS,iBAAiBC,mBACvCV,KAAKS,iBAAiBwB,iBAAiB,SAAUjC,KAAKkB,aAAagB,KAAKlC,OAExE,IAAIa,EAAQ,EACZb,KAAKgC,UAAUrB,SAASC,IACtB,GAAGC,EAAQb,KAAKc,YAAa,CAC3BF,EAAKG,aAAa,YAAa,O,CAEjC,GAAIH,EAAKW,UAAY,SAAWX,EAAKW,UAAY,SAAU,CACzDvB,KAAKK,OAAOqB,KAAKd,GACjB,GAAIA,EAAKW,UAAY,SAAWX,EAAKY,OAAS,QAAS,CACrDZ,EAAKL,KAAOP,KAAKO,I,MAEd,CACL,MAAMF,EAASO,EAAKuB,iBAAiB,iBACrC,GAAI9B,EAAOF,OAAS,EAAG,CACrBE,EAAOM,SAASyB,IACdpC,KAAKK,OAAOqB,KAAKU,GAEjB,GAAIA,EAAMb,UAAY,SAAWa,EAAMZ,OAAS,QAAS,CACvDY,EAAM7B,KAAOP,KAAKO,I,MAK1BM,GAAO,G,CAIX,MAAAwB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFxC,KAAKyC,SAAWH,EAAA,MAAAE,IAAA,4CAAKxC,KAAKyC,SAC3BH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,eACTJ,EAAA,QAAAE,IAAA,2CAAMG,IAAMC,GAAQ5C,KAAKS,iBAAmBmC,KAE7C5C,KAAKK,OAAOF,OAASH,KAAKc,aACzBwB,EAAA,eAAAE,IAAA,2CAAaK,QAAQ,UAAUC,KAAK,QAAQC,KAAI,KAACxC,KAAMP,KAAKgB,SAAWhB,KAAKgD,WAAahD,KAAKiD,UAAS,aAC9EjD,KAAKgB,SAAWhB,KAAKgD,WAAahD,KAAKiD,UACnDC,QAAS,IAAMlD,KAAKiB,kBAC9BjB,KAAKgB,SAAWhB,KAAKgD,WAAahD,KAAKiD,UACxCX,EAAA,aAAAE,IAAA,2CAAWW,KAAK,SAAS5C,KAAMP,KAAKgB,SAAW,eAAiB,kB"}

package/dist/jump-design-system/p-b92e6459.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,H as s,g as a}from"./p-4d6cc90d.js";const o=":host{--card-max-width:450px;--jump-card-max-width-horizontal:100%;--jump-card-color:var(--neutral-grey-primary);--jump-card-background:transparent;--jump-card-border-color:var(--neutral-grey-background);--jump-card-padding:0.5rem;max-width:var(--card-max-width);overflow:hidden;display:flex;flex-direction:column;position:relative;width:100%;font-family:var(--ff-primary, \"Arial\"), sans-serif;line-height:var(--lh-400, 1.3);background-color:var(--jump-card-background);color:var(--jump-card-color)}:host .Footer,:host .Body{display:flex;width:100%}:host jump-badge{position:absolute;top:1rem;left:1rem;z-index:2}:host jump-badge.hasBackground.iconOnly{top:calc(1rem + 8px);left:calc(1rem + 8px)}:host .Favorite{position:absolute;top:1rem;right:1rem;z-index:2}:host .Favorite.hasBackground.iconOnly{top:calc(1rem + 8px);right:calc(1rem + 8px)}:host .Media{overflow:hidden;position:relative;border-top-left-radius:3px;border-top-right-radius:3px;aspect-ratio:1/1}:host .Media .Images{height:100%;margin:0;position:relative}:host .Media .Images img{height:100%;width:100%;object-fit:cover;position:absolute;top:0;left:0;overflow:hidden}:host .Media .Images__Front{z-index:1;transition:opacity 0.5s linear;cursor:pointer}:host .Media .Images.has-hover-image:hover .Images__Front{opacity:0}:host .Media.hasBackground{background-color:var(--neutral-white)}:host .Media.hasBackground.iconOnly{border-top-left-radius:6px;border-top-right-radius:6px;padding:var(--jump-card-padding) var(--jump-card-padding) 0}:host .Media.hasBackground.iconOnly img{border-radius:6px}:host .NotificationCart{display:none;position:absolute;bottom:0px;width:100%;padding:2rem 1rem;background-color:hsla(0, 0%, 0%, 0.35);box-sizing:border-box;z-index:2;transform:translate3d(0, 0, 0)}:host .NotificationCart.is-active{display:flex;align-items:center;justify-content:center}:host .Content.hasBackground{background-color:var(--neutral-white);padding:calc(var(--jump-card-padding) * 2)}:host .Content.iconOnly{padding:calc(var(--jump-card-padding) * 2) var(--jump-card-padding)}:host .Body{display:flex;flex-direction:column;gap:0.75rem;padding:var(--jump-card-padding) 0}:host .Body>*{display:flex;flex-direction:row;justify-content:space-between}:host .Body>*>*{flex:0 1 auto}:host .Body.hasBackground{padding:0 0 var(--jump-card-padding)}:host .Body.iconOnly{padding:0}:host .Product{font-size:var(--fs-400)}:host .Subtitle{font-size:var(--fs-300);color:var(--neutral-grey-secondary);line-height:1.2}:host .Footer{line-height:var(--lh-400);justify-content:end;padding:var(--jump-card-padding) 0;align-items:flex-end}:host .Footer.justify-between{justify-content:space-between}:host .Footer.hasBackground{padding-bottom:0}:host .Footer.iconOnly{padding:0}:host .OutOfStock{justify-items:start;font-size:var(--fs-300);font-weight:var(--fw-900);color:var(--status-danger-standard)}:host .OnlyIconButton{position:absolute;bottom:0;right:0;background:var(--neutral-white);border-top-left-radius:20px;padding:8px 8px 0px 8px;z-index:2}:host .Price{position:relative;display:grid;grid-template-columns:auto auto;grid-template-rows:1.5rem 1.5rem auto;justify-items:end;align-items:end;column-gap:0.5rem;font-size:var(--fs-500);font-weight:var(--fw-900);line-height:var(--lh-400)}:host .Price>*{display:inline-flex}:host .Price__Regular{text-align:right}:host .Price__Regular.sale{text-decoration:line-through;color:var(--neutral-grey-secondary);font-weight:var(--fw-400);font-size:var(--fs-400);grid-column:2;grid-row:1}:host .Price__Sale{grid-column:2;grid-row:2}:host .Price__Discount{color:var(--status-danger-standard);font-weight:var(--fw-400);font-size:var(--fs-300);grid-column:1;grid-row:1}:host .SelectVariations select{appearance:none;background-color:transparent;border:1px solid var(--neutral-grey-secondary);border-radius:3px;color:var(--neutral-grey-secondary);font-size:var(--fs-300);padding:0.5rem 0.75rem;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\");background-position:right 0.5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact}.slide-in-bottom{animation:slide-in-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both}.slide-out-bottom{animation:slide-out-bottom 0.5s cubic-bezier(0.55, 0.085, 0.68, 0.53) both}.fade-in-out{animation-name:fade-in-out;animation-duration:6s;animation-timing-function:ease-in-out}@keyframes fade-in-out{from{opacity:0;transform:translateY(100px)}50%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}";const r=o;const n=class{constructor(e){t(this,e);this.toggleFavorite=i(this,"jump-toggle-favorite",7);this.productAddToCart=i(this,"jump-add-to-cart",7);this.productWaitingList=i(this,"jump-add-to-waiting-list",7);this.variationSelected=i(this,"jump-variation-selected",7);this.onlyIconButton=false;this.hasBackground=false;this.badge=undefined;this.favorite=false;this.hasFavorite=false;this.link=undefined;this.img=undefined;this.imgAlt=undefined;this.hoverImg=undefined;this.hoverImgAlt=undefined;this.videoSrc=undefined;this.notificationUrl=undefined;this.notificationText="";this.productName=undefined;this.subtitle=undefined;this.productId=undefined;this.price=undefined;this.salePrice=undefined;this.currency="€";this.outOfStock=false;this.outOfStockText=undefined;this.addToCartText=undefined;this.waitingListText=undefined;this.addToWaitingList=false;this.addedToCart=false;this.endAddedToCart=false;this.variations=[]}addOption(t){let i=t.detail;this.variations=[...this.variations,Object.assign({},i)]}onVariationSelected(t){this.variationSelected.emit(t)}componentWillLoad(){}componentDidLoad(){this.jumpQuantityEl=this.JumpCardEcommerce.querySelector("jump-quantity");if(this.jumpQuantityEl){this.jumpQuantityEl.addEventListener("jump-change",this.onQuantityChange.bind(this));this.quantity=this.jumpQuantityEl.getValue().then((t=>{this.quantity=t}))}}disconnectedCallback(){this.jumpQuantityEl=this.JumpCardEcommerce.querySelector("jump-quantity");if(this.jumpQuantityEl){this.jumpQuantityEl.removeEventListener("jump-change",this.onQuantityChange)}}onQuantityChange(t){var i;this.quantity=(i=t.detail.value)!==null&&i!==void 0?i:false}onToggleFavorite(){this.favorite=!this.favorite;this.toggleFavorite.emit({productId:this.productId,favorite:this.favorite})}addProductToCart(){var t;this.addedToCart=true;const i={productId:this.productId,addedToCart:this.addedToCart,quantity:(t=this.quantity)!==null&&t!==void 0?t:null};this.productAddToCart.emit(i);setTimeout((()=>{this.addedToCart=false}),6e3)}waitingList(){this.addToWaitingList=true;this.productWaitingList.emit({productId:this.productId,addToWaitingList:this.addToWaitingList})}render(){const t=this.hasBackground?"hasBackground":"";const i=this.onlyIconButton?"iconOnly":"";const a=this.outOfStock?"justify-between":"";const o=this.hoverImg?"has-hover-image":"";function r(t,i){const e=(t-i)/t*100;return e.toFixed(0)}return e(s,null,this.badge?e("jump-badge",{class:`${t} ${i}`,variant:"secondary",dimension:"small",label:this.badge}):"",this.hasFavorite?e("jump-button",{onClick:()=>this.onToggleFavorite(),class:`Favorite ${t} ${i}`,variant:this.favorite?"primary":"neutral",size:"small",text:true,onlyIcon:true},e("jump-icon",{slot:"prefix",name:"heart",category:this.favorite?"solid":"light",size:"medium"})):null,e("div",{class:`Media ${i} ${t}`},e("a",{href:this.link},e("figure",{class:`Images ${o} `},this.img&&!this.videoSrc?e("img",{class:"Images__Front",src:this.img,alt:this.imgAlt}):"",this.hoverImg&&!this.videoSrc?e("img",{class:"Images__OnHover",src:this.hoverImg,alt:this.hoverImgAlt}):""),this.videoSrc&&!this.img?e("video",{autoplay:true},e("source",{src:this.videoSrc,type:"video/mp4"}),e("source",{src:this.videoSrc,type:"video/mov"}),e("source",{src:this.videoSrc,type:"video/webm"})):""),e("div",{class:`NotificationCart ${this.addedToCart==true?"is-active fade-in-out":""}`},e("jump-button",{href:this.notificationUrl,variant:"white",text:true},e("jump-icon",{slot:"prefix",name:"check"}),e("span",null," ",this.notificationText," "))),this.onlyIconButton?e("div",{class:"OnlyIconButton"},e("jump-button",{variant:"secondary",size:"large",pill:true,onlyIcon:true,onClick:()=>this.addProductToCart()},e("jump-icon",{slot:"prefix",name:"cart-shopping",category:"regular"}))):""),e("div",{class:`Content ${t} ${i}`},e("div",{class:`Body ${t} ${i}`},e("div",null,e("div",{class:"Info"},e("div",{class:"Product"},this.productName),this.subtitle?e("div",{class:"Subtitle"},this.subtitle):null),this.price?e("div",{class:"Price"},this.salePrice&&this.salePrice!=0?e("div",{class:"Price__Discount"}," ",r(this.price,this.salePrice),"% "):null,e("div",{class:`Price__Regular ${this.salePrice?"sale":""}`},this.currency,this.price),this.salePrice?e("div",{class:"Price__Sale"},this.currency,this.salePrice):null):null),e("div",{class:"SelectVariations"},this.variations.length!=0?e("select",{ref:t=>this.variationSelectEl=t,onChange:()=>{let t=this.variationSelectEl.value;let i=this.variations.find((i=>i.code==t));this.onVariationSelected(i)}},this.variations.filter((t=>!t.imgUrl)).map((t=>e("option",{value:t.code},t.label)))):null),e("slot",{name:"quantity"})),e("div",{class:`Footer ${a} ${t} ${i}`},this.outOfStock?e("div",{class:"OutOfStock"},this.outOfStockText?this.outOfStockText:"Esaurito"):"",this.outOfStock?e("jump-button",{variant:"secondary",size:"small",text:true,onClick:()=>this.waitingList()},e("jump-icon",{slot:"prefix",name:!this.outOfStock?"cart-shopping":"bell",category:"regular",size:"small"}),this.waitingListText?this.waitingListText:"Notifica disponibilità"):"",!this.outOfStock&&!this.onlyIconButton?e("jump-button",{variant:"secondary",size:"small",text:true,onClick:()=>this.addProductToCart()},e("jump-icon",{slot:"prefix",name:!this.outOfStock?"cart-shopping":"bell",category:"regular",size:"small"}),this.addToCartText?this.addToCartText:"Aggiungi al carrello"):"")))}get JumpCardEcommerce(){return a(this)}};n.style=r;export{n as jump_card_ecommerce};
-//# sourceMappingURL=p-b92e6459.entry.js.map

package/dist/jump-design-system/p-b92e6459.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["jumpCardEcommerceCss","JumpCardEcommerceStyle0","JumpCardEcommerce","addOption","e","props","detail","this","variations","Object","assign","onVariationSelected","variation","variationSelected","emit","componentWillLoad","componentDidLoad","jumpQuantityEl","querySelector","addEventListener","onQuantityChange","bind","quantity","getValue","then","disconnectedCallback","removeEventListener","_a","value","onToggleFavorite","favorite","toggleFavorite","productId","addProductToCart","addedToCart","payload","productAddToCart","setTimeout","waitingList","addToWaitingList","productWaitingList","render","backgroundClass","hasBackground","iconOnlyClass","onlyIconButton","justifyClass","outOfStock","hasImageOnHover","hoverImg","calculateDiscount","price","salePrice","discount","toFixed","h","Host","badge","class","variant","dimension","label","hasFavorite","onClick","size","text","onlyIcon","slot","name","category","href","link","img","videoSrc","src","alt","imgAlt","hoverImgAlt","autoplay","type","notificationUrl","notificationText","pill","productName","subtitle","currency","length","ref","el","variationSelectEl","onChange","currentValue","currentVariation","find","code","filter","imgUrl","map","outOfStockText","waitingListText","addToCartText"],"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-top-left-radius: 3px;\n    border-top-right-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\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\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\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\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\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      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  // 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  /** 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  /* ---------------------- @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  // è 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(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\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    const payload = {\n      productId: this.productId,\n      addedToCart: this.addedToCart,\n      quantity: this.quantity ?? 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 ? 'hasBackground' : '';\n    const iconOnlyClass = this.onlyIconButton ? 'iconOnly' : '';\n    const justifyClass = this.outOfStock ? 'justify-between' : '';\n    const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\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.badge ? <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant=\"secondary\" dimension=\"small\" label={this.badge}></jump-badge> : ''}\n  \n        {this.hasFavorite ? \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        : null}\n\n        <div class={`Media ${iconOnlyClass} ${backgroundClass}`}>\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          <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            {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}`}>\n          <div class={`Body ${backgroundClass} ${iconOnlyClass}`}>\n            <div>\n              <div class=\"Info\">\n                <div class=\"Product\">{this.productName}</div>\n                {this.subtitle ? <div class=\"Subtitle\">{this.subtitle}</div> : null}\n              </div>\n\n              {this.price ? \n                <div class=\"Price\">\n                  {this.salePrice && this.salePrice != 0 ? \n                    <div class=\"Price__Discount\"> {calculateDiscount(this.price, this.salePrice)}% </div>\n                  : null}\n                  <div class={`Price__Regular ${this.salePrice ? 'sale' : ''}`}> \n                    {this.currency}{this.price}\n                  </div>\n                  {this.salePrice ? \n                    <div class=\"Price__Sale\">{this.currency}{this.salePrice}</div>\n                  : null}\n                </div>\n              : null}\n            </div>\n            \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                    let currentValue = this.variationSelectEl.value;\n                    let currentVariation = this.variations.find(\n                      (variation) => variation.code == currentValue,\n                    );\n                    this.onVariationSelected(currentVariation);\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            <slot name=\"quantity\"></slot>\n          </div>\n\n          <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass}`}>\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}"],"mappings":"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"}

package/dist/jump-design-system/p-bc64407a.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as s,h as t,H as c}from"./p-4d6cc90d.js";const n=":host{display:none}";const i=n;const o=class{constructor(t){e(this,t);this.connectedEvent=s(this,"jump-card-ecommerce-option-connected",7);this.code=undefined;this.imgUrl=undefined;this.label=undefined;this.sku=undefined}componentWillLoad(){this.connectedEvent.emit({code:this.code,label:this.label,imgUrl:this.imgUrl})}render(){return t(c,{key:"21e35180b98eeeaee34582aab33e4cff620c8c29"})}};o.style=i;export{o as jump_card_ecommerce_option};
-//# sourceMappingURL=p-bc64407a.entry.js.map

package/dist/jump-design-system/p-bc64407a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["jumpCardEcommerceOptionCss","JumpCardEcommerceOptionStyle0","CardEcommerceOption","componentWillLoad","this","connectedEvent","emit","code","label","imgUrl","render","h","Host","key"],"sources":["src/components/jump-card-ecommerce-option/jump-card-ecommerce-option.scss?tag=jump-card-ecommerce-option&encapsulation=shadow","src/components/jump-card-ecommerce-option/jump-card-ecommerce-option.tsx"],"sourcesContent":[":host {\n  display: none;\n}\n","import { Component, Host, Event, Prop, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"jump-card-ecommerce-option\",\n  styleUrl: \"jump-card-ecommerce-option.scss\",\n  shadow: true,\n})\nexport class CardEcommerceOption {\n  @Prop() code: string;\n  @Prop() imgUrl: string;\n  @Prop() label: string;\n  @Prop() sku: string;\n\n  @Event({ eventName: \"jump-card-ecommerce-option-connected\" }) connectedEvent;\n\n  componentWillLoad() {\n    this.connectedEvent.emit({\n      code: this.code,\n      label: this.label,\n      imgUrl: this.imgUrl,\n    });\n  }\n\n  render() {\n    return <Host></Host>;\n  }\n}"],"mappings":"yDAAA,MAAMA,EAA6B,sBACnC,MAAAC,EAAeD,E,MCMFE,EAAmB,M,gLAQ9B,iBAAAC,GACEC,KAAKC,eAAeC,KAAK,CACvBC,KAAMH,KAAKG,KACXC,MAAOJ,KAAKI,MACZC,OAAQL,KAAKK,Q,CAIjB,MAAAC,GACE,OAAOC,EAACC,EAAI,CAAAC,IAAA,4C"}