npm - @jumpgroup/jump-design-system - Versions diffs - 0.3.48 → 0.3.50 - Mend

@jumpgroup/jump-design-system 0.3.48 → 0.3.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (25) hide show

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

@@ -20,6 +20,7 @@ const JumpCardEcommerce = class {
         this.favorite = false;
         this.hasFavorite = false;
         this.hasSlotForFavorite = false;
+        this.hasSlotAddToCart = false;
         this.link = undefined;
         this.img = undefined;
         this.imgAlt = undefined;
@@ -164,8 +165,10 @@ const JumpCardEcommerce = class {
             index.h("img", { class: "Images__OnHover", src: this.hoverImg, alt: this.hoverImgAlt }) : ''), this.videoSrc && !this.img ?
             index.h("video", { autoplay: true }, index.h("source", { src: this.videoSrc, type: "video/mp4" }), index.h("source", { src: this.videoSrc, type: "video/mov" }), index.h("source", { src: this.videoSrc, type: "video/webm" })) : ''), !this.isMini ?
             index.h("div", { class: `NotificationCart ${this.addedToCart == true ? 'is-active fade-in-out' : ''}` }, index.h("jump-button", { href: this.notificationUrl, variant: "white", text: true }, index.h("jump-icon", { slot: "prefix", name: "check" }), index.h("span", null, " ", this.notificationText, " ")))
-            : null, !this.isMini && this.onlyIconButton ?
+            : null, !this.isMini && this.onlyIconButton && !this.hasSlotAddToCart ?
             index.h("div", { class: "OnlyIconButton" }, index.h("jump-button", { variant: "secondary", size: "large", pill: true, onlyIcon: true, onClick: () => this.addProductToCart() }, index.h("jump-icon", { slot: "prefix", name: "cart-shopping", category: "regular" })))
+            : '', !this.isMini && this.onlyIconButton && this.hasSlotAddToCart ?
+            index.h("div", { class: "OnlyIconButton" }, index.h("slot", { name: "add-to-cart" }))
             : ''), index.h("div", { class: `Content ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, index.h("div", { class: `Body ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, index.h("div", null, index.h("div", { class: "Info" }, index.h("a", { href: this.link, class: "Product" }, this.productName), !this.isMini && this.subtitle ? index.h("div", { class: "Subtitle" }, this.subtitle) : null), this.price ?
             index.h("div", { class: `Price ${miniCard}` }, !this.isMini && this.salePrice && this.salePrice < this.price ?
                 index.h("div", { class: "Price__Discount" }, " ", calculateDiscount(this.price, this.salePrice), "% ")
@@ -183,10 +186,12 @@ const JumpCardEcommerce = class {
                     .filter((variation) => !variation.imgUrl)
                     .map((variation) => (index.h("option", { value: variation.code }, variation.label)))))
                 : null, index.h("slot", { name: "quantity" }))
-            : null), index.h("div", { class: `Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, this.outOfStock ?
+            : null), index.h("div", { class: `Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, this.outOfStock && !this.isMini ?
             index.h("div", { class: "OutOfStock" }, this.outOfStockText ? this.outOfStockText : 'Esaurito') : '', this.outOfStock ?
-            index.h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.waitingList() }, index.h("jump-icon", { slot: "prefix", name: !this.outOfStock ? 'cart-shopping' : 'bell', category: "regular", size: "small" }), this.waitingListText) : '', !this.outOfStock && !this.onlyIconButton ?
-            index.h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.addProductToCart() }, index.h("jump-icon", { slot: "prefix", name: !this.outOfStock ? 'cart-shopping' : 'bell', category: "regular", size: "small" }), this.addToCartText) : ''))));
+            index.h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.waitingList() }, index.h("jump-icon", { slot: "prefix", name: "bell", category: "regular", size: "small" }), this.waitingListText) : '', !this.outOfStock && !this.onlyIconButton && !this.hasSlotAddToCart ?
+            index.h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.addProductToCart() }, index.h("jump-icon", { slot: "prefix", name: "cart-shopping", category: "regular", size: "small" }), this.addToCartText) : '', !this.outOfStock && !this.onlyIconButton && this.hasSlotAddToCart ?
+            index.h("slot", { name: "add-to-cart" })
+            : null))));
     }
     get JumpCardEcommerce() { return index.getElement(this); }
 };

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

	@@ -1 +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 color: var(--neutral-grey-primary);\n text-decoration: none;\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, Method } 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 @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 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 = 'Aggiunto al carrello';\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 the variant of the button /\n @Prop() addToCartColor: 'primary' \| 'secondary'\|'white'\|'neutral' = 'secondary';\n\n /* Indicates the variant of the button /\n @Prop() badgeColor: 'primary' \| 'secondary' \| 'neutral' \| 'warning' \| 'success' \| 'danger' = 'secondary';\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 = 'Aggiungi al carrello';\n\n /* Indicates the button class of the add to cart / notification button /\n @Prop() waitingListText: string = 'Notifica disponibilità';\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 /\n Set the price of the product\n * @param price\n * @param salePrice\n /\n @Method()\n async setPrice(price: number, salePrice: number) {\n let shouldFormat = false;\n if (price && price > 0) {\n shouldFormat = true;\n this.price = price;\n }\n\n if (salePrice && salePrice > 0) {\n this.salePrice = salePrice;\n }\n\n if (shouldFormat) {\n this.formatPrices();\n }\n }\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\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, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\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 ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n\n {!this.isMini && this.hasFavorite ?\n <jump-button onClick={() => this.onToggleFavorite()} class={`Favorite ${backgroundClass} ${iconOnlyClass}`}\n variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'}\n size=\"medium\"></jump-icon>\n </jump-button>\n :\n this.hasSlotForFavorite ? <div class=\"Favorite\">\n <slot name=\"favorite\"></slot>\n </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 ?\n <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 <a href={this.link} class=\"Product\">{this.productName}</a>\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>\n {this.variations.length != 0 ?\n <div class=\"SelectVariations\">\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 </div>\n : null}\n <slot name=\"quantity\"></slot>\n </div>\n : null}\n\n </div>\n\n <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n {this.outOfStock ?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n {this.outOfStock ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.waitingList()}>\n <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\"\n size=\"small\"></jump-icon>\n {this.waitingListText}\n </jump-button> : ''\n }\n\n {!this.outOfStock && !this.onlyIconButton ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.addProductToCart()}>\n <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\"\n size=\"small\"></jump-icon>\n {this.addToCartText}\n </jump-button> : ''\n }\n\n </div>\n\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}
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 color: var(--neutral-grey-primary);\n text-decoration: none;\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, Method } 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 @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 /* Indicate if the add to cart btn will be slotted/\n @Prop() hasSlotAddToCart: 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 = 'Aggiunto al carrello';\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 the variant of the button /\n @Prop() addToCartColor: 'primary' \| 'secondary'\|'white'\|'neutral' = 'secondary';\n\n /* Indicates the variant of the button /\n @Prop() badgeColor: 'primary' \| 'secondary' \| 'neutral' \| 'warning' \| 'success' \| 'danger' = 'secondary';\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 = 'Aggiungi al carrello';\n\n /* Indicates the button class of the add to cart / notification button /\n @Prop() waitingListText: string = 'Notifica disponibilità';\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 /\n Set the price of the product\n * @param price\n * @param salePrice\n /\n @Method()\n async setPrice(price: number, salePrice: number) {\n let shouldFormat = false;\n if (price && price > 0) {\n shouldFormat = true;\n this.price = price;\n }\n\n if (salePrice && salePrice > 0) {\n this.salePrice = salePrice;\n }\n\n if (shouldFormat) {\n this.formatPrices();\n }\n }\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 / ---------------------- @LIFECYCLE ------------------------- /\n\n componentWillLoad() {\n }\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, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\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 ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n\n {!this.isMini && this.hasFavorite ?\n <jump-button onClick={() => this.onToggleFavorite()} class={`Favorite ${backgroundClass} ${iconOnlyClass}`}\n variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'}\n size=\"medium\"></jump-icon>\n </jump-button>\n :\n this.hasSlotForFavorite ? <div class=\"Favorite\">\n <slot name=\"favorite\"></slot>\n </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 ?\n <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 }\n\n {!this.isMini && this.onlyIconButton && !this.hasSlotAddToCart ?\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\n {!this.isMini && this.onlyIconButton && this.hasSlotAddToCart ?\n <div class=\"OnlyIconButton\">\n <slot name=\"add-to-cart\"></slot>\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 <a href={this.link} class=\"Product\">{this.productName}</a>\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>\n {this.variations.length != 0 ?\n <div class=\"SelectVariations\">\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 </div>\n : null}\n <slot name=\"quantity\"></slot>\n </div>\n : null}\n\n </div>\n\n <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n {this.outOfStock && !this.isMini?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n {this.outOfStock ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.waitingList()}>\n <jump-icon slot=\"prefix\" name=\"bell\" category=\"regular\" size=\"small\"></jump-icon>\n {this.waitingListText}\n </jump-button> : ''\n }\n\n {!this.outOfStock && !this.onlyIconButton && !this.hasSlotAddToCart ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.addProductToCart()}>\n <jump-icon slot=\"prefix\" name=\"cart-shopping\" category=\"regular\" size=\"small\"></jump-icon>\n {this.addToCartText}\n </jump-button> : ''\n }\n\n {!this.outOfStock && !this.onlyIconButton && this.hasSlotAddToCart ?\n <slot name=\"add-to-cart\"></slot>\n : null\n }\n </div>\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}

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

@@ -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"],"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],"addToCartColor":[1,"add-to-cart-color"],"badgeColor":[1,"badge-color"],"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],"setPrice":[64]},[[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],"showCount":[4,"show-count"],"offCanvasOverlay":[4,"off-canvas-overlay"],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"offCanvasClasses":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]],{"showMobileFilters":["watchHandler"]}]]],["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-navbar.cjs",[[1,"jump-navbar",{"logo":[16],"navItems":[16],"secondaryNavItems":[16],"mobileThreshold":[2,"mobile-threshold"],"type":[1],"navPosition":[1,"nav-position"],"megaMenuAlignment":[1,"mega-menu-alignment"],"sticky":[4],"stickyThreshold":[2,"sticky-threshold"],"mobileLogo":[16],"user":[16],"isMobile":[32]},[[9,"resize","handleResize"]]]]],["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"],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[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],"currentValue":[32],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-search-bar.cjs",[[1,"jump-search-bar",{"placeholder":[1],"identifier":[1],"debounceTime":[2,"debounce-time"],"searchType":[1,"search-type"],"variant":[1]}]]],["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",{"disabled":[4],"alignment":[1],"fullBorder":[4,"full-border"],"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"],"hasSlotAddToCart":[4,"has-slot-add-to-cart"],"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],"addToCartColor":[1,"add-to-cart-color"],"badgeColor":[1,"badge-color"],"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],"setPrice":[64]},[[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],"showCount":[4,"show-count"],"offCanvasOverlay":[4,"off-canvas-overlay"],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"offCanvasClasses":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]],{"showMobileFilters":["watchHandler"]}]]],["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-navbar.cjs",[[1,"jump-navbar",{"logo":[16],"navItems":[16],"secondaryNavItems":[16],"mobileThreshold":[2,"mobile-threshold"],"type":[1],"navPosition":[1,"nav-position"],"megaMenuAlignment":[1,"mega-menu-alignment"],"sticky":[4],"stickyThreshold":[2,"sticky-threshold"],"mobileLogo":[16],"user":[16],"isMobile":[32]},[[9,"resize","handleResize"]]]]],["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"],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[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],"currentValue":[32],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-search-bar.cjs",[[1,"jump-search-bar",{"placeholder":[1],"identifier":[1],"debounceTime":[2,"debounce-time"],"searchType":[1,"search-type"],"variant":[1]}]]],["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",{"disabled":[4],"alignment":[1],"fullBorder":[4,"full-border"],"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/loader.cjs.js CHANGED Viewed

@@ -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"],"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],"addToCartColor":[1,"add-to-cart-color"],"badgeColor":[1,"badge-color"],"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],"setPrice":[64]},[[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],"showCount":[4,"show-count"],"offCanvasOverlay":[4,"off-canvas-overlay"],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"offCanvasClasses":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]],{"showMobileFilters":["watchHandler"]}]]],["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-navbar.cjs",[[1,"jump-navbar",{"logo":[16],"navItems":[16],"secondaryNavItems":[16],"mobileThreshold":[2,"mobile-threshold"],"type":[1],"navPosition":[1,"nav-position"],"megaMenuAlignment":[1,"mega-menu-alignment"],"sticky":[4],"stickyThreshold":[2,"sticky-threshold"],"mobileLogo":[16],"user":[16],"isMobile":[32]},[[9,"resize","handleResize"]]]]],["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"],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[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],"currentValue":[32],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-search-bar.cjs",[[1,"jump-search-bar",{"placeholder":[1],"identifier":[1],"debounceTime":[2,"debounce-time"],"searchType":[1,"search-type"],"variant":[1]}]]],["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",{"disabled":[4],"alignment":[1],"fullBorder":[4,"full-border"],"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"],"hasSlotAddToCart":[4,"has-slot-add-to-cart"],"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],"addToCartColor":[1,"add-to-cart-color"],"badgeColor":[1,"badge-color"],"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],"setPrice":[64]},[[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],"showCount":[4,"show-count"],"offCanvasOverlay":[4,"off-canvas-overlay"],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"offCanvasClasses":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]],{"showMobileFilters":["watchHandler"]}]]],["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-navbar.cjs",[[1,"jump-navbar",{"logo":[16],"navItems":[16],"secondaryNavItems":[16],"mobileThreshold":[2,"mobile-threshold"],"type":[1],"navPosition":[1,"nav-position"],"megaMenuAlignment":[1,"mega-menu-alignment"],"sticky":[4],"stickyThreshold":[2,"sticky-threshold"],"mobileLogo":[16],"user":[16],"isMobile":[32]},[[9,"resize","handleResize"]]]]],["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"],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"],"elementsRangesArray":[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],"currentValue":[32],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-search-bar.cjs",[[1,"jump-search-bar",{"placeholder":[1],"identifier":[1],"debounceTime":[2,"debounce-time"],"searchType":[1,"search-type"],"variant":[1]}]]],["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",{"disabled":[4],"alignment":[1],"fullBorder":[4,"full-border"],"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 CHANGED Viewed

@@ -7,6 +7,7 @@ export class JumpCardEcommerce {
         this.favorite = false;
         this.hasFavorite = false;
         this.hasSlotForFavorite = false;
+        this.hasSlotAddToCart = false;
         this.link = undefined;
         this.img = undefined;
         this.imgAlt = undefined;
@@ -152,8 +153,10 @@ export class JumpCardEcommerce {
             h("img", { class: "Images__OnHover", src: this.hoverImg, alt: this.hoverImgAlt }) : ''), this.videoSrc && !this.img ?
             h("video", { autoplay: true }, h("source", { src: this.videoSrc, type: "video/mp4" }), h("source", { src: this.videoSrc, type: "video/mov" }), h("source", { src: this.videoSrc, type: "video/webm" })) : ''), !this.isMini ?
             h("div", { class: `NotificationCart ${this.addedToCart == true ? 'is-active fade-in-out' : ''}` }, h("jump-button", { href: this.notificationUrl, variant: "white", text: true }, h("jump-icon", { slot: "prefix", name: "check" }), h("span", null, " ", this.notificationText, " ")))
-            : null, !this.isMini && this.onlyIconButton ?
+            : null, !this.isMini && this.onlyIconButton && !this.hasSlotAddToCart ?
             h("div", { class: "OnlyIconButton" }, h("jump-button", { variant: "secondary", size: "large", pill: true, onlyIcon: true, onClick: () => this.addProductToCart() }, h("jump-icon", { slot: "prefix", name: "cart-shopping", category: "regular" })))
+            : '', !this.isMini && this.onlyIconButton && this.hasSlotAddToCart ?
+            h("div", { class: "OnlyIconButton" }, h("slot", { name: "add-to-cart" }))
             : ''), h("div", { class: `Content ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, h("div", { class: `Body ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, h("div", null, h("div", { class: "Info" }, h("a", { href: this.link, class: "Product" }, this.productName), !this.isMini && this.subtitle ? h("div", { class: "Subtitle" }, this.subtitle) : null), this.price ?
             h("div", { class: `Price ${miniCard}` }, !this.isMini && this.salePrice && this.salePrice < this.price ?
                 h("div", { class: "Price__Discount" }, " ", calculateDiscount(this.price, this.salePrice), "% ")
@@ -171,10 +174,12 @@ export class JumpCardEcommerce {
                     .filter((variation) => !variation.imgUrl)
                     .map((variation) => (h("option", { value: variation.code }, variation.label)))))
                 : null, h("slot", { name: "quantity" }))
-            : null), h("div", { class: `Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, this.outOfStock ?
+            : null), h("div", { class: `Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}` }, this.outOfStock && !this.isMini ?
             h("div", { class: "OutOfStock" }, this.outOfStockText ? this.outOfStockText : 'Esaurito') : '', this.outOfStock ?
-            h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.waitingList() }, h("jump-icon", { slot: "prefix", name: !this.outOfStock ? 'cart-shopping' : 'bell', category: "regular", size: "small" }), this.waitingListText) : '', !this.outOfStock && !this.onlyIconButton ?
-            h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.addProductToCart() }, h("jump-icon", { slot: "prefix", name: !this.outOfStock ? 'cart-shopping' : 'bell', category: "regular", size: "small" }), this.addToCartText) : ''))));
+            h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.waitingList() }, h("jump-icon", { slot: "prefix", name: "bell", category: "regular", size: "small" }), this.waitingListText) : '', !this.outOfStock && !this.onlyIconButton && !this.hasSlotAddToCart ?
+            h("jump-button", { variant: this.addToCartColor, size: "small", text: true, onClick: () => this.addProductToCart() }, h("jump-icon", { slot: "prefix", name: "cart-shopping", category: "regular", size: "small" }), this.addToCartText) : '', !this.outOfStock && !this.onlyIconButton && this.hasSlotAddToCart ?
+            h("slot", { name: "add-to-cart" })
+            : null))));
     }
     static get is() { return "jump-card-ecommerce"; }
     static get encapsulation() { return "shadow"; }
@@ -297,6 +302,24 @@ export class JumpCardEcommerce {
                 "reflect": false,
                 "defaultValue": "false"
             },
+            "hasSlotAddToCart": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicate if the add to cart btn will be slotted"
+                },
+                "attribute": "has-slot-add-to-cart",
+                "reflect": false,
+                "defaultValue": "false"
+            },
             "link": {
                 "type": "string",
                 "mutable": false,

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

	@@ -1 +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, Method } 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 @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 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 = 'Aggiunto al carrello';\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 the variant of the button /\n @Prop() addToCartColor: 'primary' \| 'secondary'\|'white'\|'neutral' = 'secondary';\n\n /* Indicates the variant of the button /\n @Prop() badgeColor: 'primary' \| 'secondary' \| 'neutral' \| 'warning' \| 'success' \| 'danger' = 'secondary';\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 = 'Aggiungi al carrello';\n\n /* Indicates the button class of the add to cart / notification button /\n @Prop() waitingListText: string = 'Notifica disponibilità';\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 /\n Set the price of the product\n * @param price\n * @param salePrice\n /\n @Method()\n async setPrice(price: number, salePrice: number) {\n let shouldFormat = false;\n if (price && price > 0) {\n shouldFormat = true;\n this.price = price;\n }\n\n if (salePrice && salePrice > 0) {\n this.salePrice = salePrice;\n }\n\n if (shouldFormat) {\n this.formatPrices();\n }\n }\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\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, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\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 ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n\n {!this.isMini && this.hasFavorite ?\n <jump-button onClick={() => this.onToggleFavorite()} class={`Favorite ${backgroundClass} ${iconOnlyClass}`}\n variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'}\n size=\"medium\"></jump-icon>\n </jump-button>\n :\n this.hasSlotForFavorite ? <div class=\"Favorite\">\n <slot name=\"favorite\"></slot>\n </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 ?\n <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 <a href={this.link} class=\"Product\">{this.productName}</a>\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>\n {this.variations.length != 0 ?\n <div class=\"SelectVariations\">\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 </div>\n : null}\n <slot name=\"quantity\"></slot>\n </div>\n : null}\n\n </div>\n\n <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n {this.outOfStock ?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n {this.outOfStock ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.waitingList()}>\n <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\"\n size=\"small\"></jump-icon>\n {this.waitingListText}\n </jump-button> : ''\n }\n\n {!this.outOfStock && !this.onlyIconButton ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.addProductToCart()}>\n <jump-icon slot=\"prefix\" name={!this.outOfStock ? 'cart-shopping' : 'bell'} category=\"regular\"\n size=\"small\"></jump-icon>\n {this.addToCartText}\n </jump-button> : ''\n }\n\n </div>\n\n </div>\n </Host>\n );\n }\n\n}\n"]}
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, Method } 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 @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 /* Indicate if the add to cart btn will be slotted/\n @Prop() hasSlotAddToCart: 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 = 'Aggiunto al carrello';\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 the variant of the button /\n @Prop() addToCartColor: 'primary' \| 'secondary'\|'white'\|'neutral' = 'secondary';\n\n /* Indicates the variant of the button /\n @Prop() badgeColor: 'primary' \| 'secondary' \| 'neutral' \| 'warning' \| 'success' \| 'danger' = 'secondary';\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 = 'Aggiungi al carrello';\n\n /* Indicates the button class of the add to cart / notification button /\n @Prop() waitingListText: string = 'Notifica disponibilità';\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 /\n Set the price of the product\n * @param price\n * @param salePrice\n /\n @Method()\n async setPrice(price: number, salePrice: number) {\n let shouldFormat = false;\n if (price && price > 0) {\n shouldFormat = true;\n this.price = price;\n }\n\n if (salePrice && salePrice > 0) {\n this.salePrice = salePrice;\n }\n\n if (shouldFormat) {\n this.formatPrices();\n }\n }\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 / ---------------------- @LIFECYCLE ------------------------- /\n\n componentWillLoad() {\n }\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, {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\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 ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n\n {!this.isMini && this.hasFavorite ?\n <jump-button onClick={() => this.onToggleFavorite()} class={`Favorite ${backgroundClass} ${iconOnlyClass}`}\n variant={this.favorite ? 'primary' : 'neutral'} size=\"small\" text onlyIcon>\n <jump-icon slot=\"prefix\" name=\"heart\" category={this.favorite ? 'solid' : 'light'}\n size=\"medium\"></jump-icon>\n </jump-button>\n :\n this.hasSlotForFavorite ? <div class=\"Favorite\">\n <slot name=\"favorite\"></slot>\n </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 ?\n <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 }\n\n {!this.isMini && this.onlyIconButton && !this.hasSlotAddToCart ?\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\n {!this.isMini && this.onlyIconButton && this.hasSlotAddToCart ?\n <div class=\"OnlyIconButton\">\n <slot name=\"add-to-cart\"></slot>\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 <a href={this.link} class=\"Product\">{this.productName}</a>\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>\n {this.variations.length != 0 ?\n <div class=\"SelectVariations\">\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 </div>\n : null}\n <slot name=\"quantity\"></slot>\n </div>\n : null}\n\n </div>\n\n <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n {this.outOfStock && !this.isMini?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n {this.outOfStock ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.waitingList()}>\n <jump-icon slot=\"prefix\" name=\"bell\" category=\"regular\" size=\"small\"></jump-icon>\n {this.waitingListText}\n </jump-button> : ''\n }\n\n {!this.outOfStock && !this.onlyIconButton && !this.hasSlotAddToCart ?\n <jump-button variant={this.addToCartColor} size=\"small\" text onClick={() => this.addProductToCart()}>\n <jump-icon slot=\"prefix\" name=\"cart-shopping\" category=\"regular\" size=\"small\"></jump-icon>\n {this.addToCartText}\n </jump-button> : ''\n }\n\n {!this.outOfStock && !this.onlyIconButton && this.hasSlotAddToCart ?\n <slot name=\"add-to-cart\"></slot>\n : null\n }\n </div>\n </div>\n </Host>\n );\n }\n\n}\n"]}

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

@@ -30,7 +30,7 @@ export default {
         },
         hasSlotForFavorite: {
             name: 'has-slot-for-favorite',
-            description: 'Di default la card ecommerce ha un bottone icona (o ancora); Se hasSlotForFavorite è true il bottone viene sostituito da uno slot',
+            description: 'Di default la card ecommerce ha un bottone icona per il favorite che emette un evento; Se hasSlotForFavorite è true il bottone viene sostituito da uno slot',
             control: 'boolean',
             defaultValue: true,
         },
@@ -41,7 +41,7 @@ export default {
         },
         img: {
             name: 'img',
-            description: 'Url dell\'immagine da visualizzare, si attiva solo se non è presente videoSrc',
+            description: 'Url dell\'immagine da visualizzare, si attiva solo se non è presente video-src',
             control: 'text',
             defaultValue: 'https://content-management-files.canva.com/cdn-cgi/image/f=auto,q=70/2fdbd7ab-f378-4c63-8b21-c944ad2633fd/header_t-shirts2.jpg',
             if: {
@@ -121,6 +121,11 @@ export default {
             description: 'Prezzo scontato del prodotto',
             control: 'number',
         },
+        addToCartText: {
+            name: 'add-to-cart-text',
+            description: 'Testo bottone aggiungi al carrello',
+            control: 'text',
+        },
         addToCartColor: {
             name: 'add-to-cart-color',
             description: 'Colore del bottone aggiungi al carrello',
@@ -132,6 +137,12 @@ export default {
                 'white'
             ],
         },
+        hasSlotAddToCart: {
+            name: 'has-slot-add-to-cart',
+            description: 'Di default la card ecommerce ha un bottone per l\'aggiunta al carrello; Se has-slot-add-to-cart è true il bottone viene sostituito da uno slot',
+            control: 'boolean',
+            defaultValue: false,
+        },
         badgeColor: {
             name: 'badge-color',
             description: 'Colore del badge',
@@ -156,11 +167,6 @@ export default {
             description: 'Testo da visualizzare se il prodotto è esaurito',
             control: 'text',
         },
-        addToCartText: {
-            name: 'add-to-cart-text',
-            description: 'Testo bottone aggiungi al carrello',
-            control: 'text',
-        },
         waitingListText: {
             name: 'waiting-list-text',
             description: 'cta per richiedere l\'avviso se il prodotto torna disponibile',
@@ -174,20 +180,11 @@ export default {
         },
     }
 };
-// const Template = (args) => {
-//   const attributes = generateAttributesFromArgs(args);
-//   return formatHtml(`<jump-card-ecommerce ${attributes}> </jump-card-ecommerce>`);
-// }
 const Template = (args) => {
     const attributes = generateAttributesFromArgs(args);
     return formatHtml(`
   <jump-card-ecommerce ${attributes}>
   </jump-card-ecommerce>
-  <style>
-    jump-card-ecommerce {
-      --jump-badge-background: blue;
-    }
-  </style>
   `);
 };
 export const Card = Template.bind({});
@@ -197,6 +194,7 @@ Card.args = {
     badge: 'In offerta',
     favorite: false,
     hasFavorite: true,
+    hasSlotForFavorite: false,
     link: '/prodotto',
     img: 'https://images.pexels.com/photos/4066293/pexels-photo-4066293.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
     imgAlt: 'Immagine',
@@ -209,11 +207,15 @@ Card.args = {
     productId: '1',
     price: 15,
     salePrice: 10,
+    addToCartText: 'Aggiungi al carrello',
+    addToCartColor: 'secondary',
+    hasSlotAddToCart: false,
+    badgeColor: 'secondary',
     currency: '€',
     outOfStock: false,
     outOfStockText: 'Esaurito',
-    addtoCartText: 'Aggiungi al carrello',
     waitingListText: 'Notifica disponibilità',
+    isMini: false,
 };
 const TemplateWithEvent = (args, data) => {
     let id = data.id;
@@ -228,6 +230,8 @@ const TemplateWithEvent = (args, data) => {
       <jump-quantity slot="quantity" min="1" max="10" step="1" show-buttons variant="horizontal"> </jump-quantity>
       <jump-card-ecommerce-option code="size1" label="sono una select un pò lunga"></jump-card-ecommerce-option>
       <jump-card-ecommerce-option code="size2" label="L" sku="cod123"></jump-card-ecommerce-option>
+      <div slot="addtocart"><a href="">Sono un bottone dentro lo slot addotocart</a></div>
     </jump-card-ecommerce>
     <script>
@@ -283,11 +287,12 @@ CardEvent.args = {
     price: 15,
     salePrice: 10,
     currency: '€',
+    addToCartText: 'Aggiungi al carrello',
     addToCartColor: 'primary',
+    hasSlotAddToCart: true,
     badgeColor: 'primary',
     outOfStock: false,
     outOfStockText: 'Esaurito',
-    addtoCartText: 'Aggiungi al carrello',
     waitingListText: 'Notifica disponibilità',
     isMini: false,
 };