@jumpgroup/jump-design-system 0.3.14 → 0.3.15
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/jump-filtergroup.cjs.entry.js +15 -8
- package/dist/cjs/jump-filtergroup.cjs.entry.js.map +1 -1
- package/dist/collection/components/jump-filtergroup/jump-filtergroup.css +5 -4
- package/dist/collection/components/jump-filtergroup/jump-filtergroup.js +14 -7
- package/dist/collection/components/jump-filtergroup/jump-filtergroup.js.map +1 -1
- package/dist/components/jump-filtergroup.js +15 -8
- package/dist/components/jump-filtergroup.js.map +1 -1
- package/dist/esm/jump-filtergroup.entry.js +15 -8
- package/dist/esm/jump-filtergroup.entry.js.map +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js +1 -1
- package/dist/jump-design-system/p-b4e60ca4.entry.js +2 -0
- package/dist/jump-design-system/p-b4e60ca4.entry.js.map +1 -0
- package/dist/types/components/jump-filtergroup/jump-filtergroup.d.ts +2 -1
- package/package.json +1 -1
- package/dist/jump-design-system/p-a41ca036.entry.js +0 -2
- package/dist/jump-design-system/p-a41ca036.entry.js.map +0 -1
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-674508e2.js');
|
|
6
6
|
|
|
7
|
-
const jumpFiltergroupCss = ":host{display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}h5{margin:0 0 0.25rem}
|
|
7
|
+
const jumpFiltergroupCss = ":host{--hidden-display:none;display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}*[data-hide=true]{display:var(--hidden-display)}h5{margin:0 0 0.25rem}";
|
|
8
8
|
const JumpFiltergroupStyle0 = jumpFiltergroupCss;
|
|
9
9
|
|
|
10
10
|
const JumpFiltergroup = class {
|
|
@@ -35,16 +35,19 @@ const JumpFiltergroup = class {
|
|
|
35
35
|
async getName() {
|
|
36
36
|
return this.name;
|
|
37
37
|
}
|
|
38
|
-
toggleHiddenItems() {
|
|
38
|
+
toggleHiddenItems(showAll = true) {
|
|
39
39
|
this.slotItemsWrapper.assignedElements().forEach((item, index) => {
|
|
40
|
-
if (index > this.maxElements) {
|
|
41
|
-
item.setAttribute('
|
|
40
|
+
if (index > this.maxElements && !showAll) {
|
|
41
|
+
item.setAttribute('style', 'display: none');
|
|
42
|
+
}
|
|
43
|
+
else {
|
|
44
|
+
item.setAttribute('style', 'display: initial');
|
|
42
45
|
}
|
|
43
46
|
});
|
|
44
47
|
}
|
|
45
48
|
handleShowMore() {
|
|
46
49
|
this.showMore = !this.showMore;
|
|
47
|
-
this.toggleHiddenItems();
|
|
50
|
+
this.toggleHiddenItems(this.showMore);
|
|
48
51
|
}
|
|
49
52
|
handleChange(event) {
|
|
50
53
|
const target = event.target;
|
|
@@ -101,7 +104,8 @@ const JumpFiltergroup = class {
|
|
|
101
104
|
let index = 0;
|
|
102
105
|
this.slotItems.forEach((item) => {
|
|
103
106
|
if (index > this.maxElements) {
|
|
104
|
-
item.setAttribute('data-hide', 'true');
|
|
107
|
+
//item.setAttribute('data-hide', 'true');
|
|
108
|
+
item.style.display = 'none';
|
|
105
109
|
}
|
|
106
110
|
if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {
|
|
107
111
|
this.inputs.push(item);
|
|
@@ -122,10 +126,13 @@ const JumpFiltergroup = class {
|
|
|
122
126
|
}
|
|
123
127
|
index++;
|
|
124
128
|
});
|
|
129
|
+
//this.toggleHiddenItems();
|
|
125
130
|
}
|
|
126
131
|
render() {
|
|
127
|
-
return (index.h(index.Host, { key: '
|
|
128
|
-
index.h("jump-button", { key: '
|
|
132
|
+
return (index.h(index.Host, { key: '41fedeb5fa5115b92a3af041d2fba3dec6cae266' }, this.heading && index.h("h5", { key: '18ac96c2d4eb6995afb92d6c2a7d79df08aee1aa' }, this.heading), index.h("div", { key: '437810fd688063f569d4a6b2000ac2a45d450572', class: "filterGroup" }, index.h("slot", { key: '0648a643e86e5c5d978590a8c4e14358252cfd03', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
|
|
133
|
+
index.h("jump-button", { key: 'bfcdf9b4c4d005a6fd7a802ec0eeb0a6c0aa99ea', variant: "primary", size: "small", text: true, name: this.showMore ? this.otherLabel : this.lessLabel, "aria-label": this.showMore ? this.otherLabel : this.lessLabel, ref: (showMoreBtn) => {
|
|
134
|
+
this.showMoreBtn = showMoreBtn;
|
|
135
|
+
}, onClick: () => this.handleShowMore() }, this.showMore ? this.otherLabel : this.lessLabel, index.h("jump-icon", { key: 'cf42c4ac93733a34668426eae394966171ae72c3', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-up' }))));
|
|
129
136
|
}
|
|
130
137
|
};
|
|
131
138
|
JumpFiltergroup.style = JumpFiltergroupStyle0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-filtergroup.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"jump-filtergroup.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n --hidden-display: none;\n\n display: block;\n\n slot {\n display: flex;\n flex-direction: column;\n gap: .25rem;\n margin-bottom: 1rem;\n }\n\n}\n\n*[data-hide=\"true\"] {\n display: var(--hidden-display);\n}\n\nh5 {\n margin: 0 0 .25rem;\n}\n\n//TODO: capire perché non prende questo stile\n\n\n","import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n showMoreBtn: HTMLElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems(showAll = true) {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if (index > this.maxElements && !showAll) {\n item.setAttribute('style', 'display: none');\n } else {\n item.setAttribute('style', 'display: initial');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems(this.showMore);\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if (index > this.maxElements) {\n //item.setAttribute('data-hide', 'true');\n item.style.display = 'none';\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n\n //this.toggleHiddenItems();\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n ref={(showMoreBtn) => {\n this.showMoreBtn = showMoreBtn;\n }}\n onClick={() => this.handleShowMore()}>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
:host {
|
|
2
|
+
--hidden-display: none;
|
|
2
3
|
display: block;
|
|
3
4
|
}
|
|
4
5
|
:host slot {
|
|
@@ -8,10 +9,10 @@
|
|
|
8
9
|
margin-bottom: 1rem;
|
|
9
10
|
}
|
|
10
11
|
|
|
11
|
-
|
|
12
|
-
|
|
12
|
+
*[data-hide=true] {
|
|
13
|
+
display: var(--hidden-display);
|
|
13
14
|
}
|
|
14
15
|
|
|
15
|
-
|
|
16
|
-
|
|
16
|
+
h5 {
|
|
17
|
+
margin: 0 0 0.25rem;
|
|
17
18
|
}
|
|
@@ -25,16 +25,19 @@ export class JumpFiltergroup {
|
|
|
25
25
|
async getName() {
|
|
26
26
|
return this.name;
|
|
27
27
|
}
|
|
28
|
-
toggleHiddenItems() {
|
|
28
|
+
toggleHiddenItems(showAll = true) {
|
|
29
29
|
this.slotItemsWrapper.assignedElements().forEach((item, index) => {
|
|
30
|
-
if (index > this.maxElements) {
|
|
31
|
-
item.setAttribute('
|
|
30
|
+
if (index > this.maxElements && !showAll) {
|
|
31
|
+
item.setAttribute('style', 'display: none');
|
|
32
|
+
}
|
|
33
|
+
else {
|
|
34
|
+
item.setAttribute('style', 'display: initial');
|
|
32
35
|
}
|
|
33
36
|
});
|
|
34
37
|
}
|
|
35
38
|
handleShowMore() {
|
|
36
39
|
this.showMore = !this.showMore;
|
|
37
|
-
this.toggleHiddenItems();
|
|
40
|
+
this.toggleHiddenItems(this.showMore);
|
|
38
41
|
}
|
|
39
42
|
handleChange(event) {
|
|
40
43
|
const target = event.target;
|
|
@@ -91,7 +94,8 @@ export class JumpFiltergroup {
|
|
|
91
94
|
let index = 0;
|
|
92
95
|
this.slotItems.forEach((item) => {
|
|
93
96
|
if (index > this.maxElements) {
|
|
94
|
-
item.setAttribute('data-hide', 'true');
|
|
97
|
+
//item.setAttribute('data-hide', 'true');
|
|
98
|
+
item.style.display = 'none';
|
|
95
99
|
}
|
|
96
100
|
if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {
|
|
97
101
|
this.inputs.push(item);
|
|
@@ -112,10 +116,13 @@ export class JumpFiltergroup {
|
|
|
112
116
|
}
|
|
113
117
|
index++;
|
|
114
118
|
});
|
|
119
|
+
//this.toggleHiddenItems();
|
|
115
120
|
}
|
|
116
121
|
render() {
|
|
117
|
-
return (h(Host, { key: '
|
|
118
|
-
h("jump-button", { key: '
|
|
122
|
+
return (h(Host, { key: '41fedeb5fa5115b92a3af041d2fba3dec6cae266' }, this.heading && h("h5", { key: '18ac96c2d4eb6995afb92d6c2a7d79df08aee1aa' }, this.heading), h("div", { key: '437810fd688063f569d4a6b2000ac2a45d450572', class: "filterGroup" }, h("slot", { key: '0648a643e86e5c5d978590a8c4e14358252cfd03', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
|
|
123
|
+
h("jump-button", { key: 'bfcdf9b4c4d005a6fd7a802ec0eeb0a6c0aa99ea', variant: "primary", size: "small", text: true, name: this.showMore ? this.otherLabel : this.lessLabel, "aria-label": this.showMore ? this.otherLabel : this.lessLabel, ref: (showMoreBtn) => {
|
|
124
|
+
this.showMoreBtn = showMoreBtn;
|
|
125
|
+
}, onClick: () => this.handleShowMore() }, this.showMore ? this.otherLabel : this.lessLabel, h("jump-icon", { key: 'cf42c4ac93733a34668426eae394966171ae72c3', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-up' }))));
|
|
119
126
|
}
|
|
120
127
|
static get is() { return "jump-filtergroup"; }
|
|
121
128
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-filtergroup.js","sourceRoot":"","sources":["../../../src/components/jump-filtergroup/jump-filtergroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems() {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if(index > this.maxElements) {\n item.setAttribute('data-hide', this.showMore ? 'true' : 'false');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems();\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if(index > this.maxElements) {\n item.setAttribute('data-hide', 'true');\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n onClick={() => this.handleShowMore() }>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-down'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"jump-filtergroup.js","sourceRoot":"","sources":["../../../src/components/jump-filtergroup/jump-filtergroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n showMoreBtn: HTMLElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems(showAll = true) {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if (index > this.maxElements && !showAll) {\n item.setAttribute('style', 'display: none');\n } else {\n item.setAttribute('style', 'display: initial');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems(this.showMore);\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if (index > this.maxElements) {\n //item.setAttribute('data-hide', 'true');\n item.style.display = 'none';\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n\n //this.toggleHiddenItems();\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n ref={(showMoreBtn) => {\n this.showMoreBtn = showMoreBtn;\n }}\n onClick={() => this.handleShowMore()}>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"]}
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
|
|
|
2
2
|
import { d as defineCustomElement$3 } from './jump-button2.js';
|
|
3
3
|
import { d as defineCustomElement$2 } from './jump-icon2.js';
|
|
4
4
|
|
|
5
|
-
const jumpFiltergroupCss = ":host{display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}h5{margin:0 0 0.25rem}
|
|
5
|
+
const jumpFiltergroupCss = ":host{--hidden-display:none;display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}*[data-hide=true]{display:var(--hidden-display)}h5{margin:0 0 0.25rem}";
|
|
6
6
|
const JumpFiltergroupStyle0 = jumpFiltergroupCss;
|
|
7
7
|
|
|
8
8
|
const JumpFiltergroup$1 = /*@__PURE__*/ proxyCustomElement(class JumpFiltergroup extends HTMLElement {
|
|
@@ -35,16 +35,19 @@ const JumpFiltergroup$1 = /*@__PURE__*/ proxyCustomElement(class JumpFiltergroup
|
|
|
35
35
|
async getName() {
|
|
36
36
|
return this.name;
|
|
37
37
|
}
|
|
38
|
-
toggleHiddenItems() {
|
|
38
|
+
toggleHiddenItems(showAll = true) {
|
|
39
39
|
this.slotItemsWrapper.assignedElements().forEach((item, index) => {
|
|
40
|
-
if (index > this.maxElements) {
|
|
41
|
-
item.setAttribute('
|
|
40
|
+
if (index > this.maxElements && !showAll) {
|
|
41
|
+
item.setAttribute('style', 'display: none');
|
|
42
|
+
}
|
|
43
|
+
else {
|
|
44
|
+
item.setAttribute('style', 'display: initial');
|
|
42
45
|
}
|
|
43
46
|
});
|
|
44
47
|
}
|
|
45
48
|
handleShowMore() {
|
|
46
49
|
this.showMore = !this.showMore;
|
|
47
|
-
this.toggleHiddenItems();
|
|
50
|
+
this.toggleHiddenItems(this.showMore);
|
|
48
51
|
}
|
|
49
52
|
handleChange(event) {
|
|
50
53
|
const target = event.target;
|
|
@@ -101,7 +104,8 @@ const JumpFiltergroup$1 = /*@__PURE__*/ proxyCustomElement(class JumpFiltergroup
|
|
|
101
104
|
let index = 0;
|
|
102
105
|
this.slotItems.forEach((item) => {
|
|
103
106
|
if (index > this.maxElements) {
|
|
104
|
-
item.setAttribute('data-hide', 'true');
|
|
107
|
+
//item.setAttribute('data-hide', 'true');
|
|
108
|
+
item.style.display = 'none';
|
|
105
109
|
}
|
|
106
110
|
if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {
|
|
107
111
|
this.inputs.push(item);
|
|
@@ -122,10 +126,13 @@ const JumpFiltergroup$1 = /*@__PURE__*/ proxyCustomElement(class JumpFiltergroup
|
|
|
122
126
|
}
|
|
123
127
|
index++;
|
|
124
128
|
});
|
|
129
|
+
//this.toggleHiddenItems();
|
|
125
130
|
}
|
|
126
131
|
render() {
|
|
127
|
-
return (h(Host, { key: '
|
|
128
|
-
h("jump-button", { key: '
|
|
132
|
+
return (h(Host, { key: '41fedeb5fa5115b92a3af041d2fba3dec6cae266' }, this.heading && h("h5", { key: '18ac96c2d4eb6995afb92d6c2a7d79df08aee1aa' }, this.heading), h("div", { key: '437810fd688063f569d4a6b2000ac2a45d450572', class: "filterGroup" }, h("slot", { key: '0648a643e86e5c5d978590a8c4e14358252cfd03', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
|
|
133
|
+
h("jump-button", { key: 'bfcdf9b4c4d005a6fd7a802ec0eeb0a6c0aa99ea', variant: "primary", size: "small", text: true, name: this.showMore ? this.otherLabel : this.lessLabel, "aria-label": this.showMore ? this.otherLabel : this.lessLabel, ref: (showMoreBtn) => {
|
|
134
|
+
this.showMoreBtn = showMoreBtn;
|
|
135
|
+
}, onClick: () => this.handleShowMore() }, this.showMore ? this.otherLabel : this.lessLabel, h("jump-icon", { key: 'cf42c4ac93733a34668426eae394966171ae72c3', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-up' }))));
|
|
129
136
|
}
|
|
130
137
|
static get style() { return JumpFiltergroupStyle0; }
|
|
131
138
|
}, [1, "jump-filtergroup", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-filtergroup.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"jump-filtergroup.js","mappings":"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","names":["JumpFiltergroup"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n --hidden-display: none;\n\n display: block;\n\n slot {\n display: flex;\n flex-direction: column;\n gap: .25rem;\n margin-bottom: 1rem;\n }\n\n}\n\n*[data-hide=\"true\"] {\n display: var(--hidden-display);\n}\n\nh5 {\n margin: 0 0 .25rem;\n}\n\n//TODO: capire perché non prende questo stile\n\n\n","import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n showMoreBtn: HTMLElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems(showAll = true) {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if (index > this.maxElements && !showAll) {\n item.setAttribute('style', 'display: none');\n } else {\n item.setAttribute('style', 'display: initial');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems(this.showMore);\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if (index > this.maxElements) {\n //item.setAttribute('data-hide', 'true');\n item.style.display = 'none';\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n\n //this.toggleHiddenItems();\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n ref={(showMoreBtn) => {\n this.showMoreBtn = showMoreBtn;\n }}\n onClick={() => this.handleShowMore()}>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host } from './index-70f1949a.js';
|
|
2
2
|
|
|
3
|
-
const jumpFiltergroupCss = ":host{display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}h5{margin:0 0 0.25rem}
|
|
3
|
+
const jumpFiltergroupCss = ":host{--hidden-display:none;display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}*[data-hide=true]{display:var(--hidden-display)}h5{margin:0 0 0.25rem}";
|
|
4
4
|
const JumpFiltergroupStyle0 = jumpFiltergroupCss;
|
|
5
5
|
|
|
6
6
|
const JumpFiltergroup = class {
|
|
@@ -31,16 +31,19 @@ const JumpFiltergroup = class {
|
|
|
31
31
|
async getName() {
|
|
32
32
|
return this.name;
|
|
33
33
|
}
|
|
34
|
-
toggleHiddenItems() {
|
|
34
|
+
toggleHiddenItems(showAll = true) {
|
|
35
35
|
this.slotItemsWrapper.assignedElements().forEach((item, index) => {
|
|
36
|
-
if (index > this.maxElements) {
|
|
37
|
-
item.setAttribute('
|
|
36
|
+
if (index > this.maxElements && !showAll) {
|
|
37
|
+
item.setAttribute('style', 'display: none');
|
|
38
|
+
}
|
|
39
|
+
else {
|
|
40
|
+
item.setAttribute('style', 'display: initial');
|
|
38
41
|
}
|
|
39
42
|
});
|
|
40
43
|
}
|
|
41
44
|
handleShowMore() {
|
|
42
45
|
this.showMore = !this.showMore;
|
|
43
|
-
this.toggleHiddenItems();
|
|
46
|
+
this.toggleHiddenItems(this.showMore);
|
|
44
47
|
}
|
|
45
48
|
handleChange(event) {
|
|
46
49
|
const target = event.target;
|
|
@@ -97,7 +100,8 @@ const JumpFiltergroup = class {
|
|
|
97
100
|
let index = 0;
|
|
98
101
|
this.slotItems.forEach((item) => {
|
|
99
102
|
if (index > this.maxElements) {
|
|
100
|
-
item.setAttribute('data-hide', 'true');
|
|
103
|
+
//item.setAttribute('data-hide', 'true');
|
|
104
|
+
item.style.display = 'none';
|
|
101
105
|
}
|
|
102
106
|
if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {
|
|
103
107
|
this.inputs.push(item);
|
|
@@ -118,10 +122,13 @@ const JumpFiltergroup = class {
|
|
|
118
122
|
}
|
|
119
123
|
index++;
|
|
120
124
|
});
|
|
125
|
+
//this.toggleHiddenItems();
|
|
121
126
|
}
|
|
122
127
|
render() {
|
|
123
|
-
return (h(Host, { key: '
|
|
124
|
-
h("jump-button", { key: '
|
|
128
|
+
return (h(Host, { key: '41fedeb5fa5115b92a3af041d2fba3dec6cae266' }, this.heading && h("h5", { key: '18ac96c2d4eb6995afb92d6c2a7d79df08aee1aa' }, this.heading), h("div", { key: '437810fd688063f569d4a6b2000ac2a45d450572', class: "filterGroup" }, h("slot", { key: '0648a643e86e5c5d978590a8c4e14358252cfd03', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
|
|
129
|
+
h("jump-button", { key: 'bfcdf9b4c4d005a6fd7a802ec0eeb0a6c0aa99ea', variant: "primary", size: "small", text: true, name: this.showMore ? this.otherLabel : this.lessLabel, "aria-label": this.showMore ? this.otherLabel : this.lessLabel, ref: (showMoreBtn) => {
|
|
130
|
+
this.showMoreBtn = showMoreBtn;
|
|
131
|
+
}, onClick: () => this.handleShowMore() }, this.showMore ? this.otherLabel : this.lessLabel, h("jump-icon", { key: 'cf42c4ac93733a34668426eae394966171ae72c3', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-up' }))));
|
|
125
132
|
}
|
|
126
133
|
};
|
|
127
134
|
JumpFiltergroup.style = JumpFiltergroupStyle0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-filtergroup.entry.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"file":"jump-filtergroup.entry.js","mappings":"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","names":[],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n --hidden-display: none;\n\n display: block;\n\n slot {\n display: flex;\n flex-direction: column;\n gap: .25rem;\n margin-bottom: 1rem;\n }\n\n}\n\n*[data-hide=\"true\"] {\n display: var(--hidden-display);\n}\n\nh5 {\n margin: 0 0 .25rem;\n}\n\n//TODO: capire perché non prende questo stile\n\n\n","import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n showMoreBtn: HTMLElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems(showAll = true) {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if (index > this.maxElements && !showAll) {\n item.setAttribute('style', 'display: none');\n } else {\n item.setAttribute('style', 'display: initial');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems(this.showMore);\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if (index > this.maxElements) {\n //item.setAttribute('data-hide', 'true');\n item.style.display = 'none';\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n\n //this.toggleHiddenItems();\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n ref={(showMoreBtn) => {\n this.showMoreBtn = showMoreBtn;\n }}\n onClick={() => this.handleShowMore()}>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,b as t}from"./p-4d6cc90d.js";export{s as setNonce}from"./p-4d6cc90d.js";import{g as a}from"./p-e1255160.js";const i=()=>{const t=import.meta.url;const a={};if(t!==""){a.resourcesUrl=new URL(".",t).href}return e(a)};i().then((async e=>{await a();return t([["p-23fb306d",[[1,"jump-card-ecommerce",{onlyIconButton:[4,"only-icon-button"],hasBackground:[4,"has-background"],badge:[1],favorite:[1540],hasFavorite:[4,"has-favorite"],favoriteBtnClass:[1,"favorite-btn-class"],link:[1],img:[1],imgAlt:[1,"img-alt"],hoverImg:[1,"hover-img"],hoverImgAlt:[1,"hover-img-alt"],videoSrc:[1,"video-src"],notificationUrl:[1,"notification-url"],notificationText:[1,"notification-text"],productName:[1,"product-name"],subtitle:[1],productId:[1,"product-id"],price:[2],salePrice:[2,"sale-price"],currency:[1],outOfStock:[1540,"out-of-stock"],outOfStockText:[1,"out-of-stock-text"],addToCartText:[1,"add-to-cart-text"],waitingListText:[1,"waiting-list-text"],addToWaitingList:[4,"add-to-waiting-list"],addedToCart:[4,"added-to-cart"],endAddedToCart:[4,"end-added-to-cart"],variations:[32],selectedVariation:[32]},[[0,"jump-card-ecommerce-option-connected","addOption"]]]]],["p-fde99383",[[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"]]]]],["p-
|
|
1
|
+
import{p as e,b as t}from"./p-4d6cc90d.js";export{s as setNonce}from"./p-4d6cc90d.js";import{g as a}from"./p-e1255160.js";const i=()=>{const t=import.meta.url;const a={};if(t!==""){a.resourcesUrl=new URL(".",t).href}return e(a)};i().then((async e=>{await a();return t([["p-23fb306d",[[1,"jump-card-ecommerce",{onlyIconButton:[4,"only-icon-button"],hasBackground:[4,"has-background"],badge:[1],favorite:[1540],hasFavorite:[4,"has-favorite"],favoriteBtnClass:[1,"favorite-btn-class"],link:[1],img:[1],imgAlt:[1,"img-alt"],hoverImg:[1,"hover-img"],hoverImgAlt:[1,"hover-img-alt"],videoSrc:[1,"video-src"],notificationUrl:[1,"notification-url"],notificationText:[1,"notification-text"],productName:[1,"product-name"],subtitle:[1],productId:[1,"product-id"],price:[2],salePrice:[2,"sale-price"],currency:[1],outOfStock:[1540,"out-of-stock"],outOfStockText:[1,"out-of-stock-text"],addToCartText:[1,"add-to-cart-text"],waitingListText:[1,"waiting-list-text"],addToWaitingList:[4,"add-to-waiting-list"],addedToCart:[4,"added-to-cart"],endAddedToCart:[4,"end-added-to-cart"],variations:[32],selectedVariation:[32]},[[0,"jump-card-ecommerce-option-connected","addOption"]]]]],["p-fde99383",[[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"]]]]],["p-b4e60ca4",[[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]}]]],["p-4302b229",[[1,"jump-pagination",{pagLabel:[1,"pag-label"],last:[2],showFirstAndLast:[4,"show-first-and-last"],current:[32]},null,{current:["watchcurrent"]}]]],["p-c8733544",[[0,"jump-pagination-table",{elementsRanges:[1,"elements-ranges"],pagLabel:[513,"pag-label"],labelElementsPerPage:[513,"label-elements-per-page"],total:[514],first:[514],last:[514],showFirstAndLast:[516,"show-first-and-last"],elementsRangesArray:[32],elPerPage:[32]},null,{elementsRanges:["elementsRangesChanged"],elPerPage:["elPerPageChanged"]}]]],["p-839e054d",[[65,"jump-quantity",{min:[2],max:[2],step:[2],label:[1],type:[1],variant:[1],showButtons:[4,"show-buttons"],value:[2],getValue:[64],reset:[64]},null,{value:["onValueChange"]}]]],["p-ed897778",[[1,"jump-tab-item",{identifier:[1],iconName:[1,"icon-name"],iconPosition:[1,"icon-position"],label:[1],active:[4],disabled:[4],variant:[32]}]]],["p-56609b82",[[1,"jump-accordion"]]],["p-c1665537",[[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"]}]]],["p-a5aaa1dd",[[1,"jump-card-ecommerce-option",{code:[1],imgUrl:[1,"img-url"],label:[1],sku:[1],taxonomy:[1]}]]],["p-a00d20d8",[[1,"jump-filter-checkbox",{value:[1],label:[1],checked:[516],count:[8],isChecked:[64]}]]],["p-9d9b0076",[[1,"jump-tab",{tabGroupName:[1,"tab-group-name"],variant:[1]},[[0,"jump-change-active-tab","changeActiveTabHandler"]]]]],["p-aee5a8c3",[[1,"jump-tab-panel",{identifier:[1],active:[4]}]]],["p-27fa0ba4",[[1,"jump-badge",{label:[1],variant:[513],dimension:[513],soft:[516],outline:[516]}]]],["p-60849b83",[[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]}]]]],e)}));
|
|
2
2
|
//# sourceMappingURL=jump-design-system.esm.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as i,h as s,H as e}from"./p-4d6cc90d.js";const h=":host{--hidden-display:none;display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}*[data-hide=true]{display:var(--hidden-display)}h5{margin:0 0 0.25rem}";const a=h;const n=class{constructor(s){t(this,s);this.change=i(this,"jump-filterchange",7);this.name="tax-name";this.heading="Titolo del filtro";this.otherLabel="Mostra altro";this.lessLabel="Mostra meno";this.maxElements=8;this.variant="default";this.values=[];this.value="";this.slotItems=undefined;this.inputs=[];this.showMore=true}async getValues(){return this.values}async getActiveAmount(){return this.values.length}async getInputs(){return this.inputs}async getName(){return this.name}toggleHiddenItems(t=true){this.slotItemsWrapper.assignedElements().forEach(((i,s)=>{if(s>this.maxElements&&!t){i.setAttribute("style","display: none")}else{i.setAttribute("style","display: initial")}}))}handleShowMore(){this.showMore=!this.showMore;this.toggleHiddenItems(this.showMore)}handleChange(t){const i=t.target;const s=i.value;if(i.tagName==="INPUT"){if(i.type==="checkbox"){if(i.checked){this.values.push(s)}else{const t=this.values.indexOf(s);if(t!==-1){this.values.splice(t,1)}}}else if(i.type==="radio"){this.value=s;this.values=[s]}}else if(i.tagName==="SELECT"){this.value=s;this.values=[s]}this.change.emit({name:this.name,values:this.values})}handleCheckboxChange(t){if(t.detail.checked&&!this.values.includes(t.detail.value)){this.values.push(t.detail.value)}else if(!t.detail.checked&&this.values.includes(t.detail.value)){const i=this.values.indexOf(t.detail.value);if(i!==-1){this.values.splice(i,1)}}this.change.emit({name:this.name,values:this.values})}componentDidLoad(){this.slotItems=this.slotItemsWrapper.assignedElements();this.slotItemsWrapper.addEventListener("change",this.handleChange.bind(this));this.slotItemsWrapper.addEventListener("jump-checkbox-change",this.handleCheckboxChange.bind(this));let t=0;this.slotItems.forEach((i=>{if(t>this.maxElements){i.style.display="none"}if(i.tagName==="INPUT"||i.tagName==="SELECT"){this.inputs.push(i);if(i.tagName==="INPUT"&&i.type==="radio"){i.name=this.name}}else{const t=i.querySelectorAll("input, select");if(t.length>0){t.forEach((t=>{this.inputs.push(t);if(t.tagName==="INPUT"&&t.type==="radio"){t.name=this.name}}))}}t++}))}render(){return s(e,{key:"41fedeb5fa5115b92a3af041d2fba3dec6cae266"},this.heading&&s("h5",{key:"18ac96c2d4eb6995afb92d6c2a7d79df08aee1aa"},this.heading),s("div",{key:"437810fd688063f569d4a6b2000ac2a45d450572",class:"filterGroup"},s("slot",{key:"0648a643e86e5c5d978590a8c4e14358252cfd03",ref:t=>this.slotItemsWrapper=t})),this.inputs.length>this.maxElements&&s("jump-button",{key:"bfcdf9b4c4d005a6fd7a802ec0eeb0a6c0aa99ea",variant:"primary",size:"small",text:true,name:this.showMore?this.otherLabel:this.lessLabel,"aria-label":this.showMore?this.otherLabel:this.lessLabel,ref:t=>{this.showMoreBtn=t},onClick:()=>this.handleShowMore()},this.showMore?this.otherLabel:this.lessLabel,s("jump-icon",{key:"cf42c4ac93733a34668426eae394966171ae72c3",slot:"suffix",name:this.showMore?"chevron-down":"chevron-up"})))}};n.style=a;export{n as jump_filtergroup};
|
|
2
|
+
//# sourceMappingURL=p-b4e60ca4.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["jumpFiltergroupCss","JumpFiltergroupStyle0","JumpFiltergroup","getValues","this","values","getActiveAmount","length","getInputs","inputs","getName","name","toggleHiddenItems","showAll","slotItemsWrapper","assignedElements","forEach","item","index","maxElements","setAttribute","handleShowMore","showMore","handleChange","event","target","newValue","value","tagName","type","checked","push","indexOf","splice","change","emit","handleCheckboxChange","detail","includes","componentDidLoad","slotItems","addEventListener","bind","style","display","querySelectorAll","input","render","h","Host","key","heading","class","ref","el","variant","size","text","otherLabel","lessLabel","showMoreBtn","onClick","slot"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n --hidden-display: none;\n\n display: block;\n\n slot {\n display: flex;\n flex-direction: column;\n gap: .25rem;\n margin-bottom: 1rem;\n }\n\n}\n\n*[data-hide=\"true\"] {\n display: var(--hidden-display);\n}\n\nh5 {\n margin: 0 0 .25rem;\n}\n\n//TODO: capire perché non prende questo stile\n\n\n","import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n showMoreBtn: HTMLElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems(showAll = true) {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if (index > this.maxElements && !showAll) {\n item.setAttribute('style', 'display: none');\n } else {\n item.setAttribute('style', 'display: initial');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems(this.showMore);\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if (index > this.maxElements) {\n //item.setAttribute('data-hide', 'true');\n item.style.display = 'none';\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n\n //this.toggleHiddenItems();\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n ref={(showMoreBtn) => {\n this.showMoreBtn = showMoreBtn;\n }}\n onClick={() => this.handleShowMore()}>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-up'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -12,11 +12,12 @@ export declare class JumpFiltergroup {
|
|
|
12
12
|
showMore: boolean;
|
|
13
13
|
change: any;
|
|
14
14
|
slotItemsWrapper: HTMLSlotElement;
|
|
15
|
+
showMoreBtn: HTMLElement;
|
|
15
16
|
getValues(): Promise<string[]>;
|
|
16
17
|
getActiveAmount(): Promise<number>;
|
|
17
18
|
getInputs(): Promise<any>;
|
|
18
19
|
getName(): Promise<string>;
|
|
19
|
-
toggleHiddenItems(): void;
|
|
20
|
+
toggleHiddenItems(showAll?: boolean): void;
|
|
20
21
|
handleShowMore(): void;
|
|
21
22
|
handleChange(event: Event): void;
|
|
22
23
|
handleCheckboxChange(event: CustomEvent): void;
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as s,H as e}from"./p-4d6cc90d.js";const h=":host{display:block}:host slot{display:flex;flex-direction:column;gap:0.25rem;margin-bottom:1rem}h5{margin:0 0 0.25rem}[data-hide=true]{display:none}";const a=h;const n=class{constructor(s){t(this,s);this.change=i(this,"jump-filterchange",7);this.name="tax-name";this.heading="Titolo del filtro";this.otherLabel="Mostra altro";this.lessLabel="Mostra meno";this.maxElements=8;this.variant="default";this.values=[];this.value="";this.slotItems=undefined;this.inputs=[];this.showMore=true}async getValues(){return this.values}async getActiveAmount(){return this.values.length}async getInputs(){return this.inputs}async getName(){return this.name}toggleHiddenItems(){this.slotItemsWrapper.assignedElements().forEach(((t,i)=>{if(i>this.maxElements){t.setAttribute("data-hide",this.showMore?"true":"false")}}))}handleShowMore(){this.showMore=!this.showMore;this.toggleHiddenItems()}handleChange(t){const i=t.target;const s=i.value;if(i.tagName==="INPUT"){if(i.type==="checkbox"){if(i.checked){this.values.push(s)}else{const t=this.values.indexOf(s);if(t!==-1){this.values.splice(t,1)}}}else if(i.type==="radio"){this.value=s;this.values=[s]}}else if(i.tagName==="SELECT"){this.value=s;this.values=[s]}this.change.emit({name:this.name,values:this.values})}handleCheckboxChange(t){if(t.detail.checked&&!this.values.includes(t.detail.value)){this.values.push(t.detail.value)}else if(!t.detail.checked&&this.values.includes(t.detail.value)){const i=this.values.indexOf(t.detail.value);if(i!==-1){this.values.splice(i,1)}}this.change.emit({name:this.name,values:this.values})}componentDidLoad(){this.slotItems=this.slotItemsWrapper.assignedElements();this.slotItemsWrapper.addEventListener("change",this.handleChange.bind(this));this.slotItemsWrapper.addEventListener("jump-checkbox-change",this.handleCheckboxChange.bind(this));let t=0;this.slotItems.forEach((i=>{if(t>this.maxElements){i.setAttribute("data-hide","true")}if(i.tagName==="INPUT"||i.tagName==="SELECT"){this.inputs.push(i);if(i.tagName==="INPUT"&&i.type==="radio"){i.name=this.name}}else{const t=i.querySelectorAll("input, select");if(t.length>0){t.forEach((t=>{this.inputs.push(t);if(t.tagName==="INPUT"&&t.type==="radio"){t.name=this.name}}))}}t++}))}render(){return s(e,{key:"dea99beebc67c24f7d4dd7e72e8c87a2504d8beb"},this.heading&&s("h5",{key:"62e6239ba68ed6a8b3bcbd4a09fb504e0d2546bc"},this.heading),s("div",{key:"4556c42ac238fe081d09a434d39973a84eb5de7d",class:"filterGroup"},s("slot",{key:"e62ab17b893a61bd7db190a0110c7b54827b88c2",ref:t=>this.slotItemsWrapper=t})),this.inputs.length>this.maxElements&&s("jump-button",{key:"452b3a669ac521aa3f421bd2d59915fd61af2534",variant:"primary",size:"small",text:true,name:this.showMore?this.otherLabel:this.lessLabel,"aria-label":this.showMore?this.otherLabel:this.lessLabel,onClick:()=>this.handleShowMore()},this.showMore?this.otherLabel:this.lessLabel,s("jump-icon",{key:"55c462c090eb7f2531365cc4618b68ec626af432",slot:"suffix",name:this.showMore?"chevron-down":"chevron-down"})))}};n.style=a;export{n as jump_filtergroup};
|
|
2
|
-
//# sourceMappingURL=p-a41ca036.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["jumpFiltergroupCss","JumpFiltergroupStyle0","JumpFiltergroup","getValues","this","values","getActiveAmount","length","getInputs","inputs","getName","name","toggleHiddenItems","slotItemsWrapper","assignedElements","forEach","item","index","maxElements","setAttribute","showMore","handleShowMore","handleChange","event","target","newValue","value","tagName","type","checked","push","indexOf","splice","change","emit","handleCheckboxChange","detail","includes","componentDidLoad","slotItems","addEventListener","bind","querySelectorAll","input","render","h","Host","key","heading","class","ref","el","variant","size","text","otherLabel","lessLabel","onClick","slot"],"sources":["src/components/jump-filtergroup/jump-filtergroup.scss?tag=jump-filtergroup&encapsulation=shadow","src/components/jump-filtergroup/jump-filtergroup.tsx"],"sourcesContent":[":host {\n display: block;\n\n slot {\n display: flex;\n flex-direction: column;\n gap: .25rem;\n margin-bottom: 1rem;\n }\n}\n\nh5 {\n margin: 0 0 .25rem;\n}\n//TODO: capire perché non prende questo stile\n[data-hide=\"true\"] {\n display: none;\n}\n\n\n","import { Component, Host, h, Prop, State, Event, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filtergroup',\n styleUrl: 'jump-filtergroup.scss',\n shadow: true,\n})\nexport class JumpFiltergroup {\n @Prop() name: string = 'tax-name';\n @Prop() heading: string = 'Titolo del filtro';\n @Prop() otherLabel: string = 'Mostra altro';\n @Prop() lessLabel: string = 'Mostra meno';\n @Prop() maxElements: number = 8;\n //TODO: Add Accordion variant within jump-acccordion component\n @Prop() variant: 'accordion' | 'default' = 'default';\n\n @State() values: string[] = [];\n @State() value: string = '';\n @State() slotItems: any;\n @State() inputs: any = [];\n @State() showMore: boolean = true;\n\n @Event({ eventName: 'jump-filterchange' }) change;\n\n slotItemsWrapper: HTMLSlotElement;\n\n @Method('getValues')\n async getValues() {\n return this.values;\n }\n\n @Method('getActiveAmount')\n async getActiveAmount() {\n return this.values.length;\n }\n\n @Method('getInputs')\n async getInputs() {\n return this.inputs;\n }\n\n @Method('getName')\n async getName() {\n return this.name;\n }\n\n toggleHiddenItems() {\n this.slotItemsWrapper.assignedElements().forEach((item, index) => {\n if(index > this.maxElements) {\n item.setAttribute('data-hide', this.showMore ? 'true' : 'false');\n }\n });\n }\n\n handleShowMore() {\n this.showMore = !this.showMore;\n this.toggleHiddenItems();\n }\n\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement | HTMLSelectElement;\n const newValue = target.value;\n\n if (target.tagName === 'INPUT') {\n if (target.type === 'checkbox') {\n // @ts-ignore\n if (target.checked) {\n this.values.push(newValue);\n } else {\n const index = this.values.indexOf(newValue);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n } else if (target.type === 'radio') {\n // Se è un input radio selezionato, imposta il valore e aggiorna this.values\n this.value = newValue;\n this.values = [newValue]; // Assicurati che this.values contenga solo il valore selezionato\n }\n } else if (target.tagName === 'SELECT') {\n // Se è un select, aggiorna semplicemente il valore\n this.value = newValue;\n this.values = [newValue];\n }\n\n // Emit event con i valori aggiornati\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n handleCheckboxChange(event: CustomEvent) {\n if (event.detail.checked && !this.values.includes(event.detail.value)) {\n this.values.push(event.detail.value);\n } else if (!event.detail.checked && this.values.includes(event.detail.value)) {\n const index = this.values.indexOf(event.detail.value);\n if (index !== -1) {\n this.values.splice(index, 1);\n }\n }\n this.change.emit({\n name: this.name,\n values: this.values,\n });\n }\n\n componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.bind(this));\n this.slotItemsWrapper.addEventListener('jump-checkbox-change', this.handleCheckboxChange.bind(this));\n\n let index = 0;\n this.slotItems.forEach((item) => {\n if(index > this.maxElements) {\n item.setAttribute('data-hide', 'true');\n }\n if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {\n this.inputs.push(item);\n if (item.tagName === 'INPUT' && item.type === 'radio') {\n item.name = this.name;\n }\n } else {\n const inputs = item.querySelectorAll('input, select');\n if (inputs.length > 0) {\n inputs.forEach((input) => {\n this.inputs.push(input);\n\n if (input.tagName === 'INPUT' && input.type === 'radio') {\n input.name = this.name;\n }\n });\n }\n }\n index++;\n });\n }\n\n render() {\n return (\n <Host>\n {this.heading && <h5>{this.heading}</h5>}\n <div class=\"filterGroup\">\n <slot ref={(el) => (this.slotItemsWrapper = el as HTMLSlotElement)}></slot>\n </div>\n {this.inputs.length > this.maxElements &&\n <jump-button variant=\"primary\" size=\"small\" text name={this.showMore ? this.otherLabel : this.lessLabel}\n aria-label={this.showMore ? this.otherLabel : this.lessLabel}\n onClick={() => this.handleShowMore() }>\n {this.showMore ? this.otherLabel : this.lessLabel}\n <jump-icon slot=\"suffix\" name={this.showMore ? 'chevron-down' : 'chevron-down'}></jump-icon>\n </jump-button>\n }\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|