@jumpgroup/jump-design-system 0.3.40 → 0.3.42
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-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/jump-filter.cjs.entry.js +15 -5
- package/dist/cjs/jump-filter.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-filtergroup.cjs.entry.js +3 -3
- package/dist/cjs/jump-navbar.cjs.entry.js +5 -5
- 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-search-bar.cjs.entry.js +2 -2
- package/dist/cjs/jump-tab-item.cjs.entry.js +2 -2
- package/dist/cjs/jump-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/jump-tab.cjs.entry.js +2 -2
- package/dist/cjs/jump-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/jump-accordion/jump-accordion.stories.js +18 -0
- package/dist/collection/components/jump-accordion/jump-accordion.stories.js.map +1 -1
- package/dist/collection/components/jump-accordion-group/jump-accordion-group.stories.js +8 -1
- package/dist/collection/components/jump-accordion-group/jump-accordion-group.stories.js.map +1 -1
- package/dist/collection/components/jump-filter/jump-filter.css +23 -0
- package/dist/collection/components/jump-filter/jump-filter.js +52 -5
- package/dist/collection/components/jump-filter/jump-filter.js.map +1 -1
- package/dist/collection/components/jump-filter/jump-filter.stories.js +5 -0
- package/dist/collection/components/jump-filter/jump-filter.stories.js.map +1 -1
- package/dist/collection/components/jump-filter-checkbox/jump-filter-checkbox.js +2 -2
- package/dist/collection/components/jump-filtergroup/jump-filtergroup.js +3 -3
- package/dist/collection/components/jump-navbar/jump-navbar.js +5 -5
- package/dist/collection/components/jump-pagination/jump-pagination.js +3 -3
- package/dist/collection/components/jump-pagination/jump-pagination.stories.js +19 -3
- package/dist/collection/components/jump-pagination/jump-pagination.stories.js.map +1 -1
- package/dist/collection/components/jump-pagination-table/jump-pagination-table.js +3 -3
- package/dist/collection/components/jump-pagination-table/jump-pagination-table.stories.js +31 -3
- package/dist/collection/components/jump-pagination-table/jump-pagination-table.stories.js.map +1 -1
- package/dist/collection/components/jump-quantity/jump-quantity.js +3 -3
- package/dist/collection/components/jump-search-bar/jump-search-bar.js +2 -2
- package/dist/collection/components/jump-search-bar/jump-search-bar.stories.js +23 -3
- package/dist/collection/components/jump-search-bar/jump-search-bar.stories.js.map +1 -1
- package/dist/collection/components/jump-tab/jump-tab.css +1 -0
- package/dist/collection/components/jump-tab/jump-tab.js +1 -1
- package/dist/collection/components/jump-tab/jump-tab.js.map +1 -1
- package/dist/collection/components/jump-tab/jump-tab.stories.js +1 -0
- package/dist/collection/components/jump-tab/jump-tab.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item-boxed.stories.js +25 -4
- package/dist/collection/components/jump-tab-item/jump-tab-item-boxed.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item-inline.stories.js +25 -4
- package/dist/collection/components/jump-tab-item/jump-tab-item-inline.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item-rounded.stories.js +16 -2
- package/dist/collection/components/jump-tab-item/jump-tab-item-rounded.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item-sheet.stories.js +16 -2
- package/dist/collection/components/jump-tab-item/jump-tab-item-sheet.stories.js.map +1 -1
- package/dist/collection/components/jump-tab-item/jump-tab-item.js +2 -2
- package/dist/collection/components/jump-tab-panel/jump-tab-panel.js +1 -1
- package/dist/components/jump-filter-checkbox.js +2 -2
- package/dist/components/jump-filter.js +18 -5
- package/dist/components/jump-filter.js.map +1 -1
- package/dist/components/jump-filtergroup.js +3 -3
- package/dist/components/jump-navbar.js +5 -5
- 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-search-bar.js +2 -2
- package/dist/components/jump-tab-item.js +2 -2
- package/dist/components/jump-tab-panel.js +1 -1
- package/dist/components/jump-tab.js +2 -2
- package/dist/components/jump-tab.js.map +1 -1
- package/dist/esm/jump-design-system.js +1 -1
- package/dist/esm/jump-filter-checkbox.entry.js +2 -2
- package/dist/esm/jump-filter.entry.js +15 -5
- package/dist/esm/jump-filter.entry.js.map +1 -1
- package/dist/esm/jump-filtergroup.entry.js +3 -3
- package/dist/esm/jump-navbar.entry.js +5 -5
- 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-search-bar.entry.js +2 -2
- package/dist/esm/jump-tab-item.entry.js +2 -2
- package/dist/esm/jump-tab-panel.entry.js +1 -1
- package/dist/esm/jump-tab.entry.js +2 -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-15416bf7.entry.js → p-134e548b.entry.js} +2 -2
- package/dist/jump-design-system/{p-4cd128b5.entry.js → p-1c882126.entry.js} +2 -2
- package/dist/jump-design-system/p-26d18480.entry.js +2 -0
- package/dist/jump-design-system/p-26d18480.entry.js.map +1 -0
- package/dist/jump-design-system/{p-6def596d.entry.js → p-30c9d7c7.entry.js} +2 -2
- package/dist/jump-design-system/{p-eb71b342.entry.js → p-396d2541.entry.js} +2 -2
- package/dist/jump-design-system/p-5f12bbbb.entry.js +2 -0
- package/dist/jump-design-system/{p-54230a70.entry.js → p-745c61b2.entry.js} +2 -2
- package/dist/jump-design-system/{p-6563f128.entry.js → p-87d6c01a.entry.js} +2 -2
- package/dist/jump-design-system/{p-5d9817a2.entry.js → p-8bdb9702.entry.js} +2 -2
- package/dist/jump-design-system/p-dc4a3920.entry.js +2 -0
- package/dist/jump-design-system/p-dc4a3920.entry.js.map +1 -0
- package/dist/jump-design-system/{p-ce3c1ff9.entry.js → p-f371718a.entry.js} +2 -2
- package/dist/jump-design-system-elements.json +8 -0
- package/dist/types/components/jump-accordion/jump-accordion.stories.d.ts +34 -0
- package/dist/types/components/jump-accordion-group/jump-accordion-group.stories.d.ts +13 -0
- package/dist/types/components/jump-filter/jump-filter.d.ts +3 -0
- package/dist/types/components/jump-pagination/jump-pagination.stories.d.ts +32 -0
- package/dist/types/components/jump-pagination-table/jump-pagination-table.stories.d.ts +56 -0
- package/dist/types/components/jump-search-bar/jump-search-bar.stories.d.ts +40 -0
- package/dist/types/components/jump-tab-item/jump-tab-item-boxed.stories.d.ts +39 -0
- package/dist/types/components/jump-tab-item/jump-tab-item-inline.stories.d.ts +39 -0
- package/dist/types/components/jump-tab-item/jump-tab-item-rounded.stories.d.ts +26 -0
- package/dist/types/components/jump-tab-item/jump-tab-item-sheet.stories.d.ts +26 -0
- package/dist/types/components.d.ts +4 -0
- package/package.json +1 -1
- package/readme.md +33 -0
- package/dist/jump-design-system/p-7b43933f.entry.js +0 -2
- package/dist/jump-design-system/p-8893a85e.entry.js +0 -2
- package/dist/jump-design-system/p-8893a85e.entry.js.map +0 -1
- package/dist/jump-design-system/p-fbd2cbb8.entry.js +0 -2
- package/dist/jump-design-system/p-fbd2cbb8.entry.js.map +0 -1
- /package/dist/jump-design-system/{p-15416bf7.entry.js.map → p-134e548b.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-4cd128b5.entry.js.map → p-1c882126.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-6def596d.entry.js.map → p-30c9d7c7.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-eb71b342.entry.js.map → p-396d2541.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-7b43933f.entry.js.map → p-5f12bbbb.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-54230a70.entry.js.map → p-745c61b2.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-6563f128.entry.js.map → p-87d6c01a.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-5d9817a2.entry.js.map → p-8bdb9702.entry.js.map} +0 -0
- /package/dist/jump-design-system/{p-ce3c1ff9.entry.js.map → p-f371718a.entry.js.map} +0 -0
|
@@ -7,17 +7,29 @@ export default {
|
|
|
7
7
|
name: 'identifier',
|
|
8
8
|
control: 'text',
|
|
9
9
|
description: 'L\'id dell\'elemento',
|
|
10
|
+
table: {
|
|
11
|
+
type: { summary: 'string' },
|
|
12
|
+
defaultValue: { summary: 'search-bar' },
|
|
13
|
+
},
|
|
10
14
|
},
|
|
11
15
|
placeholder: {
|
|
12
16
|
name: 'placeholder',
|
|
13
17
|
control: 'text',
|
|
14
18
|
description: 'Il testo del placeholder',
|
|
19
|
+
table: {
|
|
20
|
+
type: { summary: 'string' },
|
|
21
|
+
defaultValue: { summary: 'Cerca...' },
|
|
22
|
+
},
|
|
15
23
|
},
|
|
16
24
|
searchType: {
|
|
17
25
|
name: 'searchType',
|
|
18
26
|
control: 'select',
|
|
19
27
|
options: ['auto', 'manual'],
|
|
20
28
|
description: "Scelta della modalità di ricerca tra quella automatica e quella manuale.",
|
|
29
|
+
table: {
|
|
30
|
+
type: { summary: 'string' },
|
|
31
|
+
defaultValue: { summary: 'auto' },
|
|
32
|
+
},
|
|
21
33
|
},
|
|
22
34
|
variant: {
|
|
23
35
|
name: 'variant',
|
|
@@ -27,16 +39,24 @@ export default {
|
|
|
27
39
|
arg: 'searchType',
|
|
28
40
|
eq: 'auto',
|
|
29
41
|
},
|
|
30
|
-
description: 'Solo se tipologia "auto", Scelta dello stile della barra di ricerca tra filled, linear e outline.'
|
|
42
|
+
description: 'Solo se tipologia "auto", Scelta dello stile della barra di ricerca tra filled, linear e outline.',
|
|
43
|
+
table: {
|
|
44
|
+
type: { summary: 'string' },
|
|
45
|
+
defaultValue: { summary: 'linear' },
|
|
46
|
+
},
|
|
31
47
|
},
|
|
32
48
|
debounceTime: {
|
|
33
49
|
name: 'debounce-time',
|
|
34
50
|
control: 'number',
|
|
35
|
-
description: 'Il tempo di attesa per l\'invio della ricerca in caso di ricerca automatica.',
|
|
51
|
+
description: 'Il tempo di attesa per l\'invio della ricerca in caso di ricerca automatica. In millisecondi.',
|
|
36
52
|
if: {
|
|
37
53
|
arg: 'searchType',
|
|
38
54
|
eq: 'auto',
|
|
39
|
-
}
|
|
55
|
+
},
|
|
56
|
+
table: {
|
|
57
|
+
type: { summary: 'number' },
|
|
58
|
+
defaultValue: { summary: 500 },
|
|
59
|
+
},
|
|
40
60
|
}
|
|
41
61
|
}
|
|
42
62
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-search-bar.stories.js","sourceRoot":"","sources":["../../../src/components/jump-search-bar/jump-search-bar.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,4BAA4B;IACnC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,UAAU,EAAE;YACR,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,sBAAsB;
|
|
1
|
+
{"version":3,"file":"jump-search-bar.stories.js","sourceRoot":"","sources":["../../../src/components/jump-search-bar/jump-search-bar.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/SearchBar (WIP)',\n tags: ['autodocs'],\n argTypes: {\n identifier: {\n name: 'identifier',\n control: 'text',\n description: 'L\\'id dell\\'elemento',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'search-bar' },\n },\n },\n placeholder: {\n name: 'placeholder',\n control: 'text',\n description: 'Il testo del placeholder',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'Cerca...' },\n },\n },\n searchType: {\n name: 'searchType',\n control: 'select',\n options: ['auto', 'manual'],\n description: \"Scelta della modalità di ricerca tra quella automatica e quella manuale.\",\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'auto' },\n },\n },\n variant: {\n name: 'variant',\n control: 'select',\n options: ['filled', 'linear', 'outline'],\n if: {\n arg: 'searchType',\n eq: 'auto',\n },\n description: 'Solo se tipologia \"auto\", Scelta dello stile della barra di ricerca tra filled, linear e outline.',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'linear' },\n },\n },\n debounceTime: {\n name: 'debounce-time',\n control: 'number',\n description: 'Il tempo di attesa per l\\'invio della ricerca in caso di ricerca automatica. In millisecondi.',\n if: {\n arg: 'searchType',\n eq: 'auto',\n },\n table: {\n type: { summary: 'number' },\n defaultValue: { summary: 500 },\n },\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-search-bar ${attributes}></jump-search-bar>`);\n}\n\nexport const SearchBar = Template.bind({});\nSearchBar.args = {\n placeholder: 'Cerca...',\n searchType: 'manual',\n};\n\nexport const SearchBarManual = Template.bind({});\nSearchBarManual.args = {\n placeholder: 'Cerca...',\n searchType: 'manual',\n};\n\nexport const SearchBarAutoOutline = Template.bind({});\nSearchBarAutoOutline.args = {\n placeholder: 'Cerca...',\n searchType: 'auto',\n variant: 'outline',\n};\n\nexport const SearchBarAutoFilled = Template.bind({});\nSearchBarAutoFilled.args = {\n placeholder: 'Cerca...',\n searchType: 'auto',\n variant: 'filled',\n};\n\nexport const SearchBarAutoLinear = Template.bind({});\nSearchBarAutoLinear.args = {\n placeholder: 'Cerca...',\n searchType: 'auto',\n variant: 'linear',\n};\n\nconst TemplateWithListenerExample = (args, data) => {\n let id = data.id;\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-search-bar ${attributes}></jump-search-bar>\n <div>Il testo cercato è: <span id=\"page-text\">loading..<span> </div>\n <script>\n (function() {\n let container; \n container = document.querySelector('#story--${id}');\n container.querySelector('jump-search-bar').addEventListener('jump-search-bar', (ev) => {\n container.querySelector('#page-text').innerText = ev.detail.search;\n });\n })();\n </script>`);\n};\n\nexport const SearchBarManualWithListener = TemplateWithListenerExample.bind({});\nSearchBarManualWithListener.args = {\n placeholder: 'Cerca...',\n searchType: 'manual',\n};\n\nexport const SearchBarAutoWithListener = TemplateWithListenerExample.bind({});\nSearchBarAutoWithListener.args = {\n placeholder: 'Cerca...',\n searchType: 'auto',\n};\n"]}
|
|
@@ -66,7 +66,7 @@ export class JumpTab {
|
|
|
66
66
|
}
|
|
67
67
|
}
|
|
68
68
|
render() {
|
|
69
|
-
return (h(Host, { key: '
|
|
69
|
+
return (h(Host, { key: '2375f577b5d1691b0f82ef3c2b54cfc4afd949fa', class: "JumpTab " + this.variant, id: this.tabGroupName, ref: (el) => { this.JumpTabEl = el; } }, h("div", { key: 'f073494433715e96f782124311b0d8ac447bf157', class: "Wrapper " + (this.fullBorder ? 'fullBorder' : '') }, h("div", { key: 'ae12f817900aca44de6f75deb0e7a9f193611331', class: "ContentWrapper", style: { '--alignment': this.getAlignment(this.alignment) } }, h("div", { key: '0f4317b86e0b3f0fde02c6ed3847d1d1b7d0e16d', class: "Content " + this.variant + " " + (this.disabled ? 'disabled' : '') + " " + (this.fullBorder ? 'fullBorder' : ''), style: { '--alignment': this.getAlignment(this.alignment) } }, h("slot", { key: '7fab1b1ca960c05732b390608f4ce61f2c8d5bf2', name: "tab-item" }))), h("div", { key: 'cba8b1d398833aeeaeddaf9964893b82f6b008f3', class: "ContentWrapper" }, h("slot", { key: '7f7d3582f30f21d495b517ace5139babc66e4445', name: "tab-content" })))));
|
|
70
70
|
}
|
|
71
71
|
getAlignment(alignment) {
|
|
72
72
|
switch (alignment) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-tab.js","sourceRoot":"","sources":["../../../src/components/jump-tab/jump-tab.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"jump-tab.js","sourceRoot":"","sources":["../../../src/components/jump-tab/jump-tab.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAOtF,MAAM,OAAO,OAAO;;wBAGU,KAAK;yBACL,MAAM;0BACJ,KAAK;4BACJ,SAAS;uBACd,QAAQ;;IAKlC,sBAAsB,CAAC,KAAkB;QACvC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAErC,MAAM,UAAU,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QAC9D,MAAM,YAAY,GAAG,UAAU,CAAC,gBAAgB,CAAC,0BAA0B,CAAC,CAAC,IAAI,EAAE,CAAC;QAEpF,IAAI,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;QAC7D,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;gBACrB,IAAI,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,KAAK,KAAK,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC;oBACxD,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;oBAEhC,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;wBAC7B,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;4BAC/B,IAAI,OAAO,KAAK,IAAI,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gCACnD,OAAO,CAAC,KAAK,CAAC,WAAW,GAAG,aAAa,YAAY,EAAE,CAAC;4BAC1D,CAAC;iCAAM,CAAC;gCACN,OAAO,CAAC,KAAK,CAAC,WAAW,GAAG,uBAAuB,CAAC;4BACtD,CAAC;wBACH,CAAC,CAAC,CAAC;wBAEH,IAAI,eAAe,GAAG,IAAI,CAAC,sBAA6B,CAAC;wBACzD,IAAI,eAAe,EAAE,CAAC;4BACpB,eAAe,CAAC,KAAK,CAAC,WAAW,GAAG,uBAAuB,CAAC;wBAC9D,CAAC;oBACH,CAAC;gBAEH,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;gBACjC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;QAED,IAAI,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;QAC9D,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrB,KAAK,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;gBACtB,IAAI,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC,KAAK,KAAK,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC;oBACzD,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;gBACnC,CAAC;qBAAM,CAAC;oBACN,KAAK,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;gBAClC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;YAC7B,MAAM,UAAU,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;YAC9D,MAAM,YAAY,GAAG,UAAU,CAAC,gBAAgB,CAAC,0BAA0B,CAAC,CAAC,IAAI,EAAE,CAAC;YAEpF,IAAI,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;YAC7D,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBACrB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;oBAC5B,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;wBACpE,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,uBAAuB,CAAC;oBACnD,CAAC;yBAAM,CAAC;wBACN,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,aAAa,YAAY,EAAE,CAAC;oBACvD,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC,OAAO,EAAE,EAAE,EAAE,IAAI,CAAC,YAAY,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,GAAG,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,CAAC,CAAC;YAClG,4DAAK,KAAK,EAAE,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC5D,4DAAK,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE;oBACvF,4DAAK,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC,OAAO,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE;wBACxL,6DAAM,IAAI,EAAC,UAAU,GAAQ,CACzB,CACF;gBACN,4DAAK,KAAK,EAAC,gBAAgB;oBACzB,6DAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACF,CACD,CACR,CAAC;IACJ,CAAC;IAEO,YAAY,CAAC,SAAiB;QACpC,QAAQ,SAAS,EAAE,CAAC;YAClB,KAAK,QAAQ;gBACX,OAAO,QAAQ,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,UAAU,CAAC;YACpB;gBACE,OAAO,YAAY,CAAC;QACxB,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Event, EventEmitter, Prop, h, Listen } from '@stencil/core';\n\n@Component({\n tag: 'jump-tab',\n styleUrl: 'jump-tab.scss',\n shadow: true,\n})\nexport class JumpTab {\n JumpTabEl: HTMLElement;\n\n @Prop() disabled: boolean = false;\n @Prop() alignment: string = 'left';\n @Prop() fullBorder: boolean = false;\n @Prop() tabGroupName: string = undefined;\n @Prop() variant: string = 'inline';\n\n @Event({ eventName: 'jump-change-activetab' }) setActiveTab: EventEmitter;\n\n @Listen('jump-change-active-tab')\n changeActiveTabHandler(event: CustomEvent) {\n this.setActiveTab.emit(event.detail);\n\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item) => {\n if (item.getAttribute('identifier') === event.detail.id) {\n item.setAttribute('active', '');\n\n if (this.variant === 'sheet') {\n items.forEach((sibling, index) => {\n if (sibling !== item && index !== items.length - 1) {\n sibling.style.borderRight = `1px solid ${primaryColor}`;\n } else {\n sibling.style.borderRight = '1px solid transparent';\n }\n });\n\n let previousSibling = item.previousElementSibling as any;\n if (previousSibling) {\n previousSibling.style.borderRight = '1px solid transparent';\n }\n }\n\n } else {\n item.removeAttribute('active');\n }\n });\n }\n\n let panel = this.JumpTabEl.querySelectorAll('jump-tab-panel');\n if (panel.length > 0) {\n panel.forEach((panel) => {\n if (panel.getAttribute('identifier') === event.detail.id) {\n panel.setAttribute('active', '');\n } else {\n panel.removeAttribute('active');\n }\n });\n }\n }\n\n componentDidLoad() {\n if (this.variant === 'sheet') {\n const rootStyles = getComputedStyle(document.documentElement);\n const primaryColor = rootStyles.getPropertyValue('--neutral-grey-secondary').trim();\n\n let items = this.JumpTabEl.querySelectorAll('jump-tab-item');\n if (items.length > 0) {\n items.forEach((item, index) => {\n if (index === items.length - 1 || item.classList.contains('active')) {\n item.style.borderRight = '1px solid transparent';\n } else {\n item.style.borderRight = `1px solid ${primaryColor}`;\n }\n });\n }\n }\n }\n\n render() {\n return (\n <Host class={\"JumpTab \" + this.variant} id={this.tabGroupName} ref={(el) => { this.JumpTabEl = el; }}>\n <div class={\"Wrapper \" + (this.fullBorder ? 'fullBorder' : '')}>\n <div class={\"ContentWrapper\"} style={{ '--alignment': this.getAlignment(this.alignment) }}>\n <div class={\"Content \" + this.variant + \" \" + (this.disabled ? 'disabled' : '') + \" \" + (this.fullBorder ? 'fullBorder' : '')} style={{ '--alignment': this.getAlignment(this.alignment) }}>\n <slot name=\"tab-item\"></slot>\n </div>\n </div>\n <div class=\"ContentWrapper\">\n <slot name=\"tab-content\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n\n private getAlignment(alignment: string): string {\n switch (alignment) {\n case 'center':\n return 'center';\n case 'right':\n return 'flex-end';\n default:\n return 'flex-start';\n }\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-tab.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab/jump-tab.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Tab/Tabs',\n tags: ['autodocs'],\n argTypes: {\n tabGroupName: {\n name: 'tab-group-name',\n control: 'text',\n description: 'Indica la tab attiva',\n table: {\n type: { summary: 'string' },\n },\n },\n variant: {\n name: 'variant',\n control: 'select',\n options: ['inline', 'boxed', 'sheet', 'rounded'],\n description: 'Stile del tab e di tutti i suoi item',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'inline' },\n },\n },\n disabled: {\n name: 'disabled',\n control: 'boolean',\n description: 'Se true, tutte le tab item sono disabilitate',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n },\n alignment: {\n name: 'alignment',\n control: 'select',\n options: ['left', 'center', 'right'],\n description: 'Allineamento delle tab item',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'left' },\n }\n },\n fullBorder: {\n name: 'full-border',\n control: 'boolean',\n description: 'Se true, il tab ha un bordo inferiore pieno',\n if: {\n arg: 'variant',\n eq: 'inline'\n },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n }\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" variant=${args.variant} active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" variant=${args.variant} label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" variant=${args.variant} label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n </jump-tab>`);\n}\n\nexport const TabInline = Template.bind({});\n\nTabInline.args = {\n tabGroupName: 'Tab 1',\n variant: 'inline',\n alignment: 'center',\n};\n\nexport const TabBoxed = Template.bind({});\nTabBoxed.args = {\n tabGroupName: 'Tab 1',\n variant: 'boxed',\n alignment: 'left'\n};\n\n\nexport const TabRounded = Template.bind({});\nTabRounded.args = {\n tabGroupName: 'tabRounded',\n variant: 'rounded',\n alignment: 'right'\n};\n\nexport const TabInlineFullBorder = Template.bind({});\nTabInlineFullBorder.args = {\n tabGroupName: 'Tab 1',\n variant: 'inline',\n alignment: 'center',\n fullBorder: true \n};\n\n\nconst TemplateDisabled = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" disabled label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n </jump-tab>`);\n}\n\nexport const OneTabDisabled = TemplateDisabled.bind({});\nOneTabDisabled.args = {\n tabGroupName: 'Tab 1',\n variant: 'boxed',\n alignment: 'left'\n};\n\nconst TemplateWithListenerExample = (args, data) => {\n let id = data.id;\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<div style=\"background-color: #EEEEEE; padding: 2rem;\"><jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab4\" label=\"Tab 4\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n </jump-tab>\n <div>La tab attiva ha l'id: <span id=\"active-tab\">loading..<span></div>\n </div>\n <script>\n (function(){\n let container = document.querySelector('#story--${id}');\n container.querySelector('#active-tab').innerText = \"tab1\";\n container.querySelector('jump-tab').addEventListener('jump-change-activetab', (ev) => {\n container.querySelector('#active-tab').innerText = ev.detail.id;\n console.log('TemplateWithListenerExample - event:', ev.detail.id);\n });\n })();\n </script>`);\n};\n\nexport const TabInlineWithListener = TemplateWithListenerExample.bind({});\nTabInlineWithListener.args = { \n tabGroupName: 'tabInline',\n iconName: 'settings',\n variant: 'inline',\n alignment: 'center'\n};\n\nexport const TabBoxedWithListener = TemplateWithListenerExample.bind({});\nTabBoxedWithListener.args = { \n tabGroupName: 'tabBoxed',\n iconName: 'settings',\n variant: 'boxed'\n};\n\nexport const TaRoundedWithListener = TemplateWithListenerExample.bind({});\nTaRoundedWithListener.args = { \n tabGroupName: 'tabRounded',\n iconName: 'settings',\n variant: 'rounded'\n};\n\nexport const TabSheetWithListener = TemplateWithListenerExample.bind({});\nTabSheetWithListener.args = { \n tabGroupName: 'tabSheet',\n iconName: 'settings',\n variant: 'sheet'\n};\n\nconst TemplateWithPanel = (args,data) => {\n let id = data.id;\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-panel identifier=\"tab1\" active slot=\"tab-content\">Tab 1 content</jump-tab-panel>\n <jump-tab-panel identifier=\"tab2\" slot=\"tab-content\">Tab 2 content</jump-tab-panel>\n <jump-tab-panel identifier=\"tab3\" slot=\"tab-content\">Tab 3 content</jump-tab-panel>\n </jump-tab> <div>La tab attiva ha l'id: <span id=\"active-tab\">loading..<span></div>\n </div><script>\n (function(){\n let container = document.querySelector('#story--${id}');\n container.querySelector('#active-tab').innerText = \"tab1\";\n container.querySelector('jump-tab').addEventListener('jump-change-activetab', (ev) => {\n container.querySelector('#active-tab').innerText = ev.detail.id;\n console.log('TemplateWithPanel - event:', ev.detail.id);\n });\n })();\n </script>\n `);\n}\n\nexport const TabInlineWithPanel = TemplateWithPanel.bind({});\n\nTabInlineWithPanel.args = {\n tabGroupName: 'Tab 1',\n variant: 'inline',\n fullBorder: true,\n};"]}
|
|
1
|
+
{"version":3,"file":"jump-tab.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab/jump-tab.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,qBAAqB;IAC5B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,YAAY,EAAE;YACV,IAAI,EAAE,gBAAgB;YACtB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,sBAAsB;YAClC,KAAK,EAAE;gBACJ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,OAAO,EAAE;YACL,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC;YAChD,WAAW,EAAE,sCAAsC;YACnD,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aACtC;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,8CAA8C;YAC3D,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;SACJ;QACD,SAAS,EAAE;YACP,IAAI,EAAE,WAAW;YACjB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC;YACpC,WAAW,EAAE,6BAA6B;YAC1C,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;aACpC;SACJ;QACD,UAAU,EAAE;YACR,IAAI,EAAE,aAAa;YACnB,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,6CAA6C;YAC1D,EAAE,EAAE;gBACA,GAAG,EAAE,SAAS;gBACd,EAAE,EAAE,QAAQ;aACf;YACD,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;SACJ;KACJ;CACJ,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACrB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACrD,OAAO,UAAU,CAAC,aAAa,UAAU;uDACU,IAAI,CAAC,OAAO;uDACZ,IAAI,CAAC,OAAO;uDACZ,IAAI,CAAC,OAAO;gBACnD,CAAC,CAAC;AAClB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE3C,SAAS,CAAC,IAAI,GAAG;IACb,YAAY,EAAE,OAAO;IACrB,OAAO,EAAE,QAAQ;IACjB,SAAS,EAAE,QAAQ;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACZ,YAAY,EAAE,OAAO;IACrB,OAAO,EAAE,OAAO;IAChB,SAAS,EAAE,MAAM;CACpB,CAAC;AAGF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IACd,YAAY,EAAE,YAAY;IAC1B,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,OAAO;CACrB,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACrD,mBAAmB,CAAC,IAAI,GAAG;IACvB,YAAY,EAAE,OAAO;IACrB,OAAO,EAAE,QAAQ;IACjB,SAAS,EAAE,QAAQ;IACnB,UAAU,EAAE,IAAI;CACnB,CAAC;AAGF,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,EAAE;IAC9B,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,aAAa,UAAU;;;;gBAI7B,CAAC,CAAC;AAClB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxD,cAAc,CAAC,IAAI,GAAG;IAClB,YAAY,EAAE,OAAO;IACrB,OAAO,EAAE,OAAO;IAChB,SAAS,EAAE,MAAM;CACpB,CAAC;AAEF,MAAM,2BAA2B,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;IAC/C,IAAI,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;IACjB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,oEAAoE,UAAU;;;;;;;;;;8DAUtC,EAAE;;;;;;;kBAO9C,CAAC,CAAC;AACpB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1E,qBAAqB,CAAC,IAAI,GAAG;IACzB,YAAY,EAAE,WAAW;IACzB,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,QAAQ;IACjB,SAAS,EAAE,QAAQ;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzE,oBAAoB,CAAC,IAAI,GAAG;IACxB,YAAY,EAAE,UAAU;IACxB,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,OAAO;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1E,qBAAqB,CAAC,IAAI,GAAG;IACzB,YAAY,EAAE,YAAY;IAC1B,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,SAAS;CACrB,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,2BAA2B,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzE,oBAAoB,CAAC,IAAI,GAAG;IACxB,YAAY,EAAE,UAAU;IACxB,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,OAAO;CACnB,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAC,IAAI,EAAE,EAAE;IACpC,IAAI,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;IACjB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC,aAAa,UAAU;;;;;;;;;;8DAUiB,EAAE;;;;;;;;SAQvD,CAAC,CAAC;AACX,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAE7D,kBAAkB,CAAC,IAAI,GAAG;IACtB,YAAY,EAAE,OAAO;IACrB,OAAO,EAAE,QAAQ;IACjB,UAAU,EAAE,IAAI;IAChB,SAAS,EAAE,QAAQ;CACtB,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Tab/Tabs',\n tags: ['autodocs'],\n argTypes: {\n tabGroupName: {\n name: 'tab-group-name',\n control: 'text',\n description: 'Indica la tab attiva',\n table: {\n type: { summary: 'string' },\n },\n },\n variant: {\n name: 'variant',\n control: 'select',\n options: ['inline', 'boxed', 'sheet', 'rounded'],\n description: 'Stile del tab e di tutti i suoi item',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'inline' },\n },\n },\n disabled: {\n name: 'disabled',\n control: 'boolean',\n description: 'Se true, tutte le tab item sono disabilitate',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n },\n alignment: {\n name: 'alignment',\n control: 'select',\n options: ['left', 'center', 'right'],\n description: 'Allineamento delle tab item',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'left' },\n }\n },\n fullBorder: {\n name: 'full-border',\n control: 'boolean',\n description: 'Se true, il tab ha un bordo inferiore pieno',\n if: {\n arg: 'variant',\n eq: 'inline'\n },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n }\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" variant=${args.variant} active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" variant=${args.variant} label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" variant=${args.variant} label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n </jump-tab>`);\n}\n\nexport const TabInline = Template.bind({});\n\nTabInline.args = {\n tabGroupName: 'Tab 1',\n variant: 'inline',\n alignment: 'center',\n};\n\nexport const TabBoxed = Template.bind({});\nTabBoxed.args = {\n tabGroupName: 'Tab 1',\n variant: 'boxed',\n alignment: 'left'\n};\n\n\nexport const TabRounded = Template.bind({});\nTabRounded.args = {\n tabGroupName: 'tabRounded',\n variant: 'rounded',\n alignment: 'right'\n};\n\nexport const TabInlineFullBorder = Template.bind({});\nTabInlineFullBorder.args = {\n tabGroupName: 'Tab 1',\n variant: 'inline',\n alignment: 'center',\n fullBorder: true \n};\n\n\nconst TemplateDisabled = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" disabled label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n </jump-tab>`);\n}\n\nexport const OneTabDisabled = TemplateDisabled.bind({});\nOneTabDisabled.args = {\n tabGroupName: 'Tab 1',\n variant: 'boxed',\n alignment: 'left'\n};\n\nconst TemplateWithListenerExample = (args, data) => {\n let id = data.id;\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<div style=\"background-color: #EEEEEE; padding: 2rem;\"><jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab4\" label=\"Tab 4\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n </jump-tab>\n <div>La tab attiva ha l'id: <span id=\"active-tab\">loading..<span></div>\n </div>\n <script>\n (function(){\n let container = document.querySelector('#story--${id}');\n container.querySelector('#active-tab').innerText = \"tab1\";\n container.querySelector('jump-tab').addEventListener('jump-change-activetab', (ev) => {\n container.querySelector('#active-tab').innerText = ev.detail.id;\n console.log('TemplateWithListenerExample - event:', ev.detail.id);\n });\n })();\n </script>`);\n};\n\nexport const TabInlineWithListener = TemplateWithListenerExample.bind({});\nTabInlineWithListener.args = { \n tabGroupName: 'tabInline',\n iconName: 'settings',\n variant: 'inline',\n alignment: 'center'\n};\n\nexport const TabBoxedWithListener = TemplateWithListenerExample.bind({});\nTabBoxedWithListener.args = { \n tabGroupName: 'tabBoxed',\n iconName: 'settings',\n variant: 'boxed'\n};\n\nexport const TaRoundedWithListener = TemplateWithListenerExample.bind({});\nTaRoundedWithListener.args = { \n tabGroupName: 'tabRounded',\n iconName: 'settings',\n variant: 'rounded'\n};\n\nexport const TabSheetWithListener = TemplateWithListenerExample.bind({});\nTabSheetWithListener.args = { \n tabGroupName: 'tabSheet',\n iconName: 'settings',\n variant: 'sheet'\n};\n\nconst TemplateWithPanel = (args,data) => {\n let id = data.id;\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab ${attributes}>\n <jump-tab-item identifier=\"tab1\" active label=\"Tab 1\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab2\" label=\"Tab 2\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-item identifier=\"tab3\" label=\"Tab 3\" icon-name=\"gear\" slot=\"tab-item\"></jump-tab-item>\n <jump-tab-panel identifier=\"tab1\" active slot=\"tab-content\">Tab 1 content</jump-tab-panel>\n <jump-tab-panel identifier=\"tab2\" slot=\"tab-content\">Tab 2 content</jump-tab-panel>\n <jump-tab-panel identifier=\"tab3\" slot=\"tab-content\">Tab 3 content</jump-tab-panel>\n </jump-tab> <div>La tab attiva ha l'id: <span id=\"active-tab\">loading..<span></div>\n </div><script>\n (function(){\n let container = document.querySelector('#story--${id}');\n container.querySelector('#active-tab').innerText = \"tab1\";\n container.querySelector('jump-tab').addEventListener('jump-change-activetab', (ev) => {\n container.querySelector('#active-tab').innerText = ev.detail.id;\n console.log('TemplateWithPanel - event:', ev.detail.id);\n });\n })();\n </script>\n `);\n}\n\nexport const TabInlineWithPanel = TemplateWithPanel.bind({});\n\nTabInlineWithPanel.args = {\n tabGroupName: 'Tab 1',\n variant: 'inline',\n fullBorder: true,\n alignment: 'center',\n};"]}
|
|
@@ -7,32 +7,53 @@ export default {
|
|
|
7
7
|
name: 'identifier',
|
|
8
8
|
control: 'text',
|
|
9
9
|
description: 'Identificatore della tab',
|
|
10
|
+
table: {
|
|
11
|
+
type: { summary: 'string' },
|
|
12
|
+
},
|
|
10
13
|
},
|
|
11
14
|
label: {
|
|
12
15
|
name: 'label',
|
|
13
16
|
control: 'text',
|
|
14
17
|
description: 'Label della tab',
|
|
18
|
+
table: {
|
|
19
|
+
type: { summary: 'string' },
|
|
20
|
+
},
|
|
15
21
|
},
|
|
16
22
|
iconName: {
|
|
17
23
|
name: 'icon-name',
|
|
18
24
|
control: 'text',
|
|
19
|
-
description: "Seleziona il nome dal seguente <a href='https://fontawesome.com/search' target='_blank'>link</a>"
|
|
25
|
+
description: "Seleziona il nome dal seguente <a href='https://fontawesome.com/search' target='_blank'>link</a>",
|
|
26
|
+
table: {
|
|
27
|
+
type: { summary: 'string' },
|
|
28
|
+
},
|
|
20
29
|
},
|
|
21
30
|
iconPosition: {
|
|
22
31
|
name: 'icon-position',
|
|
23
32
|
control: 'select',
|
|
24
33
|
options: ['left', 'top'],
|
|
25
|
-
description: 'Posizione dell\'icona'
|
|
34
|
+
description: 'Posizione dell\'icona',
|
|
35
|
+
table: {
|
|
36
|
+
type: { summary: 'string' },
|
|
37
|
+
defaultValue: { summary: 'left' },
|
|
38
|
+
},
|
|
26
39
|
},
|
|
27
40
|
active: {
|
|
28
41
|
name: 'active',
|
|
29
42
|
control: 'boolean',
|
|
30
|
-
description: 'Tab attiva'
|
|
43
|
+
description: 'Tab attiva',
|
|
44
|
+
table: {
|
|
45
|
+
type: { summary: 'boolean' },
|
|
46
|
+
defaultValue: { summary: 'false' },
|
|
47
|
+
},
|
|
31
48
|
},
|
|
32
49
|
disabled: {
|
|
33
50
|
name: 'disabled',
|
|
34
51
|
control: 'boolean',
|
|
35
|
-
description: 'Tab disabilitata'
|
|
52
|
+
description: 'Tab disabilitata',
|
|
53
|
+
table: {
|
|
54
|
+
type: { summary: 'boolean' },
|
|
55
|
+
defaultValue: { summary: 'false' },
|
|
56
|
+
},
|
|
36
57
|
}
|
|
37
58
|
}
|
|
38
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-tab-item-boxed.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-boxed.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,2BAA2B;IAClC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,UAAU,EAAE;YACR,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;
|
|
1
|
+
{"version":3,"file":"jump-tab-item-boxed.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-boxed.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,2BAA2B;IAClC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,UAAU,EAAE;YACR,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;YACvC,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,KAAK,EAAE;YACH,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,iBAAiB;YAC9B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,WAAW;YACjB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,kGAAkG;YAC/G,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,YAAY,EAAE;YACV,IAAI,EAAE,eAAe;YACrB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;YACxB,WAAW,EAAE,uBAAuB;YACpC,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;aACpC;SACJ;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,YAAY;YACzB,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,kBAAkB;YAC/B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;KACJ;CACJ,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACtB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC;qCACe,UAAU;gBAC/B,CAAC,CAAC;AAClB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,YAAY,CAAC,IAAI,GAAG;IAChB,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,MAAM;IAChB,YAAY,EAAE,MAAM;IACpB,MAAM,EAAE,IAAI;IACZ,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,KAAK;CAClB,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Tab/Item/Boxed',\n tags: ['autodocs'],\n argTypes: {\n identifier: {\n name: 'identifier',\n control: 'text',\n description: 'Identificatore della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n label: {\n name: 'label',\n control: 'text',\n description: 'Label della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n iconName: { \n name: 'icon-name',\n control: 'text',\n description: \"Seleziona il nome dal seguente <a href='https://fontawesome.com/search' target='_blank'>link</a>\",\n table: {\n type: { summary: 'string' },\n },\n },\n iconPosition: {\n name: 'icon-position',\n control: 'select',\n options: ['left', 'top'],\n description: 'Posizione dell\\'icona',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'left' },\n },\n },\n active: {\n name: 'active',\n control: 'boolean',\n description: 'Tab attiva',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n },\n disabled: {\n name: 'disabled',\n control: 'boolean',\n description: 'Tab disabilitata',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab variant=\"boxed\" tab-group-name=\"tabBoxed\">\n <jump-tab-item slot=\"tab-item\" ${attributes}></jump-tab-item>\n </jump-tab>`);\n}\n\nexport const TabBoxedItem = Template.bind({});\nTabBoxedItem.args = {\n label: 'Tab1',\n iconName: 'gear',\n iconPosition: 'left',\n active: true,\n identifier: 'tab1',\n disabled: false\n};"]}
|
|
@@ -7,32 +7,53 @@ export default {
|
|
|
7
7
|
name: 'identifier',
|
|
8
8
|
control: 'text',
|
|
9
9
|
description: 'Identificatore della tab',
|
|
10
|
+
table: {
|
|
11
|
+
type: { summary: 'string' },
|
|
12
|
+
},
|
|
10
13
|
},
|
|
11
14
|
label: {
|
|
12
15
|
name: 'label',
|
|
13
16
|
control: 'text',
|
|
14
17
|
description: 'Label della tab',
|
|
18
|
+
table: {
|
|
19
|
+
type: { summary: 'string' },
|
|
20
|
+
},
|
|
15
21
|
},
|
|
16
22
|
iconName: {
|
|
17
23
|
name: 'icon-name',
|
|
18
24
|
control: 'text',
|
|
19
|
-
description: "Seleziona il nome dal seguente <a href='https://fontawesome.com/search' target='_blank'>link</a>"
|
|
25
|
+
description: "Seleziona il nome dal seguente <a href='https://fontawesome.com/search' target='_blank'>link</a>",
|
|
26
|
+
table: {
|
|
27
|
+
type: { summary: 'string' },
|
|
28
|
+
},
|
|
20
29
|
},
|
|
21
30
|
iconPosition: {
|
|
22
31
|
name: 'icon-position',
|
|
23
32
|
control: 'select',
|
|
24
33
|
options: ['left', 'top'],
|
|
25
|
-
description: 'Posizione dell\'icona'
|
|
34
|
+
description: 'Posizione dell\'icona',
|
|
35
|
+
table: {
|
|
36
|
+
type: { summary: 'string' },
|
|
37
|
+
defaultValue: { summary: 'left' },
|
|
38
|
+
},
|
|
26
39
|
},
|
|
27
40
|
active: {
|
|
28
41
|
name: 'active',
|
|
29
42
|
control: 'boolean',
|
|
30
|
-
description: 'Tab attiva'
|
|
43
|
+
description: 'Tab attiva',
|
|
44
|
+
table: {
|
|
45
|
+
type: { summary: 'boolean' },
|
|
46
|
+
defaultValue: { summary: 'false' },
|
|
47
|
+
},
|
|
31
48
|
},
|
|
32
49
|
disabled: {
|
|
33
50
|
name: 'disabled',
|
|
34
51
|
control: 'boolean',
|
|
35
|
-
description: 'Tab disabilitata'
|
|
52
|
+
description: 'Tab disabilitata',
|
|
53
|
+
table: {
|
|
54
|
+
type: { summary: 'boolean' },
|
|
55
|
+
defaultValue: { summary: 'false' },
|
|
56
|
+
},
|
|
36
57
|
}
|
|
37
58
|
}
|
|
38
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-tab-item-inline.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-inline.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,4BAA4B;IACnC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,UAAU,EAAE;YACR,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;
|
|
1
|
+
{"version":3,"file":"jump-tab-item-inline.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-inline.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,4BAA4B;IACnC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,UAAU,EAAE;YACR,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;YACvC,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,KAAK,EAAE;YACH,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,iBAAiB;YAC9B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACF,QAAQ,EAAE;YACL,IAAI,EAAE,WAAW;YACjB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,kGAAkG;YAC/G,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,YAAY,EAAE;YACV,IAAI,EAAE,eAAe;YACrB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;YACxB,WAAW,EAAE,uBAAuB;YACpC,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;aACpC;SACJ;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,YAAY;YACzB,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,kBAAkB;YAC/B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;KACJ;CACJ,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACtB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC;qCACe,UAAU;gBAC/B,CAAC,CAAC;AAClB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACX,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,MAAM;IAChB,YAAY,EAAE,MAAM;IACpB,MAAM,EAAE,IAAI;IACZ,OAAO,EAAE,QAAQ;IACjB,QAAQ,EAAE,KAAK;CAClB,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Tab/Item/Inline',\n tags: ['autodocs'],\n argTypes: {\n identifier: {\n name: 'identifier',\n control: 'text',\n description: 'Identificatore della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n label: {\n name: 'label',\n control: 'text',\n description: 'Label della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n iconName: { \n name: 'icon-name',\n control: 'text',\n description: \"Seleziona il nome dal seguente <a href='https://fontawesome.com/search' target='_blank'>link</a>\",\n table: {\n type: { summary: 'string' },\n },\n },\n iconPosition: {\n name: 'icon-position',\n control: 'select',\n options: ['left', 'top'],\n description: 'Posizione dell\\'icona',\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: 'left' },\n },\n },\n active: {\n name: 'active',\n control: 'boolean',\n description: 'Tab attiva',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n },\n disabled: {\n name: 'disabled',\n control: 'boolean',\n description: 'Tab disabilitata',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab variant=\"inline\" tab-group-name=\"tabInline\">\n <jump-tab-item slot=\"tab-item\" ${attributes}></jump-tab-item>\n </jump-tab>`);\n}\n\nexport const TabItem = Template.bind({});\nTabItem.args = {\n label: 'Tab1',\n iconName: 'gear',\n iconPosition: 'left',\n active: true,\n variant: 'inline',\n disabled: false\n};"]}
|
|
@@ -7,21 +7,35 @@ export default {
|
|
|
7
7
|
name: 'identifier',
|
|
8
8
|
control: 'text',
|
|
9
9
|
description: 'Identificatore della tab',
|
|
10
|
+
table: {
|
|
11
|
+
type: { summary: 'string' },
|
|
12
|
+
},
|
|
10
13
|
},
|
|
11
14
|
label: {
|
|
12
15
|
name: 'label',
|
|
13
16
|
control: 'text',
|
|
14
17
|
description: 'Label della tab',
|
|
18
|
+
table: {
|
|
19
|
+
type: { summary: 'string' },
|
|
20
|
+
},
|
|
15
21
|
},
|
|
16
22
|
active: {
|
|
17
23
|
name: 'active',
|
|
18
24
|
control: 'boolean',
|
|
19
|
-
description: 'Tab attiva'
|
|
25
|
+
description: 'Tab attiva',
|
|
26
|
+
table: {
|
|
27
|
+
type: { summary: 'boolean' },
|
|
28
|
+
defaultValue: { summary: 'false' },
|
|
29
|
+
},
|
|
20
30
|
},
|
|
21
31
|
disabled: {
|
|
22
32
|
name: 'disabled',
|
|
23
33
|
control: 'boolean',
|
|
24
|
-
description: 'Tab disabilitata'
|
|
34
|
+
description: 'Tab disabilitata',
|
|
35
|
+
table: {
|
|
36
|
+
type: { summary: 'boolean' },
|
|
37
|
+
defaultValue: { summary: 'false' },
|
|
38
|
+
},
|
|
25
39
|
}
|
|
26
40
|
}
|
|
27
41
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-tab-item-rounded.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-rounded.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,6BAA6B;IACpC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACL,UAAU,EAAE;YACT,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;
|
|
1
|
+
{"version":3,"file":"jump-tab-item-rounded.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-rounded.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,6BAA6B;IACpC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACL,UAAU,EAAE;YACT,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;YACvC,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,KAAK,EAAE;YACH,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,iBAAiB;YAC9B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,YAAY;YACzB,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,kBAAkB;YAC/B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;KACJ;CACJ,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACtB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC;qCACe,UAAU;gBAC/B,CAAC,CAAC;AAClB,CAAC,CAAA;AAGD,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,YAAY,CAAC,IAAI,GAAG;IAChB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,IAAI;IACZ,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,KAAK;CAClB,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Tab/Item/Rounded',\n tags: ['autodocs'],\n argTypes: {\n identifier: {\n name: 'identifier',\n control: 'text',\n description: 'Identificatore della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n label: {\n name: 'label',\n control: 'text',\n description: 'Label della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n active: {\n name: 'active',\n control: 'boolean',\n description: 'Tab attiva',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n },\n disabled: {\n name: 'disabled',\n control: 'boolean',\n description: 'Tab disabilitata',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<jump-tab variant=\"rounded\" tab-group-name=\"tabRounded\">\n <jump-tab-item slot=\"tab-item\" ${attributes}></jump-tab-item>\n </jump-tab>`);\n}\n\n\nexport const TabBoxedItem = Template.bind({});\nTabBoxedItem.args = {\n label: 'Tab1',\n active: true,\n identifier: 'tab1',\n disabled: false\n};"]}
|
|
@@ -7,21 +7,35 @@ export default {
|
|
|
7
7
|
name: 'identifier',
|
|
8
8
|
control: 'text',
|
|
9
9
|
description: 'Identificatore della tab',
|
|
10
|
+
table: {
|
|
11
|
+
type: { summary: 'string' },
|
|
12
|
+
},
|
|
10
13
|
},
|
|
11
14
|
label: {
|
|
12
15
|
name: 'label',
|
|
13
16
|
control: 'text',
|
|
14
17
|
description: 'Label della tab',
|
|
18
|
+
table: {
|
|
19
|
+
type: { summary: 'string' },
|
|
20
|
+
},
|
|
15
21
|
},
|
|
16
22
|
active: {
|
|
17
23
|
name: 'active',
|
|
18
24
|
control: 'boolean',
|
|
19
|
-
description: 'Tab attiva'
|
|
25
|
+
description: 'Tab attiva',
|
|
26
|
+
table: {
|
|
27
|
+
type: { summary: 'boolean' },
|
|
28
|
+
defaultValue: { summary: 'false' },
|
|
29
|
+
},
|
|
20
30
|
},
|
|
21
31
|
disabled: {
|
|
22
32
|
name: 'disabled',
|
|
23
33
|
control: 'boolean',
|
|
24
|
-
description: 'Tab disabilitata'
|
|
34
|
+
description: 'Tab disabilitata',
|
|
35
|
+
table: {
|
|
36
|
+
type: { summary: 'boolean' },
|
|
37
|
+
defaultValue: { summary: 'false' },
|
|
38
|
+
},
|
|
25
39
|
}
|
|
26
40
|
}
|
|
27
41
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-tab-item-sheet.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-sheet.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,2BAA2B;IAClC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACL,UAAU,EAAE;YACT,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;
|
|
1
|
+
{"version":3,"file":"jump-tab-item-sheet.stories.js","sourceRoot":"","sources":["../../../src/components/jump-tab-item/jump-tab-item-sheet.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,2BAA2B;IAClC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACL,UAAU,EAAE;YACT,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,0BAA0B;YACvC,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,KAAK,EAAE;YACH,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,iBAAiB;YAC9B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;aAC9B;SACJ;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,YAAY;YACzB,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,kBAAkB;YAC/B,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aACrC;SACJ;KACJ;CACJ,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACtB,MAAM,UAAU,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;IACpD,OAAO,UAAU,CAAC;;qCAEe,UAAU;sBACzB,CAAC,CAAC;AACxB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,YAAY,CAAC,IAAI,GAAG;IAChB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,IAAI;IACZ,UAAU,EAAE,MAAM;IAClB,QAAQ,EAAE,KAAK;CAClB,CAAC","sourcesContent":["import { generateAttributesFromArgs, formatHtml} from '../../utils/utils';\n\nexport default {\n title: 'Components/Tab/Item/Sheet',\n tags: ['autodocs'],\n argTypes: {\n identifier: {\n name: 'identifier',\n control: 'text',\n description: 'Identificatore della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n label: {\n name: 'label',\n control: 'text',\n description: 'Label della tab',\n table: {\n type: { summary: 'string' },\n },\n },\n active: {\n name: 'active',\n control: 'boolean',\n description: 'Tab attiva',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n },\n disabled: {\n name: 'disabled',\n control: 'boolean',\n description: 'Tab disabilitata',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: 'false' },\n },\n }\n }\n}\n\nconst Template = (args) => {\n const attributes = generateAttributesFromArgs(args);\n return formatHtml(`<div style=\"background-color: #EEEEEE; padding: 2rem;\">\n <jump-tab variant=\"sheet\" tab-group-name=\"tabsheet\">\n <jump-tab-item slot=\"tab-item\" ${attributes}></jump-tab-item>\n </jump-tab></div>`);\n}\n\nexport const TabBoxedItem = Template.bind({});\nTabBoxedItem.args = {\n label: 'Tab1',\n active: true,\n identifier: 'tab1',\n disabled: false\n};"]}
|
|
@@ -18,8 +18,8 @@ export class JumpTabItem {
|
|
|
18
18
|
this.variant = parentVariant;
|
|
19
19
|
}
|
|
20
20
|
render() {
|
|
21
|
-
return (h(Host, { key: '
|
|
22
|
-
h("jump-icon", { key: '
|
|
21
|
+
return (h(Host, { key: '7007ce478b8de6630f88ec8ed6da7f3fb0d5dd97', ref: (el) => { this.tabEl = el; }, class: "JumpTabItem " + (this.active ? 'active' : '') + " " + (this.variant) + " " + (this.disabled ? 'disabled' : '') }, h("div", { key: '04b6b822ddc49ede102e391c99976a6a41f97ee2', class: "Content " + (this.iconName ? this.iconPosition : '') + " " + (this.variant) + " " + (this.active ? 'active' : '') + " " + (this.disabled ? 'disabled' : ''), onClick: () => this.changeTab(this.identifier), id: this.identifier }, (this.iconName && (this.variant == 'inline' || this.variant == 'boxed')) &&
|
|
22
|
+
h("jump-icon", { key: '4337d05e761c69a29d431528992ea7c7efe36268', library: "fa", category: "regular", name: this.iconName, size: "small" }), h("span", { key: '17ca0b360fc1bf629d7ddd1598c903a437c833ae', class: "label" }, this.label))));
|
|
23
23
|
}
|
|
24
24
|
static get is() { return "jump-tab-item"; }
|
|
25
25
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,7 +5,7 @@ export class JumpTabPanel {
|
|
|
5
5
|
this.active = false;
|
|
6
6
|
}
|
|
7
7
|
render() {
|
|
8
|
-
return (h(Host, { key: '
|
|
8
|
+
return (h(Host, { key: '1057ea1667cef613a262c5eb4720445c0e406731', class: "JumpTabPanel", id: this.identifier }, h("div", { key: '1b05a31f18518cf65f037f5a605e67d1221bb9dd', class: "JumpTabPanel__Content " + (this.active ? 'active' : '') }, h("slot", { key: 'cf471584939f94b0f26b80eab1c524edf5d55078' }))));
|
|
9
9
|
}
|
|
10
10
|
static get is() { return "jump-tab-panel"; }
|
|
11
11
|
static get encapsulation() { return "shadow"; }
|
|
@@ -807,8 +807,8 @@ const JumpFilterCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class JumpFilterCh
|
|
|
807
807
|
return this.el.checked;
|
|
808
808
|
}
|
|
809
809
|
render() {
|
|
810
|
-
return (h(Host, { key: '
|
|
811
|
-
h("sl-checkbox", { key: '
|
|
810
|
+
return (h(Host, { key: 'c1ed5c7a59979dbe46338b2df91e5ab73c0547bd', ref: (host) => this.host = host }, this.value && this.label &&
|
|
811
|
+
h("sl-checkbox", { key: 'de838d7ec4dedc45935bca737c71251028adc658', value: this.value, ref: (el) => this.el = el, checked: this.checked }, this.label), this.count && h("span", { key: '4e7ca6acfdc390a1a9511d52c00135783e57b1cd', class: "count" }, this.count)));
|
|
812
812
|
}
|
|
813
813
|
static get style() { return JumpFilterCheckboxStyle0; }
|
|
814
814
|
}, [1, "jump-filter-checkbox", {
|