@digigov/ui 0.35.0 → 0.35.2

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 (38) hide show
  1. package/CHANGELOG.md +8 -1
  2. package/admin/Pagination/Pagination.stories.d.ts +2 -0
  3. package/admin/Pagination/Pagination.stories.js +28 -0
  4. package/admin/Pagination/__stories__/Default.js +11 -69
  5. package/admin/Pagination/__stories__/PaginationSmall.js +1 -1
  6. package/admin/Pagination/__stories__/WithInactiveValues.d.ts +2 -0
  7. package/admin/Pagination/__stories__/WithInactiveValues.js +88 -0
  8. package/admin/Pagination/__stories__/WithResultsPerPage.d.ts +2 -0
  9. package/admin/Pagination/__stories__/WithResultsPerPage.js +60 -0
  10. package/admin/Pagination/index.js +1 -1
  11. package/admin/Pagination/index.mdx +8 -0
  12. package/es/admin/Pagination/Pagination.stories.js +2 -0
  13. package/es/admin/Pagination/__stories__/Default.js +11 -69
  14. package/es/admin/Pagination/__stories__/PaginationSmall.js +1 -1
  15. package/es/admin/Pagination/__stories__/WithInactiveValues.js +71 -0
  16. package/es/admin/Pagination/__stories__/WithResultsPerPage.js +42 -0
  17. package/es/admin/Pagination/index.js +1 -1
  18. package/es/admin/Pagination/index.mdx +8 -0
  19. package/es/locales/el.js +1 -1
  20. package/esm/admin/Pagination/Pagination.stories.js +2 -0
  21. package/esm/admin/Pagination/__stories__/Default.js +11 -69
  22. package/esm/admin/Pagination/__stories__/PaginationSmall.js +1 -1
  23. package/esm/admin/Pagination/__stories__/WithInactiveValues.js +71 -0
  24. package/esm/admin/Pagination/__stories__/WithResultsPerPage.js +42 -0
  25. package/esm/admin/Pagination/index.js +1 -1
  26. package/esm/admin/Pagination/index.mdx +8 -0
  27. package/esm/index.js +1 -1
  28. package/esm/locales/el.js +1 -1
  29. package/locales/el.js +1 -1
  30. package/package.json +3 -3
  31. package/src/admin/Pagination/Pagination.stories.js +2 -0
  32. package/src/admin/Pagination/__stories__/Default.tsx +9 -86
  33. package/src/admin/Pagination/__stories__/PaginationSmall.tsx +1 -1
  34. package/src/admin/Pagination/__stories__/WithInactiveValues.tsx +90 -0
  35. package/src/admin/Pagination/__stories__/WithResultsPerPage.tsx +66 -0
  36. package/src/admin/Pagination/index.mdx +8 -0
  37. package/src/admin/Pagination/index.tsx +1 -1
  38. package/src/locales/el.ts +1 -1
@@ -0,0 +1,42 @@
1
+ import React from 'react';
2
+ import { Pagination, PaginationList, PaginationListItem, PaginationLabel } from '@digigov/ui/admin/Pagination';
3
+ import { SelectContainer, SelectOption } from '@digigov/ui/core/SelectContainer';
4
+ import { ArrowIcon } from '@digigov/ui/core/SvgIcon';
5
+ import { Link } from '@digigov/ui/core/Link';
6
+ import { I18NProvider } from '@digigov/ui/app/i18n';
7
+ import { LabelContainer } from '@digigov/react-core';
8
+
9
+ var _ref = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
10
+ start: 1,
11
+ end: 10,
12
+ total: 15
13
+ }), /*#__PURE__*/React.createElement(LabelContainer, null, "\u0391\u03C0\u03BF\u03C4\u03B5\u03BB\u03AD\u03C3\u03BC\u03B1\u03C4\u03B1 \u03B1\u03BD\u03AC \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1", /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(SelectOption, null, "5"), /*#__PURE__*/React.createElement(SelectOption, null, "10"), /*#__PURE__*/React.createElement(SelectOption, null, "15"))), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
14
+ direction: "left"
15
+ }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
16
+ href: "#page1"
17
+ }, "1")), /*#__PURE__*/React.createElement(PaginationListItem, {
18
+ variant: "dots"
19
+ }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
20
+ href: "#page2"
21
+ }, "2")), /*#__PURE__*/React.createElement(PaginationListItem, {
22
+ currentPage: true
23
+ }, "8"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
24
+ href: "#page9"
25
+ }, "9")), /*#__PURE__*/React.createElement(PaginationListItem, {
26
+ variant: "dots"
27
+ }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
28
+ href: "#page20"
29
+ }, "20")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
30
+ direction: "right"
31
+ })))));
32
+
33
+ export var WithResultsPerPage = function WithResultsPerPage() {
34
+ return /*#__PURE__*/React.createElement("div", {
35
+ className: "example"
36
+ }, /*#__PURE__*/React.createElement(I18NProvider, {
37
+ t: function t(str) {
38
+ return str;
39
+ }
40
+ }, _ref));
41
+ };
42
+ export default WithResultsPerPage;
@@ -13,7 +13,7 @@ export var PaginationLabel = /*#__PURE__*/React.forwardRef(function PaginationLa
13
13
  ref: ref
14
14
  }, /*#__PURE__*/React.createElement(I18nText, {
15
15
  i18nKey: "pagination.label"
16
- }, "Showing ", /*#__PURE__*/React.createElement("b", null, start), " to ", /*#__PURE__*/React.createElement("b", null, end), " of ", /*#__PURE__*/React.createElement("b", null, total), " results."));
16
+ }, "Showing ", /*#__PURE__*/React.createElement("b", null, start), " to ", /*#__PURE__*/React.createElement("b", null, end), " of ", /*#__PURE__*/React.createElement("b", null, total), " results"));
17
17
  });
18
18
  export * from '@digigov/react-extensions/admin/Pagination';
19
19
  export * from '@digigov/react-extensions/admin/PaginationList';
@@ -11,6 +11,14 @@ import Pagination from '@digigov/ui/app/Pagination';
11
11
 
12
12
  <Story packageName="@digigov/ui" component="admin/Pagination" story="Default.tsx" />
13
13
 
14
+ ## With inactive values
15
+
16
+ <Story packageName="@digigov/ui" component="admin/Pagination" story="WithInactiveValues.tsx" />
17
+
18
+ ## With results per page
19
+
20
+ <Story packageName="@digigov/ui" component="admin/Pagination" story="WithResultsPerPage.tsx" />
21
+
14
22
  ## API
15
23
 
16
24
  <PropTypes packageName="@digigov/ui" component="Pagination" />
package/es/locales/el.js CHANGED
@@ -72,7 +72,7 @@ export default {
72
72
  to: 'έως',
73
73
  of: 'από',
74
74
  results: 'αποτελέσματα',
75
- label: 'Εμφανίζονται <1>{{start}}</1> έως <3>{{end}}</3> από <5>{{total}}</5> αποτελέσματα.'
75
+ label: 'Εμφανίζονται <1>{{start}}</1> έως <3>{{end}}</3> από <5>{{total}}</5> αποτελέσματα'
76
76
  },
77
77
  upload: {
78
78
  file: 'Αρχείο',
@@ -7,4 +7,6 @@ export default {
7
7
  displayName: 'Pagination'
8
8
  };
9
9
  export * from '@digigov/ui/admin/Pagination/__stories__/Default';
10
+ export * from '@digigov/ui/admin/Pagination/__stories__/WithInactiveValues';
11
+ export * from '@digigov/ui/admin/Pagination/__stories__/WithResultsPerPage';
10
12
  export * from '@digigov/ui/admin/Pagination/__stories__/PaginationSmall';
@@ -12,19 +12,19 @@ var _ref = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React
12
12
  }), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
13
13
  direction: "left"
14
14
  }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
15
- href: "/page1"
15
+ href: "#page1"
16
16
  }, "1")), /*#__PURE__*/React.createElement(PaginationListItem, {
17
17
  currentPage: true
18
18
  }, "2"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
19
- href: "/page3"
19
+ href: "#page3"
20
20
  }, "3")), /*#__PURE__*/React.createElement(PaginationListItem, {
21
21
  variant: "dots"
22
22
  }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
23
- href: "/page5"
23
+ href: "#page5"
24
24
  }, "5")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
25
- href: "/page6"
25
+ href: "#page6"
26
26
  }, "6")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
27
- href: "/page7"
27
+ href: "#page7"
28
28
  }, "7")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
29
29
  direction: "right"
30
30
  })))));
@@ -34,83 +34,25 @@ var _ref2 = /*#__PURE__*/React.createElement(SectionBreak, {
34
34
  });
35
35
 
36
36
  var _ref3 = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
37
- start: 10,
38
- end: 20,
39
- total: 10000
40
- }), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, {
41
- inactive: true
42
- }, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
43
- direction: "left"
44
- }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, {
45
- currentPage: true
46
- }, "1"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
47
- href: "/page2"
48
- }, "2")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
49
- href: "/page3"
50
- }, "3")), /*#__PURE__*/React.createElement(PaginationListItem, {
51
- variant: "dots"
52
- }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
53
- href: "/page5"
54
- }, "5")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
55
- href: "/page6"
56
- }, "6")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
57
- href: "/page7"
58
- }, "7")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
59
- direction: "right"
60
- })))));
61
-
62
- var _ref4 = /*#__PURE__*/React.createElement(SectionBreak, {
63
- size: "l"
64
- });
65
-
66
- var _ref5 = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
67
- start: 10,
68
- end: 20,
69
- total: 10000
70
- }), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
71
- direction: "left"
72
- }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
73
- href: "/page1"
74
- }, "1")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "2")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
75
- href: "/page3"
76
- }, "3")), /*#__PURE__*/React.createElement(PaginationListItem, {
77
- variant: "dots"
78
- }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
79
- href: "/page5"
80
- }, "5")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
81
- href: "/page6"
82
- }, "6")), /*#__PURE__*/React.createElement(PaginationListItem, {
83
- currentPage: true
84
- }, "7"), /*#__PURE__*/React.createElement(PaginationListItem, {
85
- inactive: true
86
- }, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
87
- direction: "right"
88
- })))));
89
-
90
- var _ref6 = /*#__PURE__*/React.createElement(SectionBreak, {
91
- size: "l"
92
- });
93
-
94
- var _ref7 = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
95
37
  start: 1,
96
38
  end: 10,
97
39
  total: 15
98
40
  }), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
99
41
  direction: "left"
100
42
  }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
101
- href: "/page1"
43
+ href: "#page1"
102
44
  }, "1")), /*#__PURE__*/React.createElement(PaginationListItem, {
103
45
  variant: "dots"
104
46
  }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
105
- href: "/page7"
106
- }, "2")), /*#__PURE__*/React.createElement(PaginationListItem, {
47
+ href: "#page7"
48
+ }, "7")), /*#__PURE__*/React.createElement(PaginationListItem, {
107
49
  currentPage: true
108
50
  }, "8"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
109
- href: "/page9"
51
+ href: "#page9"
110
52
  }, "9")), /*#__PURE__*/React.createElement(PaginationListItem, {
111
53
  variant: "dots"
112
54
  }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
113
- href: "/page20"
55
+ href: "#page20"
114
56
  }, "20")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
115
57
  direction: "right"
116
58
  })))));
@@ -122,6 +64,6 @@ export var Default = function Default() {
122
64
  t: function t(str) {
123
65
  return str;
124
66
  }
125
- }, _ref, _ref2, _ref3, _ref4, _ref5, _ref6, _ref7));
67
+ }, _ref, _ref2, _ref3));
126
68
  };
127
69
  export default Default;
@@ -16,7 +16,7 @@ var _ref = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React
16
16
  }))), /*#__PURE__*/React.createElement(PaginationListItem, {
17
17
  currentPage: true
18
18
  }, "1"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
19
- href: "/page7"
19
+ href: "#page2"
20
20
  }, "2")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
21
21
  direction: "right"
22
22
  })))));
@@ -0,0 +1,71 @@
1
+ import React from 'react';
2
+ import { Pagination, PaginationList, PaginationListItem, PaginationLabel } from '@digigov/ui/admin/Pagination';
3
+ import { ArrowIcon } from '@digigov/ui/core/SvgIcon';
4
+ import { Link } from '@digigov/ui/core/Link';
5
+ import { SectionBreak } from '@digigov/ui/core/SectionBreak';
6
+ import { I18NProvider } from '@digigov/ui/app/i18n';
7
+
8
+ var _ref = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
9
+ start: 10,
10
+ end: 20,
11
+ total: 10000
12
+ }), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, {
13
+ inactive: true
14
+ }, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
15
+ direction: "left"
16
+ }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, {
17
+ currentPage: true
18
+ }, "1"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
19
+ href: "#page2"
20
+ }, "2")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
21
+ href: "#page3"
22
+ }, "3")), /*#__PURE__*/React.createElement(PaginationListItem, {
23
+ variant: "dots"
24
+ }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
25
+ href: "#page5"
26
+ }, "5")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
27
+ href: "#page6"
28
+ }, "6")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
29
+ href: "#page7"
30
+ }, "7")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
31
+ direction: "right"
32
+ })))));
33
+
34
+ var _ref2 = /*#__PURE__*/React.createElement(SectionBreak, {
35
+ size: "l"
36
+ });
37
+
38
+ var _ref3 = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
39
+ start: 10,
40
+ end: 20,
41
+ total: 10000
42
+ }), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
43
+ direction: "left"
44
+ }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
45
+ href: "#page1"
46
+ }, "1")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "2")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
47
+ href: "#page3"
48
+ }, "3")), /*#__PURE__*/React.createElement(PaginationListItem, {
49
+ variant: "dots"
50
+ }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
51
+ href: "#page5"
52
+ }, "5")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
53
+ href: "#page6"
54
+ }, "6")), /*#__PURE__*/React.createElement(PaginationListItem, {
55
+ currentPage: true
56
+ }, "7"), /*#__PURE__*/React.createElement(PaginationListItem, {
57
+ inactive: true
58
+ }, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
59
+ direction: "right"
60
+ })))));
61
+
62
+ export var WithInactiveValues = function WithInactiveValues() {
63
+ return /*#__PURE__*/React.createElement("div", {
64
+ className: "example"
65
+ }, /*#__PURE__*/React.createElement(I18NProvider, {
66
+ t: function t(str) {
67
+ return str;
68
+ }
69
+ }, _ref, _ref2, _ref3));
70
+ };
71
+ export default WithInactiveValues;
@@ -0,0 +1,42 @@
1
+ import React from 'react';
2
+ import { Pagination, PaginationList, PaginationListItem, PaginationLabel } from '@digigov/ui/admin/Pagination';
3
+ import { SelectContainer, SelectOption } from '@digigov/ui/core/SelectContainer';
4
+ import { ArrowIcon } from '@digigov/ui/core/SvgIcon';
5
+ import { Link } from '@digigov/ui/core/Link';
6
+ import { I18NProvider } from '@digigov/ui/app/i18n';
7
+ import { LabelContainer } from '@digigov/react-core';
8
+
9
+ var _ref = /*#__PURE__*/React.createElement(Pagination, null, /*#__PURE__*/React.createElement(PaginationLabel, {
10
+ start: 1,
11
+ end: 10,
12
+ total: 15
13
+ }), /*#__PURE__*/React.createElement(LabelContainer, null, "\u0391\u03C0\u03BF\u03C4\u03B5\u03BB\u03AD\u03C3\u03BC\u03B1\u03C4\u03B1 \u03B1\u03BD\u03AC \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1", /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(SelectOption, null, "5"), /*#__PURE__*/React.createElement(SelectOption, null, "10"), /*#__PURE__*/React.createElement(SelectOption, null, "15"))), /*#__PURE__*/React.createElement(PaginationList, null, /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, /*#__PURE__*/React.createElement(ArrowIcon, {
14
+ direction: "left"
15
+ }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
16
+ href: "#page1"
17
+ }, "1")), /*#__PURE__*/React.createElement(PaginationListItem, {
18
+ variant: "dots"
19
+ }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
20
+ href: "#page2"
21
+ }, "2")), /*#__PURE__*/React.createElement(PaginationListItem, {
22
+ currentPage: true
23
+ }, "8"), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
24
+ href: "#page9"
25
+ }, "9")), /*#__PURE__*/React.createElement(PaginationListItem, {
26
+ variant: "dots"
27
+ }), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, {
28
+ href: "#page20"
29
+ }, "20")), /*#__PURE__*/React.createElement(PaginationListItem, null, /*#__PURE__*/React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /*#__PURE__*/React.createElement(ArrowIcon, {
30
+ direction: "right"
31
+ })))));
32
+
33
+ export var WithResultsPerPage = function WithResultsPerPage() {
34
+ return /*#__PURE__*/React.createElement("div", {
35
+ className: "example"
36
+ }, /*#__PURE__*/React.createElement(I18NProvider, {
37
+ t: function t(str) {
38
+ return str;
39
+ }
40
+ }, _ref));
41
+ };
42
+ export default WithResultsPerPage;
@@ -13,7 +13,7 @@ export var PaginationLabel = /*#__PURE__*/React.forwardRef(function PaginationLa
13
13
  ref: ref
14
14
  }, /*#__PURE__*/React.createElement(I18nText, {
15
15
  i18nKey: "pagination.label"
16
- }, "Showing ", /*#__PURE__*/React.createElement("b", null, start), " to ", /*#__PURE__*/React.createElement("b", null, end), " of ", /*#__PURE__*/React.createElement("b", null, total), " results."));
16
+ }, "Showing ", /*#__PURE__*/React.createElement("b", null, start), " to ", /*#__PURE__*/React.createElement("b", null, end), " of ", /*#__PURE__*/React.createElement("b", null, total), " results"));
17
17
  });
18
18
  export * from '@digigov/react-extensions/admin/Pagination';
19
19
  export * from '@digigov/react-extensions/admin/PaginationList';
@@ -11,6 +11,14 @@ import Pagination from '@digigov/ui/app/Pagination';
11
11
 
12
12
  <Story packageName="@digigov/ui" component="admin/Pagination" story="Default.tsx" />
13
13
 
14
+ ## With inactive values
15
+
16
+ <Story packageName="@digigov/ui" component="admin/Pagination" story="WithInactiveValues.tsx" />
17
+
18
+ ## With results per page
19
+
20
+ <Story packageName="@digigov/ui" component="admin/Pagination" story="WithResultsPerPage.tsx" />
21
+
14
22
  ## API
15
23
 
16
24
  <PropTypes packageName="@digigov/ui" component="Pagination" />
package/esm/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license Digigov v0.35.0
1
+ /** @license Digigov v0.35.2
2
2
  *
3
3
  * This source code is licensed under the BSD-2-Clause license found in the
4
4
  * LICENSE file in the root directory of this source tree.
package/esm/locales/el.js CHANGED
@@ -72,7 +72,7 @@ export default {
72
72
  to: 'έως',
73
73
  of: 'από',
74
74
  results: 'αποτελέσματα',
75
- label: 'Εμφανίζονται <1>{{start}}</1> έως <3>{{end}}</3> από <5>{{total}}</5> αποτελέσματα.'
75
+ label: 'Εμφανίζονται <1>{{start}}</1> έως <3>{{end}}</3> από <5>{{total}}</5> αποτελέσματα'
76
76
  },
77
77
  upload: {
78
78
  file: 'Αρχείο',
package/locales/el.js CHANGED
@@ -78,7 +78,7 @@ var _default = {
78
78
  to: 'έως',
79
79
  of: 'από',
80
80
  results: 'αποτελέσματα',
81
- label: 'Εμφανίζονται <1>{{start}}</1> έως <3>{{end}}</3> από <5>{{total}}</5> αποτελέσματα.'
81
+ label: 'Εμφανίζονται <1>{{start}}</1> έως <3>{{end}}</3> από <5>{{total}}</5> αποτελέσματα'
82
82
  },
83
83
  upload: {
84
84
  file: 'Αρχείο',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@digigov/ui",
3
- "version": "0.35.0",
3
+ "version": "0.35.2",
4
4
  "description": "@digigov reusable components toolkit",
5
5
  "main": "./index.js",
6
6
  "module": "./esm/index.js",
@@ -20,8 +20,8 @@
20
20
  "clsx": "1.1.1",
21
21
  "react": "^16.8.0 || ^17.0.0",
22
22
  "react-dom": "^16.8.0 || ^17.0.0",
23
- "@digigov/react-core": "0.25.1",
24
- "@digigov/react-extensions": "0.23.0"
23
+ "@digigov/react-core": "0.25.3",
24
+ "@digigov/react-extensions": "0.23.2"
25
25
  },
26
26
  "gitHead": "c903a46306f77f55ad7fc4d2e274006f39a6c871",
27
27
  "private": false,
@@ -9,4 +9,6 @@ export default {
9
9
  displayName: 'Pagination',
10
10
  };
11
11
  export * from '@digigov/ui/admin/Pagination/__stories__/Default';
12
+ export * from '@digigov/ui/admin/Pagination/__stories__/WithInactiveValues';
13
+ export * from '@digigov/ui/admin/Pagination/__stories__/WithResultsPerPage';
12
14
  export * from '@digigov/ui/admin/Pagination/__stories__/PaginationSmall';
@@ -6,7 +6,6 @@ import {
6
6
  PaginationListItem,
7
7
  PaginationLabel,
8
8
  } from '@digigov/ui/admin/Pagination';
9
-
10
9
  import { ArrowIcon } from '@digigov/ui/core/SvgIcon';
11
10
  import { Link } from '@digigov/ui/core/Link';
12
11
  import { SectionBreak } from '@digigov/ui/core/SectionBreak';
@@ -25,58 +24,21 @@ export const Default = () => (
25
24
  </Link>
26
25
  </PaginationListItem>
27
26
  <PaginationListItem>
28
- <Link href="/page1">1</Link>
27
+ <Link href="#page1">1</Link>
29
28
  </PaginationListItem>
30
29
  <PaginationListItem currentPage>2</PaginationListItem>
31
30
  <PaginationListItem>
32
- <Link href="/page3">3</Link>
31
+ <Link href="#page3">3</Link>
33
32
  </PaginationListItem>
34
33
  <PaginationListItem variant="dots" />
35
34
  <PaginationListItem>
36
- <Link href="/page5">5</Link>
37
- </PaginationListItem>
38
- <PaginationListItem>
39
- <Link href="/page6">6</Link>
40
- </PaginationListItem>
41
- <PaginationListItem>
42
- <Link href="/page7">7</Link>
43
- </PaginationListItem>
44
- <PaginationListItem>
45
- <Link>
46
- Επόμενο
47
- <ArrowIcon direction="right" />
48
- </Link>
49
- </PaginationListItem>
50
- </PaginationList>
51
- </Pagination>
52
-
53
- <SectionBreak size="l" />
54
-
55
- <Pagination>
56
- <PaginationLabel start={10} end={20} total={10000}></PaginationLabel>
57
- <PaginationList>
58
- <PaginationListItem inactive>
59
- <Link>
60
- <ArrowIcon direction="left" />
61
- Προηγούμενο
62
- </Link>
63
- </PaginationListItem>
64
- <PaginationListItem currentPage>1</PaginationListItem>
65
- <PaginationListItem>
66
- <Link href="/page2">2</Link>
67
- </PaginationListItem>
68
- <PaginationListItem>
69
- <Link href="/page3">3</Link>
70
- </PaginationListItem>
71
- <PaginationListItem variant="dots"></PaginationListItem>
72
- <PaginationListItem>
73
- <Link href="/page5">5</Link>
35
+ <Link href="#page5">5</Link>
74
36
  </PaginationListItem>
75
37
  <PaginationListItem>
76
- <Link href="/page6">6</Link>
38
+ <Link href="#page6">6</Link>
77
39
  </PaginationListItem>
78
40
  <PaginationListItem>
79
- <Link href="/page7">7</Link>
41
+ <Link href="#page7">7</Link>
80
42
  </PaginationListItem>
81
43
  <PaginationListItem>
82
44
  <Link>
@@ -86,46 +48,7 @@ export const Default = () => (
86
48
  </PaginationListItem>
87
49
  </PaginationList>
88
50
  </Pagination>
89
-
90
51
  <SectionBreak size="l" />
91
-
92
- <Pagination>
93
- <PaginationLabel start={10} end={20} total={10000}></PaginationLabel>
94
- <PaginationList>
95
- <PaginationListItem>
96
- <Link>
97
- <ArrowIcon direction="left" />
98
- Προηγούμενο
99
- </Link>
100
- </PaginationListItem>
101
- <PaginationListItem>
102
- <Link href="/page1">1</Link>
103
- </PaginationListItem>
104
- <PaginationListItem>
105
- <Link>2</Link>
106
- </PaginationListItem>
107
- <PaginationListItem>
108
- <Link href="/page3">3</Link>
109
- </PaginationListItem>
110
- <PaginationListItem variant="dots"></PaginationListItem>
111
- <PaginationListItem>
112
- <Link href="/page5">5</Link>
113
- </PaginationListItem>
114
- <PaginationListItem>
115
- <Link href="/page6">6</Link>
116
- </PaginationListItem>
117
- <PaginationListItem currentPage>7</PaginationListItem>
118
- <PaginationListItem inactive>
119
- <Link>
120
- Επόμενο
121
- <ArrowIcon direction="right" />
122
- </Link>
123
- </PaginationListItem>
124
- </PaginationList>
125
- </Pagination>
126
-
127
- <SectionBreak size="l" />
128
-
129
52
  <Pagination>
130
53
  <PaginationLabel start={1} end={10} total={15}></PaginationLabel>
131
54
  <PaginationList>
@@ -136,19 +59,19 @@ export const Default = () => (
136
59
  </Link>
137
60
  </PaginationListItem>
138
61
  <PaginationListItem>
139
- <Link href="/page1">1</Link>
62
+ <Link href="#page1">1</Link>
140
63
  </PaginationListItem>
141
64
  <PaginationListItem variant="dots"></PaginationListItem>
142
65
  <PaginationListItem>
143
- <Link href="/page7">2</Link>
66
+ <Link href="#page7">7</Link>
144
67
  </PaginationListItem>
145
68
  <PaginationListItem currentPage>8</PaginationListItem>
146
69
  <PaginationListItem>
147
- <Link href="/page9">9</Link>
70
+ <Link href="#page9">9</Link>
148
71
  </PaginationListItem>
149
72
  <PaginationListItem variant="dots"></PaginationListItem>
150
73
  <PaginationListItem>
151
- <Link href="/page20">20</Link>
74
+ <Link href="#page20">20</Link>
152
75
  </PaginationListItem>
153
76
  <PaginationListItem>
154
77
  <Link>
@@ -26,7 +26,7 @@ export const PaginationSmall = () => (
26
26
  <PaginationListItem currentPage>1</PaginationListItem>
27
27
 
28
28
  <PaginationListItem>
29
- <Link href="/page7">2</Link>
29
+ <Link href="#page2">2</Link>
30
30
  </PaginationListItem>
31
31
 
32
32
  <PaginationListItem>