npm - @jumpgroup/jump-design-system - Versions diffs - 0.3.0 → 0.3.2 - Mend

@jumpgroup/jump-design-system 0.3.0 → 0.3.2

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

package/dist/cjs/jump-tab-item.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"jump-tab-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG~~,+gFAA+gF~~,CAAC;~~AACviF~~,0BAAe,cAAc;;MCMhB,WAAW;;;;0BAOO,SAAS;wBAKX,SAAS;4BAML,MAAM;qBACb,EAAE;sBACA,KAAK;wBAEH,KAAK;uBAMN,QAAQ;;IAInC,SAAS,CAAC,UAAU;QAClB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,UAAU,EAAC,CAAC,CAAC;KAC7C;IAED,gBAAgB;QACd,OAAO,CAAC,GAAG,CAAC,6BAA6B,CAAC,CAAC;;QAE3C,IAAI,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;QACtE,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC;KAC7B;IAkED,MAAM;QACJ,QACEA,QAACC,UAAI,qDACH,GAAG,EAAE,CAAC,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA,EAAE,EACjC,KAAK,EAAE,cAAc,IAAI,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,EAAE,CAAC,GAAG,GAAG,IAAG,IAAI,CAAC,OAAO,CAAC,IAC1ED,kEAAK,KAAK,EAAE,~~uBAAuB~~,IAAI,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,EAAE,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,UAAU,~~IACvP~~,CAAC,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,OAAO,IAAI,QAAQ,IAAI,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC;YACtEA,wEAAW,~~KAAK~~,EAAC,~~OAAO~~,EAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,~~GAAc~~,~~EAE5DA~~,mEAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CACnC,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/jump-tab-item/jump-tab-item.scss?tag=jump-tab-item","src/components/jump-tab-item/jump-tab-item.tsx"],"sourcesContent":[":host {\n display: block;\n}\n~~\n.JumpTabItem {\n~~ --jump-tabitem-active-color: var(--secondary-standard);\n --jump-tabitem-color: var(--neutral-grey-secondary);\n --jump-tabitem-hover-color: var(--neutral-grey-disabled, #CBCBCB);\n --jump-tabitem-boxed-bg-color: var(--secondary-soft, #EDF2FA);\n --jump-tabitem-rounded-bg-color: white;\n\n font-family: var(--ff-primary);\n\n ~~&.inline {~~\n ~~border-bottom: 1px solid var(--jump-tabitem-hover-color);\n~~\n ~~&:hover:not(~~.~~disabled):not(.active)~~ {\n ~~border-bottom: 3px solid var(--jump-tabitem-hover-color);\n cursor: pointer;\n~~ }\n~~\n &.active {\n border-bottom: 3px solid var(--jump-tabitem-active-color);\n }\n\n }\n\n\n &__Content {\n\n~~ display: flex;\n\n label {\n font-size: 16px;\n }\n\n &.left {\n flex-direction: row;\n gap: 6px;\n align-items: center;\n }\n\n &.top {\n flex-direction: column;\n gap: 2px;\n align-items: center;\n }\n\n /Tipologia inline /\n &.inline {\n color: var(--jump-tabitem-color);\n padding: 12px 24px;\n }\n\n &.inline.active {\n color: var(--jump-tabitem-active-color);\n \n \n span {\n font-weight: bold;\n }\n }\n\n /* Tipologia boxed /\n &.boxed {\n color: var(--jump-tabitem-color);\n padding: 15px 39px;\n background-color: transparent;\n border: 1px solid var(--jump-tabitem-boxed-bg-color);\n }\n\n &.boxed:hover:not(.disabled), &.boxed:hover:not(.active) {\n background-color: transparent;\n\n span {\n font-weight: bold;\n }\n }\n\n \n\n &.boxed.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-boxed-bg-color);\n border: 1px solid var(--jump-tabitem-boxed-bg-color);\n\n span {\n font-weight: bold;\n }\n }\n\n / Tipologia rounded /\n &.rounded {\n padding: 12px 32px;\n color: var(--jump-tabitem-color);\n \n }\n\n &.rounded:hover:not(.disabled){\n cursor: pointer;\n\n span {\n font-weight: bold;\n }\n }\n\n &.rounded.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-rounded-bg-color);\n border: 1px solid var(--jump-tabitem-active-color);\n border-radius: 50px;\n\n }\n\n /* Tipologia sheet /\n &.sheet {\n padding: 12px 32px;\n color: var(--neutral-grey-secondary);\n // border: 1px solid transparent;\n \n }\n\n &.sheet:hover:not(.disabled){\n cursor: pointer;\n\n span {\n font-weight: bold;\n }\n }\n\n &.sheet.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-rounded-bg-color);\n //border: 1px solid var(--jump-tabitem-rounded-bg-color);\n border-radius: 8px 8px 0px 0px;\n }\n\n / Disabilitato /\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n }\n\n }\n}","import { Component, Host, Prop,State, h, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab-item',\n styleUrl: 'jump-tab-item.scss',\n shadow: ~~false~~,\n})\nexport class JumpTabItem {\n\n / ---------------------- @PROPERTIES ------------------------- /\n\n /\n Identifier of the tab\n /\n @Prop() identifier: string = undefined;\n\n /\n Name of the icon. If not provided, the icon will not be displayed\n /\n @Prop() iconName: string = undefined;\n\n /\n Icon position, apply only if the icon is present\n * Choosed from \"left\", \"top\"\n /\n @Prop() iconPosition: string = 'left';\n @Prop() label: string = '';\n @Prop() active: boolean = false;\n\n @Prop() disabled: boolean = false;\n\n /\n The style of the tab item\n * Choosed from \"inline\", \"boxed\", \"sheet\", \"rounded\"\n */\n @State() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-active-tab' }) changeActiveTab: EventEmitter;\n\n changeTab(identifier){\n this.changeActiveTab.emit({id: identifier});\n }\n\n componentDidLoad() {\n console.log('Component has been rendered');\n // Deve leggere la prop \"variant\" del componente babbo jump-tab e popolare la propria prop \"variant\"\n let parentVariant = this.tabEl.parentElement.getAttribute('variant');\n this.variant = parentVariant;\n }\n\n // componentDidLoad() {\n // console.log('Component has been rendered');\n \n // // console.log('THIS', this);\n // if(this.active){\n // let tab = this.tabEl.previousElementSibling as any;\n // if(tab){\n // tab.style.borderRight = 'none';\n // }\n // }\n // }\n\n // @Watch('active')\n // watchActive(newValue) {\n // console.log('watch active');\n // // Devo ripristinare i bordi di tutti i fratelli di this.tabEl\n // let siblings = this.tabEl.parentElement.children as any;\n // for (let i = 0; i < siblings.length; i++) {\n // siblings[i].style.borderRight = '1px solid red';\n // }\n\n // console.log('thisel', this.tabEl);\n // console.log('newvalue', newValue);\n // console.log('xxxxxx', this.tabEl.classList);\n\n // // Se this.tabEl ha la classe 'active' allora rimuovo il bordo destro\n // if (newValue && this.tabEl.classList.contains('active')) {\n // console.log('contiene ');\n // this.tabEl.style.borderRight = 'none';\n\n // // Rimuovere il bordo destro dal fratello precedente, se esiste\n // let prevEl = this.tabEl.previousElementSibling as any;\n // console.log('revEl', prevEl);\n // if (prevEl) {\n // prevEl.style.borderRight = 'none';\n // }\n // }\n // }\n\n // @Watch('active')\n // watchActive(newValue) {\n // // Ripristina i bordi di tutti gli elementi\n // const items = document.querySelectorAll('.JumpTabItem') as any;\n // console.log('ITEMS', items);\n // items.forEach(item => {\n // item.style.borderRight = '1px solid red';\n // });\n\n // // Verifica se this.tabEl ha la classe 'active'\n // if (newValue && this.tabEl.classList.contains('active')) {\n // // Rimuovere il bordo destro dal nuovo elemento attivo\n // this.tabEl.style.borderRight = 'none';\n\n // // Rimuovere il bordo destro dal fratello precedente, se esiste\n // let prevEl = this.tabEl.previousElementSibling as any;\n // if (prevEl) {\n // prevEl.style.borderRight = 'none';\n // }\n // }\n // }\n\n\n tabEl: HTMLElement;\n\n render() {\n return (\n <Host\n ref={(el) => { this.tabEl = el }}\n class={\"JumpTabItem \" + (this.active ? 'active' : '') + \" \" +(this.variant)}>\n <div class={\"~~JumpTabItem__Content~~ \" + (this.iconName ? this.iconPosition : '') + \" \" + (this.variant) + \" \" + (this.active ? 'active' : '') + \" \" + (this.disabled ? 'disabled' : '')} onClick={() => this.changeTab(this.identifier)} id={this.identifier}>\n {(this.iconName && (this.variant == 'inline' \|\| this.variant == 'boxed')) &&\n <jump-icon ~~class~~=\"~~small~~\" name={this.iconName}></jump-icon>\n }\n <span class=\"label\">{this.label}</span>\n </div>\n </Host>\n );\n }\n}\n\n"],"version":3}
1	+ {"file":"jump-tab-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,k1EAAk1E,CAAC;AAC12E,0BAAe,cAAc;;MCMhB,WAAW;;;;0BAOO,SAAS;wBAKX,SAAS;4BAML,MAAM;qBACb,EAAE;sBACA,KAAK;wBAEH,KAAK;uBAMN,QAAQ;;IAInC,SAAS,CAAC,UAAU;QAClB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAC,EAAE,EAAE,UAAU,EAAC,CAAC,CAAC;KAC7C;IAED,gBAAgB;QACd,OAAO,CAAC,GAAG,CAAC,6BAA6B,CAAC,CAAC;;QAE3C,IAAI,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;QACtE,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC;KAC7B;IAkED,MAAM;QACJ,QACEA,QAACC,UAAI,qDACH,GAAG,EAAE,CAAC,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA,EAAE,EACjC,KAAK,EAAE,cAAc,IAAI,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,EAAE,CAAC,GAAG,GAAG,IAAG,IAAI,CAAC,OAAO,CAAC,IAC1ED,kEAAK,KAAK,EAAE,UAAU,IAAI,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,EAAE,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,UAAU,IAC1O,CAAC,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,OAAO,IAAI,QAAQ,IAAI,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC;YACtEA,wEAAW,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,OAAO,GAAa,EAE3FA,mEAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CACnC,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/jump-tab-item/jump-tab-item.scss?tag=jump-tab-item&encapsulation=shadow","src/components/jump-tab-item/jump-tab-item.tsx"],"sourcesContent":[":host {\n display: block;\n\n --jump-tabitem-active-color: var(--secondary-standard);\n --jump-tabitem-color: var(--neutral-grey-secondary);\n --jump-tabitem-hover-color: var(--neutral-grey-disabled, #CBCBCB);\n --jump-tabitem-boxed-bg-color: var(--secondary-soft, #EDF2FA);\n --jump-tabitem-rounded-bg-color: white;\n \n font-family: var(--ff-primary);\n \n \n .Content {\n \n display: flex;\n \n label {\n font-size: 16px;\n }\n \n &.left {\n flex-direction: row;\n gap: 6px;\n align-items: center;\n }\n \n &.top {\n flex-direction: column;\n gap: 2px;\n align-items: center;\n }\n \n /Tipologia inline /\n &.inline {\n color: var(--jump-tabitem-color);\n padding: 12px 24px;\n }\n \n &.inline.active {\n color: var(--jump-tabitem-active-color);\n \n \n span {\n font-weight: bold;\n }\n }\n \n /* Tipologia boxed /\n &.boxed {\n color: var(--jump-tabitem-color);\n padding: 15px 39px;\n background-color: transparent;\n border: 1px solid var(--jump-tabitem-boxed-bg-color);\n }\n \n &.boxed:hover:not(.disabled),\n &.boxed:hover:not(.active) {\n background-color: transparent;\n \n span {\n font-weight: bold;\n }\n }\n \n \n \n &.boxed.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-boxed-bg-color);\n border: 1px solid var(--jump-tabitem-boxed-bg-color);\n \n span {\n font-weight: bold;\n }\n }\n \n / Tipologia rounded /\n &.rounded {\n padding: 12px 32px;\n color: var(--jump-tabitem-color);\n \n }\n \n &.rounded:hover:not(.disabled) {\n cursor: pointer;\n \n span {\n font-weight: bold;\n }\n }\n \n &.rounded.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-rounded-bg-color);\n border: 1px solid var(--jump-tabitem-active-color);\n border-radius: 50px;\n \n }\n \n /* Tipologia sheet /\n &.sheet {\n padding: 12px 32px;\n color: var(--neutral-grey-secondary);\n // border: 1px solid transparent;\n \n }\n \n &.sheet:hover:not(.disabled) {\n cursor: pointer;\n \n span {\n font-weight: bold;\n }\n }\n \n &.sheet.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-rounded-bg-color);\n //border: 1px solid var(--jump-tabitem-rounded-bg-color);\n border-radius: 8px 8px 0px 0px;\n }\n \n / Disabilitato /\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n }\n \n }\n}\n\n:host(.inline){\n border-bottom: 1px solid var(--jump-tabitem-hover-color);\n}\n\n:host(.inline):hover:not(.disabled):not(.active) {\n border-bottom: 3px solid var(--jump-tabitem-hover-color);\n cursor: pointer;\n}\n\n:host(.inline.active) {\n border-bottom: 3px solid var(--jump-tabitem-active-color);\n}","import { Component, Host, Prop,State, h, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab-item',\n styleUrl: 'jump-tab-item.scss',\n shadow: true,\n})\nexport class JumpTabItem {\n\n / ---------------------- @PROPERTIES ------------------------- /\n\n /\n Identifier of the tab\n /\n @Prop() identifier: string = undefined;\n\n /\n Name of the icon. If not provided, the icon will not be displayed\n /\n @Prop() iconName: string = undefined;\n\n /\n Icon position, apply only if the icon is present\n * Choosed from \"left\", \"top\"\n /\n @Prop() iconPosition: string = 'left';\n @Prop() label: string = '';\n @Prop() active: boolean = false;\n\n @Prop() disabled: boolean = false;\n\n /\n The style of the tab item\n * Choosed from \"inline\", \"boxed\", \"sheet\", \"rounded\"\n */\n @State() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-active-tab' }) changeActiveTab: EventEmitter;\n\n changeTab(identifier){\n this.changeActiveTab.emit({id: identifier});\n }\n\n componentDidLoad() {\n console.log('Component has been rendered');\n // Deve leggere la prop \"variant\" del componente babbo jump-tab e popolare la propria prop \"variant\"\n let parentVariant = this.tabEl.parentElement.getAttribute('variant');\n this.variant = parentVariant;\n }\n\n // componentDidLoad() {\n // console.log('Component has been rendered');\n \n // // console.log('THIS', this);\n // if(this.active){\n // let tab = this.tabEl.previousElementSibling as any;\n // if(tab){\n // tab.style.borderRight = 'none';\n // }\n // }\n // }\n\n // @Watch('active')\n // watchActive(newValue) {\n // console.log('watch active');\n // // Devo ripristinare i bordi di tutti i fratelli di this.tabEl\n // let siblings = this.tabEl.parentElement.children as any;\n // for (let i = 0; i < siblings.length; i++) {\n // siblings[i].style.borderRight = '1px solid red';\n // }\n\n // console.log('thisel', this.tabEl);\n // console.log('newvalue', newValue);\n // console.log('xxxxxx', this.tabEl.classList);\n\n // // Se this.tabEl ha la classe 'active' allora rimuovo il bordo destro\n // if (newValue && this.tabEl.classList.contains('active')) {\n // console.log('contiene ');\n // this.tabEl.style.borderRight = 'none';\n\n // // Rimuovere il bordo destro dal fratello precedente, se esiste\n // let prevEl = this.tabEl.previousElementSibling as any;\n // console.log('revEl', prevEl);\n // if (prevEl) {\n // prevEl.style.borderRight = 'none';\n // }\n // }\n // }\n\n // @Watch('active')\n // watchActive(newValue) {\n // // Ripristina i bordi di tutti gli elementi\n // const items = document.querySelectorAll('.JumpTabItem') as any;\n // console.log('ITEMS', items);\n // items.forEach(item => {\n // item.style.borderRight = '1px solid red';\n // });\n\n // // Verifica se this.tabEl ha la classe 'active'\n // if (newValue && this.tabEl.classList.contains('active')) {\n // // Rimuovere il bordo destro dal nuovo elemento attivo\n // this.tabEl.style.borderRight = 'none';\n\n // // Rimuovere il bordo destro dal fratello precedente, se esiste\n // let prevEl = this.tabEl.previousElementSibling as any;\n // if (prevEl) {\n // prevEl.style.borderRight = 'none';\n // }\n // }\n // }\n\n\n tabEl: HTMLElement;\n\n render() {\n return (\n <Host\n ref={(el) => { this.tabEl = el }}\n class={\"JumpTabItem \" + (this.active ? 'active' : '') + \" \" +(this.variant)}>\n <div class={\"Content \" + (this.iconName ? this.iconPosition : '') + \" \" + (this.variant) + \" \" + (this.active ? 'active' : '') + \" \" + (this.disabled ? 'disabled' : '')} onClick={() => this.changeTab(this.identifier)} id={this.identifier}>\n {(this.iconName && (this.variant == 'inline' \|\| this.variant == 'boxed')) &&\n <jump-icon library=\"fa\" category=\"regular\" name={this.iconName} size=\"small\"></jump-icon>\n }\n <span class=\"label\">{this.label}</span>\n </div>\n </Host>\n );\n }\n}\n\n"],"version":3}

package/dist/cjs/jump-tab-panel.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-418c607f.js');
+const index = require('./index-674508e2.js');
 const jumpTabPanelCss = ":host{display:block}.JumpTabPanel__Content{display:none;padding:1rem 0}.JumpTabPanel__Content.active{display:block}";
 const JumpTabPanelStyle0 = jumpTabPanelCss;
@@ -14,7 +14,7 @@ const JumpTabPanel = class {
         this.active = false;
     }
     render() {
-        return (index.h(index.Host, { key: '5a2a846c7470d079a668b9951d9463a312be4341', class: "JumpTabPanel", id: this.identifier }, index.h("div", { key: '0b04369ba6c7ed54566383516b8e736cad30b2c3', class: "JumpTabPanel__Content " + (this.active ? 'active' : '') }, index.h("slot", { key: '1381d2e4e39f2ddbac4b9532458419c5c03dc704' }))));
+        return (index.h(index.Host, { key: '90108df0339c76ec7ffef78722400cbd5e5b125d', class: "JumpTabPanel", id: this.identifier }, index.h("div", { key: '4e127ffdeb05efdd63dc538cb38976252ff5a060', class: "JumpTabPanel__Content " + (this.active ? 'active' : '') }, index.h("slot", { key: '5e54c0eaed6558e97226ffdc347e0ca8c0d9aa1b' }))));
     }
 };
 JumpTabPanel.style = JumpTabPanelStyle0;

package/dist/cjs/jump-tab.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-418c607f.js');
+const index = require('./index-674508e2.js');
-const jumpTabCss = ":host{display:block}.JumpTab{--jump-tab-bg-color:var(--gray-ultralight, #f8f8f8)}.JumpTab__Wrapper{display:flex;width:fit-content}.JumpTab__Wrapper.rounded{border-radius:50px;background-color:#f8f8f8}";
+const jumpTabCss = ":host{display:block;--jump-tab-bg-color:var(--gray-ultralight, #f8f8f8)}:host .Wrapper{display:flex;width:fit-content}:host .Wrapper.rounded{border-radius:50px;background-color:#f8f8f8}";
 const JumpTabStyle0 = jumpTabCss;
 const JumpTab = class {
@@ -82,7 +82,7 @@ const JumpTab = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '5adce348b75c58349a4ff443cf2f6b39b646722f', class: "JumpTab", id: this.tabGroupName, ref: (el) => { this.JumpTabEl = el; } }, index.h("div", { key: 'dcfe4b594261f40f91bff6fba243fcc2c9d19368', class: "JumpTab__Wrapper " + this.variant }, index.h("slot", { key: 'ce9cf25e3d5566a2e52469aafeeac6392862c348', name: "tab-item" })), index.h("div", { key: 'a396fbb89c2299c2cee8b9bd1828ad70faf3caee' }, index.h("slot", { key: '34f95fe28043b74be2cdba5e0253e50c9326bf01', name: "tab-content" }))));
+        return (index.h(index.Host, { key: '325ebf63677d7b1307ebb5be3d521d06efa22a5a', class: "JumpTab", id: this.tabGroupName, ref: (el) => { this.JumpTabEl = el; } }, index.h("div", { key: 'afa4eb17c8582aa59f8f3b55237de34fa04871d5', class: "Wrapper " + this.variant }, index.h("slot", { key: '69023d9ae6ae85ef8270d7c8ea4c881c60889f63', name: "tab-item" })), index.h("div", { key: '28257b0f8de4c3ef1b7dd7adb58dc2d0ce342164' }, index.h("slot", { key: '3097cf4876730499e2067aed722ff822582e173f', name: "tab-content" }))));
     }
 };
 JumpTab.style = JumpTabStyle0;

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

	@@ -1 +1 @@
1	- {"file":"jump-tab.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,UAAU,GAAG,~~0MAA0M~~,CAAC;~~AAC9N~~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~~IAKD~~,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,KAAK,EAAC,SAAS,EAAC,EAAE,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,CAAC,EAAE,OAAM,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,EAAC,IAC9ED,kEAAK,KAAK,EAAE,~~mBAAmB~~,GAAG,IAAI,CAAC,OAAO,~~IAC5CA~~,mEAAM,IAAI,EAAC,UAAU,GAAQ,CACzB,EACNA,oEACEA,mEAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/jump-tab/jump-tab.scss?tag=jump-tab&encapsulation=shadow","src/components/jump-tab/jump-tab.tsx"],"sourcesContent":[":host {\n display: block;\n}\n~~\n.JumpTab {\n~~ --jump-tab-bg-color: var(--gray-ultralight, #f8f8f8);\n\n ~~&__Wrapper~~ {\n display: flex;\n width: fit-content;\n\n &.rounded {\n border-radius: 50px;\n background-color: #f8f8f8; // dovrà andarci var(--jump-tab-bg-color)\n } \n }\n}","import { Component, Host, Event, EventEmitter, Prop, h, Listen } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab',\n styleUrl: 'jump-tab.scss',\n shadow: true,\n})\nexport class JumpTab {\n\n JumpTabEl: HTMLElement;\n /* ---------------------- @PROPERTIES ------------------------- /\n @Prop() tabGroupName: string = undefined;\n\n /\n The style of the tab. The same value must be passed to all the items.\n * Choosed from \"inline\", \"boxed\", \"sheet\", \"rounded\"\n */\n @Prop() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-activetab'}) setActiveTab: EventEmitter;\n\n @Listen('jump-change-active-tab')\n changeActiveTabHandler(event: CustomEvent) {\n this.setActiveTab.emit(event.detail);\n\n // Recupera il valore della variabile CSS\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item) => {\n if (item.getAttribute('identifier') === event.detail.id) {\n item.setAttribute('active', '');\n\n if (this.variant === 'sheet') {\n // Aggiungi il bordo ai fratelli dell'elemento attivo tranne l'ultimo\n items.forEach((sibling, index) => {\n if (sibling !== item && index !== items.length - 1) {\n sibling.style.borderRight = `1px solid ${primaryColor}`; // Usa i backticks\n } else {\n sibling.style.borderRight = '1px solid transparent';\n }\n });\n\n // Rimuovi il bordo dal fratello precedente\n let previousSibling = item.previousElementSibling as any;\n if (previousSibling) {\n previousSibling.style.borderRight = '1px solid transparent';\n }\n }\n\n } else {\n item.removeAttribute('active');\n }\n });\n }\n\n let panel = this.JumpTabEl.querySelectorAll('jump-tab-panel');\n if (panel.length > 0) {\n panel.forEach((panel) => {\n if (panel.getAttribute('identifier') === event.detail.id) {\n panel.setAttribute('active', '');\n } else {\n panel.removeAttribute('active');\n }\n });\n }\n }\n\n\n componentDidLoad() {\n console.log('Component has been rendered');\n if(this.variant === 'sheet') {\n // Recupera il valore della variabile CSS\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n // Seleziona tutti gli elementi jump-tab-item\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item, index) => {\n // Aggiungi bordo destro a tutti tranne:\n // - l'ultimo elemento\n // - l'elemento attivo (avente classe \"active\")\n if (index === items.length - 1 \|\| item.classList.contains('active')) {\n item.style.borderRight = '1px solid transparent';\n } else {\n item.style.borderRight = `1px solid ${primaryColor}`;\n }\n });\n }\n }\n\n }\n\n~~\n\n\n~~ render() {\n return (\n <Host class=\"JumpTab\" id={this.tabGroupName} ref={(el) => {this.JumpTabEl = el;}}> \n <div class={\"~~JumpTab__Wrapper~~ \" + this.variant}>\n <slot name=\"tab-item\"></slot>\n </div>\n <div>\n <slot name=\"tab-content\"></slot>\n </div>\n </Host>\n );\n }\n}"],"version":3}
1	+ {"file":"jump-tab.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/jump-tab/jump-tab.scss?tag=jump-tab&encapsulation=shadow","src/components/jump-tab/jump-tab.tsx"],"sourcesContent":[":host {\n display: block;\n\n --jump-tab-bg-color: var(--gray-ultralight, #f8f8f8);\n \n .Wrapper {\n display: flex;\n width: fit-content;\n \n &.rounded {\n border-radius: 50px;\n background-color: #f8f8f8; // dovrà andarci var(--jump-tab-bg-color)\n }\n }\n}","import { Component, Host, Event, EventEmitter, Prop, h, Listen } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab',\n styleUrl: 'jump-tab.scss',\n shadow: true,\n})\nexport class JumpTab {\n\n JumpTabEl: HTMLElement;\n /* ---------------------- @PROPERTIES ------------------------- /\n @Prop() tabGroupName: string = undefined;\n\n /\n The style of the tab. The same value must be passed to all the items.\n * Choosed from \"inline\", \"boxed\", \"sheet\", \"rounded\"\n */\n @Prop() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-activetab'}) setActiveTab: EventEmitter;\n\n @Listen('jump-change-active-tab')\n changeActiveTabHandler(event: CustomEvent) {\n this.setActiveTab.emit(event.detail);\n\n // Recupera il valore della variabile CSS\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item) => {\n if (item.getAttribute('identifier') === event.detail.id) {\n item.setAttribute('active', '');\n\n if (this.variant === 'sheet') {\n // Aggiungi il bordo ai fratelli dell'elemento attivo tranne l'ultimo\n items.forEach((sibling, index) => {\n if (sibling !== item && index !== items.length - 1) {\n sibling.style.borderRight = `1px solid ${primaryColor}`; // Usa i backticks\n } else {\n sibling.style.borderRight = '1px solid transparent';\n }\n });\n\n // Rimuovi il bordo dal fratello precedente\n let previousSibling = item.previousElementSibling as any;\n if (previousSibling) {\n previousSibling.style.borderRight = '1px solid transparent';\n }\n }\n\n } else {\n item.removeAttribute('active');\n }\n });\n }\n\n let panel = this.JumpTabEl.querySelectorAll('jump-tab-panel');\n if (panel.length > 0) {\n panel.forEach((panel) => {\n if (panel.getAttribute('identifier') === event.detail.id) {\n panel.setAttribute('active', '');\n } else {\n panel.removeAttribute('active');\n }\n });\n }\n }\n\n\n componentDidLoad() {\n console.log('Component has been rendered');\n if(this.variant === 'sheet') {\n // Recupera il valore della variabile CSS\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n // Seleziona tutti gli elementi jump-tab-item\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item, index) => {\n // Aggiungi bordo destro a tutti tranne:\n // - l'ultimo elemento\n // - l'elemento attivo (avente classe \"active\")\n if (index === items.length - 1 \|\| item.classList.contains('active')) {\n item.style.borderRight = '1px solid transparent';\n } else {\n item.style.borderRight = `1px solid ${primaryColor}`;\n }\n });\n }\n }\n\n }\n\n render() {\n return (\n <Host class=\"JumpTab\" id={this.tabGroupName} ref={(el) => {this.JumpTabEl = el;}}> \n <div class={\"Wrapper \" + this.variant}>\n <slot name=\"tab-item\"></slot>\n </div>\n <div>\n <slot name=\"tab-content\"></slot>\n </div>\n </Host>\n );\n }\n}"],"version":3}

package/dist/cjs/loader.cjs.js CHANGED Viewed

@@ -2,13 +2,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-418c607f.js');
+const index = require('./index-674508e2.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["jump-card-ecommerce.cjs",[[1,"jump-card-ecommerce",{"onlyIconButton":[4,"only-icon-button"],"hasBackground":[4,"has-background"],"badge":[1],"favorite":[1540],"link":[1],"img":[1],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"],"addedToCart":[4,"added-to-cart"],"notificationUrl":[1,"notification-url"],"notificationText":[1,"notification-text"],"productName":[1,"product-name"],"subtitle":[1],"productId":[1,"product-id"],"price":[2],"salePrice":[2,"sale-price"],"currency":[1],"outOfStock":[1540,"out-of-stock"],"outOfStockText":[1,"out-of-stock-text"],"addtoCartText":[1,"addto-cart-text"],"waitingListText":[1,"waiting-list-text"],"addToWaitingList":[4,"add-to-waiting-list"],"quantity":[1540],"changedQuantity":[4,"changed-quantity"],"changedVariation":[4,"changed-variation"]}]]],["jump-filter.cjs",[[1,"jump-filter",{"direction":[1],"filterHeading":[1,"filter-heading"],"filterButtonLabel":[1,"filter-button-label"],"filterButtonIcon":[1,"filter-button-icon"],"mobileThreshold":[2,"mobile-threshold"],"filters":[8],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]]]]],["jump-filtergroup.cjs",[[1,"jump-filtergroup",{"name":[1],"heading":[1],"otherLabel":[1,"other-label"],"lessLabel":[1,"less-label"],"maxElements":[2,"max-elements"],"variant":[1],"values":[32],"value":[32],"slotItems":[32],"inputs":[32],"showMore":[32],"getValues":[64],"getActiveAmount":[64],"getInputs":[64],"getName":[64]}]]],["jump-pagination.cjs",[[0,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[16],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"]},null,{"elPerPage":["elPerPageChanged"]}]]],["jump-tab-item.cjs",[[0,"jump-tab-item",{"identifier":[1],"iconName":[1,"icon-name"],"iconPosition":[1,"icon-position"],"label":[1],"active":[4],"disabled":[4],"variant":[32]}]]],["jump-accordion.cjs",[[1,"jump-accordion"]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-tab.cjs",[[1,"jump-tab",{"tabGroupName":[1,"tab-group-name"],"variant":[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["jump-tab-panel.cjs",[[1,"jump-tab-panel",{"identifier":[1],"active":[4]}]]],["jump-button.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}]]],["jump-badge_2.cjs",[[65,"jump-quantity",{"min":[2],"max":[2],"step":[2],"label":[1],"type":[1],"variant":[1],"showButtons":[4,"show-buttons"],"value":[32]},null,{"value":["onValueChange"]}],[1,"jump-badge",{"label":[1],"variant":[1]}]]],["jump-icon.cjs",[[1,"jump-icon",{"class":[1],"library":[1],"name":[1],"category":[1],"size":[1],"label":[1],"src":[1]}]]]], options);
+  return index.bootstrapLazy([["jump-button_2.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}],[1,"jump-icon",{"class":[1],"library":[1],"name":[1],"category":[1],"size":[1],"label":[1],"src":[1]}]]],["jump-card-ecommerce.cjs",[[1,"jump-card-ecommerce",{"onlyIconButton":[4,"only-icon-button"],"hasBackground":[4,"has-background"],"badge":[1],"favorite":[1540],"link":[1],"img":[1],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"],"addedToCart":[4,"added-to-cart"],"notificationUrl":[1,"notification-url"],"notificationText":[1,"notification-text"],"productName":[1,"product-name"],"subtitle":[1],"productId":[1,"product-id"],"price":[2],"salePrice":[2,"sale-price"],"currency":[1],"outOfStock":[1540,"out-of-stock"],"outOfStockText":[1,"out-of-stock-text"],"addtoCartText":[1,"addto-cart-text"],"waitingListText":[1,"waiting-list-text"],"addToWaitingList":[4,"add-to-waiting-list"],"changedVariation":[4,"changed-variation"]}]]],["jump-filter.cjs",[[1,"jump-filter",{"direction":[1],"filterHeading":[1,"filter-heading"],"filterButtonLabel":[1,"filter-button-label"],"filterButtonIcon":[1,"filter-button-icon"],"mobileThreshold":[2,"mobile-threshold"],"filters":[8],"activeFilters":[32],"showMobileFilters":[32],"isMobile":[32],"getFilters":[64]},[[0,"jump-filterchange","filterChangeHandler"],[9,"resize","handleResize"]]]]],["jump-filtergroup.cjs",[[1,"jump-filtergroup",{"name":[1],"heading":[1],"otherLabel":[1,"other-label"],"lessLabel":[1,"less-label"],"maxElements":[2,"max-elements"],"variant":[1],"values":[32],"value":[32],"slotItems":[32],"inputs":[32],"showMore":[32],"getValues":[64],"getActiveAmount":[64],"getInputs":[64],"getName":[64]}]]],["jump-pagination.cjs",[[1,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[16],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"]},null,{"elPerPage":["elPerPageChanged"]}]]],["jump-quantity.cjs",[[65,"jump-quantity",{"min":[2],"max":[2],"step":[2],"label":[1],"type":[1],"variant":[1],"showButtons":[4,"show-buttons"],"value":[8],"getValue":[64],"reset":[64]},null,{"value":["onValueChange"]}]]],["jump-tab-item.cjs",[[1,"jump-tab-item",{"identifier":[1],"iconName":[1,"icon-name"],"iconPosition":[1,"icon-position"],"label":[1],"active":[4],"disabled":[4],"variant":[32]}]]],["jump-accordion.cjs",[[1,"jump-accordion"]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-tab.cjs",[[1,"jump-tab",{"tabGroupName":[1,"tab-group-name"],"variant":[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["jump-tab-panel.cjs",[[1,"jump-tab-panel",{"identifier":[1],"active":[4]}]]],["jump-badge.cjs",[[1,"jump-badge",{"label":[1],"variant":[1],"dimension":[1],"soft":[4],"outline":[4]}]]]], options);
 };
 exports.setNonce = index.setNonce;

package/dist/collection/components/jump-badge/jump-badge.css CHANGED Viewed

@@ -1,20 +1,104 @@
 :host {
   --jump-badge-background: var(--primary-standard);
-  --jump-badge-color: #fff;
+  --jump-badge-color: var(--neutral-white);
   --jump-badge-border-radius: 50px;
-  display: inline-flex;
+  --jump-badge-border: var(--primary-standard);
+  --jump-badge-padding: 4px 12px;
+  display: flex;
+  width: fit-content;
+  gap: 0.5rem;
   color: var(--jump-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-300);
+  font-size: var(--fs-500);
   font-weight: var(--fw-900);
-  line-height: 1;
+  line-height: 1.2;
   border-radius: var(--jump-badge-border-radius);
-  border: solid 1px var(--jump-badge-border-radius);
+  border: solid 1px var(--jump-badge-border);
   white-space: nowrap;
-  padding: 0.35em 0.6em;
+  padding: var(--jump-badge-padding);
   user-select: none;
   cursor: inherit;
+}
+:host([variant=primary]):host([soft]) {
+  --jump-badge-background: var(--primary-soft);
+  --jump-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);
+  --jump-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);
+  --jump-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);
+  --jump-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);
+  --jump-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);
+  --jump-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;
 }

package/dist/collection/components/jump-badge/jump-badge.js CHANGED Viewed

@@ -3,9 +3,12 @@ export class AppBadge {
     constructor() {
         this.label = '';
         this.variant = 'primary';
+        this.dimension = 'large';
+        this.soft = false;
+        this.outline = false;
     }
     render() {
-        return (h(Host, { key: '00c947abf3e46b224b6f20421f3e8ee35fdd9401', "data-variant": this.variant }, this.label));
+        return (h(Host, { key: 'c820f0fd33cdbcf6d4269a8346085f1efdf87aab' }, h("slot", { key: '704280d65559cbcb283aeead333ddb27636f905b', name: "prefix" }), this.label));
     }
     static get is() { return "jump-badge"; }
     static get encapsulation() { return "shadow"; }
@@ -43,8 +46,8 @@ export class AppBadge {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "'primary'|'secondary'",
-                    "resolved": "\"primary\" | \"secondary\"",
+                    "original": "'primary'|'secondary'|'neutral'|'warning'|'success'|'danger'",
+                    "resolved": "\"danger\" | \"neutral\" | \"primary\" | \"secondary\" | \"success\" | \"warning\"",
                     "references": {}
                 },
                 "required": false,
@@ -56,6 +59,60 @@ export class AppBadge {
                 "attribute": "variant",
                 "reflect": false,
                 "defaultValue": "'primary'"
+            },
+            "dimension": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'large'|'small'|'dot'|'microdot'",
+                    "resolved": "\"dot\" | \"large\" | \"microdot\" | \"small\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicates the variant of the badge"
+                },
+                "attribute": "dimension",
+                "reflect": false,
+                "defaultValue": "'large'"
+            },
+            "soft": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicates the variant of the badge"
+                },
+                "attribute": "soft",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "outline": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicates the variant of the badge"
+                },
+                "attribute": "outline",
+                "reflect": false,
+                "defaultValue": "false"
             }
         };
     }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"jump-badge.js","sourceRoot":"","sources":["../../../src/components/jump-badge/jump-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,QAAQ;;qBAIK,EAAE;~~uBAKe~~,SAAS;;~~IAElD~~,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,~~qEAAe~~,IAAI,~~CAAC~~,~~OAAO~~,~~IAC7B~~,IAAI,CAAC,KAAK,CACN,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CAEF","sourcesContent":["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() variant: 'primary'\|'secondary' = 'primary';\n\n render() {\n return (\n <Host ~~data-variant={this.variant}~~>\n {this.label}\n </Host>\n );\n }\n\n}\n"]}
1	+ {"version":3,"file":"jump-badge.js","sourceRoot":"","sources":["../../../src/components/jump-badge/jump-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,QAAQ;;qBAIK,EAAE;uBAKsD,SAAS;yBAKnC,OAAO;oBAKrC,KAAK;uBAKF,KAAK;;IAEhC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,6DAAM,IAAI,EAAC,QAAQ,GAAQ;YAC1B,IAAI,CAAC,KAAK,CACN,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["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() variant: 'primary'\|'secondary'\|'neutral'\|'warning'\|'success'\|'danger' = 'primary';\n\n /\n Indicates the variant of the badge\n /\n @Prop() dimension: 'large'\|'small'\|'dot'\|'microdot' = 'large';\n\n /\n Indicates the variant of the badge\n /\n @Prop() soft: boolean = false;\n\n /\n Indicates the variant of the badge\n */\n @Prop() 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"]}

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

@@ -15,6 +15,31 @@ export default {
             options: [
                 'primary',
                 'secondary',
+                'neutral',
+                'warning',
+                'success',
+                'danger',
+            ],
+        },
+        outline: {
+            name: 'outline',
+            description: 'scegliere se il badge deve essere pieno o solo il contorno',
+            control: 'boolean',
+        },
+        soft: {
+            name: 'soft',
+            description: 'scegliere se il badge deve avere i bordi arrotondati',
+            control: 'boolean',
+        },
+        dimension: {
+            name: 'dimension',
+            description: 'scegliere la dimensione del badge',
+            control: 'select',
+            options: [
+                'large',
+                'small',
+                'dot',
+                'microdot',
             ],
         },
     }
@@ -23,14 +48,64 @@ const Template = (args) => {
     const attributes = generateAttributesFromArgs(args);
     return `<jump-badge ${attributes}>${args.label}</jump-badge>`;
 };
+const TemplateIcon = (args) => {
+    const attributes = generateAttributesFromArgs(args);
+    return `<jump-badge ${attributes}><jump-icon slot="prefix" name="circle-exclamation" category="regular"></jump-icon> ${args.label}</jump-badge>`;
+};
 export const Badge = Template.bind({});
 Badge.args = {
     label: 'badge',
-    variant: 'primary'
+    variant: 'primary',
+    outline: false,
+    soft: false,
+    dimension: 'large'
 };
-export const BadgeSecondary = Template.bind({});
-BadgeSecondary.args = {
+export const IconBadge = TemplateIcon.bind({});
+IconBadge.args = {
     label: 'badge',
-    variant: 'secondary'
+    variant: 'secondary',
+    outline: false,
+    soft: false,
+    dimension: 'large'
+};
+export const Outline = Template.bind({});
+Outline.args = {
+    label: 'badge',
+    variant: 'secondary',
+    outline: true,
+    soft: false,
+    dimension: 'large'
+};
+export const Soft = Template.bind({});
+Soft.args = {
+    label: 'badge',
+    variant: 'neutral',
+    outline: false,
+    soft: true,
+    dimension: 'large'
+};
+export const Small = Template.bind({});
+Small.args = {
+    label: 'badge',
+    variant: 'warning',
+    outline: false,
+    soft: true,
+    dimension: 'small'
+};
+export const Dot = Template.bind({});
+Dot.args = {
+    label: '1',
+    variant: 'success',
+    outline: false,
+    soft: true,
+    dimension: 'dot'
+};
+export const MicroDot = Template.bind({});
+MicroDot.args = {
+    label: '',
+    variant: 'danger',
+    outline: false,
+    soft: false,
+    dimension: 'microdot'
 };
 //# sourceMappingURL=jump-badge.stories.js.map

package/dist/collection/components/jump-badge/jump-badge.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"jump-badge.stories.js","sourceRoot":"","sources":["../../../src/components/jump-badge/jump-badge.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAC,MAAM,mBAAmB,CAAC;AAE9D,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,IAAI,EAAE,OAAO;YACb,WAAW,EAAE,qDAAqD;YAClE,OAAO,EAAE,MAAM;SAChB;~~QAED~~,OAAO,EAAE;YACP,IAAI,EAAE,SAAS;YACf,WAAW,EAAE,gCAAgC;YAC7C,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE;gBACP,SAAS;gBACT,WAAW;~~aACZ~~;~~SAEF~~;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,eAAe,UAAU,IAAI,IAAI,CAAC,KAAK,eAAe,CAAA;AAC/D,CAAC,CAAA;~~AAGD~~,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG;IACX,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,~~cAAc~~,GAAG,~~QAAQ~~,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;~~AAChD~~,~~cAAc~~,CAAC,IAAI,GAAG;IACpB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,WAAW;~~CACrB~~,CAAC","sourcesContent":["import { generateAttributesFromArgs} from '../../utils/utils';\n\nexport default {\n title: 'Components/Badge/Badge',\n tags: ['autodocs'],\n argTypes: {\n label: {\n name: 'label',\n description: 'inserire la scritta che sarà visualizzata nel badge',\n control: 'text',\n },\n \n variant: {\n name: 'variant',\n description: 'scegliere il colore dell badge',\n control: 'select',\n options: [\n 'primary',\n 'secondary',\n ],\n\n },\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return `<jump-badge ${attributes}>${args.label}</jump-badge>`\n}\n\n\nexport const Badge = Template.bind({});\nBadge.args = {\n label: 'badge',\n variant: 'primary'\n};\n\nexport const ~~BadgeSecondary~~ = Template.bind({});\~~nBadgeSecondary~~.args = {\n label: 'badge',\n variant: 'secondary'\n};\n"]}
1	+ {"version":3,"file":"jump-badge.stories.js","sourceRoot":"","sources":["../../../src/components/jump-badge/jump-badge.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { generateAttributesFromArgs} from '../../utils/utils';\n\nexport default {\n title: 'Components/Badge/Badge',\n tags: ['autodocs'],\n argTypes: {\n label: {\n name: 'label',\n description: 'inserire la scritta che sarà visualizzata nel badge',\n control: 'text',\n },\n variant: {\n name: 'variant',\n description: 'scegliere il colore dell badge',\n control: 'select',\n options: [\n 'primary',\n 'secondary',\n 'neutral',\n 'warning',\n 'success',\n 'danger',\n ],\n },\n outline: {\n name: 'outline',\n description: 'scegliere se il badge deve essere pieno o solo il contorno',\n control: 'boolean',\n },\n soft: {\n name: 'soft',\n description: 'scegliere se il badge deve avere i bordi arrotondati',\n control: 'boolean',\n },\n dimension: {\n name: 'dimension',\n description: 'scegliere la dimensione del badge',\n control: 'select',\n options: [\n 'large',\n 'small',\n 'dot',\n 'microdot',\n ],\n },\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return `<jump-badge ${attributes}>${args.label}</jump-badge>`\n}\n\nconst TemplateIcon = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return `<jump-badge ${attributes}><jump-icon slot=\"prefix\" name=\"circle-exclamation\" category=\"regular\"></jump-icon> ${args.label}</jump-badge>`\n}\n\nexport const Badge = Template.bind({});\nBadge.args = {\n label: 'badge',\n variant: 'primary',\n outline: false,\n soft: false,\n dimension: 'large'\n};\n\nexport const IconBadge = TemplateIcon.bind({});\nIconBadge.args = {\n label: 'badge',\n variant: 'secondary',\n outline: false,\n soft: false,\n dimension: 'large'\n};\n\nexport const Outline = Template.bind({});\nOutline.args = {\n label: 'badge',\n variant: 'secondary',\n outline: true,\n soft: false,\n dimension: 'large'\n};\n\nexport const Soft = Template.bind({});\nSoft.args = {\n label: 'badge',\n variant: 'neutral',\n outline: false,\n soft: true,\n dimension: 'large'\n};\n\nexport const Small = Template.bind({});\nSmall.args = {\n label: 'badge',\n variant: 'warning',\n outline: false,\n soft: true,\n dimension: 'small'\n};\n\nexport const Dot = Template.bind({});\nDot.args = {\n label: '1',\n variant: 'success',\n outline: false,\n soft: true,\n dimension: 'dot'\n};\n\nexport const MicroDot = Template.bind({});\nMicroDot.args = {\n label: '',\n variant: 'danger',\n outline: false,\n soft: false,\n dimension: 'microdot'\n};\n"]}

package/dist/collection/components/jump-button/jump-button.js CHANGED Viewed

@@ -22,7 +22,7 @@ export class JumpButton {
         this.target = this.href ? this.target : '_self';
     }
     render() {
-        return (h(Host, { key: 'b7db771baa0578e8397424b28d1c3aa3b99f5900' }, this.href ? (h("a", { href: this.href, id: this.buttonId, class: this.class, "data-variant": this.variant, "data-outline": this.outline, "data-size": this.size, "data-full": this.full, "data-pill": this.pill, "data-text": this.text, "data-only-icon": this.onlyIcon, "aria-label": this.ariaLabel, target: this.target }, h("slot", { name: "prefix" }), !this.onlyIcon && h("slot", null), h("slot", { name: "suffix" }))) : (h("button", { id: this.buttonId, class: this.class, "data-variant": this.variant, "data-outline": this.outline, "data-size": this.size, "data-full": this.full, "data-pill": this.pill, "data-text": this.text, "data-only-icon": this.onlyIcon, disabled: this.disabled, "aria-label": this.ariaLabel, type: this.type, name: this.name, value: this.value }, h("slot", { name: "prefix" }), !this.onlyIcon && h("slot", null), h("slot", { name: "suffix" })))));
+        return (h(Host, { key: '654a8147c4251ebab7834f6ddb569e0a3ebe2b77' }, this.href ? (h("a", { href: this.href, id: this.buttonId, class: this.class, "data-variant": this.variant, "data-outline": this.outline, "data-size": this.size, "data-full": this.full, "data-pill": this.pill, "data-text": this.text, "data-only-icon": this.onlyIcon, "aria-label": this.ariaLabel, target: this.target }, h("slot", { name: "prefix" }), !this.onlyIcon && h("slot", null), h("slot", { name: "suffix" }))) : (h("button", { id: this.buttonId, class: this.class, "data-variant": this.variant, "data-outline": this.outline, "data-size": this.size, "data-full": this.full, "data-pill": this.pill, "data-text": this.text, "data-only-icon": this.onlyIcon, disabled: this.disabled, "aria-label": this.ariaLabel, type: this.type, name: this.name, value: this.value }, h("slot", { name: "prefix" }), !this.onlyIcon && h("slot", null), h("slot", { name: "suffix" })))));
     }
     static get is() { return "jump-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -14,8 +14,8 @@ export class AppCard {
         this.videoSrc = '';
     }
     render() {
-        return (h(Host, { key: 'a6d672e0dc05d8d596bf3eb4472339f2b6ad0e33', horizontal: this.horizontal, "border-radius": this.borderRadius, "rounded-media": this.roundedMedia, "top-border-content-radius": this.topBorderContentRadius, boxed: this.boxed, shadow: this.shadow, border: this.border }, this.imgSrc && !this.videoSrc ? h("img", { src: this.imgSrc, alt: this.imgAlt }) : '', this.videoSrc && !this.imgSrc ?
-            h("video", { autoplay: true }, h("source", { src: this.videoSrc, type: "video/mp4" }), h("source", { src: this.videoSrc, type: "video/mov" }), h("source", { src: this.videoSrc, type: "video/webm" })) : '', h("div", { key: 'cffc3af0b3c23d9738427113f03eb7f17eec99da', class: "Content" }, h("slot", { key: '69b0806f909ecea66e1b83d51ddd6d02003401ea', name: "body" }), h("slot", { key: '9830621fc1314e5f99f3e3f4b1626cb7feb29cb2', name: "footer" }))));
+        return (h(Host, { key: '7cb28f9f3ef1a64c859b7b4de719ca9dc58eea8d', horizontal: this.horizontal, "border-radius": this.borderRadius, "rounded-media": this.roundedMedia, "top-border-content-radius": this.topBorderContentRadius, boxed: this.boxed, shadow: this.shadow, border: this.border }, this.imgSrc && !this.videoSrc ? h("img", { src: this.imgSrc, alt: this.imgAlt }) : '', this.videoSrc && !this.imgSrc ?
+            h("video", { autoplay: true }, h("source", { src: this.videoSrc, type: "video/mp4" }), h("source", { src: this.videoSrc, type: "video/mov" }), h("source", { src: this.videoSrc, type: "video/webm" })) : '', h("div", { key: 'dabe68c686a49f1af7386182ad4b14181d7c7bcc', class: "Content" }, h("slot", { key: '18be998730900c91de0e93e410ae34abccff4bfc', name: "body" }), h("slot", { key: 'd9dfbf2a4cf014ceb761432cd435179689d5baa6', name: "footer" }))));
     }
     static get is() { return "jump-card"; }
     static get originalStyleUrls() {

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

@@ -176,4 +176,8 @@
   font-size: var(--fs-300);
   grid-column: 1;
   grid-row: 1;
+}
+:host(.Pippo) {
+  background-color: red;
 }