@jumpgroup/jump-design-system 0.3.30 → 0.3.32
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-design-system.cjs.js +1 -1
- package/dist/cjs/jump-filter.cjs.entry.js +1 -1
- package/dist/cjs/jump-filter.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-navbar.cjs.entry.js +45 -0
- package/dist/cjs/jump-navbar.cjs.entry.js.map +1 -0
- package/dist/cjs/jump-pagination-table.cjs.entry.js +3 -3
- package/dist/cjs/jump-pagination.cjs.entry.js +3 -3
- package/dist/cjs/jump-quantity.cjs.entry.js +3 -3
- package/dist/cjs/jump-tab-item.cjs.entry.js +3 -4
- package/dist/cjs/jump-tab-item.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/jump-tab.cjs.entry.js +4 -2
- package/dist/cjs/jump-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/jump-filter/jump-filter.css +1 -1
- package/dist/collection/components/jump-navbar/jump-navbar.css +13 -0
- package/dist/collection/components/jump-navbar/jump-navbar.js +260 -0
- package/dist/collection/components/jump-navbar/jump-navbar.js.map +1 -0
- package/dist/collection/components/jump-pagination/jump-pagination.js +3 -3
- package/dist/collection/components/jump-pagination-table/jump-pagination-table.js +3 -3
- package/dist/collection/components/jump-quantity/jump-quantity.js +3 -3
- package/dist/collection/components/jump-tab/jump-tab.css +28 -0
- package/dist/collection/components/jump-tab/jump-tab.js +39 -1
- package/dist/collection/components/jump-tab/jump-tab.js.map +1 -1
- package/dist/collection/components/jump-tab/jump-tab.stories.js +28 -5
- package/dist/collection/components/jump-tab/jump-tab.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item.css +5 -2
- package/dist/collection/components/jump-tab-item/jump-tab-item.js +2 -3
- package/dist/collection/components/jump-tab-item/jump-tab-item.js.map +1 -1
- package/dist/collection/components/jump-tab-panel/jump-tab-panel.js +1 -1
- package/dist/components/jump-filter.js +1 -1
- package/dist/components/jump-filter.js.map +1 -1
- package/dist/components/jump-navbar.d.ts +11 -0
- package/dist/components/jump-navbar.js +84 -0
- package/dist/components/jump-navbar.js.map +1 -0
- package/dist/components/jump-pagination-table.js +3 -3
- package/dist/components/jump-pagination.js +3 -3
- package/dist/components/jump-quantity.js +3 -3
- package/dist/components/jump-tab-item.js +3 -4
- package/dist/components/jump-tab-item.js.map +1 -1
- package/dist/components/jump-tab-panel.js +1 -1
- package/dist/components/jump-tab.js +6 -2
- package/dist/components/jump-tab.js.map +1 -1
- package/dist/esm/jump-design-system.js +1 -1
- package/dist/esm/jump-filter.entry.js +1 -1
- package/dist/esm/jump-filter.entry.js.map +1 -1
- package/dist/esm/jump-navbar.entry.js +41 -0
- package/dist/esm/jump-navbar.entry.js.map +1 -0
- package/dist/esm/jump-pagination-table.entry.js +3 -3
- package/dist/esm/jump-pagination.entry.js +3 -3
- package/dist/esm/jump-quantity.entry.js +3 -3
- package/dist/esm/jump-tab-item.entry.js +3 -4
- package/dist/esm/jump-tab-item.entry.js.map +1 -1
- package/dist/esm/jump-tab-panel.entry.js +1 -1
- package/dist/esm/jump-tab.entry.js +4 -2
- package/dist/esm/jump-tab.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js.map +1 -1
- package/dist/jump-design-system/p-108990a7.entry.js +2 -0
- package/dist/jump-design-system/p-108990a7.entry.js.map +1 -0
- package/dist/jump-design-system/p-1a8f69e1.entry.js +2 -0
- package/dist/jump-design-system/p-1a8f69e1.entry.js.map +1 -0
- package/dist/jump-design-system/p-2c95396a.entry.js +2 -0
- package/dist/jump-design-system/p-5e08bb4a.entry.js +2 -0
- package/dist/jump-design-system/p-5e08bb4a.entry.js.map +1 -0
- package/dist/jump-design-system/{p-d93e4ed5.entry.js → p-7b854194.entry.js} +2 -2
- package/dist/jump-design-system/{p-3094f68c.entry.js → p-80d94f0f.entry.js} +2 -2
- package/dist/jump-design-system/p-81fdf870.entry.js +2 -0
- package/dist/jump-design-system/p-81fdf870.entry.js.map +1 -0
- package/dist/jump-design-system/{p-f3c9fa96.entry.js → p-dbff34ba.entry.js} +2 -2
- package/dist/jump-design-system-elements.json +71 -0
- package/dist/types/components/jump-navbar/jump-navbar.d.ts +47 -0
- package/dist/types/components/jump-tab/jump-tab.d.ts +5 -0
- package/dist/types/components/jump-tab/jump-tab.stories.d.ts +12 -0
- package/dist/types/components.d.ts +105 -0
- package/package.json +1 -1
- package/dist/jump-design-system/p-188c7c2e.entry.js +0 -2
- package/dist/jump-design-system/p-188c7c2e.entry.js.map +0 -1
- package/dist/jump-design-system/p-21a38875.entry.js +0 -2
- package/dist/jump-design-system/p-21a38875.entry.js.map +0 -1
- package/dist/jump-design-system/p-62b52857.entry.js +0 -2
- package/dist/jump-design-system/p-eebee8f5.entry.js +0 -2
- package/dist/jump-design-system/p-eebee8f5.entry.js.map +0 -1
- /package/dist/jump-design-system/{p-62b52857.entry.js.map → p-2c95396a.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-d93e4ed5.entry.js.map → p-7b854194.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-3094f68c.entry.js.map → p-80d94f0f.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-f3c9fa96.entry.js.map → p-dbff34ba.entry.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,c as e,h as i,H as s,g as
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as e,h as i,H as s,g as n}from"./p-d4c681a4.js";const a=":host{display:inline-flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:0.5rem}:host jump-button,:host button{--jump-button-padding:0.5rem}:host [data-variant=horizontal]{flex-direction:row}:host label{color:var(--neutral-grey-secondary);font-size:0.875rem}:host input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;margin:0;outline:none;border:1px solid transparent;border-radius:3px;padding:0.5rem;height:14px;width:36px;font-size:0.875rem;text-align:center}:host input::-webkit-inner-spin-button,:host input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}:host input:focus{border-color:var(--secondary-standard)}:host input:not([aria-hasbuttons]){border-color:var(--neutral-grey-secondary)}:host input[type=button]{cursor:pointer}:host ::slotted(jump-button){--jump-button-padding:0}:host .jump-quantity__InnerWrapper{display:flex;flex-direction:row;align-items:flex-start;justify-content:center;gap:0}";const r=a;const o=class{constructor(i){t(this,i);this.change=e(this,"jump-change",7);if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}this.min=1;this.max=undefined;this.step=1;this.label="";this.type="buttons";this.variant="vertical";this.showButtons=true;this.value=undefined}onValueChange(t,e){this.change.emit({value:t,oldValue:e});this.internals.setFormValue(t)}async getValue(){return this.value}async reset(){this.value=this.min}componentWillLoad(){this.value=this.min;this.internals.setFormValue(this.value.toString())}formResetCallback(){this.internals.setValidity({});this.internals.setFormValue("")}handleChange(t){this.value=t.target.value}handleBlur(t){if(t.target.value<this.min){this.value=this.min}}render(){return i(s,{key:"60bf7e8f2de0ccc25763b9248e9c6ef3d60fcc92",value:this.value,"data-variant":this.variant,"data-hasbuttons":this.showButtons},this.label&&i("label",{key:"5f29838b2bf5606ed50ee6e09c57b67286f8095f"},this.label),i("div",{key:"e6934083f54d1b84748936569b687b725756cac6",class:`jump-quantity__InnerWrapper`},this.showButtons&&i("jump-button",{key:"7687a84784a5fc55c3194dcc36292cff61507cb3",onClick:()=>this.value=this.value-this.step,disabled:this.value<=this.min,variant:"neutral",size:"custom"},i("jump-icon",{key:"2251771f3d182371ee59e09a475b13c9057920c7",library:"lucide",name:"minus",size:"small"})),i("input",{key:"708d3a835e62bc14b1f64bcfe5470b11ad997b1a",ref:t=>{this.inputEl=t},type:"number",value:this.value,onInput:t=>this.handleChange(t),min:this.min,max:this.max,step:this.step,"aria-hasbuttons":this.showButtons}),this.showButtons&&i("jump-button",{key:"922c17979037b3849f175def9c5d10d8d4722793",onClick:()=>this.value=this.value+this.step,disabled:this.value>=this.max,variant:"neutral",size:"custom"},i("jump-icon",{key:"84fa52f7203049c7a7793579a8bf3d612dcfba83",library:"lucide",name:"plus",size:"small"}))))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{value:["onValueChange"]}}};o.style=r;export{o as jump_quantity};
|
|
2
|
+
//# sourceMappingURL=p-7b854194.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as a,h as t,H as i}from"./p-d4c681a4.js";const s=":host{display:block}.JumpPaginationTable{--jump-pagination-table-label:var(--neutral-grey-secondary);--jump-pagination-table-arrows:var(--neutral-grey-secondary);--jump-pagination-table-arrows-disabled:var(--neutral-grey-disabled);font-family:var(--ff-primary)}.JumpPaginationTable__Wrapper{display:flex;justify-content:space-between}.JumpPaginationTable__Wrapper .elementsPerPage{display:flex;gap:1rem;align-items:center}.JumpPaginationTable__Wrapper .elementsPerPage label{color:var(--jump-pagination-table-label);font-size:var(--fs-300);font-weight:normal}.JumpPaginationTable__Wrapper .indicators{font-size:var(--fs-400);font-weight:normal;display:flex;justify-content:space-between;gap:20px;color:var(--jump-pagination-table-label)}.JumpPaginationTable__Wrapper .indicators .arrow{color:var(--jump-pagination-table-arrows);display:flex;align-items:center;gap:10px}.JumpPaginationTable__Wrapper .indicators .arrow button{background-color:transparent;border:none;cursor:pointer;padding:0px;display:flex;align-items:center}.JumpPaginationTable__Wrapper .indicators .arrow button:disabled{cursor:not-allowed;color:var(--jump-pagination-table-arrows-disabled)}.JumpPaginationTable__Wrapper .indicators .elements{color:var(--jump-pagination-table-label);display:flex;align-items:center;gap:5px}";const n=s;const l=class{constructor(t){e(this,t);this.changePage=a(this,"jump-change-page",7);this.changeElPerPage=a(this,"jump-change-el-per-page",7);this.elementsRanges="10,20,60,100";this.elementsRangesArray=undefined;this.elPerPage=undefined;this.pagLabel="di";this.labelElementsPerPage="Elementi per pagina";this.total=100;this.first=1;this.last=10;this.showFirstAndLast=false}elementsRangesChanged(e,a){console.log("dentro el");if(e!==a){this.elementsRangesArray=e.split(",").map(Number)}this.elementsRangesArray=[...this.elementsRangesArray];console.log("elementsRangesChanged",e,a)}elPerPageChanged(e,a){if(e!==a){this.first=1;this.last=Math.min(this.total,e)}this.changeElPerPage.emit({elPerPage:e})}componentWillLoad(){this.elementsRangesArray=this.elementsRanges.split(",").map(Number);this.elPerPage=this.elementsRangesArray[0]}setElPerPage(e){this.elPerPage=e.target.value}doChangePage(e){let a;let t;if(e==="first"){a=1;t=Math.min(this.total,this.elPerPage)}else if(e==="last"){t=this.total;a=Math.max(1,this.total-this.elPerPage+1)}else if(e==="previous"){a=Math.max(1,this.first-this.elPerPage);t=Math.min(this.total,a+this.elPerPage-1)}else if(e==="next"){t=Math.min(this.total,this.last+this.elPerPage);a=Math.max(1,t-this.elPerPage+1)}this.first=a;this.last=t;let i={first:a,last:t,direction:e};this.changePage.emit(i)}render(){var e;return t(i,{key:"
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as a,h as t,H as i}from"./p-d4c681a4.js";const s=":host{display:block}.JumpPaginationTable{--jump-pagination-table-label:var(--neutral-grey-secondary);--jump-pagination-table-arrows:var(--neutral-grey-secondary);--jump-pagination-table-arrows-disabled:var(--neutral-grey-disabled);font-family:var(--ff-primary)}.JumpPaginationTable__Wrapper{display:flex;justify-content:space-between}.JumpPaginationTable__Wrapper .elementsPerPage{display:flex;gap:1rem;align-items:center}.JumpPaginationTable__Wrapper .elementsPerPage label{color:var(--jump-pagination-table-label);font-size:var(--fs-300);font-weight:normal}.JumpPaginationTable__Wrapper .indicators{font-size:var(--fs-400);font-weight:normal;display:flex;justify-content:space-between;gap:20px;color:var(--jump-pagination-table-label)}.JumpPaginationTable__Wrapper .indicators .arrow{color:var(--jump-pagination-table-arrows);display:flex;align-items:center;gap:10px}.JumpPaginationTable__Wrapper .indicators .arrow button{background-color:transparent;border:none;cursor:pointer;padding:0px;display:flex;align-items:center}.JumpPaginationTable__Wrapper .indicators .arrow button:disabled{cursor:not-allowed;color:var(--jump-pagination-table-arrows-disabled)}.JumpPaginationTable__Wrapper .indicators .elements{color:var(--jump-pagination-table-label);display:flex;align-items:center;gap:5px}";const n=s;const l=class{constructor(t){e(this,t);this.changePage=a(this,"jump-change-page",7);this.changeElPerPage=a(this,"jump-change-el-per-page",7);this.elementsRanges="10,20,60,100";this.elementsRangesArray=undefined;this.elPerPage=undefined;this.pagLabel="di";this.labelElementsPerPage="Elementi per pagina";this.total=100;this.first=1;this.last=10;this.showFirstAndLast=false}elementsRangesChanged(e,a){console.log("dentro el");if(e!==a){this.elementsRangesArray=e.split(",").map(Number)}this.elementsRangesArray=[...this.elementsRangesArray];console.log("elementsRangesChanged",e,a)}elPerPageChanged(e,a){if(e!==a){this.first=1;this.last=Math.min(this.total,e)}this.changeElPerPage.emit({elPerPage:e})}componentWillLoad(){this.elementsRangesArray=this.elementsRanges.split(",").map(Number);this.elPerPage=this.elementsRangesArray[0]}setElPerPage(e){this.elPerPage=e.target.value}doChangePage(e){let a;let t;if(e==="first"){a=1;t=Math.min(this.total,this.elPerPage)}else if(e==="last"){t=this.total;a=Math.max(1,this.total-this.elPerPage+1)}else if(e==="previous"){a=Math.max(1,this.first-this.elPerPage);t=Math.min(this.total,a+this.elPerPage-1)}else if(e==="next"){t=Math.min(this.total,this.last+this.elPerPage);a=Math.max(1,t-this.elPerPage+1)}this.first=a;this.last=t;let i={first:a,last:t,direction:e};this.changePage.emit(i)}render(){var e;return t(i,{key:"68cfdc8f670c77a14605e4f151b41e2d551531e5",class:"JumpPaginationTable"},t("div",{key:"80d51c132999625d22b6e7ed73867e79a043ae99",class:"JumpPaginationTable__Wrapper"},t("div",{key:"709e412acf386ad3149e7a04208a0ea4948b4f0b",class:"elementsPerPage"},t("label",{key:"73985f2877b3c242b8deccb68ac11c878780e6ee",htmlFor:"elements"},(e=this.labelElementsPerPage)!==null&&e!==void 0?e:"Elements per page"),t("select",{key:"0def3077b6dc04018aecd2f50b0301bc19c29527",name:"elements",id:"elements",onChange:e=>this.setElPerPage(e)},this.elementsRangesArray.map((e=>t("option",{value:e,selected:this.elPerPage==e&&true},e))))),t("div",{key:"c2691bc0e79d043625977b276ac38ec10a41d73b",class:"indicators"},t("div",{key:"d9d62ca7b06479244bb396d38fc01dd86236515d",class:"elements"},t("span",{key:"51ea23a9d77319738404c8b6ead86ea0a9052e1c"},t("span",{key:"8fd64ef028151ae61c31998f72036ff4c9c9f151"},this.first)," - ",t("span",{key:"a001b2a509920566c34a41afb24a823e0445c3e2"},this.last)," ",this.pagLabel," ",t("span",{key:"9a27e142353e7d410655f270988183a82c0792a1"},this.total))),t("div",{key:"ba778721da92c9147449de9d0869a06d65615602",class:"arrow"},this.showFirstAndLast&&t("jump-button",{key:"76dfd54bfa05a6c33489aa41f9150c793fac5f85",onClick:()=>this.doChangePage("first"),variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.first===1}," ",t("jump-icon",{key:"0aee871e37e2e5b5190fc62cd8c8617d209f57ed",slot:"suffix",name:"chevrons-left"})," "),t("jump-button",{key:"9e82cf38238d358a4084078b975a3f75bf55e9fe",onClick:()=>this.doChangePage("previous"),variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.first===1}," ",t("jump-icon",{key:"7303a4371e0540dfa28feaf4a1f69662b646e64b",slot:"suffix",name:"chevron-left"})," "),t("jump-button",{key:"4bfb0713a9a374c30873e046b7ded26965cfce84",onClick:()=>this.doChangePage("next"),variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.last===this.total}," ",t("jump-icon",{key:"52c929962accd14480152a0dfd2e03904fd79fc4",slot:"suffix",name:"chevron-right"})," "),this.showFirstAndLast&&t("jump-button",{key:"6f0c43ef094c622447cd1095ab70ce6bfd2c464a",onClick:()=>this.doChangePage("last"),variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.last===this.total}," ",t("jump-icon",{key:"cb05b4a61efdebf03a17b353f17572d038df251f",slot:"suffix",name:"chevrons-right"})," ")))))}static get watchers(){return{elementsRanges:["elementsRangesChanged"],elPerPage:["elPerPageChanged"]}}};l.style=n;export{l as jump_pagination_table};
|
|
2
|
+
//# sourceMappingURL=p-80d94f0f.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as a,h as e,H as t}from"./p-d4c681a4.js";const s=":host{--jump-navbar-height:var(--header-height, 100px);--jump-navbar-background:var(--bg-drawer, #fff);--jump-navbar-width:var(--drawer-width, 240px);--jump-navbar-shadow:8px 0 15px 0 #00000026;--jump-navbar-zindex:2;--jump-navbar-transition:0.3s all ease-in-out;--jump-navbar-gap:2.5rem;--jump-navbar-padding:1rem;--jump-navbar-close-top:calc(var(--header-height) + 1rem);--jump-navbar-close-left:calc(var(--drawer-width) - 2rem);--jump-navbar-close-gap:0.5rem}";const i=s;const r=class{constructor(e){a(this,e);this.logo={image_url:"",alt:"",link:"#",target:"_self"};this.navItems=[];this.secondaryNavItems=[];this.mobileThreshold=768;this.type="basic";this.navPosition="inline";this.megaMenuAlignment="left";this.sticky=false;this.stickyThreshold=0;this.mobileLogo=this.logo;this.user=null;this.isMobile=false}handleResize(){this.isMobile=window.innerWidth<this.mobileThreshold}render(){var a,s;return e(t,{key:"87fa483a27dc0314a3fadcc0b7c4cf61013ad98d"},e("jump-button",{key:"b2756659bde1018ea284a59d0919729e593364ac",variant:"primary",size:"small",text:true,href:this.logo["link"],target:(a=this.logo["target"])!==null&&a!==void 0?a:"_self"},e("img",{key:"b3b7d8f6028d16d0967d7fdb71068cd9f2a0636c",src:this.logo["image_url"],alt:this.logo["alt"]})),this.isMobile&&e("div",{key:"9ff3e44a80259536f2bbb58ccc6be5967a3dc189",class:"MobileMenuOffCanvas"},e("div",{key:"c8e35bfbea3eb84d9df53fe8f18fa5cdccfe31c0",class:"MobileMenuOffCanvas__Header"},"/* TODO: ricerca + pulsante chiusura + profilo utente con immagine */"),e("div",{key:"ac6ad3c511ce635f4aa541a8326e97a77d3c4f2b",class:"MobileMenuOffCanvas__Navbar"},this.navbar.cloneNode(true)),e("div",{key:"f0f1ef266da0efa437c08df92a7d481b68892329",class:"MobileMenuOffCanvas__Footer"},"/* TODO: langswitcher */",this.mobileLogo&&e("jump-button",{key:"6eaa0a821b15ea28e8a8672e03cf51c5e57a1ca1",variant:"primary",size:"small",text:true,href:this.mobileLogo["link"],target:(s=this.mobileLogo["target"])!==null&&s!==void 0?s:"_self"},e("img",{key:"7ef8f3187b555bc27172d062fb19a20423409bbc",src:this.mobileLogo["image_url"],alt:this.mobileLogo["alt"]})))),e("nav",{key:"ab7a9bcbd9e907448a6dc393f1efa32e80752856",ref:a=>{this.navbar=a}},e("ul",{key:"70c90191941c1b371218a69216f30921c5e097af"},this.navItems.map((a=>e("li",null,e("jump-button",{variant:"primary",size:"small",text:true,href:a.link,target:a.target,class:a.class},a.text,this.secondaryNavItems.some((e=>e.parent===a.id))&&e("jump-icon",{slot:"suffix",library:"lucide",name:"chevron-down",size:"small"})),this.secondaryNavItems.map((t=>t.parent===a.id&&e("ul",{"data-parent":t.parent},t.title&&e("h4",null,t.title)," /* TODO: utilizzare jump-heading? */",t.items.map((a=>e("li",null,e("jump-button",{variant:"primary",size:"small",text:true,href:a.link,target:a.target,class:a.class},a.text)))))))))))),e("slot",{key:"7edb581eab5c8942b9670129f893e92eefe9b5f3",name:"actions"},e("slot",{key:"9e1eaf7c15bd2767d78d00a594a28f1d867ebb6d",name:"lang_switcher"}),e("slot",{key:"9cff169f4012c9dc87e9b6b78497f3c0e53dae58",name:"search"}),e("slot",{key:"465d61b9266c7ff12cfd434decd44579b84ab908",name:"buttons"}),e("slot",{key:"c7e66e9bc83921f327f4f7fe74e3e68ac3d4a44a",name:"cart"})))}};r.style=i;export{r as jump_navbar};
|
|
2
|
+
//# sourceMappingURL=p-81fdf870.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["jumpNavbarCss","JumpNavbarStyle0","JumpNavbar","image_url","alt","link","target","this","logo","handleResize","isMobile","window","innerWidth","mobileThreshold","render","h","Host","key","variant","size","text","href","_a","src","class","navbar","cloneNode","mobileLogo","_b","ref","el","navItems","map","item","secondaryNavItems","some","secondaryItem","parent","id","slot","library","name","title","items","subItem"],"sources":["src/components/jump-navbar/jump-navbar.scss?tag=jump-navbar&encapsulation=shadow","src/components/jump-navbar/jump-navbar.tsx"],"sourcesContent":[":host {\n --jump-navbar-height: var(--header-height, 100px);\n --jump-navbar-background: var(--bg-drawer, #fff);\n --jump-navbar-width: var(--drawer-width, 240px);\n --jump-navbar-shadow: 8px 0 15px 0 #00000026;\n --jump-navbar-zindex: 2;\n --jump-navbar-transition: 0.3s all ease-in-out;\n --jump-navbar-gap: 2.5rem;\n --jump-navbar-padding: 1rem;\n --jump-navbar-close-top: calc(var(--header-height) + 1rem);\n --jump-navbar-close-left: calc(var(--drawer-width) - 2rem);\n --jump-navbar-close-gap: 0.5rem;\n}\n","import { Component, Host, Prop, h, Listen, State } from '@stencil/core';\n\n@Component({\n tag: 'jump-navbar',\n styleUrl: 'jump-navbar.scss',\n shadow: true,\n})\nexport class JumpNavbar {\n @Prop() logo: {\n image_url: string,\n alt: string,\n link: string,\n target: '_blank' | '_parent' | '_self' | '_top'\n } = { image_url: '', alt: '', link: '#', target: '_self' };\n @Prop() navItems: Array<{\n id: string,\n text: string,\n link: string,\n class: string,\n target: '_blank' | '_parent' | '_self' | '_top'\n }> = [];\n @Prop() secondaryNavItems: Array<{\n parent: string | null,\n title: string | null,\n items: Array<{\n text: string,\n link: string,\n class: string,\n target: '_blank' | '_parent' | '_self' | '_top'\n }>\n }> = [];\n @Prop() mobileThreshold: number = 768;\n @Prop() type: 'basic' | 'hamburger_left' | 'hamburger_right' = 'basic';\n @Prop() navPosition: 'inline' | 'bottom' | 'megamenu' = 'inline'; //TODO: Chiedere a Vale se può essere inline + sulla riga sotto mostriamo la tendina oppure è un menu a sé stante quello sotto\n @Prop() megaMenuAlignment: 'left' | 'right' = 'left';\n @Prop() sticky: boolean = false;\n @Prop() stickyThreshold: number = 0; // Possible to get sticky on mobile only after a certain scroll threshold\n @Prop() mobileLogo: {\n image_url: string,\n alt: string,\n link: string,\n target: '_blank' | '_parent' | '_self' | '_top'\n } | null = this.logo;\n @Prop() user : {\n image_url: string,\n alt: string,\n link: string,\n target: '_blank' | '_parent' | '_self' | '_top'\n } | null = null;\n\n @State() isMobile: boolean = false;\n\n navbar: HTMLElement;\n\n @Listen('resize', { target: 'window' })\n handleResize() {\n this.isMobile = window.innerWidth < this.mobileThreshold;\n }\n\n render() {\n return (\n <Host>\n <jump-button variant=\"primary\" size=\"small\" text href={this.logo['link']}\n target={this.logo['target'] ?? '_self'}>\n <img src={this.logo['image_url']} alt={this.logo['alt']} />\n </jump-button>\n {this.isMobile &&\n <div class=\"MobileMenuOffCanvas\">\n <div class=\"MobileMenuOffCanvas__Header\">\n /* TODO: ricerca + pulsante chiusura + profilo utente con immagine */\n </div>\n <div class=\"MobileMenuOffCanvas__Navbar\">\n {this.navbar.cloneNode(true)}\n </div>\n <div class=\"MobileMenuOffCanvas__Footer\">\n /* TODO: langswitcher */\n {this.mobileLogo &&\n <jump-button variant=\"primary\" size=\"small\" text href={this.mobileLogo['link']}\n target={this.mobileLogo['target'] ?? '_self'}>\n <img src={this.mobileLogo['image_url']} alt={this.mobileLogo['alt']} />\n </jump-button>\n }\n </div>\n </div>}\n <nav ref={(el: HTMLElement) => {\n this.navbar = el;\n }}>\n <ul>\n {this.navItems.map((item) => (\n <li>\n <jump-button variant=\"primary\" size=\"small\" text href={item.link} target={item.target}\n class={item.class}>\n {item.text}\n {this.secondaryNavItems.some(secondaryItem => secondaryItem.parent === item.id) &&\n <jump-icon slot=\"suffix\" library=\"lucide\" name=\"chevron-down\" size=\"small\"></jump-icon>\n }\n </jump-button>\n\n {this.secondaryNavItems.map((secondaryItem) => (\n secondaryItem.parent === item.id &&\n <ul data-parent={secondaryItem.parent}>\n {secondaryItem.title &&\n <h4>{secondaryItem.title}</h4>} /* TODO: utilizzare jump-heading? */\n {secondaryItem.items.map((subItem) => (\n <li>\n <jump-button variant=\"primary\" size=\"small\" text href={subItem.link} target={subItem.target}\n class={subItem.class}>\n {subItem.text}\n </jump-button>\n </li>\n ))}\n </ul>\n ))}\n </li>\n ))}\n </ul>\n </nav>\n <slot name=\"actions\">\n <slot name=\"lang_switcher\"></slot>\n <slot name=\"search\"></slot>\n <slot name=\"buttons\"></slot>\n <slot name=\"cart\"></slot>\n </slot>\n </Host>\n );\n }\n}\n\n"],"mappings":"kDAAA,MAAMA,EAAgB,idACtB,MAAAC,EAAeD,E,MCMFE,EAAU,M,mCAMjB,CAAEC,UAAW,GAAIC,IAAK,GAAIC,KAAM,IAAKC,OAAQ,S,cAO5C,G,uBAUA,G,qBAC6B,I,UAC6B,Q,iBACP,S,uBACV,O,YACpB,M,qBACQ,E,gBAMvBC,KAAKC,K,UAML,K,cAEkB,K,CAK7B,YAAAC,GACEF,KAAKG,SAAWC,OAAOC,WAAaL,KAAKM,e,CAG3C,MAAAC,G,QACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,eAAAE,IAAA,2CAAaC,QAAQ,UAAUC,KAAK,QAAQC,KAAI,KAACC,KAAMd,KAAKC,KAAK,QACpDF,QAAQgB,EAAAf,KAAKC,KAAK,aAAS,MAAAc,SAAA,EAAAA,EAAI,SAC1CP,EAAA,OAAAE,IAAA,2CAAKM,IAAKhB,KAAKC,KAAK,aAAcJ,IAAKG,KAAKC,KAAK,UAElDD,KAAKG,UACJK,EAAA,OAAAE,IAAA,2CAAKO,MAAM,uBACTT,EAAA,OAAAE,IAAA,2CAAKO,MAAM,+BAA6B,yEAGxCT,EAAA,OAAAE,IAAA,2CAAKO,MAAM,+BACRjB,KAAKkB,OAAOC,UAAU,OAEzBX,EAAA,OAAAE,IAAA,2CAAKO,MAAM,+BAA6B,2BAErCjB,KAAKoB,YACJZ,EAAA,eAAAE,IAAA,2CAAaC,QAAQ,UAAUC,KAAK,QAAQC,KAAI,KAACC,KAAMd,KAAKoB,WAAW,QAC1DrB,QAAQsB,EAAArB,KAAKoB,WAAW,aAAS,MAAAC,SAAA,EAAAA,EAAI,SAChDb,EAAA,OAAAE,IAAA,2CAAKM,IAAKhB,KAAKoB,WAAW,aAAcvB,IAAKG,KAAKoB,WAAW,YAKvEZ,EAAA,OAAAE,IAAA,2CAAKY,IAAMC,IACTvB,KAAKkB,OAASK,CAAE,GAEhBf,EAAA,MAAAE,IAAA,4CACGV,KAAKwB,SAASC,KAAKC,GAClBlB,EAAA,UACEA,EAAA,eAAaG,QAAQ,UAAUC,KAAK,QAAQC,KAAI,KAACC,KAAMY,EAAK5B,KAAMC,OAAQ2B,EAAK3B,OAClEkB,MAAOS,EAAKT,OACtBS,EAAKb,KACLb,KAAK2B,kBAAkBC,MAAKC,GAAiBA,EAAcC,SAAWJ,EAAKK,MAC1EvB,EAAA,aAAWwB,KAAK,SAASC,QAAQ,SAASC,KAAK,eAAetB,KAAK,WAItEZ,KAAK2B,kBAAkBF,KAAKI,GAC3BA,EAAcC,SAAWJ,EAAKK,IAC9BvB,EAAA,oBAAiBqB,EAAcC,QAC5BD,EAAcM,OACb3B,EAAA,UAAKqB,EAAcM,OAAW,wCAC/BN,EAAcO,MAAMX,KAAKY,GACxB7B,EAAA,UACEA,EAAA,eAAaG,QAAQ,UAAUC,KAAK,QAAQC,KAAI,KAACC,KAAMuB,EAAQvC,KAAMC,OAAQsC,EAAQtC,OACxEkB,MAAOoB,EAAQpB,OACzBoB,EAAQxB,iBAU3BL,EAAA,QAAAE,IAAA,2CAAMwB,KAAK,WACT1B,EAAA,QAAAE,IAAA,2CAAMwB,KAAK,kBACX1B,EAAA,QAAAE,IAAA,2CAAMwB,KAAK,WACX1B,EAAA,QAAAE,IAAA,2CAAMwB,KAAK,YACX1B,EAAA,QAAAE,IAAA,2CAAMwB,KAAK,U"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as a,c as e,h as i,H as t}from"./p-d4c681a4.js";const r=":host{display:block;--jump-button-color:yellow}.JumpPagination{--jump-pagination-label:var(--neutral-grey-secondary);--jump-pagination-arrows-color:var(--neutral-grey-secondary);--jump-pagination-arrows-disabled:var(--neutral-grey-disabled);font-family:var(--ff-primary)}.JumpPagination__Wrapper{display:flex;justify-content:space-between}.JumpPagination__Wrapper .indicators{font-size:var(--fs-400);font-weight:normal;display:flex;justify-content:space-between;gap:20px;color:var(--jump-pagination-label)}.JumpPagination__Wrapper .indicators .arrow{color:var(--jump-pagination-arrows-color);display:flex;align-items:center;gap:10px}.JumpPagination__Wrapper .indicators .arrow button{background-color:transparent;border:none;cursor:pointer;padding:0px;display:flex;align-items:center}.JumpPagination__Wrapper .indicators .arrow button:disabled{cursor:not-allowed;color:var(--jump-pagination-arrows-disabled)}.JumpPagination__Wrapper .indicators .elements{color:var(--jump-pagination-label);display:flex;align-items:center;gap:5px}";const n=r;const s=class{constructor(i){a(this,i);this.changePage=e(this,"jump-change-page",7);this.current=1;this.pagLabel="di";this.last=10;this.showFirstAndLast=false}watchcurrent(a,e){let i={current:a,previousPage:e,first:1,last:this.last,direction:a>e?"next":"prev"};this.changePage.emit(i)}componentWillLoad(){this.current=1}render(){return i(t,{key:"
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as a,c as e,h as i,H as t}from"./p-d4c681a4.js";const r=":host{display:block;--jump-button-color:yellow}.JumpPagination{--jump-pagination-label:var(--neutral-grey-secondary);--jump-pagination-arrows-color:var(--neutral-grey-secondary);--jump-pagination-arrows-disabled:var(--neutral-grey-disabled);font-family:var(--ff-primary)}.JumpPagination__Wrapper{display:flex;justify-content:space-between}.JumpPagination__Wrapper .indicators{font-size:var(--fs-400);font-weight:normal;display:flex;justify-content:space-between;gap:20px;color:var(--jump-pagination-label)}.JumpPagination__Wrapper .indicators .arrow{color:var(--jump-pagination-arrows-color);display:flex;align-items:center;gap:10px}.JumpPagination__Wrapper .indicators .arrow button{background-color:transparent;border:none;cursor:pointer;padding:0px;display:flex;align-items:center}.JumpPagination__Wrapper .indicators .arrow button:disabled{cursor:not-allowed;color:var(--jump-pagination-arrows-disabled)}.JumpPagination__Wrapper .indicators .elements{color:var(--jump-pagination-label);display:flex;align-items:center;gap:5px}";const n=r;const s=class{constructor(i){a(this,i);this.changePage=e(this,"jump-change-page",7);this.current=1;this.pagLabel="di";this.last=10;this.showFirstAndLast=false}watchcurrent(a,e){let i={current:a,previousPage:e,first:1,last:this.last,direction:a>e?"next":"prev"};this.changePage.emit(i)}componentWillLoad(){this.current=1}render(){return i(t,{key:"e7b289bce3ef2bcfe2b45135b463feb2390c50a3",class:"JumpPagination"},i("div",{key:"6559e463bf9d9973dd037f6b6a23f20816ef1882",class:"JumpPagination__Wrapper"},i("div",{key:"5650bf9580bd470604e8841faf33e6b029549cda",class:"indicators"},i("div",{key:"b40e74ede39cd17fd770cf1fc46d46644a86fc63",class:"elements"},i("span",{key:"af919f31f94448c99291a830dd35da7169cd24ec"},i("span",{key:"96b8773daf276e9285b91f06cf6f5fa28a5d6727"},this.current)," ",this.pagLabel," ",i("span",{key:"e7dd92a3a48e23d5c28d1b6e0f3c07cddd837598"},this.last))),i("div",{key:"1a3338a3e913f9c92a530203f91e93f6085b607c",class:"arrow"},this.showFirstAndLast&&i("jump-button",{key:"23075cb5a2513048e7ee690242f0ce5a54c95538",onClick:()=>{this.current=1},variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.current===1?true:false}," ",i("jump-icon",{key:"0e834c3117fca9d2dd593a4b5ceb3934e7eb547a",slot:"suffix",name:"chevrons-left"})," "),i("jump-button",{key:"fc27582a142ed6051187692f6a31a2c51f91e4af",onClick:()=>{this.current--},variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.current===1?true:false}," ",i("jump-icon",{key:"a2998274cf27c33b80f7fd0c917a5583b70ef8f0",slot:"suffix",name:"chevron-left"})," "),i("jump-button",{key:"26d7a56a2a0312cf526dcf9bc432679c756534f1",onClick:()=>{this.current++},variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.current===this.last?true:false}," ",i("jump-icon",{key:"6769d3484fdd63d2fff5268392111137273b9541",slot:"suffix",name:"chevron-right"})," "),this.showFirstAndLast&&i("jump-button",{key:"7e3c33e8a7c7d7c1dbaeb6009781602023f71133",onClick:()=>{this.current=this.last},variant:"primary",text:true,size:"small",name:"scopri",value:"value","aria-label":"Scopri di più",id:"button",onlyIcon:true,disabled:this.current===this.last?true:false}," ",i("jump-icon",{key:"418f61b2481e76f5766a92e6b7c8d0fad5dcd70a",slot:"suffix",name:"chevrons-right"})," ")))))}static get watchers(){return{current:["watchcurrent"]}}};s.style=n;export{s as jump_pagination};
|
|
2
|
+
//# sourceMappingURL=p-dbff34ba.entry.js.map
|
|
@@ -645,6 +645,69 @@
|
|
|
645
645
|
}
|
|
646
646
|
]
|
|
647
647
|
},
|
|
648
|
+
{
|
|
649
|
+
"name": "jump-navbar",
|
|
650
|
+
"description": {
|
|
651
|
+
"kind": "markdown",
|
|
652
|
+
"value": ""
|
|
653
|
+
},
|
|
654
|
+
"attributes": [
|
|
655
|
+
{
|
|
656
|
+
"name": "mega-menu-alignment",
|
|
657
|
+
"description": "",
|
|
658
|
+
"values": [
|
|
659
|
+
{
|
|
660
|
+
"name": "left"
|
|
661
|
+
},
|
|
662
|
+
{
|
|
663
|
+
"name": "right"
|
|
664
|
+
}
|
|
665
|
+
]
|
|
666
|
+
},
|
|
667
|
+
{
|
|
668
|
+
"name": "mobile-threshold",
|
|
669
|
+
"description": ""
|
|
670
|
+
},
|
|
671
|
+
{
|
|
672
|
+
"name": "nav-position",
|
|
673
|
+
"description": "",
|
|
674
|
+
"values": [
|
|
675
|
+
{
|
|
676
|
+
"name": "bottom"
|
|
677
|
+
},
|
|
678
|
+
{
|
|
679
|
+
"name": "inline"
|
|
680
|
+
},
|
|
681
|
+
{
|
|
682
|
+
"name": "megamenu"
|
|
683
|
+
}
|
|
684
|
+
]
|
|
685
|
+
},
|
|
686
|
+
{
|
|
687
|
+
"name": "sticky",
|
|
688
|
+
"description": ""
|
|
689
|
+
},
|
|
690
|
+
{
|
|
691
|
+
"name": "sticky-threshold",
|
|
692
|
+
"description": ""
|
|
693
|
+
},
|
|
694
|
+
{
|
|
695
|
+
"name": "type",
|
|
696
|
+
"description": "",
|
|
697
|
+
"values": [
|
|
698
|
+
{
|
|
699
|
+
"name": "basic"
|
|
700
|
+
},
|
|
701
|
+
{
|
|
702
|
+
"name": "hamburger_left"
|
|
703
|
+
},
|
|
704
|
+
{
|
|
705
|
+
"name": "hamburger_right"
|
|
706
|
+
}
|
|
707
|
+
]
|
|
708
|
+
}
|
|
709
|
+
]
|
|
710
|
+
},
|
|
648
711
|
{
|
|
649
712
|
"name": "jump-pagination",
|
|
650
713
|
"description": {
|
|
@@ -770,6 +833,14 @@
|
|
|
770
833
|
"value": ""
|
|
771
834
|
},
|
|
772
835
|
"attributes": [
|
|
836
|
+
{
|
|
837
|
+
"name": "alignment",
|
|
838
|
+
"description": ""
|
|
839
|
+
},
|
|
840
|
+
{
|
|
841
|
+
"name": "full-border",
|
|
842
|
+
"description": "If true, the jump-tab component have a full bottom border"
|
|
843
|
+
},
|
|
773
844
|
{
|
|
774
845
|
"name": "tab-group-name",
|
|
775
846
|
"description": ""
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
export declare class JumpNavbar {
|
|
2
|
+
logo: {
|
|
3
|
+
image_url: string;
|
|
4
|
+
alt: string;
|
|
5
|
+
link: string;
|
|
6
|
+
target: '_blank' | '_parent' | '_self' | '_top';
|
|
7
|
+
};
|
|
8
|
+
navItems: Array<{
|
|
9
|
+
id: string;
|
|
10
|
+
text: string;
|
|
11
|
+
link: string;
|
|
12
|
+
class: string;
|
|
13
|
+
target: '_blank' | '_parent' | '_self' | '_top';
|
|
14
|
+
}>;
|
|
15
|
+
secondaryNavItems: Array<{
|
|
16
|
+
parent: string | null;
|
|
17
|
+
title: string | null;
|
|
18
|
+
items: Array<{
|
|
19
|
+
text: string;
|
|
20
|
+
link: string;
|
|
21
|
+
class: string;
|
|
22
|
+
target: '_blank' | '_parent' | '_self' | '_top';
|
|
23
|
+
}>;
|
|
24
|
+
}>;
|
|
25
|
+
mobileThreshold: number;
|
|
26
|
+
type: 'basic' | 'hamburger_left' | 'hamburger_right';
|
|
27
|
+
navPosition: 'inline' | 'bottom' | 'megamenu';
|
|
28
|
+
megaMenuAlignment: 'left' | 'right';
|
|
29
|
+
sticky: boolean;
|
|
30
|
+
stickyThreshold: number;
|
|
31
|
+
mobileLogo: {
|
|
32
|
+
image_url: string;
|
|
33
|
+
alt: string;
|
|
34
|
+
link: string;
|
|
35
|
+
target: '_blank' | '_parent' | '_self' | '_top';
|
|
36
|
+
} | null;
|
|
37
|
+
user: {
|
|
38
|
+
image_url: string;
|
|
39
|
+
alt: string;
|
|
40
|
+
link: string;
|
|
41
|
+
target: '_blank' | '_parent' | '_self' | '_top';
|
|
42
|
+
} | null;
|
|
43
|
+
isMobile: boolean;
|
|
44
|
+
navbar: HTMLElement;
|
|
45
|
+
handleResize(): void;
|
|
46
|
+
render(): any;
|
|
47
|
+
}
|
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
2
|
export declare class JumpTab {
|
|
3
3
|
JumpTabEl: HTMLElement;
|
|
4
|
+
alignment: string;
|
|
5
|
+
/**
|
|
6
|
+
* If true, the jump-tab component have a full bottom border
|
|
7
|
+
*/
|
|
8
|
+
fullBorder: boolean;
|
|
4
9
|
tabGroupName: string;
|
|
5
10
|
/**
|
|
6
11
|
* The style of the tab. The same value must be passed to all the items.
|
|
@@ -13,12 +13,24 @@ declare const _default: {
|
|
|
13
13
|
options: string[];
|
|
14
14
|
description: string;
|
|
15
15
|
};
|
|
16
|
+
alignment: {
|
|
17
|
+
name: string;
|
|
18
|
+
control: string;
|
|
19
|
+
options: string[];
|
|
20
|
+
description: string;
|
|
21
|
+
};
|
|
22
|
+
fullBorder: {
|
|
23
|
+
name: string;
|
|
24
|
+
control: string;
|
|
25
|
+
description: string;
|
|
26
|
+
};
|
|
16
27
|
};
|
|
17
28
|
};
|
|
18
29
|
export default _default;
|
|
19
30
|
export declare const TabInline: any;
|
|
20
31
|
export declare const TabBoxed: any;
|
|
21
32
|
export declare const TabRounded: any;
|
|
33
|
+
export declare const TabInlineFullBorder: any;
|
|
22
34
|
export declare const OneTabDisabled: any;
|
|
23
35
|
export declare const TabInlineWithListener: any;
|
|
24
36
|
export declare const TabBoxedWithListener: any;
|
|
@@ -341,6 +341,49 @@ export namespace Components {
|
|
|
341
341
|
*/
|
|
342
342
|
"src": string;
|
|
343
343
|
}
|
|
344
|
+
interface JumpNavbar {
|
|
345
|
+
"logo": {
|
|
346
|
+
image_url: string,
|
|
347
|
+
alt: string,
|
|
348
|
+
link: string,
|
|
349
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
350
|
+
};
|
|
351
|
+
"megaMenuAlignment": 'left' | 'right';
|
|
352
|
+
"mobileLogo": {
|
|
353
|
+
image_url: string,
|
|
354
|
+
alt: string,
|
|
355
|
+
link: string,
|
|
356
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
357
|
+
} | null;
|
|
358
|
+
"mobileThreshold": number;
|
|
359
|
+
"navItems": Array<{
|
|
360
|
+
id: string,
|
|
361
|
+
text: string,
|
|
362
|
+
link: string,
|
|
363
|
+
class: string,
|
|
364
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
365
|
+
}>;
|
|
366
|
+
"navPosition": 'inline' | 'bottom' | 'megamenu';
|
|
367
|
+
"secondaryNavItems": Array<{
|
|
368
|
+
parent: string | null,
|
|
369
|
+
title: string | null,
|
|
370
|
+
items: Array<{
|
|
371
|
+
text: string,
|
|
372
|
+
link: string,
|
|
373
|
+
class: string,
|
|
374
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
375
|
+
}>
|
|
376
|
+
}>;
|
|
377
|
+
"sticky": boolean;
|
|
378
|
+
"stickyThreshold": number;
|
|
379
|
+
"type": 'basic' | 'hamburger_left' | 'hamburger_right';
|
|
380
|
+
"user": {
|
|
381
|
+
image_url: string,
|
|
382
|
+
alt: string,
|
|
383
|
+
link: string,
|
|
384
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
385
|
+
} | null;
|
|
386
|
+
}
|
|
344
387
|
interface JumpPagination {
|
|
345
388
|
/**
|
|
346
389
|
* Last element of the page
|
|
@@ -398,6 +441,11 @@ export namespace Components {
|
|
|
398
441
|
"variant": 'vertical' | 'horizontal';
|
|
399
442
|
}
|
|
400
443
|
interface JumpTab {
|
|
444
|
+
"alignment": string;
|
|
445
|
+
/**
|
|
446
|
+
* If true, the jump-tab component have a full bottom border
|
|
447
|
+
*/
|
|
448
|
+
"fullBorder": boolean;
|
|
401
449
|
"tabGroupName": string;
|
|
402
450
|
/**
|
|
403
451
|
* The style of the tab. The same value must be passed to all the items. Choosed from "inline", "boxed", "sheet", "rounded"
|
|
@@ -591,6 +639,12 @@ declare global {
|
|
|
591
639
|
prototype: HTMLJumpIconElement;
|
|
592
640
|
new (): HTMLJumpIconElement;
|
|
593
641
|
};
|
|
642
|
+
interface HTMLJumpNavbarElement extends Components.JumpNavbar, HTMLStencilElement {
|
|
643
|
+
}
|
|
644
|
+
var HTMLJumpNavbarElement: {
|
|
645
|
+
prototype: HTMLJumpNavbarElement;
|
|
646
|
+
new (): HTMLJumpNavbarElement;
|
|
647
|
+
};
|
|
594
648
|
interface HTMLJumpPaginationElementEventMap {
|
|
595
649
|
"jump-change-page": any;
|
|
596
650
|
}
|
|
@@ -695,6 +749,7 @@ declare global {
|
|
|
695
749
|
"jump-filter-checkbox": HTMLJumpFilterCheckboxElement;
|
|
696
750
|
"jump-filtergroup": HTMLJumpFiltergroupElement;
|
|
697
751
|
"jump-icon": HTMLJumpIconElement;
|
|
752
|
+
"jump-navbar": HTMLJumpNavbarElement;
|
|
698
753
|
"jump-pagination": HTMLJumpPaginationElement;
|
|
699
754
|
"jump-pagination-table": HTMLJumpPaginationTableElement;
|
|
700
755
|
"jump-quantity": HTMLJumpQuantityElement;
|
|
@@ -1032,6 +1087,49 @@ declare namespace LocalJSX {
|
|
|
1032
1087
|
*/
|
|
1033
1088
|
"src"?: string;
|
|
1034
1089
|
}
|
|
1090
|
+
interface JumpNavbar {
|
|
1091
|
+
"logo"?: {
|
|
1092
|
+
image_url: string,
|
|
1093
|
+
alt: string,
|
|
1094
|
+
link: string,
|
|
1095
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
1096
|
+
};
|
|
1097
|
+
"megaMenuAlignment"?: 'left' | 'right';
|
|
1098
|
+
"mobileLogo"?: {
|
|
1099
|
+
image_url: string,
|
|
1100
|
+
alt: string,
|
|
1101
|
+
link: string,
|
|
1102
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
1103
|
+
} | null;
|
|
1104
|
+
"mobileThreshold"?: number;
|
|
1105
|
+
"navItems"?: Array<{
|
|
1106
|
+
id: string,
|
|
1107
|
+
text: string,
|
|
1108
|
+
link: string,
|
|
1109
|
+
class: string,
|
|
1110
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
1111
|
+
}>;
|
|
1112
|
+
"navPosition"?: 'inline' | 'bottom' | 'megamenu';
|
|
1113
|
+
"secondaryNavItems"?: Array<{
|
|
1114
|
+
parent: string | null,
|
|
1115
|
+
title: string | null,
|
|
1116
|
+
items: Array<{
|
|
1117
|
+
text: string,
|
|
1118
|
+
link: string,
|
|
1119
|
+
class: string,
|
|
1120
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
1121
|
+
}>
|
|
1122
|
+
}>;
|
|
1123
|
+
"sticky"?: boolean;
|
|
1124
|
+
"stickyThreshold"?: number;
|
|
1125
|
+
"type"?: 'basic' | 'hamburger_left' | 'hamburger_right';
|
|
1126
|
+
"user"?: {
|
|
1127
|
+
image_url: string,
|
|
1128
|
+
alt: string,
|
|
1129
|
+
link: string,
|
|
1130
|
+
target: '_blank' | '_parent' | '_self' | '_top'
|
|
1131
|
+
} | null;
|
|
1132
|
+
}
|
|
1035
1133
|
interface JumpPagination {
|
|
1036
1134
|
/**
|
|
1037
1135
|
* Last element of the page
|
|
@@ -1088,6 +1186,11 @@ declare namespace LocalJSX {
|
|
|
1088
1186
|
"variant"?: 'vertical' | 'horizontal';
|
|
1089
1187
|
}
|
|
1090
1188
|
interface JumpTab {
|
|
1189
|
+
"alignment"?: string;
|
|
1190
|
+
/**
|
|
1191
|
+
* If true, the jump-tab component have a full bottom border
|
|
1192
|
+
*/
|
|
1193
|
+
"fullBorder"?: boolean;
|
|
1091
1194
|
"onJump-change-activetab"?: (event: JumpTabCustomEvent<any>) => void;
|
|
1092
1195
|
"tabGroupName"?: string;
|
|
1093
1196
|
/**
|
|
@@ -1129,6 +1232,7 @@ declare namespace LocalJSX {
|
|
|
1129
1232
|
"jump-filter-checkbox": JumpFilterCheckbox;
|
|
1130
1233
|
"jump-filtergroup": JumpFiltergroup;
|
|
1131
1234
|
"jump-icon": JumpIcon;
|
|
1235
|
+
"jump-navbar": JumpNavbar;
|
|
1132
1236
|
"jump-pagination": JumpPagination;
|
|
1133
1237
|
"jump-pagination-table": JumpPaginationTable;
|
|
1134
1238
|
"jump-quantity": JumpQuantity;
|
|
@@ -1152,6 +1256,7 @@ declare module "@stencil/core" {
|
|
|
1152
1256
|
"jump-filter-checkbox": LocalJSX.JumpFilterCheckbox & JSXBase.HTMLAttributes<HTMLJumpFilterCheckboxElement>;
|
|
1153
1257
|
"jump-filtergroup": LocalJSX.JumpFiltergroup & JSXBase.HTMLAttributes<HTMLJumpFiltergroupElement>;
|
|
1154
1258
|
"jump-icon": LocalJSX.JumpIcon & JSXBase.HTMLAttributes<HTMLJumpIconElement>;
|
|
1259
|
+
"jump-navbar": LocalJSX.JumpNavbar & JSXBase.HTMLAttributes<HTMLJumpNavbarElement>;
|
|
1155
1260
|
"jump-pagination": LocalJSX.JumpPagination & JSXBase.HTMLAttributes<HTMLJumpPaginationElement>;
|
|
1156
1261
|
"jump-pagination-table": LocalJSX.JumpPaginationTable & JSXBase.HTMLAttributes<HTMLJumpPaginationTableElement>;
|
|
1157
1262
|
"jump-quantity": LocalJSX.JumpQuantity & JSXBase.HTMLAttributes<HTMLJumpQuantityElement>;
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as t,h as a,H as i}from"./p-d4c681a4.js";const s=":host{display:block;--jump-tab-bg-color:var(--gray-ultralight, #f8f8f8)}:host .Wrapper{display:flex;width:fit-content}:host .Wrapper.rounded{border-radius:50px;background-color:#f8f8f8}";const c=s;const d=class{constructor(a){e(this,a);this.setActiveTab=t(this,"jump-change-activetab",7);this.tabGroupName=undefined;this.variant="inline"}changeActiveTabHandler(e){this.setActiveTab.emit(e.detail);const t=getComputedStyle(document.documentElement);const a=t.getPropertyValue("--neutral-grey-secondary").trim();let i=this.JumpTabEl.querySelectorAll("jump-tab-item");if(i.length>0){i.forEach((t=>{if(t.getAttribute("identifier")===e.detail.id){t.setAttribute("active","");if(this.variant==="sheet"){i.forEach(((e,s)=>{if(e!==t&&s!==i.length-1){e.style.borderRight=`1px solid ${a}`}else{e.style.borderRight="1px solid transparent"}}));let e=t.previousElementSibling;if(e){e.style.borderRight="1px solid transparent"}}}else{t.removeAttribute("active")}}))}let s=this.JumpTabEl.querySelectorAll("jump-tab-panel");if(s.length>0){s.forEach((t=>{if(t.getAttribute("identifier")===e.detail.id){t.setAttribute("active","")}else{t.removeAttribute("active")}}))}}componentDidLoad(){console.log("Component has been rendered");if(this.variant==="sheet"){const e=getComputedStyle(document.documentElement);const t=e.getPropertyValue("--neutral-grey-secondary").trim();let a=this.JumpTabEl.querySelectorAll("jump-tab-item");if(a.length>0){a.forEach(((e,i)=>{if(i===a.length-1||e.classList.contains("active")){e.style.borderRight="1px solid transparent"}else{e.style.borderRight=`1px solid ${t}`}}))}}}render(){return a(i,{key:"1f7ce37a86cdc6c5eb7c98c19e3c1dd02a731e86",class:"JumpTab",id:this.tabGroupName,ref:e=>{this.JumpTabEl=e}},a("div",{key:"2e3c707b84ae5cf642b276f586cf2385ddddc819",class:"Wrapper "+this.variant},a("slot",{key:"270de7bd4e4c5a3a8679d79951557dee91f62788",name:"tab-item"})),a("div",{key:"9ab0264b6e0844324696dec5c35bbeed5441d413"},a("slot",{key:"e329ee02fb732e819e5826208a779357d5bd5e4f",name:"tab-content"})))}};d.style=c;export{d as jump_tab};
|
|
2
|
-
//# sourceMappingURL=p-188c7c2e.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["jumpTabCss","JumpTabStyle0","JumpTab","undefined","changeActiveTabHandler","event","this","setActiveTab","emit","detail","rootStyles","getComputedStyle","document","documentElement","primaryColor","getPropertyValue","trim","items","JumpTabEl","querySelectorAll","length","forEach","item","getAttribute","id","setAttribute","variant","sibling","index","style","borderRight","previousSibling","previousElementSibling","removeAttribute","panel","componentDidLoad","console","log","classList","contains","render","h","Host","key","class","tabGroupName","ref","el","name"],"sources":["src/components/jump-tab/jump-tab.scss?tag=jump-tab&encapsulation=shadow","src/components/jump-tab/jump-tab.tsx"],"sourcesContent":[":host {\n display: block;\n\n --jump-tab-bg-color: var(--gray-ultralight, #f8f8f8);\n \n .Wrapper {\n display: flex;\n width: fit-content;\n \n &.rounded {\n border-radius: 50px;\n background-color: #f8f8f8; // dovrà andarci var(--jump-tab-bg-color)\n }\n }\n}","import { Component, Host, Event, EventEmitter, Prop, h, Listen } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab',\n styleUrl: 'jump-tab.scss',\n shadow: true,\n})\nexport class JumpTab {\n\n JumpTabEl: HTMLElement;\n /* ---------------------- @PROPERTIES ------------------------- */\n @Prop() tabGroupName: string = undefined;\n\n /**\n * The style of the tab. The same value must be passed to all the items.\n * Choosed from \"inline\", \"boxed\", \"sheet\", \"rounded\"\n */\n @Prop() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-activetab'}) setActiveTab: EventEmitter;\n\n @Listen('jump-change-active-tab')\n changeActiveTabHandler(event: CustomEvent) {\n this.setActiveTab.emit(event.detail);\n\n // Recupera il valore della variabile CSS\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item) => {\n if (item.getAttribute('identifier') === event.detail.id) {\n item.setAttribute('active', '');\n\n if (this.variant === 'sheet') {\n // Aggiungi il bordo ai fratelli dell'elemento attivo tranne l'ultimo\n items.forEach((sibling, index) => {\n if (sibling !== item && index !== items.length - 1) {\n sibling.style.borderRight = `1px solid ${primaryColor}`; // Usa i backticks\n } else {\n sibling.style.borderRight = '1px solid transparent';\n }\n });\n\n // Rimuovi il bordo dal fratello precedente\n let previousSibling = item.previousElementSibling as any;\n if (previousSibling) {\n previousSibling.style.borderRight = '1px solid transparent';\n }\n }\n\n } else {\n item.removeAttribute('active');\n }\n });\n }\n\n let panel = this.JumpTabEl.querySelectorAll('jump-tab-panel');\n if (panel.length > 0) {\n panel.forEach((panel) => {\n if (panel.getAttribute('identifier') === event.detail.id) {\n panel.setAttribute('active', '');\n } else {\n panel.removeAttribute('active');\n }\n });\n }\n }\n\n\n componentDidLoad() {\n console.log('Component has been rendered');\n if(this.variant === 'sheet') {\n // Recupera il valore della variabile CSS\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n // Seleziona tutti gli elementi jump-tab-item\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item, index) => {\n // Aggiungi bordo destro a tutti tranne:\n // - l'ultimo elemento\n // - l'elemento attivo (avente classe \"active\")\n if (index === items.length - 1 || item.classList.contains('active')) {\n item.style.borderRight = '1px solid transparent';\n } else {\n item.style.borderRight = `1px solid ${primaryColor}`;\n }\n });\n }\n }\n\n }\n\n render() {\n return (\n <Host class=\"JumpTab\" id={this.tabGroupName} ref={(el) => {this.JumpTabEl = el;}}> \n <div class={\"Wrapper \" + this.variant}>\n <slot name=\"tab-item\"></slot>\n </div>\n <div>\n <slot name=\"tab-content\"></slot>\n </div>\n </Host>\n );\n }\n}"],"mappings":"yDAAA,MAAMA,EAAa,4LACnB,MAAAC,EAAeD,E,MCMFE,EAAO,M,+FAIaC,U,aAML,Q,CAK1B,sBAAAC,CAAuBC,GACrBC,KAAKC,aAAaC,KAAKH,EAAMI,QAG7B,MAAMC,EAAaC,iBAAiBC,SAASC,iBAC7C,MAAMC,EAAeJ,EAAWK,iBAAiB,4BAA4BC,OAE7E,IAAIC,EAAQX,KAAKY,UAAUC,iBAAiB,iBAC5C,GAAIF,EAAMG,OAAS,EAAG,CACpBH,EAAMI,SAASC,IACb,GAAIA,EAAKC,aAAa,gBAAkBlB,EAAMI,OAAOe,GAAI,CACvDF,EAAKG,aAAa,SAAU,IAE5B,GAAInB,KAAKoB,UAAY,QAAS,CAE5BT,EAAMI,SAAQ,CAACM,EAASC,KACtB,GAAID,IAAYL,GAAQM,IAAUX,EAAMG,OAAS,EAAG,CAClDO,EAAQE,MAAMC,YAAc,aAAahB,G,KACpC,CACLa,EAAQE,MAAMC,YAAc,uB,KAKhC,IAAIC,EAAkBT,EAAKU,uBAC3B,GAAID,EAAiB,CACnBA,EAAgBF,MAAMC,YAAc,uB,OAInC,CACLR,EAAKW,gBAAgB,S,KAK3B,IAAIC,EAAQ5B,KAAKY,UAAUC,iBAAiB,kBAC5C,GAAIe,EAAMd,OAAS,EAAG,CACpBc,EAAMb,SAASa,IACb,GAAIA,EAAMX,aAAa,gBAAkBlB,EAAMI,OAAOe,GAAI,CACxDU,EAAMT,aAAa,SAAU,G,KACxB,CACLS,EAAMD,gBAAgB,S,MAO9B,gBAAAE,GACEC,QAAQC,IAAI,+BACZ,GAAG/B,KAAKoB,UAAY,QAAS,CAE3B,MAAMhB,EAAaC,iBAAiBC,SAASC,iBAC7C,MAAMC,EAAeJ,EAAWK,iBAAiB,4BAA4BC,OAG7E,IAAIC,EAAQX,KAAKY,UAAUC,iBAAiB,iBAC5C,GAAIF,EAAMG,OAAS,EAAG,CACpBH,EAAMI,SAAQ,CAACC,EAAMM,KAInB,GAAIA,IAAUX,EAAMG,OAAS,GAAKE,EAAKgB,UAAUC,SAAS,UAAW,CACnEjB,EAAKO,MAAMC,YAAc,uB,KACpB,CACLR,EAAKO,MAAMC,YAAc,aAAahB,G,OAQhD,MAAA0B,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,UAAUpB,GAAIlB,KAAKuC,aAAcC,IAAMC,IAAQzC,KAAKY,UAAY6B,CAAE,GAC5EN,EAAA,OAAAE,IAAA,2CAAKC,MAAO,WAAatC,KAAKoB,SAC5Be,EAAA,QAAAE,IAAA,2CAAMK,KAAK,cAEbP,EAAA,OAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,2CAAMK,KAAK,iB"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as a,H as i}from"./p-d4c681a4.js";const t=":host{--primary-standard:var(--secondary-hard, #435171);--jump-button-background-hover:red;--bg-drawer:var(--bg-drawer, #fff);--header-height:var(--header-height, 80px);--drawer-width:var(--drawer-width, 240px)}:host h3{margin:0}.filtersDrawer{position:fixed;display:flex;flex-direction:column;gap:1rem;left:-100vw;top:var(--header-height);height:-webkit-fill-available;max-height:calc(100vh - var(--header-height));transition:0.3s all ease-in-out;background-color:var(--bg-drawer, #fff);padding:1rem;width:100%;max-width:var(--drawer-width);box-shadow:8px 0 15px 0 rgba(0, 0, 0, 0.1490196078);z-index:2;overflow:auto}.filtersDrawer[aria-hidden=false]{left:0;transition:0.3s all ease-in-out}.filtersDrawer[aria-hidden=false] .filtersDrawer__close{position:fixed;top:calc(var(--header-height) + 1rem);left:calc(var(--drawer-width) - 2rem)}@media (min-width: 768px){.filtersDrawer{position:relative;left:0;height:auto;max-width:initial;box-shadow:none}}.filtersDrawer .filtersDrawer__header{display:flex;justify-content:flex-start;align-items:center;gap:0.5rem}";const r=t;const s=class{constructor(a){e(this,a);this.direction="vertical";this.filterHeading="Filtra per";this.filterButtonLabel="Filtri";this.filterButtonIcon="sliders";this.mobileThreshold=768;this.filters=undefined;this.activeFilters=0;this.showMobileFilters=false;this.isMobile=false}filterChangeHandler(e){this.filters=Object.assign(Object.assign({},this.filters),{[e.detail.name]:e.detail.values});console.log("Received the custom filterChange event: ",this.filters)}handleResize(){this.isMobile=window.innerWidth<this.mobileThreshold}watchHandler(e,a){var i,t,r,s;if(e!==a){if(e){(i=this.mobileToggle)===null||i===void 0?void 0:i.setAttribute("aria-expanded","true");(t=this.filtersDrawer)===null||t===void 0?void 0:t.setAttribute("aria-hidden","false")}else{(r=this.mobileToggle)===null||r===void 0?void 0:r.setAttribute("aria-expanded","false");(s=this.filtersDrawer)===null||s===void 0?void 0:s.setAttribute("aria-hidden","true")}}}async getFilters(){return this.filters}componentDidLoad(){this.handleResize()}render(){return a(i,{key:"b45c2e4a0ed8985f709b5ef0cd6796c73f78080b",mobileFilters:this.showMobileFilters},this.isMobile&&a("jump-button",{key:"a8bf5423d154fe3dc7c91bc12a379fc30ab85992",ref:e=>{this.mobileToggle=e},buttonId:this.filterButtonIcon,variant:"primary",outline:true,onClick:()=>this.showMobileFilters=!this.showMobileFilters},a("slot",{key:"e9cdf515fe9d1f5f6c557f1b345ccaa5e75ed5ba",name:"prefix"},this.filterButtonIcon&&a("jump-icon",{key:"7175bf68ccc5cba19384ac74de269a83a9321f9c",library:"fa",category:"regular",name:this.filterButtonIcon,size:"small"}),this.filterButtonLabel),a("slot",{key:"43d5a322cf0d0828b821abfb8bdfe14a9c2bf706",name:"suffix"},this.activeFilters>0&&a("jump-badge",{key:"2d27ab99d6980334ca33b7d75ccceef9561005b0",label:this.activeFilters.toString(),variant:"success",soft:true,dimension:"dot"},"1"))),a("div",{key:"b960e02353e147de8dc633b6f3fa74e8aebd4fc1",ref:e=>{this.filtersDrawer=e},class:"filtersDrawer","data-variant":this.direction},!this.isMobile&&a("div",{key:"6c86c707343eab1720d49208d487dacfed2c7a69",class:"filtersDrawer__header"},a("jump-icon",{key:"44e43addc3beecc57cc0b5a4bbc1f004df9f4ea3",class:"small",name:this.filterButtonIcon}),a("h3",{key:"49893521129b517c91caa15fb38d7c1bfc17be2c"},this.filterHeading)),this.isMobile&&a("jump-icon",{key:"91d6bfe0b195cad204df517eb4e2ab02b141a3a8",library:"lucide",name:"x",size:"small",label:"",class:"filtersDrawer__close",onClick:()=>this.showMobileFilters=false}),a("slot",{key:"5691db6520a4ea84d3b3ea5b1b4c622893770317"})))}static get watchers(){return{showMobileFilters:["watchHandler"]}}};s.style=r;export{s as jump_filter};
|
|
2
|
-
//# sourceMappingURL=p-21a38875.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["jumpFilterCss","JumpFilterStyle0","JumpFilter","filterChangeHandler","event","this","filters","Object","assign","detail","name","values","console","log","handleResize","isMobile","window","innerWidth","mobileThreshold","watchHandler","newValue","oldValue","_a","mobileToggle","setAttribute","_b","filtersDrawer","_c","_d","getFilters","componentDidLoad","render","h","Host","key","mobileFilters","showMobileFilters","ref","el","buttonId","filterButtonIcon","variant","outline","onClick","library","category","size","filterButtonLabel","activeFilters","label","toString","soft","dimension","class","direction","filterHeading"],"sources":["src/components/jump-filter/jump-filter.scss?tag=jump-filter&encapsulation=shadow","src/components/jump-filter/jump-filter.tsx"],"sourcesContent":[":host {\n --primary-standard: var(--secondary-hard, #435171);\n //--jump-button-background-hover: var(--secondary-hard, #435171);\n --jump-button-background-hover: red;\n --bg-drawer: var(--bg-drawer, #fff);\n --header-height: var(--header-height, 80px);\n --drawer-width: var(--drawer-width, 240px);\n\n h3 {\n margin: 0;\n }\n}\n\n.filtersDrawer {\n position: fixed;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n left: -100vw;\n top: var(--header-height);\n height: -webkit-fill-available;\n max-height: calc(100vh - var(--header-height));\n transition: 0.3s all ease-in-out;\n background-color: var(--bg-drawer, #fff);\n padding: 1rem;\n width: 100%;\n max-width: var(--drawer-width);\n box-shadow: 8px 0 15px 0 #00000026;\n z-index: 2;\n overflow: auto;\n\n &[aria-hidden=\"false\"] {\n left: 0;\n transition: 0.3s all ease-in-out;\n\n .filtersDrawer__close {\n position: fixed;\n top: calc(var(--header-height) + 1rem);\n left: calc(var(--drawer-width) - 2rem);\n }\n }\n\n @media (min-width: 768px) { //md breakpoint tailwind\n position: relative;\n left: 0;\n height: auto;\n max-width: initial;\n box-shadow: none;\n }\n\n .filtersDrawer__header {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 0.5rem;\n }\n}\n","import { Component, Host, Prop, h, State, Listen, Method, Watch } 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 @Watch('showMobileFilters')\n watchHandler(newValue: boolean, oldValue: boolean) {\n if (newValue !== oldValue) {\n if (newValue) {\n this.mobileToggle?.setAttribute('aria-expanded', 'true');\n this.filtersDrawer?.setAttribute('aria-hidden', 'false');\n } else {\n this.mobileToggle?.setAttribute('aria-expanded', 'false');\n this.filtersDrawer?.setAttribute('aria-hidden', 'true');\n }\n }\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.handleResize();\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\n onClick={() => this.showMobileFilters = !this.showMobileFilters}>\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 &&\n <jump-badge label={this.activeFilters.toString()} variant=\"success\" soft dimension=\"dot\">1</jump-badge>}\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 {this.isMobile && <jump-icon library=\"lucide\" name=\"x\" size=\"small\" label=\"\" class={'filtersDrawer__close'}\n onClick={() => this.showMobileFilters = false}></jump-icon>}\n <slot></slot>\n </div>}\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAgB,siCACtB,MAAAC,EAAeD,E,MCMFE,EAAU,M,wCAE0B,W,mBACf,a,uBACI,S,sBACD,U,qBACD,I,0CAGD,E,uBACK,M,cACT,K,CAM7B,mBAAAC,CAAoBC,GAElBC,KAAKC,QAAOC,OAAAC,OAAAD,OAAAC,OAAA,GAAOH,KAAKC,SAAO,CAAE,CAACF,EAAMK,OAAOC,MAAON,EAAMK,OAAOE,SACnEC,QAAQC,IAAI,2CAA4CR,KAAKC,Q,CAQ/D,YAAAQ,GACET,KAAKU,SAAWC,OAAOC,WAAaZ,KAAKa,e,CAI3C,YAAAC,CAAaC,EAAmBC,G,YAC9B,GAAID,IAAaC,EAAU,CACzB,GAAID,EAAU,EACZE,EAAAjB,KAAKkB,gBAAY,MAAAD,SAAA,SAAAA,EAAEE,aAAa,gBAAiB,SACjDC,EAAApB,KAAKqB,iBAAa,MAAAD,SAAA,SAAAA,EAAED,aAAa,cAAe,Q,KAC3C,EACLG,EAAAtB,KAAKkB,gBAAY,MAAAI,SAAA,SAAAA,EAAEH,aAAa,gBAAiB,UACjDI,EAAAvB,KAAKqB,iBAAa,MAAAE,SAAA,SAAAA,EAAEJ,aAAa,cAAe,O,GAStD,gBAAMK,GACJ,OAAOxB,KAAKC,O,CAGd,gBAAAwB,GACEzB,KAAKS,c,CAGP,MAAAiB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,cAAe9B,KAAK+B,mBACvB/B,KAAKU,UAAYiB,EAAA,eAAAE,IAAA,2CAChBG,IAAMC,IAAQjC,KAAKkB,aAAee,CAAE,EACpCC,SAAUlC,KAAKmC,iBAAkBC,QAAS,UAAWC,QAAO,KAC5DC,QAAS,IAAMtC,KAAK+B,mBAAqB/B,KAAK+B,mBAC9CJ,EAAA,QAAAE,IAAA,2CAAMxB,KAAK,UACRL,KAAKmC,kBACJR,EAAA,aAAAE,IAAA,2CAAWU,QAAQ,KAAKC,SAAS,UAAUnC,KAAML,KAAKmC,iBAAkBM,KAAK,UAC9EzC,KAAK0C,mBAERf,EAAA,QAAAE,IAAA,2CAAMxB,KAAK,UACRL,KAAK2C,cAAgB,GACpBhB,EAAA,cAAAE,IAAA,2CAAYe,MAAO5C,KAAK2C,cAAcE,WAAYT,QAAQ,UAAUU,KAAI,KAACC,UAAU,OAAK,OAIzFpB,EAAA,OAAAE,IAAA,2CACCG,IAAMC,IAAQjC,KAAKqB,cAAgBY,CAAE,EACzCe,MAAM,gBAAe,eAAehD,KAAKiD,YACvCjD,KAAKU,UACPiB,EAAA,OAAAE,IAAA,2CAAKmB,MAAO,yBACVrB,EAAA,aAAAE,IAAA,2CAAWmB,MAAM,QAAQ3C,KAAML,KAAKmC,mBACpCR,EAAA,MAAAE,IAAA,4CAAK7B,KAAKkD,gBAEPlD,KAAKU,UAAYiB,EAAA,aAAAE,IAAA,2CAAWU,QAAQ,SAASlC,KAAK,IAAIoC,KAAK,QAAQG,MAAM,GAAGI,MAAO,uBACpFV,QAAS,IAAMtC,KAAK+B,kBAAoB,QACxCJ,EAAA,QAAAE,IAAA,8C"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as a,H as s}from"./p-d4c681a4.js";const t=":host{display:block}.JumpTabPanel__Content{display:none;padding:1rem 0}.JumpTabPanel__Content.active{display:block}";const n=t;const d=class{constructor(a){e(this,a);this.identifier=undefined;this.active=false}render(){return a(s,{key:"be2d841d0dd1b5cf9785e427d23cec2f64736722",class:"JumpTabPanel",id:this.identifier},a("div",{key:"843453d48997bac1a6d9407ef4d8338fe50c2bf8",class:"JumpTabPanel__Content "+(this.active?"active":"")},a("slot",{key:"6359a6f56a92683f44964e41ee46e49a8de8e10a"})))}};d.style=n;export{d as jump_tab_panel};
|
|
2
|
-
//# sourceMappingURL=p-62b52857.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as o,h as e,H as n}from"./p-d4c681a4.js";const r=":host{display:block;--jump-tabitem-active-color:var(--secondary-standard);--jump-tabitem-color:var(--neutral-grey-secondary);--jump-tabitem-hover-color:var(--neutral-grey-disabled, #CBCBCB);--jump-tabitem-boxed-bg-color:var(--secondary-soft, #EDF2FA);--jump-tabitem-rounded-bg-color:white;font-family:var(--ff-primary)}:host .Content{display:flex;}:host .Content label{font-size:16px}:host .Content.left{flex-direction:row;gap:6px;align-items:center}:host .Content.top{flex-direction:column;gap:2px;align-items:center}:host .Content.inline{color:var(--jump-tabitem-color);padding:12px 24px}:host .Content.inline.active{color:var(--jump-tabitem-active-color)}:host .Content.inline.active span{font-weight:bold}:host .Content.boxed{color:var(--jump-tabitem-color);padding:15px 39px;background-color:transparent;border:1px solid var(--jump-tabitem-boxed-bg-color)}:host .Content.boxed:hover:not(.disabled),:host .Content.boxed:hover:not(.active){background-color:transparent}:host .Content.boxed:hover:not(.disabled) span,:host .Content.boxed:hover:not(.active) span{font-weight:bold}:host .Content.boxed.active{color:var(--jump-tabitem-active-color);background-color:var(--jump-tabitem-boxed-bg-color);border:1px solid var(--jump-tabitem-boxed-bg-color)}:host .Content.boxed.active span{font-weight:bold}:host .Content.rounded{padding:12px 32px;color:var(--jump-tabitem-color)}:host .Content.rounded:hover:not(.disabled){cursor:pointer}:host .Content.rounded:hover:not(.disabled) span{font-weight:bold}:host .Content.rounded.active{color:var(--jump-tabitem-active-color);background-color:var(--jump-tabitem-rounded-bg-color);border:1px solid var(--jump-tabitem-active-color);border-radius:50px}:host .Content.sheet{padding:12px 32px;color:var(--neutral-grey-secondary)}:host .Content.sheet:hover:not(.disabled){cursor:pointer}:host .Content.sheet:hover:not(.disabled) span{font-weight:bold}:host .Content.sheet.active{color:var(--jump-tabitem-active-color);background-color:var(--jump-tabitem-rounded-bg-color);border-radius:8px 8px 0px 0px}:host .Content.disabled{cursor:not-allowed;opacity:0.5;pointer-events:none}:host(.inline){border-bottom:1px solid var(--jump-tabitem-hover-color)}:host(.inline):hover:not(.disabled):not(.active){border-bottom:3px solid var(--jump-tabitem-hover-color);cursor:pointer}:host(.inline.active){border-bottom:3px solid var(--jump-tabitem-active-color)}";const a=r;const i=class{constructor(e){t(this,e);this.changeActiveTab=o(this,"jump-change-active-tab",7);this.identifier=undefined;this.iconName=undefined;this.iconPosition="left";this.label="";this.active=false;this.disabled=false;this.variant="inline"}changeTab(t){this.changeActiveTab.emit({id:t})}componentDidLoad(){console.log("Component has been rendered");let t=this.tabEl.parentElement.getAttribute("variant");this.variant=t}render(){return e(n,{key:"9d817c4dc39e4091ddf11bbe3586dd299db2c9a1",ref:t=>{this.tabEl=t},class:"JumpTabItem "+(this.active?"active":"")+" "+this.variant},e("div",{key:"59bdb3b691141796dd912611742bc79c0d10a4ca",class:"Content "+(this.iconName?this.iconPosition:"")+" "+this.variant+" "+(this.active?"active":"")+" "+(this.disabled?"disabled":""),onClick:()=>this.changeTab(this.identifier),id:this.identifier},this.iconName&&(this.variant=="inline"||this.variant=="boxed")&&e("jump-icon",{key:"3cd011409f305046cf76d79256be72662f7d6c9a",library:"fa",category:"regular",name:this.iconName,size:"small"}),e("span",{key:"522ca0332d2302021ded4941ca67d790b308f3ac",class:"label"},this.label)))}};i.style=a;export{i as jump_tab_item};
|
|
2
|
-
//# sourceMappingURL=p-eebee8f5.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["jumpTabItemCss","JumpTabItemStyle0","JumpTabItem","undefined","changeTab","identifier","this","changeActiveTab","emit","id","componentDidLoad","console","log","parentVariant","tabEl","parentElement","getAttribute","variant","render","h","Host","key","ref","el","class","active","iconName","iconPosition","disabled","onClick","library","category","name","size","label"],"sources":["src/components/jump-tab-item/jump-tab-item.scss?tag=jump-tab-item&encapsulation=shadow","src/components/jump-tab-item/jump-tab-item.tsx"],"sourcesContent":[":host {\n display: block;\n\n --jump-tabitem-active-color: var(--secondary-standard);\n --jump-tabitem-color: var(--neutral-grey-secondary);\n --jump-tabitem-hover-color: var(--neutral-grey-disabled, #CBCBCB);\n --jump-tabitem-boxed-bg-color: var(--secondary-soft, #EDF2FA);\n --jump-tabitem-rounded-bg-color: white;\n \n font-family: var(--ff-primary);\n \n \n .Content {\n \n display: flex;\n \n label {\n font-size: 16px;\n }\n \n &.left {\n flex-direction: row;\n gap: 6px;\n align-items: center;\n }\n \n &.top {\n flex-direction: column;\n gap: 2px;\n align-items: center;\n }\n \n /*Tipologia inline */\n &.inline {\n color: var(--jump-tabitem-color);\n padding: 12px 24px;\n }\n \n &.inline.active {\n color: var(--jump-tabitem-active-color);\n \n \n span {\n font-weight: bold;\n }\n }\n \n /* Tipologia boxed */\n &.boxed {\n color: var(--jump-tabitem-color);\n padding: 15px 39px;\n background-color: transparent;\n border: 1px solid var(--jump-tabitem-boxed-bg-color);\n }\n \n &.boxed:hover:not(.disabled),\n &.boxed:hover:not(.active) {\n background-color: transparent;\n \n span {\n font-weight: bold;\n }\n }\n \n \n \n &.boxed.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-boxed-bg-color);\n border: 1px solid var(--jump-tabitem-boxed-bg-color);\n \n span {\n font-weight: bold;\n }\n }\n \n /* Tipologia rounded */\n &.rounded {\n padding: 12px 32px;\n color: var(--jump-tabitem-color);\n \n }\n \n &.rounded:hover:not(.disabled) {\n cursor: pointer;\n \n span {\n font-weight: bold;\n }\n }\n \n &.rounded.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-rounded-bg-color);\n border: 1px solid var(--jump-tabitem-active-color);\n border-radius: 50px;\n \n }\n \n /** Tipologia sheet */\n &.sheet {\n padding: 12px 32px;\n color: var(--neutral-grey-secondary);\n // border: 1px solid transparent;\n \n }\n \n &.sheet:hover:not(.disabled) {\n cursor: pointer;\n \n span {\n font-weight: bold;\n }\n }\n \n &.sheet.active {\n color: var(--jump-tabitem-active-color);\n background-color: var(--jump-tabitem-rounded-bg-color);\n //border: 1px solid var(--jump-tabitem-rounded-bg-color);\n border-radius: 8px 8px 0px 0px;\n }\n \n /* Disabilitato */\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n }\n \n }\n}\n\n:host(.inline){\n border-bottom: 1px solid var(--jump-tabitem-hover-color);\n}\n\n:host(.inline):hover:not(.disabled):not(.active) {\n border-bottom: 3px solid var(--jump-tabitem-hover-color);\n cursor: pointer;\n}\n\n:host(.inline.active) {\n border-bottom: 3px solid var(--jump-tabitem-active-color);\n}","import { Component, Host, Prop,State, h, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab-item',\n styleUrl: 'jump-tab-item.scss',\n shadow: true,\n})\nexport class JumpTabItem {\n\n /* ---------------------- @PROPERTIES ------------------------- */\n\n /**\n * Identifier of the tab\n */\n @Prop() identifier: string = undefined;\n\n /**\n * Name of the icon. If not provided, the icon will not be displayed\n */\n @Prop() iconName: string = undefined;\n\n /**\n * Icon position, apply only if the icon is present\n * Choosed from \"left\", \"top\"\n */\n @Prop() iconPosition: string = 'left';\n @Prop() label: string = '';\n @Prop() active: boolean = false;\n\n @Prop() disabled: boolean = false;\n\n /**\n * The style of the tab item\n * Choosed from \"inline\", \"boxed\", \"sheet\", \"rounded\"\n */\n @State() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-active-tab' }) changeActiveTab: EventEmitter;\n\n changeTab(identifier){\n this.changeActiveTab.emit({id: identifier});\n }\n\n componentDidLoad() {\n console.log('Component has been rendered');\n // Deve leggere la prop \"variant\" del componente babbo jump-tab e popolare la propria prop \"variant\"\n let parentVariant = this.tabEl.parentElement.getAttribute('variant');\n this.variant = parentVariant;\n }\n\n // componentDidLoad() {\n // console.log('Component has been rendered');\n \n // // console.log('THIS', this);\n // if(this.active){\n // let tab = this.tabEl.previousElementSibling as any;\n // if(tab){\n // tab.style.borderRight = 'none';\n // }\n // }\n // }\n\n // @Watch('active')\n // watchActive(newValue) {\n // console.log('watch active');\n // // Devo ripristinare i bordi di tutti i fratelli di this.tabEl\n // let siblings = this.tabEl.parentElement.children as any;\n // for (let i = 0; i < siblings.length; i++) {\n // siblings[i].style.borderRight = '1px solid red';\n // }\n\n // console.log('thisel', this.tabEl);\n // console.log('newvalue', newValue);\n // console.log('xxxxxx', this.tabEl.classList);\n\n // // Se this.tabEl ha la classe 'active' allora rimuovo il bordo destro\n // if (newValue && this.tabEl.classList.contains('active')) {\n // console.log('contiene ');\n // this.tabEl.style.borderRight = 'none';\n\n // // Rimuovere il bordo destro dal fratello precedente, se esiste\n // let prevEl = this.tabEl.previousElementSibling as any;\n // console.log('revEl', prevEl);\n // if (prevEl) {\n // prevEl.style.borderRight = 'none';\n // }\n // }\n // }\n\n // @Watch('active')\n // watchActive(newValue) {\n // // Ripristina i bordi di tutti gli elementi\n // const items = document.querySelectorAll('.JumpTabItem') as any;\n // console.log('ITEMS', items);\n // items.forEach(item => {\n // item.style.borderRight = '1px solid red';\n // });\n\n // // Verifica se this.tabEl ha la classe 'active'\n // if (newValue && this.tabEl.classList.contains('active')) {\n // // Rimuovere il bordo destro dal nuovo elemento attivo\n // this.tabEl.style.borderRight = 'none';\n\n // // Rimuovere il bordo destro dal fratello precedente, se esiste\n // let prevEl = this.tabEl.previousElementSibling as any;\n // if (prevEl) {\n // prevEl.style.borderRight = 'none';\n // }\n // }\n // }\n\n\n tabEl: HTMLElement;\n\n render() {\n return (\n <Host\n ref={(el) => { this.tabEl = el }}\n class={\"JumpTabItem \" + (this.active ? 'active' : '') + \" \" +(this.variant)}>\n <div class={\"Content \" + (this.iconName ? this.iconPosition : '') + \" \" + (this.variant) + \" \" + (this.active ? 'active' : '') + \" \" + (this.disabled ? 'disabled' : '')} onClick={() => this.changeTab(this.identifier)} id={this.identifier}>\n {(this.iconName && (this.variant == 'inline' || this.variant == 'boxed')) &&\n <jump-icon library=\"fa\" category=\"regular\" name={this.iconName} size=\"small\"></jump-icon>\n }\n <span class=\"label\">{this.label}</span>\n </div>\n </Host>\n );\n }\n}\n\n"],"mappings":"yDAAA,MAAMA,EAAiB,m1EACvB,MAAAC,EAAeD,E,MCMFE,EAAW,M,iGAOOC,U,cAKFA,U,kBAMI,O,WACP,G,YACE,M,cAEE,M,aAMD,Q,CAI3B,SAAAC,CAAUC,GACRC,KAAKC,gBAAgBC,KAAK,CAACC,GAAIJ,G,CAGjC,gBAAAK,GACEC,QAAQC,IAAI,+BAEZ,IAAIC,EAAgBP,KAAKQ,MAAMC,cAAcC,aAAa,WAC3DV,KAAKW,QAAUJ,C,CAmEhB,MAAAK,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,IAAMC,IAASjB,KAAKQ,MAAQS,CAAE,EAC/BC,MAAO,gBAAkBlB,KAAKmB,OAAS,SAAW,IAAM,IAAMnB,KAAY,SACzEa,EAAA,OAAAE,IAAA,2CAAKG,MAAO,YAAclB,KAAKoB,SAAWpB,KAAKqB,aAAe,IAAM,IAAOrB,KAAY,QAAI,KAAOA,KAAKmB,OAAS,SAAW,IAAM,KAAOnB,KAAKsB,SAAW,WAAa,IAAKC,QAAS,IAAMvB,KAAKF,UAAUE,KAAKD,YAAaI,GAAIH,KAAKD,YAC/NC,KAAKoB,WAAapB,KAAKW,SAAW,UAAYX,KAAKW,SAAW,UAC9DE,EAAA,aAAAE,IAAA,2CAAWS,QAAQ,KAAKC,SAAS,UAAUC,KAAM1B,KAAKoB,SAAUO,KAAK,UAEvEd,EAAA,QAAAE,IAAA,2CAAMG,MAAM,SAASlB,KAAK4B,Q"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|