@jumpgroup/jump-design-system 0.3.37 → 0.3.39
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.
- package/dist/cjs/{index-86f59981.js → index-97b3526b.js} +23 -2
- package/dist/cjs/index-97b3526b.js.map +1 -0
- package/dist/cjs/jump-accordion-group.cjs.entry.js +1 -1
- package/dist/cjs/jump-accordion.cjs.entry.js +1 -1
- package/dist/cjs/jump-badge.cjs.entry.js +1 -1
- package/dist/cjs/jump-button_2.cjs.entry.js +1 -1
- package/dist/cjs/jump-card-ecommerce-option.cjs.entry.js +1 -1
- package/dist/cjs/jump-card-ecommerce.cjs.entry.js +1 -1
- package/dist/cjs/jump-card.cjs.entry.js +1 -1
- package/dist/cjs/jump-design-system.cjs.js +1 -1
- package/dist/cjs/jump-filter-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/jump-filter.cjs.entry.js +1 -1
- package/dist/cjs/jump-filtergroup.cjs.entry.js +1 -1
- package/dist/cjs/jump-navbar.cjs.entry.js +1 -1
- package/dist/cjs/jump-pagination-table.cjs.entry.js +1 -1
- package/dist/cjs/jump-pagination.cjs.entry.js +1 -1
- package/dist/cjs/jump-quantity.cjs.entry.js +1 -1
- package/dist/cjs/jump-search-bar.cjs.entry.js +1 -1
- package/dist/cjs/jump-tab-item.cjs.entry.js +4 -4
- package/dist/cjs/jump-tab-item.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/jump-tab.cjs.entry.js +14 -12
- package/dist/cjs/jump-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/jump-tab/jump-tab.css +21 -18
- package/dist/collection/components/jump-tab/jump-tab.js +14 -12
- package/dist/collection/components/jump-tab/jump-tab.js.map +1 -1
- package/dist/collection/components/jump-tab/jump-tab.stories.js +2 -1
- package/dist/collection/components/jump-tab/jump-tab.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item.css +3 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item.js +2 -2
- package/dist/collection/components/jump-tab-panel/jump-tab-panel.js +1 -1
- package/dist/components/jump-tab-item.js +3 -3
- package/dist/components/jump-tab-item.js.map +1 -1
- package/dist/components/jump-tab-panel.js +1 -1
- package/dist/components/jump-tab.js +13 -11
- package/dist/components/jump-tab.js.map +1 -1
- package/dist/esm/{index-a94d133e.js → index-14b73bd6.js} +23 -2
- package/dist/esm/index-14b73bd6.js.map +1 -0
- package/dist/esm/jump-accordion-group.entry.js +1 -1
- package/dist/esm/jump-accordion.entry.js +1 -1
- package/dist/esm/jump-badge.entry.js +1 -1
- package/dist/esm/jump-button_2.entry.js +1 -1
- package/dist/esm/jump-card-ecommerce-option.entry.js +1 -1
- package/dist/esm/jump-card-ecommerce.entry.js +1 -1
- package/dist/esm/jump-card.entry.js +1 -1
- package/dist/esm/jump-design-system.js +2 -2
- package/dist/esm/jump-filter-checkbox.entry.js +1 -1
- package/dist/esm/jump-filter.entry.js +1 -1
- package/dist/esm/jump-filtergroup.entry.js +1 -1
- package/dist/esm/jump-navbar.entry.js +1 -1
- package/dist/esm/jump-pagination-table.entry.js +1 -1
- package/dist/esm/jump-pagination.entry.js +1 -1
- package/dist/esm/jump-quantity.entry.js +1 -1
- package/dist/esm/jump-search-bar.entry.js +1 -1
- package/dist/esm/jump-tab-item.entry.js +4 -4
- package/dist/esm/jump-tab-item.entry.js.map +1 -1
- package/dist/esm/jump-tab-panel.entry.js +2 -2
- package/dist/esm/jump-tab.entry.js +14 -12
- package/dist/esm/jump-tab.entry.js.map +1 -1
- package/dist/esm/loader.js +2 -2
- package/dist/jump-design-system/jump-design-system.esm.js +1 -1
- package/dist/jump-design-system/{p-96e7d098.entry.js → p-15416bf7.entry.js} +2 -2
- package/dist/jump-design-system/p-1c5db8d3.js +3 -0
- package/dist/jump-design-system/p-1c5db8d3.js.map +1 -0
- package/dist/jump-design-system/{p-1a7387af.entry.js → p-24cac36a.entry.js} +2 -2
- package/dist/jump-design-system/{p-8e0e49fb.entry.js → p-4b284def.entry.js} +2 -2
- package/dist/jump-design-system/{p-81fdf870.entry.js → p-4cd128b5.entry.js} +2 -2
- package/dist/jump-design-system/{p-7e81b433.entry.js → p-53129684.entry.js} +2 -2
- package/dist/jump-design-system/{p-80d94f0f.entry.js → p-54230a70.entry.js} +2 -2
- package/dist/jump-design-system/{p-7ca6b546.entry.js → p-5d9817a2.entry.js} +2 -2
- package/dist/jump-design-system/{p-cf8832ed.entry.js → p-6def596d.entry.js} +2 -2
- package/dist/jump-design-system/p-7b43933f.entry.js +2 -0
- package/dist/jump-design-system/{p-6872b29d.entry.js → p-7b6c9e01.entry.js} +2 -2
- package/dist/jump-design-system/{p-b72b9130.entry.js → p-7e23b9de.entry.js} +2 -2
- package/dist/jump-design-system/{p-aedff4de.entry.js → p-8873623c.entry.js} +2 -2
- package/dist/jump-design-system/p-8893a85e.entry.js +2 -0
- package/dist/jump-design-system/p-8893a85e.entry.js.map +1 -0
- package/dist/jump-design-system/p-88f4a8ac.entry.js +2 -0
- package/dist/jump-design-system/p-88f4a8ac.entry.js.map +1 -0
- package/dist/jump-design-system/{p-dbff34ba.entry.js → p-ce3c1ff9.entry.js} +2 -2
- package/dist/jump-design-system/{p-34cd550e.entry.js → p-e0e82d36.entry.js} +2 -2
- package/dist/jump-design-system/{p-883548ea.entry.js → p-eb71b342.entry.js} +2 -2
- package/dist/jump-design-system/{p-5e08bb4a.entry.js → p-fbd2cbb8.entry.js} +2 -2
- package/dist/jump-design-system-elements.json +2 -2
- package/dist/types/components/jump-tab/jump-tab.d.ts +1 -7
- package/dist/types/components.d.ts +0 -12
- package/package.json +1 -1
- package/dist/cjs/index-86f59981.js.map +0 -1
- package/dist/esm/index-a94d133e.js.map +0 -1
- package/dist/jump-design-system/p-9defb660.entry.js +0 -2
- package/dist/jump-design-system/p-ad0de120.entry.js +0 -2
- package/dist/jump-design-system/p-ad0de120.entry.js.map +0 -1
- package/dist/jump-design-system/p-d1a8e815.entry.js +0 -2
- package/dist/jump-design-system/p-d1a8e815.entry.js.map +0 -1
- package/dist/jump-design-system/p-d4c681a4.js +0 -3
- package/dist/jump-design-system/p-d4c681a4.js.map +0 -1
- /package/dist/jump-design-system/{p-96e7d098.entry.js.map → p-15416bf7.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-1a7387af.entry.js.map → p-24cac36a.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-8e0e49fb.entry.js.map → p-4b284def.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-81fdf870.entry.js.map → p-4cd128b5.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-7e81b433.entry.js.map → p-53129684.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-80d94f0f.entry.js.map → p-54230a70.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-7ca6b546.entry.js.map → p-5d9817a2.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-cf8832ed.entry.js.map → p-6def596d.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-9defb660.entry.js.map → p-7b43933f.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-6872b29d.entry.js.map → p-7b6c9e01.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-b72b9130.entry.js.map → p-7e23b9de.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-aedff4de.entry.js.map → p-8873623c.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-dbff34ba.entry.js.map → p-ce3c1ff9.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-34cd550e.entry.js.map → p-e0e82d36.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-883548ea.entry.js.map → p-eb71b342.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-5e08bb4a.entry.js.map → p-fbd2cbb8.entry.js.map} +0 -0
|
@@ -5,6 +5,8 @@
|
|
|
5
5
|
--jump-tabitem-hover-color: var(--neutral-grey-disabled, #CBCBCB);
|
|
6
6
|
--jump-tabitem-boxed-bg-color: var(--secondary-soft, #EDF2FA);
|
|
7
7
|
--jump-tabitem-rounded-bg-color: white;
|
|
8
|
+
--jump-tabitem-border-inline-color: var(--neutral-grey-disabled, #CBCBCB)
|
|
9
|
+
|
|
8
10
|
font-family: var(--ff-primary);
|
|
9
11
|
}
|
|
10
12
|
:host .Content {
|
|
@@ -33,7 +35,7 @@
|
|
|
33
35
|
:host .Content.inline {
|
|
34
36
|
color: var(--jump-tabitem-color);
|
|
35
37
|
padding: 12px 24px;
|
|
36
|
-
border-bottom: 1px solid var(--jump-tabitem-
|
|
38
|
+
border-bottom: 1px solid var(--jump-tabitem-border-inline-color);
|
|
37
39
|
}
|
|
38
40
|
:host .Content.inline:not(.active) {
|
|
39
41
|
padding-bottom: 14px;
|
|
@@ -18,8 +18,8 @@ export class JumpTabItem {
|
|
|
18
18
|
this.variant = parentVariant;
|
|
19
19
|
}
|
|
20
20
|
render() {
|
|
21
|
-
return (h(Host, { key: '
|
|
22
|
-
h("jump-icon", { key: '
|
|
21
|
+
return (h(Host, { key: 'b897b4a721b51eb035b37a38500527bfeea724e3', ref: (el) => { this.tabEl = el; }, class: "JumpTabItem " + (this.active ? 'active' : '') + " " + (this.variant) + " " + (this.disabled ? 'disabled' : '') }, h("div", { key: '8b7db229e28aa1812179119eae507db6fc91b722', class: "Content " + (this.iconName ? this.iconPosition : '') + " " + (this.variant) + " " + (this.active ? 'active' : '') + " " + (this.disabled ? 'disabled' : ''), onClick: () => this.changeTab(this.identifier), id: this.identifier }, (this.iconName && (this.variant == 'inline' || this.variant == 'boxed')) &&
|
|
22
|
+
h("jump-icon", { key: '6135cd085bfec6cc6c827f1ebb5bf16e8d7ba05c', library: "fa", category: "regular", name: this.iconName, size: "small" }), h("span", { key: '79ff37f80ea54ea042cc96e326047595adc75be5', class: "label" }, this.label))));
|
|
23
23
|
}
|
|
24
24
|
static get is() { return "jump-tab-item"; }
|
|
25
25
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,7 +5,7 @@ export class JumpTabPanel {
|
|
|
5
5
|
this.active = false;
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: 'c307478192ab5d9b581de68902723c04dcd33278', class: "JumpTabPanel", id: this.identifier }, h("div", { key: 'ed8748df27a43e0b68be3eacb614eba1aa64d887', class: "JumpTabPanel__Content " + (this.active ? 'active' : '') }, h("slot", { key: '22a5c9f17117ea16bbbda5bb067ea4a998f62a32' }))));
|
|
9
9
|
}
|
|
10
10
|
static get is() { return "jump-tab-panel"; }
|
|
11
11
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { d as defineCustomElement$2 } from './jump-icon2.js';
|
|
3
3
|
|
|
4
|
-
const jumpTabItemCss = ":host{display:block;--jump-tabitem-active-color:var(--secondary-standard);--jump-tabitem-color:var(--neutral-grey-secondary);--jump-tabitem-hover-color:var(--neutral-grey-disabled, #CBCBCB);--jump-tabitem-boxed-bg-color:var(--secondary-soft, #EDF2FA);--jump-tabitem-rounded-bg-color:white
|
|
4
|
+
const jumpTabItemCss = ":host{display:block;--jump-tabitem-active-color:var(--secondary-standard);--jump-tabitem-color:var(--neutral-grey-secondary);--jump-tabitem-hover-color:var(--neutral-grey-disabled, #CBCBCB);--jump-tabitem-boxed-bg-color:var(--secondary-soft, #EDF2FA);--jump-tabitem-rounded-bg-color:white;--jump-tabitem-border-inline-color:var(--neutral-grey-disabled, #CBCBCB)\n\n font-family: var(--ff-primary)}:host .Content{display:flex;}:host .Content:hover:not(.disabled){cursor:pointer}:host .Content label{font-size:16px}:host .Content.left{flex-direction:row;gap:6px;align-items:center}:host .Content.top{flex-direction:column;gap:2px;align-items:center}:host .Content.inline{color:var(--jump-tabitem-color);padding:12px 24px;border-bottom:1px solid var(--jump-tabitem-border-inline-color)}:host .Content.inline:not(.active){padding-bottom:14px}:host .Content.inline.active{color:var(--jump-tabitem-active-color);border-bottom:3px solid var(--jump-tabitem-active-color)}:host .Content.inline.active span{font-weight:bold}:host .Content.inline:hover:not(.disabled):not(.active){border-bottom:3px solid var(--jump-tabitem-hover-color);cursor:pointer;padding-bottom:12px}:host .Content.boxed{color:var(--jump-tabitem-color);padding:15px 39px;background-color:transparent;border:1px solid var(--jump-tabitem-boxed-bg-color)}:host .Content.boxed:hover:not(.disabled),:host .Content.boxed:hover:not(.active){background-color:transparent}:host .Content.boxed:hover:not(.disabled) span,:host .Content.boxed:hover:not(.active) span{font-weight:bold}:host .Content.boxed.active{color:var(--jump-tabitem-active-color);background-color:var(--jump-tabitem-boxed-bg-color);border:1px solid var(--jump-tabitem-boxed-bg-color)}:host .Content.boxed.active span{font-weight:bold}:host .Content.rounded{padding:12px 32px;color:var(--jump-tabitem-color)}:host .Content.rounded:hover:not(.disabled){cursor:pointer}:host .Content.rounded:hover:not(.disabled) span{font-weight:bold}:host .Content.rounded.active{color:var(--jump-tabitem-active-color);background-color:var(--jump-tabitem-rounded-bg-color);border:1px solid var(--jump-tabitem-active-color);border-radius:50px}:host .Content.sheet{padding:12px 32px;color:var(--neutral-grey-secondary)}:host .Content.sheet:hover:not(.disabled){cursor:pointer}:host .Content.sheet:hover:not(.disabled) span{font-weight:bold}:host .Content.sheet.active{color:var(--jump-tabitem-active-color);background-color:var(--jump-tabitem-rounded-bg-color);border-radius:8px 8px 0px 0px}:host(.disabled){cursor:not-allowed;opacity:0.5;pointer-events:none}";
|
|
5
5
|
const JumpTabItemStyle0 = jumpTabItemCss;
|
|
6
6
|
|
|
7
7
|
const JumpTabItem$1 = /*@__PURE__*/ proxyCustomElement(class JumpTabItem extends HTMLElement {
|
|
@@ -27,8 +27,8 @@ const JumpTabItem$1 = /*@__PURE__*/ proxyCustomElement(class JumpTabItem extends
|
|
|
27
27
|
this.variant = parentVariant;
|
|
28
28
|
}
|
|
29
29
|
render() {
|
|
30
|
-
return (h(Host, { key: '
|
|
31
|
-
h("jump-icon", { key: '
|
|
30
|
+
return (h(Host, { key: 'b897b4a721b51eb035b37a38500527bfeea724e3', ref: (el) => { this.tabEl = el; }, class: "JumpTabItem " + (this.active ? 'active' : '') + " " + (this.variant) + " " + (this.disabled ? 'disabled' : '') }, h("div", { key: '8b7db229e28aa1812179119eae507db6fc91b722', class: "Content " + (this.iconName ? this.iconPosition : '') + " " + (this.variant) + " " + (this.active ? 'active' : '') + " " + (this.disabled ? 'disabled' : ''), onClick: () => this.changeTab(this.identifier), id: this.identifier }, (this.iconName && (this.variant == 'inline' || this.variant == 'boxed')) &&
|
|
31
|
+
h("jump-icon", { key: '6135cd085bfec6cc6c827f1ebb5bf16e8d7ba05c', library: "fa", category: "regular", name: this.iconName, size: "small" }), h("span", { key: '79ff37f80ea54ea042cc96e326047595adc75be5', class: "label" }, this.label))));
|
|
32
32
|
}
|
|
33
33
|
static get style() { return JumpTabItemStyle0; }
|
|
34
34
|
}, [1, "jump-tab-item", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-tab-item.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,
|
|
1
|
+
{"file":"jump-tab-item.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,kgFAAkgF,CAAC;AAC1hF,0BAAe,cAAc;;MCMhBA,aAAW;;;;;;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;;QAEd,IAAI,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;QACrE,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC;KAC9B;IAID,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,GAAG,EAAE,CAAC,EAAE,OAAO,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA,EAAE,EAChC,KAAK,EAAE,cAAc,IAAI,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,EAAE,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,GAAG,IAAI,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,CAAC,IACtH,4DAAK,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;YACtE,kEAAW,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,OAAO,GAAa,EAE3F,6DAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CACnC,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["JumpTabItem"],"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 --jump-tabitem-border-inline-color: var(--neutral-grey-disabled, #CBCBCB)\n \n font-family: var(--ff-primary);\n \n .Content {\n \n display: flex;\n\n &:hover:not(.disabled){\n cursor: pointer;\n }\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 border-bottom: 1px solid var(--jump-tabitem-border-inline-color);\n }\n\n &.inline:not(.active) {\n padding-bottom: 14px;\n }\n\n &.inline.active {\n color: var(--jump-tabitem-active-color);\n border-bottom: 3px solid var(--jump-tabitem-active-color);\n \n span {\n font-weight: bold;\n }\n }\n\n &.inline:hover:not(.disabled):not(.active) {\n border-bottom: 3px solid var(--jump-tabitem-hover-color);\n cursor: pointer;\n padding-bottom: 12px;\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 &.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 }\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-radius: 8px 8px 0px 0px;\n }\n }\n}\n\n:host(.disabled) {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\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: 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 // 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 tabEl: HTMLElement;\n\n render() {\n return (\n <Host\n ref={(el) => { this.tabEl = el }}\n class={\"JumpTabItem \" + (this.active ? 'active' : '') + \" \" + (this.variant) + \" \" + (this.disabled ? 'disabled' : '')}>\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}
|
|
@@ -12,7 +12,7 @@ const JumpTabPanel$1 = /*@__PURE__*/ proxyCustomElement(class JumpTabPanel exten
|
|
|
12
12
|
this.active = false;
|
|
13
13
|
}
|
|
14
14
|
render() {
|
|
15
|
-
return (h(Host, { key: '
|
|
15
|
+
return (h(Host, { key: 'c307478192ab5d9b581de68902723c04dcd33278', class: "JumpTabPanel", id: this.identifier }, h("div", { key: 'ed8748df27a43e0b68be3eacb614eba1aa64d887', class: "JumpTabPanel__Content " + (this.active ? 'active' : '') }, h("slot", { key: '22a5c9f17117ea16bbbda5bb067ea4a998f62a32' }))));
|
|
16
16
|
}
|
|
17
17
|
static get style() { return JumpTabPanelStyle0; }
|
|
18
18
|
}, [1, "jump-tab-panel", {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const jumpTabCss = ":host{display:block;--jump-tab-bg-color:var(--gray-ultralight, #f8f8f8);--jump-tab-border-color:var(--neutral-grey-disabled, #CBCBCB)}:host .Wrapper{display:flex;flex-direction:column
|
|
3
|
+
const jumpTabCss = ":host{display:block;--jump-tab-bg-color:var(--gray-ultralight, #f8f8f8);--jump-tab-border-color:var(--neutral-grey-disabled, #CBCBCB)}:host .Wrapper{display:flex;flex-direction:column}:host .ContentWrapper{display:flex;width:100%;justify-content:var(--alignment, flex-start)}:host .Content{display:flex;flex-direction:row;align-items:flex-end;width:fit-content}:host .Content.fullBorder{width:100%;border-bottom:1px solid var(--jump-tab-border-color)}:host .Content.fullBorder.inline ::slotted([slot=tab-item]){margin-bottom:-1px}:host .Content.rounded{border-radius:50px;background-color:var(--jump-tab-bg-color)}:host .Content.disabled{cursor:not-allowed;opacity:0.5;pointer-events:none}:host jump-tab-item{display:flex;align-items:flex-end;overflow:hidden}:host jump-tab-item .tab-title{display:block;white-space:normal;text-align:center}";
|
|
4
4
|
const JumpTabStyle0 = jumpTabCss;
|
|
5
5
|
|
|
6
6
|
const JumpTab$1 = /*@__PURE__*/ proxyCustomElement(class JumpTab extends HTMLElement {
|
|
@@ -17,7 +17,6 @@ const JumpTab$1 = /*@__PURE__*/ proxyCustomElement(class JumpTab extends HTMLEle
|
|
|
17
17
|
}
|
|
18
18
|
changeActiveTabHandler(event) {
|
|
19
19
|
this.setActiveTab.emit(event.detail);
|
|
20
|
-
// Recupera il valore della variabile CSS
|
|
21
20
|
const rootStyles = getComputedStyle(document.documentElement);
|
|
22
21
|
const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();
|
|
23
22
|
let items = this.JumpTabEl.querySelectorAll('jump-tab-item');
|
|
@@ -26,16 +25,14 @@ const JumpTab$1 = /*@__PURE__*/ proxyCustomElement(class JumpTab extends HTMLEle
|
|
|
26
25
|
if (item.getAttribute('identifier') === event.detail.id) {
|
|
27
26
|
item.setAttribute('active', '');
|
|
28
27
|
if (this.variant === 'sheet') {
|
|
29
|
-
// Aggiungi il bordo ai fratelli dell'elemento attivo tranne l'ultimo
|
|
30
28
|
items.forEach((sibling, index) => {
|
|
31
29
|
if (sibling !== item && index !== items.length - 1) {
|
|
32
|
-
sibling.style.borderRight = `1px solid ${primaryColor}`;
|
|
30
|
+
sibling.style.borderRight = `1px solid ${primaryColor}`;
|
|
33
31
|
}
|
|
34
32
|
else {
|
|
35
33
|
sibling.style.borderRight = '1px solid transparent';
|
|
36
34
|
}
|
|
37
35
|
});
|
|
38
|
-
// Rimuovi il bordo dal fratello precedente
|
|
39
36
|
let previousSibling = item.previousElementSibling;
|
|
40
37
|
if (previousSibling) {
|
|
41
38
|
previousSibling.style.borderRight = '1px solid transparent';
|
|
@@ -61,16 +58,11 @@ const JumpTab$1 = /*@__PURE__*/ proxyCustomElement(class JumpTab extends HTMLEle
|
|
|
61
58
|
}
|
|
62
59
|
componentDidLoad() {
|
|
63
60
|
if (this.variant === 'sheet') {
|
|
64
|
-
// Recupera il valore della variabile CSS
|
|
65
61
|
const rootStyles = getComputedStyle(document.documentElement);
|
|
66
62
|
const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();
|
|
67
|
-
// Seleziona tutti gli elementi jump-tab-item
|
|
68
63
|
let items = this.JumpTabEl.querySelectorAll('jump-tab-item');
|
|
69
64
|
if (items.length > 0) {
|
|
70
65
|
items.forEach((item, index) => {
|
|
71
|
-
// Aggiungi bordo destro a tutti tranne:
|
|
72
|
-
// - l'ultimo elemento
|
|
73
|
-
// - l'elemento attivo (avente classe "active")
|
|
74
66
|
if (index === items.length - 1 || item.classList.contains('active')) {
|
|
75
67
|
item.style.borderRight = '1px solid transparent';
|
|
76
68
|
}
|
|
@@ -82,7 +74,17 @@ const JumpTab$1 = /*@__PURE__*/ proxyCustomElement(class JumpTab extends HTMLEle
|
|
|
82
74
|
}
|
|
83
75
|
}
|
|
84
76
|
render() {
|
|
85
|
-
return (h(Host, { key: '
|
|
77
|
+
return (h(Host, { key: 'beb020fdd6c31ad90be02ebcee610df87164d90d', class: "JumpTab " + this.variant, id: this.tabGroupName, ref: (el) => { this.JumpTabEl = el; } }, h("div", { key: 'f35ed1271bbe668b86ce881181c823e2e360d01a', class: "Wrapper " + (this.fullBorder ? 'fullBorder' : '') }, h("div", { key: '334884fcec4a4c45da838679d7331117f7e17846', class: "ContentWrapper", style: { '--alignment': this.getAlignment(this.alignment) } }, h("div", { key: 'a115d0cf84c671a892db304e7203fe25ff7ffc3f', class: "Content " + this.variant + " " + (this.disabled ? 'disabled' : '') + " " + (this.fullBorder ? 'fullBorder' : '') }, h("slot", { key: '1394f8cab6f79c6799906c5f04dc180685fd5bef', name: "tab-item" }))), h("div", { key: '880f63d36aba524ec864323f6fa259d49b87840c', class: "ContentWrapper" }, h("slot", { key: '64060015cb968819ea9d6f7411ad654cd92337ba', name: "tab-content" })))));
|
|
78
|
+
}
|
|
79
|
+
getAlignment(alignment) {
|
|
80
|
+
switch (alignment) {
|
|
81
|
+
case 'center':
|
|
82
|
+
return 'center';
|
|
83
|
+
case 'right':
|
|
84
|
+
return 'flex-end';
|
|
85
|
+
default:
|
|
86
|
+
return 'flex-start';
|
|
87
|
+
}
|
|
86
88
|
}
|
|
87
89
|
static get style() { return JumpTabStyle0; }
|
|
88
90
|
}, [1, "jump-tab", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-tab.js","mappings":";;AAAA,MAAM,UAAU,GAAG
|
|
1
|
+
{"file":"jump-tab.js","mappings":"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","names":["JumpTab"],"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 --jump-tab-border-color: var(--neutral-grey-disabled, #CBCBCB);\n\n .Wrapper {\n display: flex;\n flex-direction: column;\n }\n\n .ContentWrapper {\n display: flex;\n width: 100%;\n justify-content: var(--alignment, flex-start);\n }\n\n .Content {\n display: flex;\n flex-direction: row;\n align-items: flex-end;\n width: fit-content;\n\n &.fullBorder {\n width: 100%;\n border-bottom: 1px solid var(--jump-tab-border-color);\n }\n\n &.fullBorder.inline ::slotted([slot=\"tab-item\"]) {\n margin-bottom: -1px;\n }\n\n &.rounded {\n border-radius: 50px;\n background-color: var(--jump-tab-bg-color);\n }\n\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n }\n }\n\n jump-tab-item {\n display: flex;\n align-items: flex-end;\n overflow: hidden;\n\n .tab-title {\n display: block;\n white-space: normal;\n text-align: center;\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 JumpTabEl: HTMLElement;\n\n @Prop() disabled: boolean = false;\n @Prop() alignment: string = 'left';\n @Prop() fullBorder: boolean = false;\n @Prop() tabGroupName: string = undefined;\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 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 items.forEach((sibling, index) => {\n if (sibling !== item && index !== items.length - 1) {\n sibling.style.borderRight = `1px solid ${primaryColor}`;\n } else {\n sibling.style.borderRight = '1px solid transparent';\n }\n });\n\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 componentDidLoad() {\n if (this.variant === 'sheet') {\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, index) => {\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 render() {\n return (\n <Host class={\"JumpTab \" + this.variant} id={this.tabGroupName} ref={(el) => { this.JumpTabEl = el; }}>\n <div class={\"Wrapper \" + (this.fullBorder ? 'fullBorder' : '')}>\n <div class={\"ContentWrapper\"} style={{ '--alignment': this.getAlignment(this.alignment) }}>\n <div class={\"Content \" + this.variant + \" \" + (this.disabled ? 'disabled' : '') + \" \" + (this.fullBorder ? 'fullBorder' : '')}>\n <slot name=\"tab-item\"></slot>\n </div>\n </div>\n <div class=\"ContentWrapper\">\n <slot name=\"tab-content\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n\n private getAlignment(alignment: string): string {\n switch (alignment) {\n case 'center':\n return 'center';\n case 'right':\n return 'flex-end';\n default:\n return 'flex-start';\n }\n }\n}\n"],"version":3}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const NAMESPACE = 'jump-design-system';
|
|
2
|
-
const BUILD = /* jump-design-system */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle:
|
|
2
|
+
const BUILD = /* jump-design-system */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: false, watchCallback: true };
|
|
3
3
|
|
|
4
4
|
/*
|
|
5
5
|
Stencil Client Platform v4.18.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -282,6 +282,27 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
|
282
282
|
const newClasses = parseClassList(newValue);
|
|
283
283
|
classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
|
|
284
284
|
classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
|
|
285
|
+
} else if (memberName === "style") {
|
|
286
|
+
{
|
|
287
|
+
for (const prop in oldValue) {
|
|
288
|
+
if (!newValue || newValue[prop] == null) {
|
|
289
|
+
if (prop.includes("-")) {
|
|
290
|
+
elm.style.removeProperty(prop);
|
|
291
|
+
} else {
|
|
292
|
+
elm.style[prop] = "";
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
}
|
|
296
|
+
}
|
|
297
|
+
for (const prop in newValue) {
|
|
298
|
+
if (!oldValue || newValue[prop] !== oldValue[prop]) {
|
|
299
|
+
if (prop.includes("-")) {
|
|
300
|
+
elm.style.setProperty(prop, newValue[prop]);
|
|
301
|
+
} else {
|
|
302
|
+
elm.style[prop] = newValue[prop];
|
|
303
|
+
}
|
|
304
|
+
}
|
|
305
|
+
}
|
|
285
306
|
} else if (memberName === "key") ; else if (memberName === "ref") {
|
|
286
307
|
if (newValue) {
|
|
287
308
|
newValue(elm);
|
|
@@ -1543,4 +1564,4 @@ var writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
|
|
|
1543
1564
|
|
|
1544
1565
|
export { Host as H, bootstrapLazy as b, createEvent as c, getElement as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
|
|
1545
1566
|
|
|
1546
|
-
//# sourceMappingURL=index-
|
|
1567
|
+
//# sourceMappingURL=index-14b73bd6.js.map
|