npm - @jumpgroup/jump-design-system - Versions diffs - 1.0.19 → 1.0.21 - Mend

@jumpgroup/jump-design-system 1.0.19 → 1.0.21

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 (52) hide show

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

	@@ -1 +1 @@
1	- {"file":"jump-card-ecommerce.js","mappings":"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","names":["JumpCardEcommerce"],"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 --jump-card-commerce-out-of-stock-color: var(--status-danger-standard);\n --jump-card-ecommerce-discount-color: var(--status-danger-standard);\n --image-object-fit: cover;\n --jump-card-ecommerce-hide-discover-button-visibility: block;\n --jump-card-ecommerce-discount-badge-bg-color: var(--neutral-white);\n --jump-card-ecommerce-discount-badge-text-color: var(--primary-standard);\n --jump-card-ecommerce-discount-badge-padding: 4px 12px;\n --jump-card-ecommerce-discount-badge-border-radius: 50px;\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 .DiscountBadge {\n position: absolute;\n bottom: 1rem;\n right: 0.2rem;\n z-index: 2;\n border: 2px solid var(--jump-card-ecommerce-discount-badge-text-color);\n color: var(--jump-card-ecommerce-discount-badge-text-color);\n background-color: var(--jump-card-ecommerce-discount-badge-bg-color);\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n padding: var(--jump-card-ecommerce-discount-badge-padding);\n border-radius: var(--jump-card-ecommerce-discount-badge-border-radius);\n line-height: 1.2;\n }\n\n .Footer,\n .Body {\n display: flex;\n width: 100%;\n }\n\n .Footer {\n container-type: inline-size;\n flex-direction: row;\n\n @container (max-width: 239px) {\n flex-direction: column;\n\n .OutOfStock {\n margin-bottom: 0.25rem;\n }\n\n }\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 .Media {\n container-type: inline-size;\n\n @container (max-width: 239px) {\n jump-badge {\n top: auto;\n bottom: 1rem;\n left: 0.2rem;\n right: auto;\n }\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 position: absolute;\n top: 0;\n left: 0;\n overflow: hidden;\n object-fit: var(--image-object-fit, cover);\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 &.enable-zoom {\n overflow: hidden;\n\n .Images__Front {\n transition: transform 0s ease-out;\n cursor: zoom-in;\n }\n\n &:hover {\n .Images__Front {\n transform: scale(1.5);\n }\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 container-type: inline-size;\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n\n @container (max-width: 239px) {\n flex-direction: row;\n }\n\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 container-type: inline-size;\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 .Body__Top {\n display: flex;\n flex-direction: row;\n }\n\n .Body__Bottom {\n display: flex;\n flex-direction: row;\n }\n \n &.is-vertical {\n .Body__Top {\n flex-direction: column;\n align-items: flex-start;\n \n .Subtitle {\n min-height: 3.5rem;\n }\n\n @container (max-width: 239px) {\n .Subtitle {\n min-height: 3.2rem;\n }\n }\n }\n\n .Price {\n justify-items: start;\n margin-top: 0.5rem;\n column-gap: 0;\n display: flex;\n flex-direction: column-reverse;\n align-items: flex-start;\n }\n\n }\n\n @container (max-width: 239px) {\n .Body__Top {\n flex-direction: column;\n }\n\n .Body__Bottom {\n flex-direction: column;\n }\n\n .SelectVariations {\n max-width: 100%;\n margin-bottom: 0.5rem;\n\n select {\n width: 100%;\n }\n }\n\n .Price {\n display: flex;\n flex-direction: column-reverse;\n margin-top: 0.5rem;\n align-items: start;\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 .Subtitle:hover {\n cursor: pointer;\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 flex-grow: 1;\n display: flex;\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 &__AddToCart {\n --jump-button-color: var(--jump-card-ecommerce-add-to-cart-color);\n --jump-button-background: var(--jump-card-ecommerce-add-to-cart-background);\n --jump-button-color-hover: var(--jump-card-ecommerce-add-to-cart-color-hover);\n --jump-button-background-hover: var(--jump-card-ecommerce-add-to-cart-background-hover);\n\n &--Disallow { \n display: var(--jump-card-ecommerce-hide-discover-button-visibility);\n }\n }\n }\n\n .OutOfStock {\n justify-items: start;\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n color: var(--jump-card-commerce-out-of-stock-color);\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 margin-top: 0;\n \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(--jump-card-ecommerce-discount-color);\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 display: flex;\n align-items: flex-end;\n max-width: calc(50% - 1rem);\n margin-bottom: 0;\n\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}","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Listen, Method } from '@stencil/core';\n\nexport interface Variation {\n code: string;\n imgUrl: string;\n label: string;\n taxonomy: string;\n order?: number; // Aggiunta proprietà order\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 private imageEl: HTMLImageElement;\n\n /* ---------------------- @PROPERTIES ------------------------- /\n\n /* Indicates the threshold below which the discount will be hidden /\n @Prop() hideDiscountIfLessThreshold: number = undefined;\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 if the button to waiting list need to be shown /\n @Prop({ mutable: true, reflect: true }) waitingListButtonShow: boolean = false;\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 /* Indica se si tratta di un prodotto che può essere aggiunto al carrello solo dalla pagina prodotto /\n @Prop() disallowAddToCart: boolean = false;\n\n /* Label del pulsante che appare quando il prodotto non può essere aggiunto al carrello /\n @Prop() disallowAddToCartLabel: string = 'Scopri';\n\n /* Indica se è attivo lo zoom all'hover /\n @Prop() enableZoom: boolean = false;\n\n /* Controlla il comportamento dell'object-fit delle immagini /\n @Prop() imageObjectFit: 'cover' \| 'scale-down' \| 'contain' \| 'fill' \| 'none' = 'cover';\n\n /* Indica se selezionare automaticamente la prima variazione /\n @Prop() autoSelectFirstVariation: boolean = true;\n\n @Prop() showDiscountBadge: boolean = false;\n\n @Prop() verticalCard: 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 /* Flag per tracciare se le opzioni sono state ordinate /\n @State() optionsOrdered: boolean = false;\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 @Event({ eventName: 'jump-card-go-to-product-page' }) goToProductPage: EventEmitter;\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 /\n Forza l'ordinamento delle variazioni (utile per debugging o situazioni edge-case)\n /\n @Method()\n async forceVariationsOrder() {\n this.optionsOrdered = false;\n setTimeout(() => {\n this.optionsOrdered = true;\n }, 1);\n }\n\n /\n Seleziona automaticamente la prima variazione se abilitato e se nessuna è già selezionata\n /\n private selectFirstVariationIfEnabled() {\n if (this.autoSelectFirstVariation && !this.selectedVariation && this.variations.length > 0) {\n // Ordiniamo le variazioni per ottenere la prima\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n return a.code.localeCompare(b.code);\n });\n \n // Selezioniamo la prima variazione\n const firstVariation = sortedVariations[0];\n this.selectedVariation = firstVariation;\n \n // Aggiorniamo anche la select se esiste\n setTimeout(() => {\n if (this.variationSelectEl) {\n this.variationSelectEl.value = firstVariation.code;\n }\n }, 50);\n \n // Emettiamo l'evento di selezione\n this.variationSelected.emit(firstVariation);\n }\n }\n\n /\n Seleziona una variazione specifica tramite code\n /\n @Method()\n async selectVariation(variationCode: string) {\n const variation = this.variations.find(v => v.code === variationCode);\n if (variation) {\n this.selectedVariation = variation;\n \n if (this.variationSelectEl) {\n this.variationSelectEl.value = variationCode;\n }\n \n this.variationSelected.emit(variation);\n return true;\n }\n return false;\n }\n\n /\n Seleziona la prima variazione disponibile\n /\n @Method()\n async selectFirstVariation() {\n if (this.variations.length > 0) {\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n return a.code.localeCompare(b.code);\n });\n \n return await this.selectVariation(sortedVariations[0].code);\n }\n return false;\n }\n\n /\n Ottiene la variazione attualmente selezionata\n /\n @Method()\n async getSelectedVariation(): Promise<Variation \| null> {\n return this.selectedVariation \|\| null;\n }\n\n @Listen('jump-card-ecommerce-option-connected')\n addOption(e) {\n let props = e.detail; // es {code: 'sku1', imageUrl: 'https://google.com/', order: 1}\n \n // Aggiungiamo la nuova variazione solo se non esiste già\n const existingIndex = this.variations.findIndex(v => v.code === props.code);\n if (existingIndex === -1) {\n this.variations = [...this.variations, { ...props }];\n } else {\n // Se esiste già, la aggiorniamo\n this.variations = this.variations.map((v, i) => i === existingIndex ? { ...props } : v);\n }\n \n // Resettiamo il flag di ordinamento\n this.optionsOrdered = false;\n \n // Forziamo il re-render per applicare l'ordinamento dopo un brevissimo delay\n setTimeout(() => {\n this.optionsOrdered = true;\n // Selezioniamo automaticamente la prima variazione se abilitato\n this.selectFirstVariationIfEnabled();\n }, 10);\n }\n\n onVariationSelected() {\n let currentValue = this.variationSelectEl.value;\n \n // Ordiniamo sempre le variazioni prima di cercare quella selezionata\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n return a.code.localeCompare(b.code);\n });\n \n let variation = sortedVariations.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\n private handleMouseMove = (e: MouseEvent) => {\n if (!this.enableZoom \|\| !this.imageEl) return;\n\n const { left, top, width, height } = (e.currentTarget as HTMLElement).getBoundingClientRect();\n const x = e.clientX - left;\n const y = e.clientY - top;\n\n const moveX = (x / width - 0.5) -80; // Controlla l'ampiezza del movimento\n const moveY = (y / height - 0.5) * -80; // Controlla l'ampiezza del movimento\n\n this.imageEl.style.transform = `scale(1.5) translate(${moveX}px, ${moveY}px)`;\n };\n\n private handleMouseLeave = () => {\n if (!this.enableZoom \|\| !this.imageEl) return;\n this.imageEl.style.transform = 'scale(1) translate(0, 0)';\n };\n\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 goToProduct(){\n this.goToProductPage.emit({\n productId: this.productId,\n link: this.link,\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\n let justifyClass;\n\n // Se outofstock è true e disallowAddToCart è true, giustifichiamo a destra\n if (this.outOfStock && this.disallowAddToCart) {\n justifyClass = 'justify-end';\n } else if (this.outOfStock) {\n justifyClass = 'justify-between';\n } else if (this.disallowAddToCart) {\n justifyClass = 'justify-end';\n } else {\n justifyClass = 'justify-end';\n }\n\n const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\n const miniCard = this.isMini ? 'is-mini' : '';\n const verticalCardClass = this.verticalCard ? 'is-vertical' : '';\n const enableZoomClass = this.enableZoom ? 'enable-zoom' : '';\n\n // Ordiniamo sempre le variazioni al momento del render per garantire consistenza\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n // Se order è uguale, ordina per codice alfanumericamente\n return a.code.localeCompare(b.code);\n });\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 style={{'--image-object-fit': this.imageObjectFit}}>\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\n class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}\n onMouseMove={this.handleMouseMove}\n onMouseLeave={this.handleMouseLeave}\n >\n {!this.isMini && this.badge ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n \n {/* INIZIO CODICE AGGIUNTO /}\n {this.showDiscountBadge && !this.isMini && this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined \|\| parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?\n <div class=\"DiscountBadge\">-{calculateDiscount(this.price, this.salePrice)}%</div>\n : null}\n {/ FINE CODICE AGGIUNTO */}\n\n <a href={this.link}>\n <figure class={`Images ${hasImageOnHover} ${enableZoomClass}`}>\n {this.img && !this.videoSrc ? <img class=\"Images__Front\" src={this.img} alt={this.imgAlt} ref={el => this.imageEl = el as HTMLImageElement}></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} ${verticalCardClass}`}>\n <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard} ${verticalCardClass}`}>\n <div class=\"Body__Top\">\n <div class=\"Info\">\n <a href={this.link} class=\"Product\">{this.productName}</a>\n {this.subtitle ? <div class=\"Subtitle\" onClick={() => this.goToProduct()}>{this.subtitle}</div> : null}\n </div>\n\n {this.price ?\n <div class={`Price ${miniCard}`}>\n {!this.isMini && !this.showDiscountBadge && this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined \|\| parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?\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 \|\| sortedVariations.length != 0 ?\n <div class=\"Body__Bottom\">\n {(sortedVariations.length != 0 && !this.disallowAddToCart) ?\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 {sortedVariations\n .filter((variation) => !variation.imgUrl)\n .map((variation, index) => (\n <option \n key={`${variation.code}-${variation.order \|\| 999}-${index}`} \n value={variation.code}\n selected={this.selectedVariation?.code === variation.code}\n >\n {variation.label}\n </option>\n ))}\n </select>\n </div>\n : null}\n {!this.disallowAddToCart &&\n <slot name=\"quantity\"></slot>\n }\n </div>\n : null}\n </div>\n\n <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n {this.outOfStock && !this.isMini && !this.disallowAddToCart ?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n {this.outOfStock && this.waitingListButtonShow ?\n <jump-button class=\"Footer__AddToCart\" 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 && !this.disallowAddToCart ?\n <jump-button class=\"Footer__AddToCart\" 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\n {this.disallowAddToCart ?\n <jump-button class=\"Footer__AddToCart Footer__AddToCart--Disallow\" variant={this.addToCartColor} size=\"small\" text onClick={() => this.goToProduct()}>\n <jump-icon slot=\"suffix\" name=\"arrow-right\"></jump-icon> {this.disallowAddToCartLabel}\n </jump-button> : ''\n }\n </div>\n </div>\n </Host>\n );\n }\n\n}"],"version":3}
1	+ {"file":"jump-card-ecommerce.js","mappings":"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","names":["JumpCardEcommerce"],"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 --jump-card-commerce-out-of-stock-color: var(--status-danger-standard);\n --jump-card-ecommerce-discount-color: var(--status-danger-standard);\n --image-object-fit: cover;\n --jump-card-ecommerce-hide-discover-button-visibility: block;\n --jump-card-ecommerce-discount-badge-bg-color: var(--neutral-white);\n --jump-card-ecommerce-discount-badge-text-color: var(--primary-standard);\n --jump-card-ecommerce-discount-badge-padding: 4px 12px;\n --jump-card-ecommerce-discount-badge-border-radius: 50px;\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 .DiscountBadge {\n position: absolute;\n bottom: 1rem;\n right: 0.2rem;\n z-index: 2;\n border: 2px solid var(--jump-card-ecommerce-discount-badge-text-color);\n color: var(--jump-card-ecommerce-discount-badge-text-color);\n background-color: var(--jump-card-ecommerce-discount-badge-bg-color);\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n padding: var(--jump-card-ecommerce-discount-badge-padding);\n border-radius: var(--jump-card-ecommerce-discount-badge-border-radius);\n line-height: 1.2;\n }\n\n .Footer,\n .Body {\n display: flex;\n width: 100%;\n }\n\n .Footer {\n container-type: inline-size;\n flex-direction: row;\n\n @container (max-width: 239px) {\n flex-direction: column;\n\n .OutOfStock {\n margin-bottom: 0.25rem;\n }\n\n }\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 .Media {\n container-type: inline-size;\n\n @container (max-width: 239px) {\n jump-badge {\n top: auto;\n bottom: 1rem;\n left: 0.2rem;\n right: auto;\n }\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 position: absolute;\n top: 0;\n left: 0;\n overflow: hidden;\n object-fit: var(--image-object-fit, cover);\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 &.enable-zoom {\n overflow: hidden;\n\n .Images__Front {\n transition: transform 0s ease-out;\n cursor: zoom-in;\n }\n\n &:hover {\n .Images__Front {\n transform: scale(1.5);\n }\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 container-type: inline-size;\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n\n @container (max-width: 239px) {\n flex-direction: row;\n }\n\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 container-type: inline-size;\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 .Body__Top {\n display: flex;\n flex-direction: row;\n }\n\n .Body__Bottom {\n display: flex;\n flex-direction: row;\n }\n \n &.is-vertical {\n .Body__Top {\n flex-direction: column;\n align-items: flex-start;\n \n .Subtitle {\n min-height: 3.5rem;\n }\n\n @container (max-width: 239px) {\n .Subtitle {\n min-height: 3.2rem;\n }\n }\n }\n\n .Price {\n justify-items: start;\n margin-top: 0.5rem;\n column-gap: 0;\n display: flex;\n flex-direction: column-reverse;\n align-items: flex-start;\n }\n\n }\n\n @container (max-width: 239px) {\n .Body__Top {\n flex-direction: column;\n }\n\n .Body__Bottom {\n flex-direction: column;\n }\n\n .SelectVariations {\n max-width: 100%;\n margin-bottom: 0.5rem;\n\n select {\n width: 100%;\n }\n }\n\n .Price {\n display: flex;\n flex-direction: column-reverse;\n margin-top: 0.5rem;\n align-items: start;\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 .Subtitle:hover {\n cursor: pointer;\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 flex-grow: 1;\n display: flex;\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 &__AddToCart {\n --jump-button-color: var(--jump-card-ecommerce-add-to-cart-color);\n --jump-button-background: var(--jump-card-ecommerce-add-to-cart-background);\n --jump-button-color-hover: var(--jump-card-ecommerce-add-to-cart-color-hover);\n --jump-button-background-hover: var(--jump-card-ecommerce-add-to-cart-background-hover);\n\n &--Disallow { \n display: var(--jump-card-ecommerce-hide-discover-button-visibility);\n }\n }\n }\n\n .OutOfStock {\n justify-items: start;\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n color: var(--jump-card-commerce-out-of-stock-color);\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 margin-top: 0;\n \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(--jump-card-ecommerce-discount-color);\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 display: flex;\n align-items: flex-end;\n max-width: calc(50% - 1rem);\n margin-bottom: 0;\n\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}","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Listen, Method } from '@stencil/core';\n\nexport interface Variation {\n code: string;\n imgUrl: string;\n label: string;\n taxonomy: string;\n order?: number; // Aggiunta proprietà order\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 private imageEl: HTMLImageElement;\n\n /* ---------------------- @PROPERTIES ------------------------- /\n\n /* Indicates the threshold below which the discount will be hidden /\n @Prop() hideDiscountIfLessThreshold: number = undefined;\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' \| 'custom' = 'secondary';\n\n /* Indica il colore nel caso in cui badgeColor sia custom /\n @Prop() badgeCustomColor: string = '#000000';\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 if the button to waiting list need to be shown /\n @Prop({ mutable: true, reflect: true }) waitingListButtonShow: boolean = false;\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 /* Indica se si tratta di un prodotto che può essere aggiunto al carrello solo dalla pagina prodotto /\n @Prop() disallowAddToCart: boolean = false;\n\n /* Label del pulsante che appare quando il prodotto non può essere aggiunto al carrello /\n @Prop() disallowAddToCartLabel: string = 'Scopri';\n\n /* Indica se è attivo lo zoom all'hover /\n @Prop() enableZoom: boolean = false;\n\n /* Controlla il comportamento dell'object-fit delle immagini /\n @Prop() imageObjectFit: 'cover' \| 'scale-down' \| 'contain' \| 'fill' \| 'none' = 'cover';\n\n /* Indica se selezionare automaticamente la prima variazione /\n @Prop() autoSelectFirstVariation: boolean = true;\n\n @Prop() showDiscountBadge: boolean = false;\n\n @Prop() verticalCard: 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 /* Flag per tracciare se le opzioni sono state ordinate /\n @State() optionsOrdered: boolean = false;\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 @Event({ eventName: 'jump-card-go-to-product-page' }) goToProductPage: EventEmitter;\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 /\n Forza l'ordinamento delle variazioni (utile per debugging o situazioni edge-case)\n /\n @Method()\n async forceVariationsOrder() {\n this.optionsOrdered = false;\n setTimeout(() => {\n this.optionsOrdered = true;\n }, 1);\n }\n\n /\n Seleziona automaticamente la prima variazione se abilitato e se nessuna è già selezionata\n /\n private selectFirstVariationIfEnabled() {\n if (this.autoSelectFirstVariation && !this.selectedVariation && this.variations.length > 0) {\n // Ordiniamo le variazioni per ottenere la prima\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n return a.code.localeCompare(b.code);\n });\n \n // Selezioniamo la prima variazione\n const firstVariation = sortedVariations[0];\n this.selectedVariation = firstVariation;\n \n // Aggiorniamo anche la select se esiste\n setTimeout(() => {\n if (this.variationSelectEl) {\n this.variationSelectEl.value = firstVariation.code;\n }\n }, 50);\n \n // Emettiamo l'evento di selezione\n this.variationSelected.emit(firstVariation);\n }\n }\n\n /\n Seleziona una variazione specifica tramite code\n /\n @Method()\n async selectVariation(variationCode: string) {\n const variation = this.variations.find(v => v.code === variationCode);\n if (variation) {\n this.selectedVariation = variation;\n \n if (this.variationSelectEl) {\n this.variationSelectEl.value = variationCode;\n }\n \n this.variationSelected.emit(variation);\n return true;\n }\n return false;\n }\n\n /\n Seleziona la prima variazione disponibile\n /\n @Method()\n async selectFirstVariation() {\n if (this.variations.length > 0) {\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n return a.code.localeCompare(b.code);\n });\n \n return await this.selectVariation(sortedVariations[0].code);\n }\n return false;\n }\n\n /\n Ottiene la variazione attualmente selezionata\n /\n @Method()\n async getSelectedVariation(): Promise<Variation \| null> {\n return this.selectedVariation \|\| null;\n }\n\n @Listen('jump-card-ecommerce-option-connected')\n addOption(e) {\n let props = e.detail; // es {code: 'sku1', imageUrl: 'https://google.com/', order: 1}\n \n // Aggiungiamo la nuova variazione solo se non esiste già\n const existingIndex = this.variations.findIndex(v => v.code === props.code);\n if (existingIndex === -1) {\n this.variations = [...this.variations, { ...props }];\n } else {\n // Se esiste già, la aggiorniamo\n this.variations = this.variations.map((v, i) => i === existingIndex ? { ...props } : v);\n }\n \n // Resettiamo il flag di ordinamento\n this.optionsOrdered = false;\n \n // Forziamo il re-render per applicare l'ordinamento dopo un brevissimo delay\n setTimeout(() => {\n this.optionsOrdered = true;\n // Selezioniamo automaticamente la prima variazione se abilitato\n this.selectFirstVariationIfEnabled();\n }, 10);\n }\n\n onVariationSelected() {\n let currentValue = this.variationSelectEl.value;\n \n // Ordiniamo sempre le variazioni prima di cercare quella selezionata\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n return a.code.localeCompare(b.code);\n });\n \n let variation = sortedVariations.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\n private handleMouseMove = (e: MouseEvent) => {\n if (!this.enableZoom \|\| !this.imageEl) return;\n\n const { left, top, width, height } = (e.currentTarget as HTMLElement).getBoundingClientRect();\n const x = e.clientX - left;\n const y = e.clientY - top;\n\n const moveX = (x / width - 0.5) -80; // Controlla l'ampiezza del movimento\n const moveY = (y / height - 0.5) * -80; // Controlla l'ampiezza del movimento\n\n this.imageEl.style.transform = `scale(1.5) translate(${moveX}px, ${moveY}px)`;\n };\n\n private handleMouseLeave = () => {\n if (!this.enableZoom \|\| !this.imageEl) return;\n this.imageEl.style.transform = 'scale(1) translate(0, 0)';\n };\n\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 goToProduct(){\n this.goToProductPage.emit({\n productId: this.productId,\n link: this.link,\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\n let justifyClass;\n\n // Se outofstock è true e disallowAddToCart è true, giustifichiamo a destra\n if (this.outOfStock && this.disallowAddToCart) {\n justifyClass = 'justify-end';\n } else if (this.outOfStock) {\n justifyClass = 'justify-between';\n } else if (this.disallowAddToCart) {\n justifyClass = 'justify-end';\n } else {\n justifyClass = 'justify-end';\n }\n\n const hasImageOnHover = this.hoverImg ? 'has-hover-image' : '';\n const miniCard = this.isMini ? 'is-mini' : '';\n const verticalCardClass = this.verticalCard ? 'is-vertical' : '';\n const enableZoomClass = this.enableZoom ? 'enable-zoom' : '';\n\n // Ordiniamo sempre le variazioni al momento del render per garantire consistenza\n const sortedVariations = [...this.variations].sort((a, b) => {\n const orderA = a.order \|\| 999;\n const orderB = b.order \|\| 999;\n \n if (orderA !== orderB) {\n return orderA - orderB;\n }\n \n // Se order è uguale, ordina per codice alfanumericamente\n return a.code.localeCompare(b.code);\n });\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 style={{'--image-object-fit': this.imageObjectFit}}>\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\n class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}\n onMouseMove={this.handleMouseMove}\n onMouseLeave={this.handleMouseLeave}\n >\n {!this.isMini && this.badge ?\n <jump-badge \n class={`${backgroundClass} ${iconOnlyClass}`} \n variant={this.badgeColor} \n customColor={this.badgeColor === 'custom' ? this.badgeCustomColor : undefined}\n dimension=\"small\"\n label={this.badge}>\n </jump-badge> : ''}\n \n {/* INIZIO CODICE AGGIUNTO /}\n {this.showDiscountBadge && !this.isMini && this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined \|\| parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?\n <div class=\"DiscountBadge\">-{calculateDiscount(this.price, this.salePrice)}%</div>\n : null}\n {/ FINE CODICE AGGIUNTO */}\n\n <a href={this.link}>\n <figure class={`Images ${hasImageOnHover} ${enableZoomClass}`}>\n {this.img && !this.videoSrc ? <img class=\"Images__Front\" src={this.img} alt={this.imgAlt} ref={el => this.imageEl = el as HTMLImageElement}></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} ${verticalCardClass}`}>\n <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard} ${verticalCardClass}`}>\n <div class=\"Body__Top\">\n <div class=\"Info\">\n <a href={this.link} class=\"Product\">{this.productName}</a>\n {this.subtitle ? <div class=\"Subtitle\" onClick={() => this.goToProduct()}>{this.subtitle}</div> : null}\n </div>\n\n {this.price ?\n <div class={`Price ${miniCard}`}>\n {!this.isMini && !this.showDiscountBadge && this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined \|\| parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?\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 \|\| sortedVariations.length != 0 ?\n <div class=\"Body__Bottom\">\n {(sortedVariations.length != 0 && !this.disallowAddToCart) ?\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 {sortedVariations\n .filter((variation) => !variation.imgUrl)\n .map((variation, index) => (\n <option \n key={`${variation.code}-${variation.order \|\| 999}-${index}`} \n value={variation.code}\n selected={this.selectedVariation?.code === variation.code}\n >\n {variation.label}\n </option>\n ))}\n </select>\n </div>\n : null}\n {!this.disallowAddToCart &&\n <slot name=\"quantity\"></slot>\n }\n </div>\n : null}\n </div>\n\n <div class={`Footer ${justifyClass} ${backgroundClass} ${iconOnlyClass} ${miniCard}`}>\n\n {this.outOfStock && !this.isMini && !this.disallowAddToCart ?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : ''}\n\n {this.outOfStock && this.waitingListButtonShow ?\n <jump-button class=\"Footer__AddToCart\" 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 && !this.disallowAddToCart ?\n <jump-button class=\"Footer__AddToCart\" 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\n {this.disallowAddToCart ?\n <jump-button class=\"Footer__AddToCart Footer__AddToCart--Disallow\" variant={this.addToCartColor} size=\"small\" text onClick={() => this.goToProduct()}>\n <jump-icon slot=\"suffix\" name=\"arrow-right\"></jump-icon> {this.disallowAddToCartLabel}\n </jump-button> : ''\n }\n </div>\n </div>\n </Host>\n );\n }\n\n}"],"version":3}

package/dist/esm/jump-badge.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-a94b3471.js';
-const jumpBadgeCss = ":host{--jump-badge-background:var(--primary-standard);--badge-color:var(--jump-badge-color, var(--neutral-white));--jump-badge-border-radius:50px;--jump-badge-border:var(--primary-standard);--jump-badge-padding:4px 12px;display:flex;width:fit-content;gap:0.5rem;color:var(--badge-color);background-color:var(--jump-badge-background);align-items:center;justify-content:center;font-family:var(--ff-primary, \"Arial\"), sans-serif;font-size:var(--fs-500);font-weight:var(--fw-900);line-height:1.2;border-radius:var(--jump-badge-border-radius);border:solid 1px var(--jump-badge-border);white-space:nowrap;padding:var(--jump-badge-padding);user-select:none;cursor:inherit}:host([variant=primary]):host([soft]){--jump-badge-background:var(--primary-soft);--badge-color:var(--primary-standard);--jump-badge-border:var(--primary-soft)}:host([variant=secondary]){--jump-badge-background:var(--secondary-standard);--jump-badge-border:var(--secondary-standard)}:host([variant=secondary]):host([soft]){--jump-badge-background:var(--secondary-soft);--badge-color:var(--secondary-standard);--jump-badge-border:var(--secondary-soft)}:host([variant=neutral]){--jump-badge-background:var(--neutral-grey-secondary);--jump-badge-border:var(--neutral-grey-secondary)}:host([variant=neutral]):host([soft]){--jump-badge-background:var(--neutral-grey-disabled);--badge-color:var(--neutral-grey-secondary);--jump-badge-border:var(--neutral-grey-disabled)}:host([variant=danger]){--jump-badge-background:var(--status-danger-standard);--jump-badge-border:var(--status-danger-standard)}:host([variant=danger]):host([soft]){--jump-badge-background:var(--status-danger-soft);--badge-color:var(--status-danger-standard);--jump-badge-border:var(--status-danger-soft)}:host([variant=success]){--jump-badge-background:var(--status-success-standard);--jump-badge-border:var(--status-success-standard)}:host([variant=success]):host([soft]){--jump-badge-background:var(--status-success-soft);--badge-color:var(--status-success-standard);--jump-badge-border:var(--status-success-soft)}:host([variant=warning]){--jump-badge-background:var(--status-warning-standard);--jump-badge-border:var(--status-warning-standard)}:host([variant=warning]):host([soft]){--jump-badge-background:var(--status-warning-soft);--badge-color:var(--status-warning-standard);--jump-badge-border:var(--status-warning-soft)}:host([dimension=small]){font-size:var(--fs-300)}:host([dimension=dot]){font-size:var(--fs-300);--jump-badge-padding:0 5px;--jump-badge-border-radius:50%}:host([dimension=microdot]){width:0.5rem;height:0.5rem;padding:0;--jump-badge-border-radius:50%}:host([outline]){background-color:var(--jump-badge-background-outline);border:1px solid var(--jump-badge-background);color:var(--jump-badge-background);background-color:transparent}";
+const jumpBadgeCss = ":host{--jump-badge-background:var(--primary-standard);--badge-color:var(--jump-badge-color, var(--neutral-white));--jump-badge-border-radius:50px;--jump-badge-border:var(--primary-standard);--jump-badge-padding:4px 12px;display:flex;width:fit-content;gap:0.5rem;color:var(--badge-color);background-color:var(--jump-badge-background);align-items:center;justify-content:center;font-family:var(--ff-primary, \"Arial\"), sans-serif;font-size:var(--fs-500);font-weight:var(--fw-900);line-height:1.2;border-radius:var(--jump-badge-border-radius);border:solid 1px var(--jump-badge-border);white-space:nowrap;padding:var(--jump-badge-padding);user-select:none;cursor:inherit}:host([variant=primary]):host([soft]){--jump-badge-background:var(--primary-soft);--badge-color:var(--primary-standard);--jump-badge-border:var(--primary-soft)}:host([variant=secondary]){--jump-badge-background:var(--secondary-standard);--jump-badge-border:var(--secondary-standard)}:host([variant=secondary]):host([soft]){--jump-badge-background:var(--secondary-soft);--badge-color:var(--secondary-standard);--jump-badge-border:var(--secondary-soft)}:host([variant=neutral]){--jump-badge-background:var(--neutral-grey-secondary);--jump-badge-border:var(--neutral-grey-secondary)}:host([variant=neutral]):host([soft]){--jump-badge-background:var(--neutral-grey-disabled);--badge-color:var(--neutral-grey-secondary);--jump-badge-border:var(--neutral-grey-disabled)}:host([variant=danger]){--jump-badge-background:var(--status-danger-standard);--jump-badge-border:var(--status-danger-standard)}:host([variant=danger]):host([soft]){--jump-badge-background:var(--status-danger-soft);--badge-color:var(--status-danger-standard);--jump-badge-border:var(--status-danger-soft)}:host([variant=success]){--jump-badge-background:var(--status-success-standard);--jump-badge-border:var(--status-success-standard)}:host([variant=success]):host([soft]){--jump-badge-background:var(--status-success-soft);--badge-color:var(--status-success-standard);--jump-badge-border:var(--status-success-soft)}:host([variant=warning]){--jump-badge-background:var(--status-warning-standard);--jump-badge-border:var(--status-warning-standard)}:host([variant=warning]):host([soft]){--jump-badge-background:var(--status-warning-soft);--badge-color:var(--status-warning-standard);--jump-badge-border:var(--status-warning-soft)}:host([variant=custom]){--jump-badge-background:var(--badge-custom-color);--jump-badge-border:var(--badge-custom-color);--badge-color:var(--neutral-white)}:host([variant=custom]):host([soft]){--jump-badge-background:color-mix(in srgb, var(--badge-custom-color) 20%, transparent);--badge-color:var(--badge-custom-color);--jump-badge-border:color-mix(in srgb, var(--badge-custom-color) 20%, transparent)}:host([dimension=small]){font-size:var(--fs-300)}:host([dimension=dot]){font-size:var(--fs-300);--jump-badge-padding:0 5px;--jump-badge-border-radius:50%}:host([dimension=microdot]){width:0.5rem;height:0.5rem;padding:0;--jump-badge-border-radius:50%}:host([outline]){background-color:var(--jump-badge-background-outline);border:1px solid var(--jump-badge-background);color:var(--jump-badge-background);background-color:transparent}";
 const JumpBadgeStyle0 = jumpBadgeCss;
 const AppBadge = class {
@@ -11,9 +11,13 @@ const AppBadge = class {
         this.dimension = 'large';
         this.soft = false;
         this.outline = false;
+        this.customColor = '#000000';
     }
     render() {
-        return (h(Host, { key: '67bda06ef732e918bd7bfe0fb200223ce632d457' }, h("slot", { key: '6dc51ae8e6bf4bf8b8801da19827e405d5e7d288', name: "prefix" }), this.label));
+        const customStyle = this.variant === 'custom' ? {
+            '--badge-custom-color': this.customColor
+        } : {};
+        return (h(Host, { key: 'f4379bcf6dbd649f91b95fb47142d7b4e0d8ea44', style: customStyle }, h("slot", { key: '50bab707d80fb13fac04ac548b6cdd92aaef5eeb', name: "prefix" }), this.label));
     }
 };
 AppBadge.style = JumpBadgeStyle0;

package/dist/esm/jump-badge.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"jump-badge.entry.js","mappings":";;AAAA,MAAM,YAAY,GAAG,~~yuFAAyuF~~,CAAC;~~AAC/vF~~,wBAAe,YAAY;;MCMd,QAAQ;;;qBAIK,EAAE;~~uBAKqE~~,SAAS;~~yBAKnC~~,OAAO;oBAKrC,KAAK;uBAKF,KAAK;;~~IAE/C~~,MAAM;QACJ,QACE,EAAC,IAAI,~~uDACH~~,6DAAM,IAAI,EAAC,QAAQ,GAAQ,EAC1B,IAAI,CAAC,KAAK,CACN,EACP;KACH;;;;;;","names":[],"sources":["src/components/jump-badge/jump-badge.scss?tag=jump-badge&encapsulation=shadow","src/components/jump-badge/jump-badge.tsx"],"sourcesContent":[":host {\n --jump-badge-background: var(--primary-standard);\n --badge-color: var(--jump-badge-color, var(--neutral-white));\n --jump-badge-border-radius: 50px;\n --jump-badge-border: var(--primary-standard);\n --jump-badge-padding: 4px 12px;\n\n display: flex;\n width: fit-content;\n gap: 0.5rem;\n color: var(--badge-color);\n background-color: var(--jump-badge-background);\n align-items: center;\n justify-content: center;\n font-family: var(--ff-primary, 'Arial'), sans-serif;\n font-size: var(--fs-500);\n font-weight: var(--fw-900);\n line-height: 1.2;\n border-radius: var(--jump-badge-border-radius);\n border: solid 1px var(--jump-badge-border);\n white-space: nowrap;\n padding: var(--jump-badge-padding);\n user-select: none;\n cursor: inherit;\n}\n\n:host([variant='primary']) {\n &:host([soft]) {\n --jump-badge-background: var(--primary-soft);\n --badge-color: var(--primary-standard);\n --jump-badge-border: var(--primary-soft);\n }\n}\n\n:host([variant='secondary']) {\n --jump-badge-background: var(--secondary-standard);\n --jump-badge-border: var(--secondary-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--secondary-soft);\n --badge-color: var(--secondary-standard);\n --jump-badge-border: var(--secondary-soft);\n }\n}\n\n:host([variant='neutral']) {\n --jump-badge-background: var(--neutral-grey-secondary);\n --jump-badge-border: var(--neutral-grey-secondary);\n\n &:host([soft]) {\n --jump-badge-background: var(--neutral-grey-disabled);\n --badge-color: var(--neutral-grey-secondary);\n --jump-badge-border: var(--neutral-grey-disabled);\n }\n}\n\n:host([variant='danger']) {\n --jump-badge-background: var(--status-danger-standard);\n --jump-badge-border: var(--status-danger-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--status-danger-soft);\n --badge-color: var(--status-danger-standard);\n --jump-badge-border: var(--status-danger-soft);\n }\n}\n\n:host([variant='success']) {\n --jump-badge-background: var(--status-success-standard);\n --jump-badge-border: var(--status-success-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--status-success-soft);\n --badge-color: var(--status-success-standard);\n --jump-badge-border: var(--status-success-soft);\n }\n}\n\n:host([variant='warning']) {\n --jump-badge-background: var(--status-warning-standard);\n --jump-badge-border: var(--status-warning-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--status-warning-soft);\n --badge-color: var(--status-warning-standard);\n --jump-badge-border: var(--status-warning-soft);\n }\n}\n\n:host([dimension='small']) {\n font-size: var(--fs-300);\n}\n\n:host([dimension='dot']) {\n font-size: var(--fs-300);\n --jump-badge-padding: 0 5px;\n --jump-badge-border-radius: 50%;\n}\n\n:host([dimension='microdot']) {\n width: 0.5rem;\n height: 0.5rem;\n padding: 0;\n --jump-badge-border-radius: 50%;\n}\n\n:host([outline]) {\n background-color: var(--jump-badge-background-outline);\n border: 1px solid var(--jump-badge-background);\n color: var(--jump-badge-background);\n background-color: transparent;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'jump-badge',\n styleUrl: 'jump-badge.scss',\n shadow: true,\n})\nexport class AppBadge {\n /*\n Indicates the label of the badge\n /\n @Prop() label: string = '';\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) variant: 'primary'\|'secondary'\|'neutral'\|'warning'\|'success'\|'danger' = 'primary';\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) dimension: 'large'\|'small'\|'dot'\|'microdot' = 'large';\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) soft: boolean = false;\n\n /\n Indicates the variant of the badge\n */\n @Prop({reflect: true}) outline: boolean = false;\n\n render() {\n return (\n <Host>\n <slot name=\"prefix\"></slot>\n {this.label}\n </Host>\n );\n }\n\n}\n"],"version":3}
1	+ {"file":"jump-badge.entry.js","mappings":";;AAAA,MAAM,YAAY,GAAG,2nGAA2nG,CAAC;AACjpG,wBAAe,YAAY;;MCMd,QAAQ;;;qBAIK,EAAE;uBAK8E,SAAS;yBAK5C,OAAO;oBAKrC,KAAK;uBAKF,KAAK;2BAKjB,SAAS;;IAEvC,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,KAAK,QAAQ,GAAG;YAC9C,sBAAsB,EAAE,IAAI,CAAC,WAAW;SACzC,GAAG,EAAE,CAAC;QAEP,QACE,EAAC,IAAI,qDAAC,KAAK,EAAE,WAAW,IACtB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,EAC1B,IAAI,CAAC,KAAK,CACN,EACP;KACH;;;;;;","names":[],"sources":["src/components/jump-badge/jump-badge.scss?tag=jump-badge&encapsulation=shadow","src/components/jump-badge/jump-badge.tsx"],"sourcesContent":[":host {\n --jump-badge-background: var(--primary-standard);\n --badge-color: var(--jump-badge-color, var(--neutral-white));\n --jump-badge-border-radius: 50px;\n --jump-badge-border: var(--primary-standard);\n --jump-badge-padding: 4px 12px;\n\n display: flex;\n width: fit-content;\n gap: 0.5rem;\n color: var(--badge-color);\n background-color: var(--jump-badge-background);\n align-items: center;\n justify-content: center;\n font-family: var(--ff-primary, 'Arial'), sans-serif;\n font-size: var(--fs-500);\n font-weight: var(--fw-900);\n line-height: 1.2;\n border-radius: var(--jump-badge-border-radius);\n border: solid 1px var(--jump-badge-border);\n white-space: nowrap;\n padding: var(--jump-badge-padding);\n user-select: none;\n cursor: inherit;\n}\n\n:host([variant='primary']) {\n &:host([soft]) {\n --jump-badge-background: var(--primary-soft);\n --badge-color: var(--primary-standard);\n --jump-badge-border: var(--primary-soft);\n }\n}\n\n:host([variant='secondary']) {\n --jump-badge-background: var(--secondary-standard);\n --jump-badge-border: var(--secondary-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--secondary-soft);\n --badge-color: var(--secondary-standard);\n --jump-badge-border: var(--secondary-soft);\n }\n}\n\n:host([variant='neutral']) {\n --jump-badge-background: var(--neutral-grey-secondary);\n --jump-badge-border: var(--neutral-grey-secondary);\n\n &:host([soft]) {\n --jump-badge-background: var(--neutral-grey-disabled);\n --badge-color: var(--neutral-grey-secondary);\n --jump-badge-border: var(--neutral-grey-disabled);\n }\n}\n\n:host([variant='danger']) {\n --jump-badge-background: var(--status-danger-standard);\n --jump-badge-border: var(--status-danger-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--status-danger-soft);\n --badge-color: var(--status-danger-standard);\n --jump-badge-border: var(--status-danger-soft);\n }\n}\n\n:host([variant='success']) {\n --jump-badge-background: var(--status-success-standard);\n --jump-badge-border: var(--status-success-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--status-success-soft);\n --badge-color: var(--status-success-standard);\n --jump-badge-border: var(--status-success-soft);\n }\n}\n\n:host([variant='warning']) {\n --jump-badge-background: var(--status-warning-standard);\n --jump-badge-border: var(--status-warning-standard);\n\n &:host([soft]) {\n --jump-badge-background: var(--status-warning-soft);\n --badge-color: var(--status-warning-standard);\n --jump-badge-border: var(--status-warning-soft);\n }\n}\n\n:host([variant='custom']) {\n --jump-badge-background: var(--badge-custom-color);\n --jump-badge-border: var(--badge-custom-color);\n --badge-color: var(--neutral-white);\n\n &:host([soft]) {\n --jump-badge-background: color-mix(in srgb, var(--badge-custom-color) 20%, transparent);\n --badge-color: var(--badge-custom-color);\n --jump-badge-border: color-mix(in srgb, var(--badge-custom-color) 20%, transparent);\n }\n}\n\n:host([dimension='small']) {\n font-size: var(--fs-300);\n}\n\n:host([dimension='dot']) {\n font-size: var(--fs-300);\n --jump-badge-padding: 0 5px;\n --jump-badge-border-radius: 50%;\n}\n\n:host([dimension='microdot']) {\n width: 0.5rem;\n height: 0.5rem;\n padding: 0;\n --jump-badge-border-radius: 50%;\n}\n\n:host([outline]) {\n background-color: var(--jump-badge-background-outline);\n border: 1px solid var(--jump-badge-background);\n color: var(--jump-badge-background);\n background-color: transparent;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'jump-badge',\n styleUrl: 'jump-badge.scss',\n shadow: true,\n})\nexport class AppBadge {\n /*\n Indicates the label of the badge\n /\n @Prop() label: string = '';\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) variant: 'primary'\|'secondary'\|'neutral'\|'warning'\|'success'\|'danger'\|'custom' = 'primary';\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) dimension: 'large'\|'small'\|'dot'\|'microdot' = 'large';\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) soft: boolean = false;\n\n /\n Indicates the variant of the badge\n /\n @Prop({reflect: true}) outline: boolean = false;\n\n /\n Indica il colore personalizzato quando variant è 'custom'\n */\n @Prop() customColor: string = '#000000';\n\n render() {\n const customStyle = this.variant === 'custom' ? {\n '--badge-custom-color': this.customColor\n } : {};\n\n return (\n <Host style={customStyle}>\n <slot name=\"prefix\"></slot>\n {this.label}\n </Host>\n );\n }\n\n}\n"],"version":3}

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-a94b3471.js';
-const jumpCardEcommerceShowcaseCss = ":host {\n  --card-max-width: 450px;\n  --jump-card-ecommerce-showcase-max-width-horizontal: 100%;\n  --jump-card-ecommerce-showcase-color: var(--neutral-grey-primary);\n  --jump-card-ecommerce-showcase-background: transparent;\n  --jump-card-ecommerce-showcase-border-color: var(--neutral-grey-background);\n  --jump-card-ecommerce-showcase-padding: 0.5rem;\n  --jump-card-ecommerce-showcase-out-of-stock-color: var(--status-danger-standard);\n  --jump-card-ecommerce-showcase-available-color: var(--status-success-standard);\n  --jump-card-ecommerce-showcase-discount-color: var(--status-danger-standard);\n  --image-object-fit: cover;\n  --jump-card-ecommerce-showcase-hide-discover-button-visibility: block;\n  --jump-card-ecommerce-showcase-discount-badge-bg-color: var(--neutral-white);\n  --jump-card-ecommerce-showcase-discount-badge-text-color: var(--primary-standard);\n  --jump-card-ecommerce-showcase-discount-badge-padding: 4px 12px;\n  --jump-card-ecommerce-showcase-discount-badge-border-radius: 50px;\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-ecommerce-showcase-background);\n  color: var(--jump-card-ecommerce-showcase-color);\n}\n:host .DiscountBadge {\n  position: absolute;\n  bottom: 1rem;\n  right: 0.2rem;\n  z-index: 2;\n  border: 2px solid var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n  color: var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n  background-color: var(--jump-card-ecommerce-showcase-discount-badge-bg-color);\n  font-size: var(--fs-300);\n  font-weight: var(--fw-900);\n  padding: var(--jump-card-ecommerce-showcase-discount-badge-padding);\n  border-radius: var(--jump-card-ecommerce-showcase-discount-badge-border-radius);\n  line-height: 1.2;\n}\n:host .Footer,\n:host .Body {\n  display: flex;\n  width: 100%;\n}\n:host .Footer {\n  container-type: inline-size;\n  flex-direction: row;\n}\n@container (max-width: 239px) {\n  :host .Footer {\n    flex-direction: column;\n  }\n  :host .Footer .OutOfStock {\n    margin-bottom: 0.25rem;\n  }\n}\n:host jump-badge {\n  position: absolute;\n  top: 1rem;\n  left: 1rem;\n  z-index: 2;\n}\n:host .Media {\n  container-type: inline-size;\n}\n@container (max-width: 239px) {\n  :host .Media jump-badge {\n    top: auto;\n    bottom: 1rem;\n    left: 0.2rem;\n    right: auto;\n  }\n}\n:host .Media {\n  overflow: hidden;\n  position: relative;\n  border-radius: 3px;\n  aspect-ratio: 1/1;\n}\n:host .Media .Images {\n  height: 100%;\n  margin: 0;\n  position: relative;\n}\n:host .Media .Images img {\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  overflow: hidden;\n  object-fit: var(--image-object-fit, cover);\n}\n:host .Media .Images__Front {\n  z-index: 1;\n  transition: opacity 0.5s linear;\n  cursor: pointer;\n}\n:host .Media.hasBackground {\n  background-color: var(--neutral-white);\n}\n:host .Media.hasBackground.iconOnly {\n  border-top-left-radius: 6px;\n  border-top-right-radius: 6px;\n  padding: var(--jump-card-ecommerce-showcase-padding) var(--jump-card-ecommerce-showcase-padding) 0;\n}\n:host .Media.hasBackground.iconOnly img {\n  border-radius: 6px;\n}\n:host .Media.iconOnly {\n  border-bottom-right-radius: 0;\n}\n:host .Media.is-mini {\n  max-width: 180px;\n}\n:host .Content {\n  container-type: inline-size;\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n}\n@container (max-width: 239px) {\n  :host .Content {\n    flex-direction: row;\n  }\n}\n:host .Content.hasBackground {\n  background-color: var(--neutral-white);\n  padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2);\n}\n:host .Content.iconOnly {\n  padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2) var(--jump-card-ecommerce-showcase-padding);\n}\n:host .Content.is-mini {\n  max-width: 180px;\n}\n:host .Body {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  padding: var(--jump-card-ecommerce-showcase-padding) 0;\n  container-type: inline-size;\n}\n:host .Body > * {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n}\n:host .Body > * > * {\n  flex: 0 1 auto;\n}\n:host .Body .Body__Top {\n  display: flex;\n  flex-direction: row;\n}\n:host .Body .Body__Bottom {\n  display: flex;\n  flex-direction: row;\n}\n:host .Body.is-vertical .Body__Top {\n  flex-direction: column;\n  align-items: flex-start;\n}\n:host .Body.is-vertical .Body__Top .Subtitle {\n  min-height: 3.5rem;\n}\n@container (max-width: 239px) {\n  :host .Body.is-vertical .Body__Top .Subtitle {\n    min-height: 3.2rem;\n  }\n}\n:host .Body.is-vertical .Price {\n  justify-items: start;\n  margin-top: 0.5rem;\n  column-gap: 0;\n  display: flex;\n  flex-direction: column-reverse;\n  align-items: flex-start;\n}\n@container (max-width: 239px) {\n  :host .Body .Body__Top {\n    flex-direction: column;\n  }\n  :host .Body .Body__Bottom {\n    flex-direction: column;\n  }\n  :host .Body .SelectVariations {\n    max-width: 100%;\n    margin-bottom: 0.5rem;\n  }\n  :host .Body .SelectVariations select {\n    width: 100%;\n  }\n  :host .Body .Price {\n    display: flex;\n    flex-direction: column-reverse;\n    margin-top: 0.5rem;\n    align-items: start;\n  }\n}\n:host .Body.hasBackground {\n  padding: 0 0 var(--jump-card-padding);\n}\n:host .Body.iconOnly {\n  padding: 0;\n}\n:host .Body.is-mini {\n  padding: calc(var(--jump-card-padding) / 2) 0;\n}\n:host .Body.is-mini > * {\n  flex-direction: column;\n}\n:host .Product {\n  font-size: var(--fs-400);\n  color: var(--neutral-grey-primary);\n  text-decoration: none;\n}\n:host .Subtitle {\n  font-size: var(--fs-300);\n  color: var(--neutral-grey-secondary);\n  line-height: 1.2;\n}\n:host .Subtitle:hover {\n  cursor: pointer;\n}\n:host .OutOfStock, :host .AvailableStock {\n  justify-items: start;\n  font-size: var(--fs-300);\n  font-weight: var(--fw-900);\n  margin-top: 0.5rem;\n}\n:host .OutOfStock {\n  color: var(--jump-card-ecommerce-showcase-out-of-stock-color);\n}\n:host .AvailableStock {\n  color: var(--jump-card-ecommerce-showcase-available-color);\n}\n:host .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  margin-top: 0;\n  font-size: var(--fs-500);\n  font-weight: var(--fw-900);\n  line-height: var(--lh-400);\n}\n:host .Price > * {\n  display: inline-flex;\n}\n:host .Price__Regular {\n  text-align: right;\n}\n:host .Price__Regular.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:host .Price__Sale {\n  grid-column: 2;\n  grid-row: 2;\n}\n:host .Price__Discount {\n  color: var(--jump-card-ecommerce-showcase-discount-color);\n  font-weight: var(--fw-400);\n  font-size: var(--fs-300);\n  grid-column: 1;\n  grid-row: 1;\n}\n:host .Price.is-mini {\n  display: flex;\n  font-size: var(--fs-400);\n}";
+const jumpCardEcommerceShowcaseCss = ":host {\n  --card-max-width: 450px;\n  --jump-card-ecommerce-showcase-max-width-horizontal: 100%;\n  --jump-card-ecommerce-showcase-color: var(--neutral-grey-primary);\n  --jump-card-ecommerce-showcase-background: transparent;\n  --jump-card-ecommerce-showcase-border-color: var(--neutral-grey-background);\n  --jump-card-ecommerce-showcase-padding: 0.5rem;\n  --jump-card-ecommerce-showcase-out-of-stock-color: var(--status-danger-standard);\n  --jump-card-ecommerce-showcase-available-color: var(--status-success-standard);\n  --jump-card-ecommerce-showcase-discount-color: var(--status-danger-standard);\n  --image-object-fit: cover;\n  --jump-card-ecommerce-showcase-hide-discover-button-visibility: block;\n  --jump-card-ecommerce-showcase-discount-badge-bg-color: var(--neutral-white);\n  --jump-card-ecommerce-showcase-discount-badge-text-color: var(--primary-standard);\n  --jump-card-ecommerce-showcase-discount-badge-padding: 4px 12px;\n  --jump-card-ecommerce-showcase-discount-badge-border-radius: 50px;\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-ecommerce-showcase-background);\n  color: var(--jump-card-ecommerce-showcase-color);\n}\n:host .DiscountBadge {\n  position: absolute;\n  bottom: 1rem;\n  right: 0.2rem;\n  z-index: 2;\n  border: 2px solid var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n  color: var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n  background-color: var(--jump-card-ecommerce-showcase-discount-badge-bg-color);\n  font-size: var(--fs-300);\n  font-weight: var(--fw-900);\n  padding: var(--jump-card-ecommerce-showcase-discount-badge-padding);\n  border-radius: var(--jump-card-ecommerce-showcase-discount-badge-border-radius);\n  line-height: 1.2;\n}\n:host .Footer,\n:host .Body {\n  display: flex;\n  width: 100%;\n}\n:host .Footer {\n  container-type: inline-size;\n  flex-direction: row;\n}\n@container (max-width: 239px) {\n  :host .Footer {\n    flex-direction: column;\n  }\n  :host .Footer .OutOfStock {\n    margin-bottom: 0.25rem;\n  }\n}\n:host jump-badge {\n  position: absolute;\n  top: 1rem;\n  left: 1rem;\n  z-index: 2;\n}\n:host .Media {\n  container-type: inline-size;\n}\n@container (max-width: 239px) {\n  :host .Media jump-badge {\n    top: auto;\n    bottom: 1rem;\n    left: 0.2rem;\n    right: auto;\n  }\n}\n:host .Media {\n  overflow: hidden;\n  position: relative;\n  border-radius: 3px;\n  aspect-ratio: 1/1;\n}\n:host .Media .Images {\n  height: 100%;\n  margin: 0;\n  position: relative;\n}\n:host .Media .Images img {\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  overflow: hidden;\n  object-fit: var(--image-object-fit, cover);\n}\n:host .Media .Images__Front {\n  z-index: 1;\n  transition: opacity 0.5s linear;\n  cursor: pointer;\n}\n:host .Media.hasBackground {\n  background-color: var(--neutral-white);\n}\n:host .Media.hasBackground.iconOnly {\n  border-top-left-radius: 6px;\n  border-top-right-radius: 6px;\n  padding: var(--jump-card-ecommerce-showcase-padding) var(--jump-card-ecommerce-showcase-padding) 0;\n}\n:host .Media.hasBackground.iconOnly img {\n  border-radius: 6px;\n}\n:host .Media.iconOnly {\n  border-bottom-right-radius: 0;\n}\n:host .Media.is-mini {\n  max-width: 180px;\n}\n:host .Content {\n  container-type: inline-size;\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n}\n@container (max-width: 239px) {\n  :host .Content {\n    flex-direction: row;\n  }\n}\n:host .Content.hasBackground {\n  background-color: var(--neutral-white);\n  padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2);\n}\n:host .Content.iconOnly {\n  padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2) var(--jump-card-ecommerce-showcase-padding);\n}\n:host .Content.is-mini {\n  max-width: 180px;\n}\n:host .Body {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  padding: var(--jump-card-ecommerce-showcase-padding) 0;\n  container-type: inline-size;\n}\n:host .Body > * {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n}\n:host .Body > * > * {\n  flex: 0 1 auto;\n}\n:host .Body .Body__Top {\n  display: flex;\n  flex-direction: row;\n}\n:host .Body .Body__Bottom {\n  display: flex;\n  flex-direction: row;\n}\n:host .Body.is-vertical .Body__Top {\n  flex-direction: column;\n  align-items: flex-start;\n}\n:host .Body.is-vertical .Body__Top .Subtitle {\n  min-height: 3.5rem;\n}\n@container (max-width: 239px) {\n  :host .Body.is-vertical .Body__Top .Subtitle {\n    min-height: 4.5rem;\n  }\n}\n:host .Body.is-vertical .Price {\n  justify-items: start;\n  margin-top: 0.5rem;\n  column-gap: 0;\n  display: flex;\n  flex-direction: column-reverse;\n  align-items: flex-start;\n}\n@container (max-width: 239px) {\n  :host .Body .Body__Top {\n    flex-direction: column;\n  }\n  :host .Body .Body__Bottom {\n    flex-direction: column;\n  }\n  :host .Body .SelectVariations {\n    max-width: 100%;\n    margin-bottom: 0.5rem;\n  }\n  :host .Body .SelectVariations select {\n    width: 100%;\n  }\n  :host .Body .Price {\n    display: flex;\n    flex-direction: column-reverse;\n    margin-top: 0.5rem;\n    align-items: start;\n  }\n}\n:host .Body.hasBackground {\n  padding: 0 0 var(--jump-card-padding);\n}\n:host .Body.iconOnly {\n  padding: 0;\n}\n:host .Body.is-mini {\n  padding: calc(var(--jump-card-padding) / 2) 0;\n}\n:host .Body.is-mini > * {\n  flex-direction: column;\n}\n:host .Product {\n  font-size: var(--fs-400);\n  color: var(--neutral-grey-primary);\n  text-decoration: none;\n}\n:host .Subtitle {\n  font-size: var(--fs-300);\n  color: var(--neutral-grey-secondary);\n  line-height: 1.2;\n}\n:host .Subtitle:hover {\n  cursor: pointer;\n}\n:host .OutOfStock, :host .AvailableStock {\n  justify-items: start;\n  font-size: var(--fs-300);\n  font-weight: var(--fw-900);\n  margin-top: 0.5rem;\n}\n:host .OutOfStock {\n  color: var(--jump-card-ecommerce-showcase-out-of-stock-color);\n}\n:host .AvailableStock {\n  color: var(--jump-card-ecommerce-showcase-available-color);\n}\n:host .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  margin-top: 0;\n  font-size: var(--fs-500);\n  font-weight: var(--fw-900);\n  line-height: var(--lh-400);\n}\n:host .Price > * {\n  display: inline-flex;\n}\n:host .Price__Regular {\n  text-align: right;\n}\n:host .Price__Regular.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:host .Price__Sale {\n  grid-column: 2;\n  grid-row: 2;\n}\n:host .Price__Discount {\n  color: var(--jump-card-ecommerce-showcase-discount-color);\n  font-weight: var(--fw-400);\n  font-size: var(--fs-300);\n  grid-column: 1;\n  grid-row: 1;\n}\n:host .Price.is-mini {\n  display: flex;\n  font-size: var(--fs-400);\n}";
 const JumpCardEcommerceShowcaseStyle0 = jumpCardEcommerceShowcaseCss;
 const JumpCardEcommerceShowcase = class {

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

	@@ -1 +1 @@
1	- {"file":"jump-card-ecommerce-showcase.entry.js","mappings":"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","names":[],"sources":["src/components/jump-card-ecommerce-showcase/jump-card-ecommerce-showcase.scss?tag=jump-card-ecommerce-showcase&encapsulation=shadow","src/components/jump-card-ecommerce-showcase/jump-card-ecommerce-showcase.tsx"],"sourcesContent":[":host {\n --card-max-width: 450px;\n --jump-card-ecommerce-showcase-max-width-horizontal: 100%;\n --jump-card-ecommerce-showcase-color: var(--neutral-grey-primary);\n --jump-card-ecommerce-showcase-background: transparent;\n --jump-card-ecommerce-showcase-border-color: var(--neutral-grey-background);\n --jump-card-ecommerce-showcase-padding: 0.5rem;\n --jump-card-ecommerce-showcase-out-of-stock-color: var(--status-danger-standard);\n --jump-card-ecommerce-showcase-available-color: var(--status-success-standard);\n --jump-card-ecommerce-showcase-discount-color: var(--status-danger-standard);\n --image-object-fit: cover;\n --jump-card-ecommerce-showcase-hide-discover-button-visibility: block;\n --jump-card-ecommerce-showcase-discount-badge-bg-color: var(--neutral-white);\n --jump-card-ecommerce-showcase-discount-badge-text-color: var(--primary-standard);\n --jump-card-ecommerce-showcase-discount-badge-padding: 4px 12px;\n --jump-card-ecommerce-showcase-discount-badge-border-radius: 50px;\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-ecommerce-showcase-background);\n color: var(--jump-card-ecommerce-showcase-color);\n\n .DiscountBadge {\n position: absolute;\n bottom: 1rem;\n right: 0.2rem;\n z-index: 2;\n border: 2px solid var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n color: var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n background-color: var(--jump-card-ecommerce-showcase-discount-badge-bg-color);\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n padding: var(--jump-card-ecommerce-showcase-discount-badge-padding);\n border-radius: var(--jump-card-ecommerce-showcase-discount-badge-border-radius);\n line-height: 1.2;\n }\n\n .Footer,\n .Body {\n display: flex;\n width: 100%;\n }\n\n .Footer {\n container-type: inline-size;\n flex-direction: row;\n\n @container (max-width: 239px) {\n flex-direction: column;\n\n .OutOfStock {\n margin-bottom: 0.25rem;\n }\n\n }\n }\n\n jump-badge {\n position: absolute;\n top: 1rem;\n left: 1rem;\n z-index: 2;\n }\n\n .Media {\n container-type: inline-size;\n\n @container (max-width: 239px) {\n jump-badge {\n top: auto;\n bottom: 1rem;\n left: 0.2rem;\n right: auto;\n }\n }\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 position: absolute;\n top: 0;\n left: 0;\n overflow: hidden;\n object-fit: var(--image-object-fit, cover);\n }\n\n &__Front {\n z-index: 1;\n transition: opacity 0.5s linear;\n cursor: pointer;\n }\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-ecommerce-showcase-padding) var(--jump-card-ecommerce-showcase-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 .Content {\n container-type: inline-size;\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n\n @container (max-width: 239px) {\n flex-direction: row;\n }\n\n &.hasBackground {\n background-color: var(--neutral-white);\n padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2);\n }\n\n &.iconOnly {\n padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2) var(--jump-card-ecommerce-showcase-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-ecommerce-showcase-padding) 0;\n container-type: inline-size;\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 .Body__Top {\n display: flex;\n flex-direction: row;\n }\n\n .Body__Bottom {\n display: flex;\n flex-direction: row;\n }\n \n &.is-vertical {\n .Body__Top {\n flex-direction: column;\n align-items: flex-start;\n \n .Subtitle {\n min-height: 3.5rem;\n }\n\n @container (max-width: 239px) {\n .Subtitle {\n min-height: 3.2rem;\n }\n }\n }\n\n .Price {\n justify-items: start;\n margin-top: 0.5rem;\n column-gap: 0;\n display: flex;\n flex-direction: column-reverse;\n align-items: flex-start;\n }\n\n }\n\n @container (max-width: 239px) {\n .Body__Top {\n flex-direction: column;\n }\n\n .Body__Bottom {\n flex-direction: column;\n }\n\n .SelectVariations {\n max-width: 100%;\n margin-bottom: 0.5rem;\n\n select {\n width: 100%;\n }\n }\n\n .Price {\n display: flex;\n flex-direction: column-reverse;\n margin-top: 0.5rem;\n align-items: start;\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 .Subtitle:hover {\n cursor: pointer;\n }\n\n .OutOfStock, .AvailableStock {\n justify-items: start;\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n margin-top: 0.5rem;\n }\n\n .OutOfStock {\n color: var(--jump-card-ecommerce-showcase-out-of-stock-color);\n }\n\n .AvailableStock {\n color: var(--jump-card-ecommerce-showcase-available-color);\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 margin-top: 0;\n \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(--jump-card-ecommerce-showcase-discount-color);\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}","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-card-ecommerce-showcase',\n styleUrl: 'jump-card-ecommerce-showcase.scss',\n shadow: true,\n})\nexport class JumpCardEcommerceShowcase {\n\n @Element() JumpCardEcommerceShowcase: HTMLElement;\n jumpQuantityEl;\n\n /* ---------------------- @PROPERTIES ------------------------- /\n\n /* Indicates the threshold below which the discount will be hidden /\n @Prop() hideDiscountIfLessThreshold: number = undefined;\n\n /* Indicates the badge of the card/\n @Prop() badge: string;\n\n /* Indicates the link of the card/\n @Prop() link: string;\n\n /* Indicates the image's src of the card/\n @Prop() img: string;\n\n /* Indicates the img's alt of the card/\n @Prop() imgAlt: string;\n\n /* Indicates the 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() 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 @Prop() availableText: string;\n \n /* Controlla il comportamento dell'object-fit delle immagini /\n @Prop() imageObjectFit: 'cover' \| 'scale-down' \| 'contain' \| 'fill' \| 'none' = 'cover';\n\n \n\n\n / ---------------------- @STATE ------------------------- /\n\n @State() priceFormatted: string;\n\n @State() salePriceFormatted: string;\n\n / ---------------------- @EVENTS ------------------------- /\n\n @Event({ eventName: 'jump-card-go-to-product-page' }) goToProductPage: EventEmitter;\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 / ---------------------- @LIFECYCLE ------------------------- /\n\n componentDidLoad() {\n this.formatPrices();\n }\n\n / ---------------------- @METHODS ------------------------- /\n\n goToProduct(){\n this.goToProductPage.emit({\n productId: this.productId,\n link: this.link,\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 = 'hasBackground';\n const iconOnlyClass = '';\n\n const hasImageOnHover = '';\n const miniCard = '';\n const verticalCardClass = 'is-vertical';\n const enableZoomClass = '';\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 style={{'--image-object-fit': this.imageObjectFit}}>\n\n <div\n class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}\n >\n {this.badge ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n \n {this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined \|\| parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?\n <div class=\"DiscountBadge\">-{calculateDiscount(this.price, this.salePrice)}%</div> : null}\n\n <a href={this.link}>\n <figure class={`Images ${hasImageOnHover} ${enableZoomClass}`}>\n {this.img && <img class=\"Images__Front\" src={this.img} alt={this.imgAlt}></img> }\n \n </figure>\n </a>\n </div>\n\n <div class={`Content ${backgroundClass} ${iconOnlyClass} ${miniCard} ${verticalCardClass}`}>\n <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard} ${verticalCardClass}`}>\n <div class=\"Body__Top\">\n <div class=\"Info\">\n <a href={this.link} class=\"Product\">{this.productName}</a>\n {this.subtitle ? <div class=\"Subtitle\" onClick={() => this.goToProduct()}>{this.subtitle}</div> : null}\n </div>\n\n {this.price ?\n <div class={`Price ${miniCard}`}>\n <div class={`Price__Regular ${this.salePrice && this.salePrice < this.price ? 'sale' : ''}`}>\n {this.currency}{this.priceFormatted}\n </div>\n \n {this.salePrice && this.salePrice < this.price ?\n <div class=\"Price__Sale\">{this.currency}{this.salePriceFormatted}</div>\n : null}\n </div>\n : null}\n \n {this.outOfStock ?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : <div class=\"AvailableStock\">{this.availableText ? this.availableText : 'Disponibile'}</div>}\n\n </div>\n </div>\n\n \n </div>\n </Host>\n );\n }\n\n}"],"version":3}
1	+ {"file":"jump-card-ecommerce-showcase.entry.js","mappings":"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","names":[],"sources":["src/components/jump-card-ecommerce-showcase/jump-card-ecommerce-showcase.scss?tag=jump-card-ecommerce-showcase&encapsulation=shadow","src/components/jump-card-ecommerce-showcase/jump-card-ecommerce-showcase.tsx"],"sourcesContent":[":host {\n --card-max-width: 450px;\n --jump-card-ecommerce-showcase-max-width-horizontal: 100%;\n --jump-card-ecommerce-showcase-color: var(--neutral-grey-primary);\n --jump-card-ecommerce-showcase-background: transparent;\n --jump-card-ecommerce-showcase-border-color: var(--neutral-grey-background);\n --jump-card-ecommerce-showcase-padding: 0.5rem;\n --jump-card-ecommerce-showcase-out-of-stock-color: var(--status-danger-standard);\n --jump-card-ecommerce-showcase-available-color: var(--status-success-standard);\n --jump-card-ecommerce-showcase-discount-color: var(--status-danger-standard);\n --image-object-fit: cover;\n --jump-card-ecommerce-showcase-hide-discover-button-visibility: block;\n --jump-card-ecommerce-showcase-discount-badge-bg-color: var(--neutral-white);\n --jump-card-ecommerce-showcase-discount-badge-text-color: var(--primary-standard);\n --jump-card-ecommerce-showcase-discount-badge-padding: 4px 12px;\n --jump-card-ecommerce-showcase-discount-badge-border-radius: 50px;\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-ecommerce-showcase-background);\n color: var(--jump-card-ecommerce-showcase-color);\n\n .DiscountBadge {\n position: absolute;\n bottom: 1rem;\n right: 0.2rem;\n z-index: 2;\n border: 2px solid var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n color: var(--jump-card-ecommerce-showcase-discount-badge-text-color);\n background-color: var(--jump-card-ecommerce-showcase-discount-badge-bg-color);\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n padding: var(--jump-card-ecommerce-showcase-discount-badge-padding);\n border-radius: var(--jump-card-ecommerce-showcase-discount-badge-border-radius);\n line-height: 1.2;\n }\n\n .Footer,\n .Body {\n display: flex;\n width: 100%;\n }\n\n .Footer {\n container-type: inline-size;\n flex-direction: row;\n\n @container (max-width: 239px) {\n flex-direction: column;\n\n .OutOfStock {\n margin-bottom: 0.25rem;\n }\n\n }\n }\n\n jump-badge {\n position: absolute;\n top: 1rem;\n left: 1rem;\n z-index: 2;\n }\n\n .Media {\n container-type: inline-size;\n\n @container (max-width: 239px) {\n jump-badge {\n top: auto;\n bottom: 1rem;\n left: 0.2rem;\n right: auto;\n }\n }\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 position: absolute;\n top: 0;\n left: 0;\n overflow: hidden;\n object-fit: var(--image-object-fit, cover);\n }\n\n &__Front {\n z-index: 1;\n transition: opacity 0.5s linear;\n cursor: pointer;\n }\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-ecommerce-showcase-padding) var(--jump-card-ecommerce-showcase-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 .Content {\n container-type: inline-size;\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n\n @container (max-width: 239px) {\n flex-direction: row;\n }\n\n &.hasBackground {\n background-color: var(--neutral-white);\n padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2);\n }\n\n &.iconOnly {\n padding: calc(var(--jump-card-ecommerce-showcase-padding) * 2) var(--jump-card-ecommerce-showcase-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-ecommerce-showcase-padding) 0;\n container-type: inline-size;\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 .Body__Top {\n display: flex;\n flex-direction: row;\n }\n\n .Body__Bottom {\n display: flex;\n flex-direction: row;\n }\n \n &.is-vertical {\n .Body__Top {\n flex-direction: column;\n align-items: flex-start;\n \n .Subtitle {\n min-height: 3.5rem;\n }\n\n @container (max-width: 239px) {\n .Subtitle {\n min-height: 4.5rem;\n }\n }\n }\n\n .Price {\n justify-items: start;\n margin-top: 0.5rem;\n column-gap: 0;\n display: flex;\n flex-direction: column-reverse;\n align-items: flex-start;\n }\n\n }\n\n @container (max-width: 239px) {\n .Body__Top {\n flex-direction: column;\n }\n\n .Body__Bottom {\n flex-direction: column;\n }\n\n .SelectVariations {\n max-width: 100%;\n margin-bottom: 0.5rem;\n\n select {\n width: 100%;\n }\n }\n\n .Price {\n display: flex;\n flex-direction: column-reverse;\n margin-top: 0.5rem;\n align-items: start;\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 .Subtitle:hover {\n cursor: pointer;\n }\n\n .OutOfStock, .AvailableStock {\n justify-items: start;\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n margin-top: 0.5rem;\n }\n\n .OutOfStock {\n color: var(--jump-card-ecommerce-showcase-out-of-stock-color);\n }\n\n .AvailableStock {\n color: var(--jump-card-ecommerce-showcase-available-color);\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 margin-top: 0;\n \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(--jump-card-ecommerce-showcase-discount-color);\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}","import { Component, Host, h, Prop, Event, EventEmitter, Element, State, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-card-ecommerce-showcase',\n styleUrl: 'jump-card-ecommerce-showcase.scss',\n shadow: true,\n})\nexport class JumpCardEcommerceShowcase {\n\n @Element() JumpCardEcommerceShowcase: HTMLElement;\n jumpQuantityEl;\n\n /* ---------------------- @PROPERTIES ------------------------- /\n\n /* Indicates the threshold below which the discount will be hidden /\n @Prop() hideDiscountIfLessThreshold: number = undefined;\n\n /* Indicates the badge of the card/\n @Prop() badge: string;\n\n /* Indicates the link of the card/\n @Prop() link: string;\n\n /* Indicates the image's src of the card/\n @Prop() img: string;\n\n /* Indicates the img's alt of the card/\n @Prop() imgAlt: string;\n\n /* Indicates the 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() 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 @Prop() availableText: string;\n \n /* Controlla il comportamento dell'object-fit delle immagini /\n @Prop() imageObjectFit: 'cover' \| 'scale-down' \| 'contain' \| 'fill' \| 'none' = 'cover';\n\n \n\n\n / ---------------------- @STATE ------------------------- /\n\n @State() priceFormatted: string;\n\n @State() salePriceFormatted: string;\n\n / ---------------------- @EVENTS ------------------------- /\n\n @Event({ eventName: 'jump-card-go-to-product-page' }) goToProductPage: EventEmitter;\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 / ---------------------- @LIFECYCLE ------------------------- /\n\n componentDidLoad() {\n this.formatPrices();\n }\n\n / ---------------------- @METHODS ------------------------- /\n\n goToProduct(){\n this.goToProductPage.emit({\n productId: this.productId,\n link: this.link,\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 = 'hasBackground';\n const iconOnlyClass = '';\n\n const hasImageOnHover = '';\n const miniCard = '';\n const verticalCardClass = 'is-vertical';\n const enableZoomClass = '';\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 style={{'--image-object-fit': this.imageObjectFit}}>\n\n <div\n class={`Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`}\n >\n {this.badge ?\n <jump-badge class={`${backgroundClass} ${iconOnlyClass}`} variant={this.badgeColor} dimension=\"small\"\n label={this.badge}></jump-badge> : ''}\n \n {this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined \|\| parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?\n <div class=\"DiscountBadge\">-{calculateDiscount(this.price, this.salePrice)}%</div> : null}\n\n <a href={this.link}>\n <figure class={`Images ${hasImageOnHover} ${enableZoomClass}`}>\n {this.img && <img class=\"Images__Front\" src={this.img} alt={this.imgAlt}></img> }\n \n </figure>\n </a>\n </div>\n\n <div class={`Content ${backgroundClass} ${iconOnlyClass} ${miniCard} ${verticalCardClass}`}>\n <div class={`Body ${backgroundClass} ${iconOnlyClass} ${miniCard} ${verticalCardClass}`}>\n <div class=\"Body__Top\">\n <div class=\"Info\">\n <a href={this.link} class=\"Product\">{this.productName}</a>\n {this.subtitle ? <div class=\"Subtitle\" onClick={() => this.goToProduct()}>{this.subtitle}</div> : null}\n </div>\n\n {this.price ?\n <div class={`Price ${miniCard}`}>\n <div class={`Price__Regular ${this.salePrice && this.salePrice < this.price ? 'sale' : ''}`}>\n {this.currency}{this.priceFormatted}\n </div>\n \n {this.salePrice && this.salePrice < this.price ?\n <div class=\"Price__Sale\">{this.currency}{this.salePriceFormatted}</div>\n : null}\n </div>\n : null}\n \n {this.outOfStock ?\n <div class=\"OutOfStock\">{this.outOfStockText ? this.outOfStockText : 'Esaurito'}</div> : <div class=\"AvailableStock\">{this.availableText ? this.availableText : 'Disponibile'}</div>}\n\n </div>\n </div>\n\n \n </div>\n </Host>\n );\n }\n\n}"],"version":3}

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

@@ -51,6 +51,7 @@ const JumpCardEcommerce = class {
         this.currency = '€';
         this.addToCartColor = 'secondary';
         this.badgeColor = 'secondary';
+        this.badgeCustomColor = '#000000';
         this.outOfStock = false;
         this.outOfStockText = undefined;
         this.addToCartText = 'Aggiungi al carrello';
@@ -313,7 +314,7 @@ const JumpCardEcommerce = class {
             h("jump-button", { onClick: () => this.onToggleFavorite(), class: `Favorite ${backgroundClass} ${iconOnlyClass}`, variant: this.favorite ? 'primary' : 'neutral', size: "small", text: true, onlyIcon: true }, h("jump-icon", { slot: "prefix", name: "heart", category: this.favorite ? 'solid' : 'light', size: "medium" }))
             :
                 this.hasSlotForFavorite ? h("div", { class: "Favorite" }, h("slot", { name: "favorite" })) : null, h("div", { class: `Media ${iconOnlyClass} ${backgroundClass} ${miniCard}`, onMouseMove: this.handleMouseMove, onMouseLeave: this.handleMouseLeave }, !this.isMini && this.badge ?
-            h("jump-badge", { class: `${backgroundClass} ${iconOnlyClass}`, variant: this.badgeColor, dimension: "small", label: this.badge }) : '', this.showDiscountBadge && !this.isMini && this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined || parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?
+            h("jump-badge", { class: `${backgroundClass} ${iconOnlyClass}`, variant: this.badgeColor, customColor: this.badgeColor === 'custom' ? this.badgeCustomColor : undefined, dimension: "small", label: this.badge }) : '', this.showDiscountBadge && !this.isMini && this.salePrice && (this.salePrice < this.price) && (this.hideDiscountIfLessThreshold === undefined || parseFloat(calculateDiscount(this.price, this.salePrice)) > this.hideDiscountIfLessThreshold) ?
             h("div", { class: "DiscountBadge" }, "-", calculateDiscount(this.price, this.salePrice), "%")
             : null, h("a", { href: this.link }, h("figure", { class: `Images ${hasImageOnHover} ${enableZoomClass}` }, this.img && !this.videoSrc ? h("img", { class: "Images__Front", src: this.img, alt: this.imgAlt, ref: el => this.imageEl = el }) : '', this.hoverImg && !this.videoSrc ?
             h("img", { class: "Images__OnHover", src: this.hoverImg, alt: this.hoverImgAlt }) : ''), this.videoSrc && !this.img ?