@jumpgroup/jump-design-system 0.1.4 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +7 -0
  2. package/dist/cjs/app-globals-3a1e7e63.js.map +1 -0
  3. package/dist/cjs/{index-c572276a.js → index-46644e39.js} +499 -152
  4. package/dist/cjs/index-46644e39.js.map +1 -0
  5. package/dist/cjs/jump-button.cjs.entry.js +22 -15
  6. package/dist/cjs/jump-button.cjs.entry.js.map +1 -1
  7. package/dist/cjs/jump-design-system.cjs.js +6 -4
  8. package/dist/cjs/jump-design-system.cjs.js.map +1 -1
  9. package/dist/cjs/jump-icon.cjs.entry.js +19 -30
  10. package/dist/cjs/jump-icon.cjs.entry.js.map +1 -1
  11. package/dist/cjs/jump-pagination.cjs.entry.js +22 -21
  12. package/dist/cjs/jump-pagination.cjs.entry.js.map +1 -1
  13. package/dist/cjs/loader.cjs.js +6 -4
  14. package/dist/cjs/loader.cjs.js.map +1 -1
  15. package/dist/collection/collection-manifest.json +2 -2
  16. package/dist/collection/components/app-icon/jump-icon.js +59 -59
  17. package/dist/collection/components/app-icon/jump-icon.js.map +1 -1
  18. package/dist/collection/components/app-icon/jump-icon.stories.js +16 -16
  19. package/dist/collection/components/app-icon/jump-icon.stories.js.map +1 -1
  20. package/dist/collection/components/app-icon/test/jump-icon.e2e.js +6 -6
  21. package/dist/collection/components/app-icon/test/jump-icon.e2e.js.map +1 -1
  22. package/dist/collection/components/app-icon/test/jump-icon.spec.js +7 -7
  23. package/dist/collection/components/app-icon/test/jump-icon.spec.js.map +1 -1
  24. package/dist/collection/components/jump-button/jump-button.js +266 -153
  25. package/dist/collection/components/jump-button/jump-button.js.map +1 -1
  26. package/dist/collection/components/jump-button/jump-button.stories.js +284 -167
  27. package/dist/collection/components/jump-button/jump-button.stories.js.map +1 -1
  28. package/dist/collection/components/jump-button/test/jump-button.e2e.js +6 -6
  29. package/dist/collection/components/jump-button/test/jump-button.e2e.js.map +1 -1
  30. package/dist/collection/components/jump-button/test/jump-button.spec.js +7 -7
  31. package/dist/collection/components/jump-button/test/jump-button.spec.js.map +1 -1
  32. package/dist/collection/components/jump-pagination/jump-pagination.js +175 -175
  33. package/dist/collection/components/jump-pagination/jump-pagination.js.map +1 -1
  34. package/dist/collection/components/jump-pagination/jump-pagination.stories.js +91 -92
  35. package/dist/collection/components/jump-pagination/jump-pagination.stories.js.map +1 -1
  36. package/dist/collection/components/jump-pagination/test/jump-pagination.e2e.js +6 -6
  37. package/dist/collection/components/jump-pagination/test/jump-pagination.e2e.js.map +1 -1
  38. package/dist/collection/components/jump-pagination/test/jump-pagination.spec.js +7 -7
  39. package/dist/collection/components/jump-pagination/test/jump-pagination.spec.js.map +1 -1
  40. package/dist/collection/utils/utils.js +1 -1
  41. package/dist/collection/utils/utils.js.map +1 -1
  42. package/dist/collection/utils/utils.spec.js +12 -12
  43. package/dist/collection/utils/utils.spec.js.map +1 -1
  44. package/dist/components/index.d.ts +6 -0
  45. package/dist/components/index.js +1 -1
  46. package/dist/components/jump-button.d.ts +2 -2
  47. package/dist/components/jump-button.js +47 -34
  48. package/dist/components/jump-button.js.map +1 -1
  49. package/dist/components/jump-icon.d.ts +2 -2
  50. package/dist/components/jump-icon2.js +33 -44
  51. package/dist/components/jump-icon2.js.map +1 -1
  52. package/dist/components/jump-pagination.d.ts +2 -2
  53. package/dist/components/jump-pagination.js +47 -46
  54. package/dist/components/jump-pagination.js.map +1 -1
  55. package/dist/esm/app-globals-0f993ce5.js +5 -0
  56. package/dist/esm/app-globals-0f993ce5.js.map +1 -0
  57. package/dist/esm/{index-ad69454c.js → index-b0176170.js} +499 -152
  58. package/dist/esm/index-b0176170.js.map +1 -0
  59. package/dist/esm/jump-button.entry.js +22 -15
  60. package/dist/esm/jump-button.entry.js.map +1 -1
  61. package/dist/esm/jump-design-system.js +7 -5
  62. package/dist/esm/jump-design-system.js.map +1 -1
  63. package/dist/esm/jump-icon.entry.js +19 -30
  64. package/dist/esm/jump-icon.entry.js.map +1 -1
  65. package/dist/esm/jump-pagination.entry.js +22 -21
  66. package/dist/esm/jump-pagination.entry.js.map +1 -1
  67. package/dist/esm/loader.js +7 -5
  68. package/dist/esm/loader.js.map +1 -1
  69. package/dist/jump-design-system/jump-design-system.esm.js +1 -1
  70. package/dist/jump-design-system/jump-design-system.esm.js.map +1 -1
  71. package/dist/jump-design-system/p-0d2b55a8.entry.js +2 -0
  72. package/dist/jump-design-system/p-0d2b55a8.entry.js.map +1 -0
  73. package/dist/jump-design-system/{p-15ecd712.entry.js → p-3cbc3a68.entry.js} +3 -3
  74. package/dist/jump-design-system/p-3cbc3a68.entry.js.map +1 -0
  75. package/dist/jump-design-system/p-68bce598.js +3 -0
  76. package/dist/jump-design-system/p-68bce598.js.map +1 -0
  77. package/dist/jump-design-system/{p-42799645.entry.js → p-9e6ea006.entry.js} +2 -2
  78. package/dist/jump-design-system/p-9e6ea006.entry.js.map +1 -0
  79. package/dist/jump-design-system/p-e1255160.js +2 -0
  80. package/dist/jump-design-system/p-e1255160.js.map +1 -0
  81. package/dist/jump-design-system-elements.json +53 -1
  82. package/dist/types/components/app-icon/jump-icon.d.ts +10 -10
  83. package/dist/types/components/app-icon/jump-icon.stories.d.ts +14 -14
  84. package/dist/types/components/jump-button/jump-button.d.ts +53 -29
  85. package/dist/types/components/jump-button/jump-button.stories.d.ts +147 -85
  86. package/dist/types/components/jump-pagination/jump-pagination.d.ts +24 -24
  87. package/dist/types/components/jump-pagination/jump-pagination.stories.d.ts +63 -63
  88. package/dist/types/components.d.ts +52 -4
  89. package/dist/types/stencil-public-runtime.d.ts +46 -5
  90. package/loader/index.d.ts +1 -1
  91. package/package.json +2 -2
  92. package/readme.md +13 -8
  93. package/dist/cjs/index-c572276a.js.map +0 -1
  94. package/dist/esm/index-ad69454c.js.map +0 -1
  95. package/dist/jump-design-system/p-15ecd712.entry.js.map +0 -1
  96. package/dist/jump-design-system/p-42799645.entry.js.map +0 -1
  97. package/dist/jump-design-system/p-44f459bb.js +0 -3
  98. package/dist/jump-design-system/p-44f459bb.js.map +0 -1
  99. package/dist/jump-design-system/p-6ba563bd.entry.js +0 -2
  100. package/dist/jump-design-system/p-6ba563bd.entry.js.map +0 -1
@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
2
2
 
3
3
  interface JumpPagination extends Components.JumpPagination, HTMLElement {}
4
4
  export const JumpPagination: {
5
- prototype: JumpPagination;
6
- new (): JumpPagination;
5
+ prototype: JumpPagination;
6
+ new (): JumpPagination;
7
7
  };
8
8
  /**
9
9
  * Used to define this component and all nested components recursively.
@@ -2,56 +2,57 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
2
2
  import { d as defineCustomElement$2 } from './jump-icon2.js';
3
3
 
4
4
  const jumpPaginationCss = ":host{display:block}.JumpPagination{--pagination-label-color:var(--neutral-grey-secondary);--pagination-arrows-color:var(--neutral-grey-secondary);font-family:var(--ff-primary)}.JumpPagination__Wrapper{display:flex;justify-content:space-between}.JumpPagination__Wrapper .elementsPerPage{display:flex;gap:1rem;align-items:center}.JumpPagination__Wrapper .elementsPerPage label{color:var(--pagination-label-color);font-size:14px;font-weight:normal}.JumpPagination__Wrapper .indicators{font-size:16px;font-weight:normal;display:flex;justify-content:space-between;gap:20px;color:var(--pagination-label-color)}.JumpPagination__Wrapper .indicators .arrow{color:var(--pagination-arrows-color);display:flex;align-items:center;gap:10px}.JumpPagination__Wrapper .indicators .elements{color:var(--pagination-label-color);display:flex;align-items:center;gap:5px}";
5
+ const JumpPaginationStyle0 = jumpPaginationCss;
5
6
 
6
7
  const JumpPagination$1 = /*@__PURE__*/ proxyCustomElement(class JumpPagination extends HTMLElement {
7
- constructor() {
8
- super();
9
- this.__registerHost();
10
- this.totalElements = undefined;
11
- this.currentPage = undefined;
12
- this.lastPage = undefined;
13
- this.labelElementsPerPage = 'Elementi per pagina';
14
- this.elementsRanges = [10, 20, 60, 100];
15
- this.firstPage = undefined;
16
- this.completeVersion = false;
17
- this.showAdditionalChrevrons = false;
18
- }
19
- render() {
20
- var _a;
21
- return (h(Host, { class: "JumpPagination" }, h("div", { class: "JumpPagination__Wrapper" }, this.completeVersion &&
22
- h("div", { class: "elementsPerPage" }, h("label", { htmlFor: "elements" }, (_a = this.labelElementsPerPage) !== null && _a !== void 0 ? _a : 'Elements per page'), h("select", { name: "elements", id: "elements" }, this.elementsRanges.map((range) => (h("option", { value: range }, range))))), h("div", { class: "indicators" }, h("div", { class: "elements" }, this.completeVersion ?
23
- h("span", null, h("span", null, this.firstPage), " - ", h("span", null, this.currentPage), " di ", h("span", null, this.totalElements))
24
- :
25
- h("span", null, h("span", null, this.currentPage), " di ", h("span", null, this.lastPage))), h("div", { class: "arrow" }, this.showAdditionalChrevrons && h("jump-icon", { name: "chevrons-left" }), h("jump-icon", { name: "chevron-left" }), h("jump-icon", { name: "chevron-right" }), this.showAdditionalChrevrons && h("jump-icon", { name: "chevrons-right" }))))));
26
- }
27
- static get style() { return jumpPaginationCss; }
8
+ constructor() {
9
+ super();
10
+ this.__registerHost();
11
+ this.totalElements = undefined;
12
+ this.currentPage = undefined;
13
+ this.lastPage = undefined;
14
+ this.labelElementsPerPage = 'Elementi per pagina';
15
+ this.elementsRanges = [10, 20, 60, 100];
16
+ this.firstPage = undefined;
17
+ this.completeVersion = false;
18
+ this.showAdditionalChrevrons = false;
19
+ }
20
+ render() {
21
+ var _a;
22
+ return (h(Host, { key: 'eacb989c1eafddab001bce8a3e7618b42e281604', class: "JumpPagination" }, h("div", { key: '52ebe6a91e9cde9f4bdcbad4be0a7e16d0a3867f', class: "JumpPagination__Wrapper" }, this.completeVersion &&
23
+ h("div", { class: "elementsPerPage" }, h("label", { htmlFor: "elements" }, (_a = this.labelElementsPerPage) !== null && _a !== void 0 ? _a : 'Elements per page'), h("select", { name: "elements", id: "elements" }, this.elementsRanges.map((range) => (h("option", { value: range }, range))))), h("div", { key: '97a70fd1f86f644ee0199f0a6f1945988579705c', class: "indicators" }, h("div", { key: '9e9a1c2f541b3aaad78105a58f051127770b6e4d', class: "elements" }, this.completeVersion ?
24
+ h("span", null, h("span", null, this.firstPage), " - ", h("span", null, this.currentPage), " di ", h("span", null, this.totalElements))
25
+ :
26
+ h("span", null, h("span", null, this.currentPage), " di ", h("span", null, this.lastPage))), h("div", { key: 'e7fe2402c2c6a1906f9f3bfc70cfde428590c964', class: "arrow" }, this.showAdditionalChrevrons && h("jump-icon", { name: "chevrons-left" }), h("jump-icon", { key: 'dadb4d94ce1bf31219adfa554a47b33f19b9b3a7', name: "chevron-left" }), h("jump-icon", { key: '841030e266c11bda6d75800bbc61f7e0899fd1ae', name: "chevron-right" }), this.showAdditionalChrevrons && h("jump-icon", { name: "chevrons-right" }))))));
27
+ }
28
+ static get style() { return JumpPaginationStyle0; }
28
29
  }, [0, "jump-pagination", {
29
- "totalElements": [514, "total-elements"],
30
- "currentPage": [514, "current-page"],
31
- "lastPage": [514, "last-page"],
32
- "labelElementsPerPage": [513, "label-elements-per-page"],
33
- "elementsRanges": [16],
34
- "firstPage": [514, "first-page"],
35
- "completeVersion": [516, "complete-version"],
36
- "showAdditionalChrevrons": [516, "show-additional-chrevrons"]
37
- }]);
30
+ "totalElements": [514, "total-elements"],
31
+ "currentPage": [514, "current-page"],
32
+ "lastPage": [514, "last-page"],
33
+ "labelElementsPerPage": [513, "label-elements-per-page"],
34
+ "elementsRanges": [16],
35
+ "firstPage": [514, "first-page"],
36
+ "completeVersion": [516, "complete-version"],
37
+ "showAdditionalChrevrons": [516, "show-additional-chrevrons"]
38
+ }]);
38
39
  function defineCustomElement$1() {
39
- if (typeof customElements === "undefined") {
40
- return;
41
- }
42
- const components = ["jump-pagination", "jump-icon"];
43
- components.forEach(tagName => { switch (tagName) {
44
- case "jump-pagination":
45
- if (!customElements.get(tagName)) {
46
- customElements.define(tagName, JumpPagination$1);
47
- }
48
- break;
49
- case "jump-icon":
50
- if (!customElements.get(tagName)) {
51
- defineCustomElement$2();
52
- }
53
- break;
54
- } });
40
+ if (typeof customElements === "undefined") {
41
+ return;
42
+ }
43
+ const components = ["jump-pagination", "jump-icon"];
44
+ components.forEach(tagName => { switch (tagName) {
45
+ case "jump-pagination":
46
+ if (!customElements.get(tagName)) {
47
+ customElements.define(tagName, JumpPagination$1);
48
+ }
49
+ break;
50
+ case "jump-icon":
51
+ if (!customElements.get(tagName)) {
52
+ defineCustomElement$2();
53
+ }
54
+ break;
55
+ } });
55
56
  }
56
57
 
57
58
  const JumpPagination = JumpPagination$1;
@@ -1 +1 @@
1
- {"file":"jump-pagination.js","mappings":";;;AAAA,MAAM,iBAAiB,GAAG,o1BAAo1B;;MCOj2BA,gBAAc;;;;;;;gCAe+B,qBAAqB;0BAKpB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC;;2BAUtB,KAAK;mCAEG,KAAK;;EAEjE,MAAM;;IACJ,QACE,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IAC1B,WAAK,KAAK,EAAC,yBAAyB,IAChC,IAAI,CAAC,eAAe;MACpB,WAAK,KAAK,EAAC,iBAAiB,IAC1B,aAAO,OAAO,EAAC,UAAU,IAAE,MAAA,IAAI,CAAC,oBAAoB,mCAAI,mBAAmB,CAAS,EAChF,cAAQ,IAAI,EAAC,UAAU,EAAC,EAAE,EAAC,UAAU,IAClC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,KAAK,MAC7B,cAAQ,KAAK,EAAE,KAAK,IAAG,KAAK,CAAU,CACvC,CAAC,CACK,CACT,EAER,WAAK,KAAK,EAAC,YAAY,IACrB,WAAK,KAAK,EAAC,UAAU,IAClB,IAAI,CAAC,eAAe;MACnB,gBACE,gBAAO,IAAI,CAAC,SAAS,CAAQ,SAAG,gBAAO,IAAI,CAAC,WAAW,CAAQ,UAAI,gBAAO,IAAI,CAAC,aAAa,CAAQ,CAC/F;;QAGP,gBACE,gBAAO,IAAI,CAAC,WAAW,CAAQ,UAAI,gBAAO,IAAI,CAAC,QAAQ,CAAQ,CAC1D,CAEL,EACN,WAAK,KAAK,EAAC,OAAO,IACf,IAAI,CAAC,uBAAuB,IAAI,iBAAW,IAAI,EAAC,eAAe,GAAa,EAC7E,iBAAW,IAAI,EAAC,cAAc,GAAa,EAC3C,iBAAW,IAAI,EAAC,eAAe,GAAa,EAC3C,IAAI,CAAC,uBAAuB,IAAI,iBAAW,IAAI,EAAC,gBAAgB,GAAa,CAC1E,CACF,CACF,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["JumpPagination"],"sources":["src/components/jump-pagination/jump-pagination.scss?tag=jump-pagination","src/components/jump-pagination/jump-pagination.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.JumpPagination {\n --pagination-label-color: var(--neutral-grey-secondary);\n --pagination-arrows-color: var(--neutral-grey-secondary);\n \n font-family: var(--ff-primary);\n\n &__Wrapper {\n display: flex;\n justify-content: space-between;\n\n .elementsPerPage {\n display: flex;\n gap: 1rem;\n align-items: center;\n\n label {\n color: var(--pagination-label-color);\n font-size: 14px;\n font-weight: normal;\n }\n } \n \n .indicators {\n font-size: 16px;\n font-weight: normal;\n display: flex;\n justify-content: space-between;\n gap: 20px;\n \n color: var(--pagination-label-color);\n\n .arrow {\n color: var(--pagination-arrows-color);\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .elements {\n color: var(--pagination-label-color);\n display: flex;\n align-items: center;\n gap: 5px;\n }\n }\n \n }\n \n}","import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'jump-pagination',\n styleUrl: 'jump-pagination.scss',\n shadow: false,\n})\nexport class JumpPagination {\n \n /* ---------------------- @PROPERTIES ------------------------- */\n\n @Prop({ reflect: true }) totalElements: number;\n\n /**\n * \n */\n @Prop({ reflect: true }) currentPage: number;\n @Prop({ reflect: true }) lastPage: number; \n\n /**\n * Label for the elements per page select\n */\n @Prop({ reflect: true }) labelElementsPerPage: string = 'Elementi per pagina';\n\n /**\n * Values for the elements per page select\n */\n @Prop({ reflect: true }) elementsRanges: Array<number> = [10, 20, 60, 100];\n\n /**\n * Indicates the first page/product of the list\n */\n @Prop({ reflect: true }) firstPage: number;\n\n /**\n * If true, the component will show the complete version of the pagination, with elements informations\n */\n @Prop({ reflect: true }) completeVersion: boolean = false;\n\n @Prop({ reflect: true }) showAdditionalChrevrons: boolean = false;\n\n render() {\n return (\n <Host class=\"JumpPagination\">\n <div class=\"JumpPagination__Wrapper\">\n { this.completeVersion && \n <div class=\"elementsPerPage\">\n <label htmlFor=\"elements\">{this.labelElementsPerPage ?? 'Elements per page'}</label>\n <select name=\"elements\" id=\"elements\">\n {this.elementsRanges.map((range) => (\n <option value={range}>{range}</option>\n ))}\n </select>\n </div> \n }\n <div class=\"indicators\"> \n <div class=\"elements\">\n {this.completeVersion ?\n <span>\n <span>{this.firstPage}</span> - <span>{this.currentPage}</span> di <span>{this.totalElements}</span>\n </span>\n \n :\n <span>\n <span>{this.currentPage}</span> di <span>{this.lastPage}</span>\n </span>\n }\n </div>\n <div class=\"arrow\">\n {this.showAdditionalChrevrons && <jump-icon name=\"chevrons-left\"></jump-icon>}\n <jump-icon name=\"chevron-left\"></jump-icon>\n <jump-icon name=\"chevron-right\"></jump-icon>\n {this.showAdditionalChrevrons && <jump-icon name=\"chevrons-right\"></jump-icon>}\n </div> \n </div>\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}
1
+ {"file":"jump-pagination.js","mappings":";;;AAAA,MAAM,iBAAiB,GAAG,o1BAAo1B,CAAC;AAC/2B,6BAAe,iBAAiB;;MCMnBA,gBAAc;;;;;;;oCAe+B,qBAAqB;8BAKpB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC;;+BAUtB,KAAK;uCAEG,KAAK;;IAEjE,MAAM;;QACJ,QACE,EAAC,IAAI,qDAAC,KAAK,EAAC,gBAAgB,IAC1B,4DAAK,KAAK,EAAC,yBAAyB,IAChC,IAAI,CAAC,eAAe;YACpB,WAAK,KAAK,EAAC,iBAAiB,IAC1B,aAAO,OAAO,EAAC,UAAU,IAAE,MAAA,IAAI,CAAC,oBAAoB,mCAAI,mBAAmB,CAAS,EAChF,cAAQ,IAAI,EAAC,UAAU,EAAC,EAAE,EAAC,UAAU,IAClC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,KAAK,MAC7B,cAAQ,KAAK,EAAE,KAAK,IAAG,KAAK,CAAU,CACvC,CAAC,CACK,CACT,EAER,4DAAK,KAAK,EAAC,YAAY,IACrB,4DAAK,KAAK,EAAC,UAAU,IAClB,IAAI,CAAC,eAAe;YACnB,gBACE,gBAAO,IAAI,CAAC,SAAS,CAAQ,SAAG,gBAAO,IAAI,CAAC,WAAW,CAAQ,UAAI,gBAAO,IAAI,CAAC,aAAa,CAAQ,CAC/F;;gBAGP,gBACE,gBAAO,IAAI,CAAC,WAAW,CAAQ,UAAI,gBAAO,IAAI,CAAC,QAAQ,CAAQ,CAC1D,CAEL,EACN,4DAAK,KAAK,EAAC,OAAO,IACf,IAAI,CAAC,uBAAuB,IAAI,iBAAW,IAAI,EAAC,eAAe,GAAa,EAC7E,kEAAW,IAAI,EAAC,cAAc,GAAa,EAC3C,kEAAW,IAAI,EAAC,eAAe,GAAa,EAC3C,IAAI,CAAC,uBAAuB,IAAI,iBAAW,IAAI,EAAC,gBAAgB,GAAa,CAC1E,CACF,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["JumpPagination"],"sources":["src/components/jump-pagination/jump-pagination.scss?tag=jump-pagination","src/components/jump-pagination/jump-pagination.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.JumpPagination {\n --pagination-label-color: var(--neutral-grey-secondary);\n --pagination-arrows-color: var(--neutral-grey-secondary);\n \n font-family: var(--ff-primary);\n\n &__Wrapper {\n display: flex;\n justify-content: space-between;\n\n .elementsPerPage {\n display: flex;\n gap: 1rem;\n align-items: center;\n\n label {\n color: var(--pagination-label-color);\n font-size: 14px;\n font-weight: normal;\n }\n } \n \n .indicators {\n font-size: 16px;\n font-weight: normal;\n display: flex;\n justify-content: space-between;\n gap: 20px;\n \n color: var(--pagination-label-color);\n\n .arrow {\n color: var(--pagination-arrows-color);\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .elements {\n color: var(--pagination-label-color);\n display: flex;\n align-items: center;\n gap: 5px;\n }\n }\n \n }\n \n}","import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'jump-pagination',\n styleUrl: 'jump-pagination.scss',\n shadow: false,\n})\nexport class JumpPagination {\n \n /* ---------------------- @PROPERTIES ------------------------- */\n\n @Prop({ reflect: true }) totalElements: number;\n\n /**\n * \n */\n @Prop({ reflect: true }) currentPage: number;\n @Prop({ reflect: true }) lastPage: number; \n\n /**\n * Label for the elements per page select\n */\n @Prop({ reflect: true }) labelElementsPerPage: string = 'Elementi per pagina';\n\n /**\n * Values for the elements per page select\n */\n @Prop({ reflect: true }) elementsRanges: Array<number> = [10, 20, 60, 100];\n\n /**\n * Indicates the first page/product of the list\n */\n @Prop({ reflect: true }) firstPage: number;\n\n /**\n * If true, the component will show the complete version of the pagination, with elements informations\n */\n @Prop({ reflect: true }) completeVersion: boolean = false;\n\n @Prop({ reflect: true }) showAdditionalChrevrons: boolean = false;\n\n render() {\n return (\n <Host class=\"JumpPagination\">\n <div class=\"JumpPagination__Wrapper\">\n { this.completeVersion && \n <div class=\"elementsPerPage\">\n <label htmlFor=\"elements\">{this.labelElementsPerPage ?? 'Elements per page'}</label>\n <select name=\"elements\" id=\"elements\">\n {this.elementsRanges.map((range) => (\n <option value={range}>{range}</option>\n ))}\n </select>\n </div> \n }\n <div class=\"indicators\"> \n <div class=\"elements\">\n {this.completeVersion ?\n <span>\n <span>{this.firstPage}</span> - <span>{this.currentPage}</span> di <span>{this.totalElements}</span>\n </span>\n \n :\n <span>\n <span>{this.currentPage}</span> di <span>{this.lastPage}</span>\n </span>\n }\n </div>\n <div class=\"arrow\">\n {this.showAdditionalChrevrons && <jump-icon name=\"chevrons-left\"></jump-icon>}\n <jump-icon name=\"chevron-left\"></jump-icon>\n <jump-icon name=\"chevron-right\"></jump-icon>\n {this.showAdditionalChrevrons && <jump-icon name=\"chevrons-right\"></jump-icon>}\n </div> \n </div>\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}
@@ -0,0 +1,5 @@
1
+ const globalScripts = () => {};
2
+
3
+ export { globalScripts as g };
4
+
5
+ //# sourceMappingURL=app-globals-0f993ce5.js.map
@@ -0,0 +1 @@
1
+ {"file":"app-globals-0f993ce5.js","mappings":"AAAY,MAAC,aAAa,GAAG,MAAM;;;;","names":[],"sources":["@stencil/core/internal/app-globals"],"sourcesContent":["export const globalScripts = () => {};\n"],"version":3}