npm - @jumpgroup/jump-design-system - Versions diffs - 0.3.9 → 0.3.15 - Mend

@jumpgroup/jump-design-system 0.3.9 → 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.

Files changed (120) hide show

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

@@ -1,8 +1,15 @@
 :host h3 {
   margin: 0;
 }
-:host .filtersDrawer {
+.filtersDrawer {
   display: flex;
   flex-direction: column;
   gap: 1rem;
+}
+.filtersDrawer .filtersDrawer__header {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  gap: 0.5rem;
 }

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

@@ -4,7 +4,7 @@ export class JumpFilter {
         this.direction = 'vertical';
         this.filterHeading = 'Filtra per';
         this.filterButtonLabel = 'Filtri';
-        this.filterButtonIcon = 'filter';
+        this.filterButtonIcon = 'sliders';
         this.mobileThreshold = 768;
         this.filters = undefined;
         this.activeFilters = 0;
@@ -39,8 +39,9 @@ export class JumpFilter {
         }
     }
     render() {
-        return (h(Host, { key: 'a8a5a1f52c55e0a4673950ccc8bf97ced277b5e1', mobileFilters: this.showMobileFilters }, this.isMobile && h("jump-button", { key: '8cb3ab66f4d8c8e7f40799c4ba75a1c4ae9afcdb', ref: (el) => { this.mobileToggle = el; }, buttonId: this.filterButtonIcon, variant: 'primary', outline: true }, h("slot", { key: '9e04e5f5ae56d7b902bec14c5552cf6741569f0e', name: "prefix" }, this.filterButtonIcon && h("jump-icon", { key: '48ed3066dc3cf124dcbe331e75b173ff66e11ced', class: "small", name: this.filterButtonIcon }), this.filterButtonLabel), h("slot", { key: '05e6c49117d6a1d2948177c76b3cb147bcf56229', name: "suffix" }, this.activeFilters > 0 ? `(${this.activeFilters})` : '0')), h("div", { key: '7cd87540e56dc46be79ea0ffce82b242d11d105a', ref: (el) => { this.filtersDrawer = el; }, class: "filtersDrawer", "data-variant": this.direction }, !this.isMobile &&
-            h("div", { key: '315a7e739cb230f14dd02f965bebe8be357de3f7', class: 'filtersDrawer__header' }, h("jump-icon", { key: '931920029b78afd420d0aac3f20b050096de9e3c', class: "small", name: this.filterButtonIcon }), h("h3", { key: '634402d897250a72a282b79188d48a1813c27337' }, this.filterHeading)), h("slot", { key: '48db024bd7aeb2e29d537d59cd8556599613a8ba' }))));
+        return (h(Host, { key: '792f2607cc6d4e4987884b4e1bf06a63e447b296', mobileFilters: this.showMobileFilters }, this.isMobile && h("jump-button", { key: '02e4a491b2d1593a26353ff3886ca5c07319596e', ref: (el) => { this.mobileToggle = el; }, buttonId: this.filterButtonIcon, variant: 'primary', outline: true }, h("slot", { key: 'bf26e0b6de709eb73245754b7bc01fc800a65f54', name: "prefix" }, this.filterButtonIcon &&
+            h("jump-icon", { key: '7a6897ca7dcc5ae3e3d7665e938db135e80d05a2', library: "fa", category: "regular", name: this.filterButtonIcon, size: "small" }), this.filterButtonLabel), h("slot", { key: '07639a79439659f99621cbdb187f2c3774c858f7', name: "suffix" }, this.activeFilters > 0 ? `(${this.activeFilters})` : '0')), h("div", { key: '1ad1334d892c929d449cbe24763e28c31b049d47', ref: (el) => { this.filtersDrawer = el; }, class: "filtersDrawer", "data-variant": this.direction }, !this.isMobile &&
+            h("div", { key: '7132ae093a15f6fa699beda14b6ca54f568a4fac', class: 'filtersDrawer__header' }, h("jump-icon", { key: '2ec24b4c6fe935de64048e71aff5f02be14655e9', class: "small", name: this.filterButtonIcon }), h("h3", { key: '188eb63f15bfd8426d071ab6dcc43740cd049157' }, this.filterHeading)), h("slot", { key: '6f5d6b88d61a4534060973eef110bc2891b6083b' }))));
     }
     static get is() { return "jump-filter"; }
     static get encapsulation() { return "shadow"; }
@@ -126,7 +127,7 @@ export class JumpFilter {
                 },
                 "attribute": "filter-button-icon",
                 "reflect": false,
-                "defaultValue": "'filter'"
+                "defaultValue": "'sliders'"
             },
             "mobileThreshold": {
                 "type": "number",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"jump-filter.js","sourceRoot":"","sources":["../../../src/components/jump-filter/jump-filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAOhF,MAAM,OAAO,UAAU;;yBAE0B,UAAU;6BACzB,YAAY;iCACR,QAAQ;gCACT,~~QAAQ~~;+~~BACT~~,GAAG;;6BAGJ,CAAC;iCACI,KAAK;wBACd,KAAK;;IAMlC,mBAAmB,CAAC,KAAkB;QACpC,8FAA8F;QAC9F,IAAI,CAAC,OAAO,mCAAO,IAAI,CAAC,OAAO,KAAE,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,GAAC,CAAC;QAC3E,OAAO,CAAC,GAAG,CAAC,0CAA0C,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAItE,oCAAoC;IACtC,CAAC;IAGD,YAAY;QACV,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC;IAC3D,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,UAAU;QACd,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAED,mBAAmB;QACjB,IAAG,IAAI,CAAC,YAAY,EAAC,CAAC;YACpB,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBAC/C,IAAG,CAAC,IAAI,CAAC,QAAQ;oBAAE,OAAO;gBAC1B,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;YACnD,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB;YACxC,IAAI,CAAC,QAAQ,IAAI,oEAChB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,GAAE,IAAI,CAAC,YAAY,GAAG,EAAE,CAAA,CAAA,CAAC,EACrC,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI;gBAClE,6DAAM,IAAI,EAAC,QAAQ;oBAChB,IAAI,CAAC,gBAAgB,IAAI,~~kEAAW~~,~~KAAK~~,EAAC,~~OAAO~~,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,~~GAAc~~;~~oBAC3F~~,IAAI,CAAC,iBAAiB,CAClB;gBACP,6DAAM,IAAI,EAAC,QAAQ,IAChB,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,GAAG,CACpD,CACK;YAEb,4DACC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,GAAE,IAAI,CAAC,aAAa,GAAG,EAAE,CAAA,CAAA,CAAC,EACtC,KAAK,EAAC,eAAe,kBAAe,IAAI,CAAC,SAAS;gBACjD,CAAC,IAAI,CAAC,QAAQ;oBACf,4DAAK,KAAK,EAAE,uBAAuB;wBACjC,kEAAW,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,GAAc;wBAClE,6DAAK,IAAI,CAAC,aAAa,CAAM,CACzB;gBACN,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, State, Listen, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filter',\n styleUrl: 'jump-filter.scss',\n shadow: true,\n})\nexport class JumpFilter {\n\n @Prop() direction: 'horizontal' \| 'vertical' = 'vertical';\n @Prop() filterHeading: string = 'Filtra per';\n @Prop() filterButtonLabel: string = 'Filtri';\n @Prop() filterButtonIcon: string = '~~filter~~';\n @Prop() mobileThreshold: number = 768;\n @Prop() filters: any;\n\n @State() activeFilters: number = 0;\n @State() showMobileFilters: boolean = false;\n @State() isMobile: boolean = false;\n\n mobileToggle: HTMLElement \| null;\n filtersDrawer: HTMLElement;\n\n @Listen('jump-filterchange')\n filterChangeHandler(event: CustomEvent) {\n //set this.filter as this.filters[event.detail.name] = event.detail.value; even if not present\n this.filters = {...this.filters, [event.detail.name]: event.detail.values};\n console.log('Received the custom filterChange event: ', this.filters);\n\n\n\n //TODO: increment this.activeFilters\n }\n\n @Listen('resize', { target: 'window' })\n handleResize() {\n this.isMobile = window.innerWidth < this.mobileThreshold;\n }\n\n /*\n Get the active filters from the component\n */\n @Method()\n async getFilters() {\n return this.filters;\n }\n\n componentDidLoad(){\n this.toggleMobileFilters();\n }\n\n toggleMobileFilters() {\n if(this.mobileToggle){\n this.mobileToggle.addEventListener('click', () => {\n if(!this.isMobile) return;\n this.showMobileFilters = !this.showMobileFilters;\n });\n }\n }\n\n render() {\n return (\n <Host mobileFilters={this.showMobileFilters}>\n {this.isMobile && <jump-button\n ref={(el) => {this.mobileToggle = el}}\n buttonId={this.filterButtonIcon} variant={'primary'} outline={true}>\n <slot name=\"prefix\">\n {this.filterButtonIcon && <jump-icon ~~class~~=\"~~small~~\" name={this.filterButtonIcon}></jump-icon>}\n {this.filterButtonLabel}\n </slot>\n <slot name=\"suffix\">\n {this.activeFilters > 0 ? `(${this.activeFilters})` : '0'}\n </slot>\n </jump-button>}\n\n {<div\n ref={(el) => {this.filtersDrawer = el}}\n class=\"filtersDrawer\" data-variant={this.direction}>\n {!this.isMobile &&\n <div class={'filtersDrawer__header'}>\n <jump-icon class=\"small\" name={this.filterButtonIcon}></jump-icon>\n <h3>{this.filterHeading}</h3>\n </div>}\n <slot></slot>\n </div>}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"jump-filter.js","sourceRoot":"","sources":["../../../src/components/jump-filter/jump-filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAOhF,MAAM,OAAO,UAAU;;yBAE0B,UAAU;6BACzB,YAAY;iCACR,QAAQ;gCACT,SAAS;+BACV,GAAG;;6BAGJ,CAAC;iCACI,KAAK;wBACd,KAAK;;IAMlC,mBAAmB,CAAC,KAAkB;QACpC,8FAA8F;QAC9F,IAAI,CAAC,OAAO,mCAAO,IAAI,CAAC,OAAO,KAAE,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,GAAC,CAAC;QAC3E,OAAO,CAAC,GAAG,CAAC,0CAA0C,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAItE,oCAAoC;IACtC,CAAC;IAGD,YAAY;QACV,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC;IAC3D,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,UAAU;QACd,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAED,mBAAmB;QACjB,IAAG,IAAI,CAAC,YAAY,EAAC,CAAC;YACpB,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBAC/C,IAAG,CAAC,IAAI,CAAC,QAAQ;oBAAE,OAAO;gBAC1B,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;YACnD,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB;YACxC,IAAI,CAAC,QAAQ,IAAI,oEAChB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,GAAE,IAAI,CAAC,YAAY,GAAG,EAAE,CAAA,CAAA,CAAC,EACrC,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI;gBAClE,6DAAM,IAAI,EAAC,QAAQ;oBAChB,IAAI,CAAC,gBAAgB;wBACpB,kEAAW,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,EAAC,OAAO,GAAa;oBAClG,IAAI,CAAC,iBAAiB,CAClB;gBACP,6DAAM,IAAI,EAAC,QAAQ,IAChB,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,GAAG,CACpD,CACK;YAEb,4DACC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,GAAE,IAAI,CAAC,aAAa,GAAG,EAAE,CAAA,CAAA,CAAC,EACtC,KAAK,EAAC,eAAe,kBAAe,IAAI,CAAC,SAAS;gBACjD,CAAC,IAAI,CAAC,QAAQ;oBACf,4DAAK,KAAK,EAAE,uBAAuB;wBACjC,kEAAW,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,GAAc;wBAClE,6DAAK,IAAI,CAAC,aAAa,CAAM,CACzB;gBACN,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, State, Listen, Method } from '@stencil/core';\n\n@Component({\n tag: 'jump-filter',\n styleUrl: 'jump-filter.scss',\n shadow: true,\n})\nexport class JumpFilter {\n\n @Prop() direction: 'horizontal' \| 'vertical' = 'vertical';\n @Prop() filterHeading: string = 'Filtra per';\n @Prop() filterButtonLabel: string = 'Filtri';\n @Prop() filterButtonIcon: string = 'sliders';\n @Prop() mobileThreshold: number = 768;\n @Prop() filters: any;\n\n @State() activeFilters: number = 0;\n @State() showMobileFilters: boolean = false;\n @State() isMobile: boolean = false;\n\n mobileToggle: HTMLElement \| null;\n filtersDrawer: HTMLElement;\n\n @Listen('jump-filterchange')\n filterChangeHandler(event: CustomEvent) {\n //set this.filter as this.filters[event.detail.name] = event.detail.value; even if not present\n this.filters = {...this.filters, [event.detail.name]: event.detail.values};\n console.log('Received the custom filterChange event: ', this.filters);\n\n\n\n //TODO: increment this.activeFilters\n }\n\n @Listen('resize', { target: 'window' })\n handleResize() {\n this.isMobile = window.innerWidth < this.mobileThreshold;\n }\n\n /*\n Get the active filters from the component\n */\n @Method()\n async getFilters() {\n return this.filters;\n }\n\n componentDidLoad(){\n this.toggleMobileFilters();\n }\n\n toggleMobileFilters() {\n if(this.mobileToggle){\n this.mobileToggle.addEventListener('click', () => {\n if(!this.isMobile) return;\n this.showMobileFilters = !this.showMobileFilters;\n });\n }\n }\n\n render() {\n return (\n <Host mobileFilters={this.showMobileFilters}>\n {this.isMobile && <jump-button\n ref={(el) => {this.mobileToggle = el}}\n buttonId={this.filterButtonIcon} variant={'primary'} outline={true}>\n <slot name=\"prefix\">\n {this.filterButtonIcon &&\n <jump-icon library=\"fa\" category=\"regular\" name={this.filterButtonIcon} size=\"small\"></jump-icon>}\n {this.filterButtonLabel}\n </slot>\n <slot name=\"suffix\">\n {this.activeFilters > 0 ? `(${this.activeFilters})` : '0'}\n </slot>\n </jump-button>}\n\n {<div\n ref={(el) => {this.filtersDrawer = el}}\n class=\"filtersDrawer\" data-variant={this.direction}>\n {!this.isMobile &&\n <div class={'filtersDrawer__header'}>\n <jump-icon class=\"small\" name={this.filterButtonIcon}></jump-icon>\n <h3>{this.filterHeading}</h3>\n </div>}\n <slot></slot>\n </div>}\n </Host>\n );\n }\n}\n"]}

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

@@ -62,11 +62,12 @@ const TemplateWithSelectFilter = (args) => {
 export const WithSelectFilter = TemplateWithSelectFilter.bind({});
 const TemplateWithCheckboxFilter = (args) => {
     const attributes = generateAttributesFromArgs(args);
-    return formatHtml(`<jump-filter ${attributes} name='sort' title='Ordina per'>
+    return formatHtml(`
+  <jump-filter ${attributes} name='sort' title='Ordina per'>
     <jump-filtergroup class='filterGroupCheckbox' name='animal' title='Animale' other-label='Mostra di più' max-elements='3'>
-      <label><input type='checkbox' value='cane'>Cane</label>
-      <label><input type='checkbox' value='gatto'>Gatto</label>
-      <label><input type='checkbox' value='pesce'>Pesce</label>
+     <jump-filter-checkbox value="cane" label="Cane" count="12"></jump-filter-checkbox>
+     <jump-filter-checkbox value="gatto" label="Gatto"></jump-filter-checkbox>
+     <jump-filter-checkbox value="pesce" label="Pesce"></jump-filter-checkbox>
     </jump-filtergroup>
   </jump-filter>`);
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"jump-filter.stories.js","sourceRoot":"","sources":["../../../src/components/jump-filter/jump-filter.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACb,KAAK,EAAE,+BAA+B;IACtC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,gBAAgB;QAChB,SAAS,EAAE;YACT,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,OAAO,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;aACpC;SACF;QACD,aAAa,EAAE;YACb,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,gCAAgC;aAC9C;SACF;QACD,iBAAiB,EAAE;YACjB,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,gBAAgB,EAAE;YAChB,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,eAAe,EAAE;YACf,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,YAAY,EAAE,GAAG;SAClB;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,gBAAgB,UAAU;;;;;;;;;eAS/B,CAAC,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEzC,MAAM,wBAAwB,GAAG,CAAC,IAAI,EAAE,EAAE;IACxC,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,qBAAqB,UAAU;;;;;;;oBAO/B,CAAC,CAAC;AACtB,CAAC,CAAA;AACD,MAAM,CAAC,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAElE,MAAM,0BAA0B,GAAG,CAAC,IAAI,EAAE,EAAE;IAC1C,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,~~gBAAgB,~~UAAU;;;;;;~~iBAM7B~~,CAAC,CAAC;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,0BAA0B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEtE,uBAAuB;AACvB,MAAM,wBAAwB,GAAG,CAAC,IAAI,EAAE,EAAE;IACxC,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,gBAAgB,UAAU;;;;;;;;;;;;;;;;;;;;;iBAqB7B,CAAC,CAAC;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAGlE,MAAM,uBAAuB,GAAG,CAAC,IAAI,EAAE,EAAE;IACvC,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,gBAAgB,UAAU;;;;;;;;;;;;;;;;iBAgB7B,CAAC,CAAC;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,uBAAuB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Filters/JumpFilter',\n tags: ['autodocs'],\n argTypes: {\n //list all props\n direction: {\n control: {\n type: 'select',\n options: ['horizontal', 'vertical']\n }\n },\n filterHeading: {\n control: {\n type: 'text',\n description: 'Intestazione drawer dei filtri'\n }\n },\n filterButtonLabel: {\n control: {\n type: 'text'\n }\n },\n filterButtonIcon: {\n control: {\n type: 'text'\n }\n },\n mobileThreshold: {\n control: {\n type: 'number'\n },\n defaultValue: 768\n },\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes}>\n <!-- TODO: Replace with jump components -->\n <jump-filtergroup class='filterGroup' name=\"tax-name\" title=\"Titolo del filtro\" other-label=\"Mostra di più\" max-elements=3>\n <select label=\"Ordina per\" variant=\"primary\" size=\"small\">\n <option value=\"0\">Ordina per</option>\n <option value=\"latest\">Più recenti</option>\n <option value=\"oldest\">Più vecchi</option>\n </select>\n </jump-filtergroup>\n</jump-filter>`);\n};\n\nexport const Default = Template.bind({});\n\nconst TemplateWithSelectFilter = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filtergroup ${attributes} name='sort' title='Ordina per'>\n <select class='filterGroupSelect' label=\"Ordina per\" variant=\"primary\" size=\"small\">\n <option value=\"0\">Ordina per</option>\n <option value=\"latest\">Più recenti</option>\n <option value=\"oldest\">Più vecchi</option>\n </select>\n </jump-filtergroup>\n</jump-filtergroup>`);\n}\nexport const WithSelectFilter = TemplateWithSelectFilter.bind({});\n\nconst TemplateWithCheckboxFilter = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes} name='sort' title='Ordina per'>\n <jump-filtergroup class='filterGroupCheckbox' name='animal' title='Animale' other-label='Mostra di più' max-elements='3'>\n <~~label><input type='~~checkbox' value='cane'>Cane~~</label~~>\n <~~label><input type='~~checkbox' value='gatto'>Gatto~~</label~~>\n <~~label><input type='~~checkbox' value='pesce'>Pesce~~</label~~>\n </jump-filtergroup>\n </jump-filter>`);\n}\n\nexport const WithCheckboxFilter = TemplateWithCheckboxFilter.bind({});\n\n//mixed kind of filters\nconst TemplateWithMixedFilters = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes} name='sort' title='Ordina per'>\n <!-- select group -->\n <jump-filtergroup class='filterGroupSelect' name=\"tax-select-sample\" title=\"Ordinamento\" other-label=\"Mostra di più\" max-elements=3>\n <select class='filterGroupSelect' label=\"Ordina per\" variant=\"primary\" size=\"small\">\n <option value=\"0\">Ordina per</option>\n <option value=\"latest\">Più recenti</option>\n <option value=\"oldest\">Più vecchi</option>\n </select>\n </jump-filtergroup>\n\n <jump-filtergroup class='filterGroupCheckbox' name=\"tax-animal-sample-checkbox\" title=\"Animali\" other-label=\"Mostra di più\" max-elements=3>\n <label><input type='checkbox' value='cane'>Cane</label>\n <label><input type='checkbox' value='gatto'>Gatto</label>\n <label><input type='checkbox' value='pesce'>Pesce</label>\n </jump-filtergroup>\n\n <!-- radio group -->\n <jump-filtergroup class='filterGroupRadio' name=\"tax-animal-sample-radio\" title=\"Animali 2\" other-label=\"Mostra di più\" max-elements=3>\n <label><input type='radio' value='snakes'>Serpenti</label>\n <label><input type='radio' value='spiders'>Ragni</label>\n </jump-filtergroup>\n </jump-filter>`);\n}\n\nexport const WithMixedFilters = TemplateWithMixedFilters.bind({});\n\n\nconst TemplateWithMoreFilters = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes} name='sort' title='Ordina per'>\n <jump-filtergroup class='filterGroupCheckbox' name=\"tax-animal-sample-checkbox\" title=\"Animali\" other-label=\"Mostra di più\" max-elements=8>\n <label><input type='checkbox' value='cane'>Cane</label>\n <label><input type='checkbox' value='gatto'>Gatto</label>\n <label><input type='checkbox' value='pesce'>Pesce</label>\n <label><input type='checkbox' value='cavallo'>Cavallo</label>\n <label><input type='checkbox' value='topo'>Topo</label>\n <label><input type='checkbox' value='coniglio'>Coniglio</label>\n <label><input type='checkbox' value='pappagallo'>Pappagallo</label>\n <label><input type='checkbox' value='tartaruga'>Tartaruga</label>\n <label><input type='checkbox' value='criceto'>Criceto</label>\n <label><input type='checkbox' value='canarino'>Canarino</label>\n <label><input type='checkbox' value='pesciolino'>Pesciolino</label>\n <label><input type='checkbox' value='pappagallino'>Pappagallino</label>\n <label><input type='checkbox' value='tartarughina'>Tartarughina</label>\n </jump-filtergroup>\n </jump-filter>`);\n}\n\nexport const WithMoreFilters = TemplateWithMoreFilters.bind({});\n"]}
1	+ {"version":3,"file":"jump-filter.stories.js","sourceRoot":"","sources":["../../../src/components/jump-filter/jump-filter.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACb,KAAK,EAAE,+BAA+B;IACtC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,gBAAgB;QAChB,SAAS,EAAE;YACT,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,OAAO,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;aACpC;SACF;QACD,aAAa,EAAE;YACb,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,gCAAgC;aAC9C;SACF;QACD,iBAAiB,EAAE;YACjB,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,gBAAgB,EAAE;YAChB,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,eAAe,EAAE;YACf,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,YAAY,EAAE,GAAG;SAClB;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,gBAAgB,UAAU;;;;;;;;;eAS/B,CAAC,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEzC,MAAM,wBAAwB,GAAG,CAAC,IAAI,EAAE,EAAE;IACxC,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,qBAAqB,UAAU;;;;;;;oBAO/B,CAAC,CAAC;AACtB,CAAC,CAAA;AACD,MAAM,CAAC,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAElE,MAAM,0BAA0B,GAAG,CAAC,IAAI,EAAE,EAAE;IAC1C,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC;iBACH,UAAU;;;;;;iBAMV,CAAC,CAAC;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,0BAA0B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEtE,uBAAuB;AACvB,MAAM,wBAAwB,GAAG,CAAC,IAAI,EAAE,EAAE;IACxC,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,gBAAgB,UAAU;;;;;;;;;;;;;;;;;;;;;iBAqB7B,CAAC,CAAC;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAGlE,MAAM,uBAAuB,GAAG,CAAC,IAAI,EAAE,EAAE;IACvC,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,gBAAgB,UAAU;;;;;;;;;;;;;;;;iBAgB7B,CAAC,CAAC;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,uBAAuB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Filters/JumpFilter',\n tags: ['autodocs'],\n argTypes: {\n //list all props\n direction: {\n control: {\n type: 'select',\n options: ['horizontal', 'vertical']\n }\n },\n filterHeading: {\n control: {\n type: 'text',\n description: 'Intestazione drawer dei filtri'\n }\n },\n filterButtonLabel: {\n control: {\n type: 'text'\n }\n },\n filterButtonIcon: {\n control: {\n type: 'text'\n }\n },\n mobileThreshold: {\n control: {\n type: 'number'\n },\n defaultValue: 768\n },\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes}>\n <!-- TODO: Replace with jump components -->\n <jump-filtergroup class='filterGroup' name=\"tax-name\" title=\"Titolo del filtro\" other-label=\"Mostra di più\" max-elements=3>\n <select label=\"Ordina per\" variant=\"primary\" size=\"small\">\n <option value=\"0\">Ordina per</option>\n <option value=\"latest\">Più recenti</option>\n <option value=\"oldest\">Più vecchi</option>\n </select>\n </jump-filtergroup>\n</jump-filter>`);\n};\n\nexport const Default = Template.bind({});\n\nconst TemplateWithSelectFilter = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filtergroup ${attributes} name='sort' title='Ordina per'>\n <select class='filterGroupSelect' label=\"Ordina per\" variant=\"primary\" size=\"small\">\n <option value=\"0\">Ordina per</option>\n <option value=\"latest\">Più recenti</option>\n <option value=\"oldest\">Più vecchi</option>\n </select>\n </jump-filtergroup>\n</jump-filtergroup>`);\n}\nexport const WithSelectFilter = TemplateWithSelectFilter.bind({});\n\nconst TemplateWithCheckboxFilter = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`\n <jump-filter ${attributes} name='sort' title='Ordina per'>\n <jump-filtergroup class='filterGroupCheckbox' name='animal' title='Animale' other-label='Mostra di più' max-elements='3'>\n <jump-filter-checkbox value=\"cane\" label=\"Cane\" count=\"12\"></jump-filter-checkbox>\n <jump-filter-checkbox value=\"gatto\" label=\"Gatto\"></jump-filter-checkbox>\n <jump-filter-checkbox value=\"pesce\" label=\"Pesce\"></jump-filter-checkbox>\n </jump-filtergroup>\n </jump-filter>`);\n}\n\nexport const WithCheckboxFilter = TemplateWithCheckboxFilter.bind({});\n\n//mixed kind of filters\nconst TemplateWithMixedFilters = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes} name='sort' title='Ordina per'>\n <!-- select group -->\n <jump-filtergroup class='filterGroupSelect' name=\"tax-select-sample\" title=\"Ordinamento\" other-label=\"Mostra di più\" max-elements=3>\n <select class='filterGroupSelect' label=\"Ordina per\" variant=\"primary\" size=\"small\">\n <option value=\"0\">Ordina per</option>\n <option value=\"latest\">Più recenti</option>\n <option value=\"oldest\">Più vecchi</option>\n </select>\n </jump-filtergroup>\n\n <jump-filtergroup class='filterGroupCheckbox' name=\"tax-animal-sample-checkbox\" title=\"Animali\" other-label=\"Mostra di più\" max-elements=3>\n <label><input type='checkbox' value='cane'>Cane</label>\n <label><input type='checkbox' value='gatto'>Gatto</label>\n <label><input type='checkbox' value='pesce'>Pesce</label>\n </jump-filtergroup>\n\n <!-- radio group -->\n <jump-filtergroup class='filterGroupRadio' name=\"tax-animal-sample-radio\" title=\"Animali 2\" other-label=\"Mostra di più\" max-elements=3>\n <label><input type='radio' value='snakes'>Serpenti</label>\n <label><input type='radio' value='spiders'>Ragni</label>\n </jump-filtergroup>\n </jump-filter>`);\n}\n\nexport const WithMixedFilters = TemplateWithMixedFilters.bind({});\n\n\nconst TemplateWithMoreFilters = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter ${attributes} name='sort' title='Ordina per'>\n <jump-filtergroup class='filterGroupCheckbox' name=\"tax-animal-sample-checkbox\" title=\"Animali\" other-label=\"Mostra di più\" max-elements=8>\n <label><input type='checkbox' value='cane'>Cane</label>\n <label><input type='checkbox' value='gatto'>Gatto</label>\n <label><input type='checkbox' value='pesce'>Pesce</label>\n <label><input type='checkbox' value='cavallo'>Cavallo</label>\n <label><input type='checkbox' value='topo'>Topo</label>\n <label><input type='checkbox' value='coniglio'>Coniglio</label>\n <label><input type='checkbox' value='pappagallo'>Pappagallo</label>\n <label><input type='checkbox' value='tartaruga'>Tartaruga</label>\n <label><input type='checkbox' value='criceto'>Criceto</label>\n <label><input type='checkbox' value='canarino'>Canarino</label>\n <label><input type='checkbox' value='pesciolino'>Pesciolino</label>\n <label><input type='checkbox' value='pappagallino'>Pappagallino</label>\n <label><input type='checkbox' value='tartarughina'>Tartarughina</label>\n </jump-filtergroup>\n </jump-filter>`);\n}\n\nexport const WithMoreFilters = TemplateWithMoreFilters.bind({});\n"]}

package/dist/collection/components/jump-filter-checkbox/jump-filter-checkbox.css ADDED Viewed

@@ -0,0 +1,31 @@
+:host {
+  display: flex;
+  width: 100%;
+}
+:host .count {
+  color: var(--neutral-grey-secondary, #707070);
+}
+:host sl-checkbox {
+  display: flex;
+  width: 100%;
+}
+:host sl-checkbox::part(control) {
+  height: 1rem;
+  width: 1rem;
+  border: 1px solid var(--neutral-grey-secondary, #707070);
+  border-radius: 3px;
+}
+:host sl-checkbox::part(control--checked) {
+  background-color: var(--status-interaction-standard, #2C6ECB);
+  border-color: var(--status-interaction-standard, #2C6ECB);
+  color: var(--neutral-ultralight, #fff);
+}
+:host sl-checkbox::part(label) {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: flex-start;
+  flex-grow: 1;
+  color: var(--neutral-grey-primary, #1d1d1d);
+  font-family: var(--ff-primary), serif;
+}

package/dist/collection/components/jump-filter-checkbox/jump-filter-checkbox.js ADDED Viewed

@@ -0,0 +1,161 @@
+import { Host, h } from "@stencil/core";
+import "@shoelace-style/shoelace/dist/components/checkbox/checkbox.js";
+export class JumpFilterCheckbox {
+    constructor() {
+        this.value = undefined;
+        this.label = undefined;
+        this.checked = false;
+        this.count = null;
+    }
+    componentDidLoad() {
+        this.listenSLChange();
+    }
+    listenSLChange() {
+        if (this.host) {
+            this.host.addEventListener('sl-change', () => {
+                //invert the checked value
+                this.checked = !this.checked;
+                this.toggleCheckbox.emit({
+                    //@ts-ignore
+                    value: this.el.value,
+                    //@ts-ignore
+                    checked: this.checked,
+                });
+            });
+        }
+    }
+    async isChecked() {
+        // @ts-ignore
+        return this.el.checked;
+    }
+    render() {
+        return (h(Host, { key: '8c7ea463a6e26c6f77962cd0295dcb41411fa074', ref: (host) => this.host = host }, this.value && this.label &&
+            h("sl-checkbox", { key: '7467e1c364d868c7d58a58937411daf4f8c4e397', value: this.value, ref: (el) => this.el = el, checked: this.checked }, this.label), this.count && h("span", { key: 'e3add7e4ad2024096d8484b93cb276ac714d57d8', class: "count" }, "(", this.count, ")")));
+    }
+    static get is() { return "jump-filter-checkbox"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["jump-filter-checkbox.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["jump-filter-checkbox.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "value",
+                "reflect": false
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "label",
+                "reflect": false
+            },
+            "checked": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "checked",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "count": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "number | string",
+                    "resolved": "number | string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "count",
+                "reflect": false,
+                "defaultValue": "null"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "toggleCheckbox",
+                "name": "jump-checkbox-change",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "isChecked": {
+                "complexType": {
+                    "signature": "() => Promise<any>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<any>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
+        };
+    }
+}
+//# sourceMappingURL=jump-filter-checkbox.js.map

package/dist/collection/components/jump-filter-checkbox/jump-filter-checkbox.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"jump-filter-checkbox.js","sourceRoot":"","sources":["../../../src/components/jump-filter-checkbox/jump-filter-checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAgB,MAAM,EAAE,MAAM,eAAe,CAAC;AACtF,OAAO,+DAA+D,CAAC;AAOvE,MAAM,OAAO,kBAAkB;;;;uBAIe,KAAK;qBAChB,IAAI;;IAKrC,gBAAgB;QACd,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,cAAc;QACZ,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,GAAG,EAAE;gBAC3C,0BAA0B;gBAC1B,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;gBAC7B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;oBACvB,YAAY;oBACZ,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC,KAAK;oBACpB,YAAY;oBACZ,OAAO,EAAE,IAAI,CAAC,OAAO;iBACtB,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAKD,KAAK,CAAC,SAAS;QACb,aAAa;QACb,OAAO,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,GAAG,EAAE,CAAC,IAAiB,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI;YAC/C,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK;gBACvB,oEAAa,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,EAAe,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,EACpE,OAAO,EAAE,IAAI,CAAC,OAAO,IACpB,IAAI,CAAC,KAAK,CACC;YACf,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,OAAO;;gBAAG,IAAI,CAAC,KAAK;oBAAS,CACnD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Method } from '@stencil/core';\nimport '@shoelace-style/shoelace/dist/components/checkbox/checkbox.js';\n\n@Component({\n tag: 'jump-filter-checkbox',\n styleUrl: 'jump-filter-checkbox.scss',\n shadow: true,\n})\nexport class JumpFilterCheckbox {\n\n @Prop() value: string;\n @Prop() label: string;\n @Prop({ reflect: true }) checked: boolean = false;\n @Prop() count: number | string = null;\n\n host: HTMLElement;\n el: HTMLElement;\n\n componentDidLoad() {\n this.listenSLChange();\n }\n\n listenSLChange() {\n if (this.host) {\n this.host.addEventListener('sl-change', () => {\n //invert the checked value\n this.checked = !this.checked;\n this.toggleCheckbox.emit({\n //@ts-ignore\n value: this.el.value,\n //@ts-ignore\n checked: this.checked,\n });\n });\n }\n }\n\n @Event({ eventName: 'jump-checkbox-change' }) toggleCheckbox: EventEmitter;\n\n @Method()\n async isChecked() {\n // @ts-ignore\n return this.el.checked;\n }\n\n render() {\n return (\n <Host ref={(host: HTMLElement) => this.host = host}>\n {this.value && this.label &&\n <sl-checkbox value={this.value} ref={(el: HTMLElement) => this.el = el}\n checked={this.checked}>\n {this.label}\n </sl-checkbox>}\n {this.count && <span class=\"count\">({this.count})</span>}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/jump-filter-checkbox/jump-filter-checkbox.stories.js ADDED Viewed

@@ -0,0 +1,51 @@
+import { generateAttributesFromArgs, formatHtml } from "../../utils/utils";
+export default {
+    title: 'Components/Filters/JumpFilterCheckbox',
+    tags: ['autodocs'],
+    argTypes: {
+        value: {
+            name: 'value',
+            control: 'text',
+            description: 'Il valore del checkbox',
+            label: 'ciao',
+        },
+        label: {
+            name: 'label',
+            control: 'text',
+            description: 'Il testo del label',
+        },
+        checked: {
+            name: 'checked',
+            control: 'boolean',
+            description: 'Il valore iniziale del checkbox',
+        },
+        count: {
+            name: 'count',
+            control: 'number',
+            description: 'Il numero da visualizzare',
+        },
+    }
+};
+const Template = (args) => {
+    const attributes = generateAttributesFromArgs(args);
+    return formatHtml(`<jump-filter-checkbox ${attributes}>
+</jump-filter-checkbox>`);
+};
+export const Default = Template.bind({});
+const TemplateSampleMultiple = () => {
+    return formatHtml(`
+  <script>
+    document.addEventListener('jump-checkbox-change', (event) => {
+      alert('Received the custom jump-checkbox-change event: ' + JSON.stringify(event.detail));
+      console.log('Received the custom jump-checkbox-change event: ', event.detail);
+    });
+  </script>
+  <div style="max-width: 200px;">
+    <jump-filter-checkbox value="1" label="Dieci" count="10"></jump-filter-checkbox>
+    <jump-filter-checkbox value="2" label="Venti" count="20" checked></jump-filter-checkbox>
+    <jump-filter-checkbox value="3" label="Trenta" count="30"></jump-filter-checkbox>
+  </div>
+`);
+};
+export const TemplateSampleMulti = TemplateSampleMultiple.bind({});
+//# sourceMappingURL=jump-filter-checkbox.stories.js.map

package/dist/collection/components/jump-filter-checkbox/jump-filter-checkbox.stories.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"jump-filter-checkbox.stories.js","sourceRoot":"","sources":["../../../src/components/jump-filter-checkbox/jump-filter-checkbox.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACb,KAAK,EAAE,uCAAuC;IAC9C,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,wBAAwB;YACrC,KAAK,EAAE,MAAM;SACd;QACD,KAAK,EAAE;YACL,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,oBAAoB;SAClC;QACD,OAAO,EAAE;YACP,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,iCAAiC;SAC/C;QACD,KAAK,EAAE;YACL,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,QAAQ;YACjB,WAAW,EAAE,2BAA2B;SACzC;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,yBAAyB,UAAU;wBAC/B,CAAC,CAAC;AAC1B,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAGzC,MAAM,sBAAsB,GAAG,GAAG,EAAE;IAClC,OAAO,UAAU,CAAC;;;;;;;;;;;;CAYnB,CAAC,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Filters/JumpFilterCheckbox',\n tags: ['autodocs'],\n argTypes: {\n value: {\n name: 'value',\n control: 'text',\n description: 'Il valore del checkbox',\n label: 'ciao',\n },\n label: {\n name: 'label',\n control: 'text',\n description: 'Il testo del label',\n },\n checked: {\n name: 'checked',\n control: 'boolean',\n description: 'Il valore iniziale del checkbox',\n },\n count: {\n name: 'count',\n control: 'number',\n description: 'Il numero da visualizzare',\n },\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filter-checkbox ${attributes}>\n</jump-filter-checkbox>`);\n};\n\nexport const Default = Template.bind({});\n\n\nconst TemplateSampleMultiple = () => {\n return formatHtml(`\n <script>\n document.addEventListener('jump-checkbox-change', (event) => {\n alert('Received the custom jump-checkbox-change event: ' + JSON.stringify(event.detail));\n console.log('Received the custom jump-checkbox-change event: ', event.detail);\n });\n </script>\n <div style=\"max-width: 200px;\">\n <jump-filter-checkbox value=\"1\" label=\"Dieci\" count=\"10\"></jump-filter-checkbox>\n <jump-filter-checkbox value=\"2\" label=\"Venti\" count=\"20\" checked></jump-filter-checkbox>\n <jump-filter-checkbox value=\"3\" label=\"Trenta\" count=\"30\"></jump-filter-checkbox>\n </div>\n`);\n};\n\nexport const TemplateSampleMulti = TemplateSampleMultiple.bind({});\n"]}

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

@@ -1,4 +1,5 @@
 :host {
+  --hidden-display: none;
   display: block;
 }
 :host slot {
@@ -8,10 +9,10 @@
   margin-bottom: 1rem;
 }
-h5 {
-  margin: 0 0 0.25rem;
+*[data-hide=true] {
+  display: var(--hidden-display);
 }
-[data-hide=true] {
-  display: none;
+h5 {
+  margin: 0 0 0.25rem;
 }

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

@@ -2,7 +2,7 @@ import { Host, h } from "@stencil/core";
 export class JumpFiltergroup {
     constructor() {
         this.name = 'tax-name';
-        this.title = 'Titolo del filtro';
+        this.heading = 'Titolo del filtro';
         this.otherLabel = 'Mostra altro';
         this.lessLabel = 'Mostra meno';
         this.maxElements = 8;
@@ -25,16 +25,19 @@ export class JumpFiltergroup {
     async getName() {
         return this.name;
     }
-    toggleHiddenItems() {
+    toggleHiddenItems(showAll = true) {
         this.slotItemsWrapper.assignedElements().forEach((item, index) => {
-            if (index > this.maxElements) {
-                item.setAttribute('data-hide', this.showMore ? 'true' : 'false');
+            if (index > this.maxElements && !showAll) {
+                item.setAttribute('style', 'display: none');
+            }
+            else {
+                item.setAttribute('style', 'display: initial');
             }
         });
     }
     handleShowMore() {
         this.showMore = !this.showMore;
-        this.toggleHiddenItems();
+        this.toggleHiddenItems(this.showMore);
     }
     handleChange(event) {
         const target = event.target;
@@ -69,13 +72,30 @@ export class JumpFiltergroup {
             values: this.values,
         });
     }
+    handleCheckboxChange(event) {
+        if (event.detail.checked && !this.values.includes(event.detail.value)) {
+            this.values.push(event.detail.value);
+        }
+        else if (!event.detail.checked && this.values.includes(event.detail.value)) {
+            const index = this.values.indexOf(event.detail.value);
+            if (index !== -1) {
+                this.values.splice(index, 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 index = 0;
         this.slotItems.forEach((item) => {
             if (index > this.maxElements) {
-                item.setAttribute('data-hide', 'true');
+                //item.setAttribute('data-hide', 'true');
+                item.style.display = 'none';
             }
             if (item.tagName === 'INPUT' || item.tagName === 'SELECT') {
                 this.inputs.push(item);
@@ -96,10 +116,13 @@ export class JumpFiltergroup {
             }
             index++;
         });
+        //this.toggleHiddenItems();
     }
     render() {
-        return (h(Host, { key: 'aa5959350948a2325f4b646ab8e6d31311df03a0' }, this.title && h("h5", { key: '43dff28c8b63b311b673390fabfec1dfaf933386' }, this.title), h("div", { key: '4b93f3ab110f6646977e00590eb8bee9e7b1ce28', class: "filterGroup" }, h("slot", { key: '459320fd46540ac84ab5e2ba3cd911e0bfcd663c', ref: (el) => (this.slotItemsWrapper = el) })), this.inputs.length > this.maxElements &&
-            h("jump-button", { key: '24999d7f0a79eeefd25ecd6c677f1170e14df6b5', 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, h("jump-icon", { key: '7731006e80030c6d6a9fc8ce4b49fc60f792834e', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-down' }))));
+        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 &&
+            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) => {
+                    this.showMoreBtn = showMoreBtn;
+                }, onClick: () => this.handleShowMore() }, this.showMore ? this.otherLabel : this.lessLabel, h("jump-icon", { key: 'cf42c4ac93733a34668426eae394966171ae72c3', slot: "suffix", name: this.showMore ? 'chevron-down' : 'chevron-up' }))));
     }
     static get is() { return "jump-filtergroup"; }
     static get encapsulation() { return "shadow"; }
@@ -133,7 +156,7 @@ export class JumpFiltergroup {
                 "reflect": false,
                 "defaultValue": "'tax-name'"
             },
-            "title": {
+            "heading": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -147,7 +170,7 @@ export class JumpFiltergroup {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "title",
+                "attribute": "heading",
                 "reflect": false,
                 "defaultValue": "'Titolo del filtro'"
             },

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

	@@ -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() title: 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 componentDidLoad() {\n this.slotItems = this.slotItemsWrapper.assignedElements();\n this.slotItemsWrapper.addEventListener('change', this.handleChange.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.title && <h5>{this.title}</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"]}

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

@@ -11,7 +11,7 @@ export default {
                 defaultValue: 'tax-name'
             }
         },
-        title: {
+        heading: {
             control: {
                 type: 'text',
                 description: 'Titolo del gruppo di filtri',

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

	@@ -1 +1 @@
1	- {"version":3,"file":"jump-filtergroup.stories.js","sourceRoot":"","sources":["../../../src/components/jump-filtergroup/jump-filtergroup.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACb,KAAK,EAAE,oCAAoC;IAC3C,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,gBAAgB;QAChB,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,iBAAiB;gBAC9B,YAAY,EAAE,UAAU;aACzB;SACF;QACD,~~KAAK~~,EAAE;~~YACL~~,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,6BAA6B;gBAC1C,YAAY,EAAE,6BAA6B;aAC5C;SACF;QACD,UAAU,EAAE;YACV,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,qCAAqC;gBAClD,YAAY,EAAE,cAAc;aAC7B;SACF;QACD,SAAS,EAAE;YACT,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,mCAAmC;gBAChD,YAAY,EAAE,aAAa;aAC5B;SACF;QACD,WAAW,EAAE;YACX,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,qCAAqC;aACnD;YACD,YAAY,EAAE,CAAC;SAChB;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,qBAAqB,UAAU,sBAAsB,CAAC,CAAC;AAC3E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Filters/JumpFilterGroup',\n tags: ['autodocs'],\n argTypes: {\n //list all props\n name: {\n control: {\n type: 'text',\n description: 'Nome del filtro',\n defaultValue: 'tax-name'\n }\n },\n ~~title~~: {\n control: {\n type: 'text',\n description: 'Titolo del gruppo di filtri',\n defaultValue: 'Titolo del gruppo di filtri'\n }\n },\n otherLabel: {\n control: {\n type: 'text',\n description: 'Label per il pulsante di espansione',\n defaultValue: 'Mostra altro'\n }\n },\n lessLabel: {\n control: {\n type: 'text',\n description: 'Label per il pulsante di chiusura',\n defaultValue: 'Mostra meno'\n }\n },\n maxElements: {\n control: {\n type: 'number',\n description: 'Numero massimo di elementi visibili'\n },\n defaultValue: 8\n }\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filtergroup ${attributes}></jump-filtergroup>`);\n};\n\nexport const Default = Template.bind({});\n"]}
1	+ {"version":3,"file":"jump-filtergroup.stories.js","sourceRoot":"","sources":["../../../src/components/jump-filtergroup/jump-filtergroup.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACb,KAAK,EAAE,oCAAoC;IAC3C,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,gBAAgB;QAChB,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,iBAAiB;gBAC9B,YAAY,EAAE,UAAU;aACzB;SACF;QACD,OAAO,EAAE;YACP,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,6BAA6B;gBAC1C,YAAY,EAAE,6BAA6B;aAC5C;SACF;QACD,UAAU,EAAE;YACV,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,qCAAqC;gBAClD,YAAY,EAAE,cAAc;aAC7B;SACF;QACD,SAAS,EAAE;YACT,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;gBACZ,WAAW,EAAE,mCAAmC;gBAChD,YAAY,EAAE,aAAa;aAC5B;SACF;QACD,WAAW,EAAE;YACX,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,qCAAqC;aACnD;YACD,YAAY,EAAE,CAAC;SAChB;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,qBAAqB,UAAU,sBAAsB,CAAC,CAAC;AAC3E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Filters/JumpFilterGroup',\n tags: ['autodocs'],\n argTypes: {\n //list all props\n name: {\n control: {\n type: 'text',\n description: 'Nome del filtro',\n defaultValue: 'tax-name'\n }\n },\n heading: {\n control: {\n type: 'text',\n description: 'Titolo del gruppo di filtri',\n defaultValue: 'Titolo del gruppo di filtri'\n }\n },\n otherLabel: {\n control: {\n type: 'text',\n description: 'Label per il pulsante di espansione',\n defaultValue: 'Mostra altro'\n }\n },\n lessLabel: {\n control: {\n type: 'text',\n description: 'Label per il pulsante di chiusura',\n defaultValue: 'Mostra meno'\n }\n },\n maxElements: {\n control: {\n type: 'number',\n description: 'Numero massimo di elementi visibili'\n },\n defaultValue: 8\n }\n }\n};\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-filtergroup ${attributes}></jump-filtergroup>`);\n};\n\nexport const Default = Template.bind({});\n"]}