w-design-system 0.0.83 → 0.0.85

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 (265) hide show
  1. package/.storybook/main.ts +8 -5
  2. package/.storybook/preview.ts +4 -13
  3. package/dist/components/Banner/index.d.ts +1 -1
  4. package/dist/components/Banner/styles.d.ts +1 -1
  5. package/dist/components/Button/index.d.ts +1 -1
  6. package/dist/components/Button/styles.d.ts +2 -2
  7. package/dist/components/Button/test.d.ts +0 -1
  8. package/dist/components/ButtonRadiusIcon/index.d.ts +1 -1
  9. package/dist/components/ButtonRadiusIcon/styles.d.ts +1 -1
  10. package/dist/components/ButtonRound/index.d.ts +1 -1
  11. package/dist/components/ButtonRound/styles.d.ts +1 -1
  12. package/dist/components/CardStories/index.d.ts +1 -1
  13. package/dist/components/CardStories/index.d.ts.map +1 -1
  14. package/dist/components/CardStories/stories.d.ts +2 -2
  15. package/dist/components/CountryStateSelector/index.d.ts +1 -2
  16. package/dist/components/DatePicker/index.d.ts +2 -7
  17. package/dist/components/DatePicker/index.d.ts.map +1 -1
  18. package/dist/components/DateRangePicker/index.d.ts +1 -1
  19. package/dist/components/DateRangePicker/index.d.ts.map +1 -1
  20. package/dist/components/DateRangePicker/styles.d.ts +7 -7
  21. package/dist/components/EmptyState/index.d.ts +1 -1
  22. package/dist/components/EmptyState/index.d.ts.map +1 -1
  23. package/dist/components/EmptyState/stories.d.ts +1 -1
  24. package/dist/components/EmptyState/styles.d.ts +1 -1
  25. package/dist/components/IconWrapper/index.d.ts +1 -1
  26. package/dist/components/Input/index.d.ts +1 -1
  27. package/dist/components/Input/index.d.ts.map +1 -1
  28. package/dist/components/Input/styles.d.ts +6 -6
  29. package/dist/components/InputTag/index.d.ts +1 -1
  30. package/dist/components/InputTag/index.d.ts.map +1 -1
  31. package/dist/components/InputTag/styles.d.ts +6 -6
  32. package/dist/components/Loading/index.d.ts +1 -1
  33. package/dist/components/Loading/stories.d.ts +1 -1
  34. package/dist/components/Modal/index.d.ts +1 -1
  35. package/dist/components/Modal/styles.d.ts +2 -2
  36. package/dist/components/MultiSelect/index.d.ts +1 -1
  37. package/dist/components/MultiSelect/index.d.ts.map +1 -1
  38. package/dist/components/Paginate/index.d.ts +1 -1
  39. package/dist/components/Paginate/index.d.ts.map +1 -1
  40. package/dist/components/Paginate/styles.d.ts +1 -1
  41. package/dist/components/Paragraph/index.d.ts +1 -1
  42. package/dist/components/Paragraph/stories.d.ts +1 -1
  43. package/dist/components/PortalSelect/index.d.ts +1 -1
  44. package/dist/components/PortalSelect/styles.d.ts +1 -1
  45. package/dist/components/Select/index.d.ts +1 -1
  46. package/dist/components/Select/index.d.ts.map +1 -1
  47. package/dist/components/Select/styles.d.ts +9 -9
  48. package/dist/components/Sidebar/SidebarGroup/index.d.ts +1 -2
  49. package/dist/components/Sidebar/SidebarGroup/index.d.ts.map +1 -1
  50. package/dist/components/Sidebar/SidebarGroup/styles.d.ts +3 -3
  51. package/dist/components/Sidebar/SidebarItem/index.d.ts +1 -1
  52. package/dist/components/Sidebar/SidebarItem/index.d.ts.map +1 -1
  53. package/dist/components/Sidebar/SidebarItem/styles.d.ts +2 -2
  54. package/dist/components/Sidebar/SidebarLogo/index.d.ts +1 -1
  55. package/dist/components/Sidebar/SidebarLogo/index.d.ts.map +1 -1
  56. package/dist/components/Sidebar/SidebarLogo/styles.d.ts +1 -1
  57. package/dist/components/Sidebar/index.d.ts +1 -1
  58. package/dist/components/Sidebar/index.d.ts.map +1 -1
  59. package/dist/components/Sidebar/styles.d.ts +4 -4
  60. package/dist/components/Table/index.d.ts +1 -1
  61. package/dist/components/Table/stories.d.ts +1 -1
  62. package/dist/components/Tabs/index.d.ts +1 -1
  63. package/dist/components/Tabs/styles.d.ts +2 -2
  64. package/dist/components/Title/index.d.ts +1 -1
  65. package/dist/components/Title/stories.d.ts +1 -1
  66. package/dist/favicon.ico +0 -0
  67. package/dist/index.html +43 -0
  68. package/dist/logo192.png +0 -0
  69. package/dist/logo512.png +0 -0
  70. package/dist/manifest.json +25 -0
  71. package/dist/robots.txt +3 -0
  72. package/dist/setupTests.d.ts +0 -1
  73. package/dist/src/globalStyles.d.ts +1 -1
  74. package/dist/stories/Button.d.ts +1 -2
  75. package/dist/stories/Button.d.ts.map +1 -1
  76. package/dist/stories/Button.stories.d.ts +3 -3
  77. package/dist/stories/Header.d.ts +1 -2
  78. package/dist/stories/Header.d.ts.map +1 -1
  79. package/dist/stories/Header.stories.d.ts +5 -5
  80. package/dist/stories/Page.d.ts +1 -2
  81. package/dist/stories/Page.stories.d.ts +2 -2
  82. package/dist/w-design-system.es.js +4656 -0
  83. package/dist/w-design-system.umd.js +1412 -0
  84. package/eslint.config.ts +21 -0
  85. package/package.json +28 -45
  86. package/prettier.config.js +11 -0
  87. package/src/components/Input/index.tsx +3 -6
  88. package/src/components/InputTag/index.tsx +3 -5
  89. package/src/components/Select/styles.ts +1 -1
  90. package/tsconfig.json +5 -18
  91. package/vite.config.ts +31 -0
  92. package/.babelrc +0 -8
  93. package/dist/assets/icon/index.js +0 -41
  94. package/dist/assets/icon/index.js.map +0 -1
  95. package/dist/components/Banner/index.js +0 -44
  96. package/dist/components/Banner/index.js.map +0 -1
  97. package/dist/components/Banner/stories.js +0 -25
  98. package/dist/components/Banner/stories.js.map +0 -1
  99. package/dist/components/Banner/styles.js +0 -56
  100. package/dist/components/Banner/styles.js.map +0 -1
  101. package/dist/components/Button/index.js +0 -66
  102. package/dist/components/Button/index.js.map +0 -1
  103. package/dist/components/Button/stories.js +0 -88
  104. package/dist/components/Button/stories.js.map +0 -1
  105. package/dist/components/Button/styles.js +0 -217
  106. package/dist/components/Button/styles.js.map +0 -1
  107. package/dist/components/Button/test.js +0 -33
  108. package/dist/components/Button/test.js.map +0 -1
  109. package/dist/components/ButtonRadiusIcon/index.js +0 -25
  110. package/dist/components/ButtonRadiusIcon/index.js.map +0 -1
  111. package/dist/components/ButtonRadiusIcon/stories.js +0 -42
  112. package/dist/components/ButtonRadiusIcon/stories.js.map +0 -1
  113. package/dist/components/ButtonRadiusIcon/styles.js +0 -150
  114. package/dist/components/ButtonRadiusIcon/styles.js.map +0 -1
  115. package/dist/components/ButtonRound/index.js +0 -21
  116. package/dist/components/ButtonRound/index.js.map +0 -1
  117. package/dist/components/ButtonRound/stories.js +0 -43
  118. package/dist/components/ButtonRound/stories.js.map +0 -1
  119. package/dist/components/ButtonRound/styles.js +0 -134
  120. package/dist/components/ButtonRound/styles.js.map +0 -1
  121. package/dist/components/CardStories/index.js +0 -43
  122. package/dist/components/CardStories/index.js.map +0 -1
  123. package/dist/components/CardStories/stories.js +0 -35
  124. package/dist/components/CardStories/stories.js.map +0 -1
  125. package/dist/components/CountryStateSelector/index.js +0 -106
  126. package/dist/components/CountryStateSelector/index.js.map +0 -1
  127. package/dist/components/CountryStateSelector/stories.js +0 -46
  128. package/dist/components/CountryStateSelector/stories.js.map +0 -1
  129. package/dist/components/DatePicker/index.js +0 -22
  130. package/dist/components/DatePicker/index.js.map +0 -1
  131. package/dist/components/DatePicker/stories.js +0 -61
  132. package/dist/components/DatePicker/stories.js.map +0 -1
  133. package/dist/components/DateRangePicker/index.js +0 -187
  134. package/dist/components/DateRangePicker/index.js.map +0 -1
  135. package/dist/components/DateRangePicker/stories.js +0 -65
  136. package/dist/components/DateRangePicker/stories.js.map +0 -1
  137. package/dist/components/DateRangePicker/styles.js +0 -122
  138. package/dist/components/DateRangePicker/styles.js.map +0 -1
  139. package/dist/components/EmptyState/index.js +0 -14
  140. package/dist/components/EmptyState/index.js.map +0 -1
  141. package/dist/components/EmptyState/stories.js +0 -31
  142. package/dist/components/EmptyState/stories.js.map +0 -1
  143. package/dist/components/EmptyState/styles.js +0 -29
  144. package/dist/components/EmptyState/styles.js.map +0 -1
  145. package/dist/components/IconWrapper/index.js +0 -34
  146. package/dist/components/IconWrapper/index.js.map +0 -1
  147. package/dist/components/Input/index.js +0 -91
  148. package/dist/components/Input/index.js.map +0 -1
  149. package/dist/components/Input/stories.js +0 -55
  150. package/dist/components/Input/stories.js.map +0 -1
  151. package/dist/components/Input/styles.js +0 -86
  152. package/dist/components/Input/styles.js.map +0 -1
  153. package/dist/components/InputTag/index.js +0 -124
  154. package/dist/components/InputTag/index.js.map +0 -1
  155. package/dist/components/InputTag/stories.js +0 -25
  156. package/dist/components/InputTag/stories.js.map +0 -1
  157. package/dist/components/InputTag/styles.js +0 -146
  158. package/dist/components/InputTag/styles.js.map +0 -1
  159. package/dist/components/Loading/index.js +0 -50
  160. package/dist/components/Loading/index.js.map +0 -1
  161. package/dist/components/Loading/stories.js +0 -46
  162. package/dist/components/Loading/stories.js.map +0 -1
  163. package/dist/components/Modal/index.js +0 -31
  164. package/dist/components/Modal/index.js.map +0 -1
  165. package/dist/components/Modal/stories.js +0 -24
  166. package/dist/components/Modal/stories.js.map +0 -1
  167. package/dist/components/Modal/styles.js +0 -48
  168. package/dist/components/Modal/styles.js.map +0 -1
  169. package/dist/components/MultiSelect/index.js +0 -284
  170. package/dist/components/MultiSelect/index.js.map +0 -1
  171. package/dist/components/MultiSelect/stories.js +0 -39
  172. package/dist/components/MultiSelect/stories.js.map +0 -1
  173. package/dist/components/MultiSelect/styles.d.ts +0 -14
  174. package/dist/components/MultiSelect/styles.d.ts.map +0 -1
  175. package/dist/components/MultiSelect/styles.js +0 -66
  176. package/dist/components/MultiSelect/styles.js.map +0 -1
  177. package/dist/components/Paginate/index.js +0 -63
  178. package/dist/components/Paginate/index.js.map +0 -1
  179. package/dist/components/Paginate/stories.js +0 -44
  180. package/dist/components/Paginate/stories.js.map +0 -1
  181. package/dist/components/Paginate/styles.js +0 -64
  182. package/dist/components/Paginate/styles.js.map +0 -1
  183. package/dist/components/Paragraph/index.js +0 -51
  184. package/dist/components/Paragraph/index.js.map +0 -1
  185. package/dist/components/Paragraph/stories.js +0 -113
  186. package/dist/components/Paragraph/stories.js.map +0 -1
  187. package/dist/components/PortalSelect/index.js +0 -141
  188. package/dist/components/PortalSelect/index.js.map +0 -1
  189. package/dist/components/PortalSelect/stories.js +0 -82
  190. package/dist/components/PortalSelect/stories.js.map +0 -1
  191. package/dist/components/PortalSelect/styles.js +0 -9
  192. package/dist/components/PortalSelect/styles.js.map +0 -1
  193. package/dist/components/Select/index.js +0 -260
  194. package/dist/components/Select/index.js.map +0 -1
  195. package/dist/components/Select/stories.js +0 -40
  196. package/dist/components/Select/stories.js.map +0 -1
  197. package/dist/components/Select/styles.js +0 -90
  198. package/dist/components/Select/styles.js.map +0 -1
  199. package/dist/components/Sidebar/SidebarGroup/index.js +0 -42
  200. package/dist/components/Sidebar/SidebarGroup/index.js.map +0 -1
  201. package/dist/components/Sidebar/SidebarGroup/styles.js +0 -68
  202. package/dist/components/Sidebar/SidebarGroup/styles.js.map +0 -1
  203. package/dist/components/Sidebar/SidebarItem/index.js +0 -26
  204. package/dist/components/Sidebar/SidebarItem/index.js.map +0 -1
  205. package/dist/components/Sidebar/SidebarItem/styles.js +0 -64
  206. package/dist/components/Sidebar/SidebarItem/styles.js.map +0 -1
  207. package/dist/components/Sidebar/SidebarLogo/index.js +0 -12
  208. package/dist/components/Sidebar/SidebarLogo/index.js.map +0 -1
  209. package/dist/components/Sidebar/SidebarLogo/styles.js +0 -48
  210. package/dist/components/Sidebar/SidebarLogo/styles.js.map +0 -1
  211. package/dist/components/Sidebar/index.js +0 -45
  212. package/dist/components/Sidebar/index.js.map +0 -1
  213. package/dist/components/Sidebar/stories.js +0 -94
  214. package/dist/components/Sidebar/stories.js.map +0 -1
  215. package/dist/components/Sidebar/styles.js +0 -73
  216. package/dist/components/Sidebar/styles.js.map +0 -1
  217. package/dist/components/Table/index.js +0 -95
  218. package/dist/components/Table/index.js.map +0 -1
  219. package/dist/components/Table/stories.js +0 -163
  220. package/dist/components/Table/stories.js.map +0 -1
  221. package/dist/components/Table/styles.js +0 -2
  222. package/dist/components/Table/styles.js.map +0 -1
  223. package/dist/components/Tabs/index.js +0 -13
  224. package/dist/components/Tabs/index.js.map +0 -1
  225. package/dist/components/Tabs/stories.js +0 -31
  226. package/dist/components/Tabs/stories.js.map +0 -1
  227. package/dist/components/Tabs/styles.js +0 -22
  228. package/dist/components/Tabs/styles.js.map +0 -1
  229. package/dist/components/Themes/index.js +0 -88
  230. package/dist/components/Themes/index.js.map +0 -1
  231. package/dist/components/Title/index.js +0 -17
  232. package/dist/components/Title/index.js.map +0 -1
  233. package/dist/components/Title/stories.js +0 -61
  234. package/dist/components/Title/stories.js.map +0 -1
  235. package/dist/components/Types/index.js +0 -2
  236. package/dist/components/Types/index.js.map +0 -1
  237. package/dist/components/index.js +0 -16
  238. package/dist/components/index.js.map +0 -1
  239. package/dist/index.js +0 -25
  240. package/dist/index.js.map +0 -1
  241. package/dist/prettier.config.js +0 -13
  242. package/dist/prettier.config.js.map +0 -1
  243. package/dist/reportWebVitals.d.ts +0 -4
  244. package/dist/reportWebVitals.d.ts.map +0 -1
  245. package/dist/reportWebVitals.js +0 -14
  246. package/dist/reportWebVitals.js.map +0 -1
  247. package/dist/setupTests.js +0 -6
  248. package/dist/setupTests.js.map +0 -1
  249. package/dist/src/globalStyles.js +0 -15
  250. package/dist/src/globalStyles.js.map +0 -1
  251. package/dist/stories/Button.js +0 -22
  252. package/dist/stories/Button.js.map +0 -1
  253. package/dist/stories/Button.stories.js +0 -45
  254. package/dist/stories/Button.stories.js.map +0 -1
  255. package/dist/stories/Header.js +0 -21
  256. package/dist/stories/Header.js.map +0 -1
  257. package/dist/stories/Header.stories.js +0 -27
  258. package/dist/stories/Header.stories.js.map +0 -1
  259. package/dist/stories/Page.js +0 -38
  260. package/dist/stories/Page.js.map +0 -1
  261. package/dist/stories/Page.stories.js +0 -34
  262. package/dist/stories/Page.stories.js.map +0 -1
  263. package/dist/utils/constanst.js +0 -3
  264. package/dist/utils/constanst.js.map +0 -1
  265. package/src/reportWebVitals.ts +0 -16
@@ -1,48 +0,0 @@
1
- import styled from 'styled-components';
2
- import { theme } from '../Themes';
3
- const { colors: { shade20 }, zIndex: { z8, z9 }, } = theme;
4
- export const Overlay = styled.div `
5
- position: fixed;
6
- top: 0;
7
- left: 0;
8
- width: 100%;
9
- height: 100%;
10
- background: rgba(0, 0, 0, 0.5);
11
- z-index: ${z8};
12
- `;
13
- export const ModalContainer = styled.div `
14
- display: flex;
15
- min-width: 360px;
16
- width: auto;
17
- height: auto;
18
- padding: 30px;
19
- flex-direction: column;
20
- align-items: flex-start;
21
- gap: 24px;
22
- flex-shrink: 0;
23
- border-radius: 24px;
24
- border: 1px solid ${shade20};
25
- background: white;
26
- position: fixed;
27
- top: 50%;
28
- left: 50%;
29
- transform: translate(-50%, -50%);
30
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
31
- z-index: ${z9};
32
-
33
- .modalContainer {
34
- min-height: 100px;
35
- }
36
- .modalHeader {
37
- display: inline-flex;
38
- justify-content: space-between;
39
- width: 100%;
40
- }
41
- .modalFooter {
42
- display: inline-flex;
43
- justify-content: flex-end;
44
- width: 100%;
45
- gap: 0 24px;
46
- }
47
- `;
48
- //# sourceMappingURL=styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Modal/styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AACjC,MAAM,EACJ,MAAM,EAAE,EAAE,OAAO,EAAE,EACnB,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GACnB,GAAG,KAAK,CAAA;AAET,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;aAOpB,EAAE;CACd,CAAA;AACD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;sBAWlB,OAAO;;;;;;;aAOhB,EAAE;;;;;;;;;;;;;;;;CAgBd,CAAA"}
@@ -1,284 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import React, { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
13
- import { chevronDownSVG } from '../../assets/icon';
14
- import { IconWrapper } from '../IconWrapper';
15
- import { Input } from '../Input';
16
- import { theme } from '../Themes';
17
- import { Dropdown, DropdownWrapper, OptionButton, OptionText, SelectWrapper, OptionBackground, OptionsWrapper, OptionTextBadge, NoResults, } from '../Select/styles';
18
- import { Paragraph } from '../Paragraph';
19
- const MultiSelectFowardRef = (_a, ref) => {
20
- var _b;
21
- var { children, label, leftIcon, onOptionChange, options, placeholder, rightIcon, selectedOption: selectedOptions, value, dropDownWidth, disabled, disableSearch } = _a, props = __rest(_a, ["children", "label", "leftIcon", "onOptionChange", "options", "placeholder", "rightIcon", "selectedOption", "value", "dropDownWidth", "disabled", "disableSearch"]);
22
- const [open, setOpen] = useState(false);
23
- const [usingInput, setUsingInput] = useState(false);
24
- const [computedValue, setComputedValue] = useState(value);
25
- const wrapperRef = useRef(null);
26
- useImperativeHandle(ref, () => ({
27
- setOpen,
28
- }));
29
- useEffect(() => {
30
- if (!open)
31
- return;
32
- const handler = (event) => {
33
- let element = event.target;
34
- while (element && element !== document.body.parentElement) {
35
- if (element === wrapperRef.current)
36
- break;
37
- element = element.parentElement;
38
- }
39
- if (element === document.body.parentElement) {
40
- setOpen(false);
41
- }
42
- };
43
- document.addEventListener('click', handler);
44
- return () => {
45
- document.removeEventListener('click', handler);
46
- };
47
- }, [open]);
48
- const onOptionClick = useCallback((option) => {
49
- var _a;
50
- const isActive = (selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.findIndex(item => item.id === option.id)) !== -1;
51
- if (isActive) {
52
- onOptionChange && onOptionChange((_a = selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.filter(item => item.id !== option.id)) !== null && _a !== void 0 ? _a : []);
53
- }
54
- else {
55
- onOptionChange && onOptionChange([...(selectedOptions !== null && selectedOptions !== void 0 ? selectedOptions : []), option]);
56
- }
57
- }, [onOptionChange, selectedOptions]);
58
- useEffect(() => {
59
- if (usingInput)
60
- return;
61
- if (value) {
62
- setComputedValue(value);
63
- }
64
- else if (selectedOptions) {
65
- if ((selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.length) === (options === null || options === void 0 ? void 0 : options.length)) {
66
- setComputedValue('Todos');
67
- }
68
- else {
69
- setComputedValue(selectedOptions
70
- .map(option => option.text)
71
- .sort()
72
- .join(', '));
73
- }
74
- }
75
- else {
76
- setComputedValue('');
77
- }
78
- }, [value, selectedOptions, disableSearch, open, usingInput, options]);
79
- useEffect(() => {
80
- if (!open)
81
- setUsingInput(false);
82
- }, [open]);
83
- const onInputChange = (event) => {
84
- if (disableSearch)
85
- return;
86
- setComputedValue(event.target.value);
87
- setUsingInput(true);
88
- };
89
- const filteredOptions = useMemo(() => {
90
- if (!options)
91
- return [];
92
- if (!usingInput || disableSearch)
93
- return options;
94
- const normalizedValue = (computedValue || '')
95
- .trim()
96
- .toLowerCase()
97
- .normalize('NFD')
98
- .replace(/[\u0300-\u036f]/g, '');
99
- if (!normalizedValue)
100
- return options;
101
- const items = [];
102
- for (const option of options) {
103
- if (option.text
104
- .toLowerCase()
105
- .normalize('NFD')
106
- .replace(/[\u0300-\u036f]/g, '')
107
- .includes(normalizedValue)) {
108
- items.push(option);
109
- }
110
- }
111
- return items;
112
- }, [options, usingInput, disableSearch, computedValue]);
113
- const dropdownRef = useRef(null);
114
- const optionsWrapperRef = useRef(null);
115
- const [backgroundStyle, setBackgroundStyle] = useState({
116
- $opacity: 0,
117
- $width: '100%',
118
- $height: '0px',
119
- $top: '0px',
120
- $left: '0px',
121
- });
122
- const optionRefs = useRef([]);
123
- const lastItemIdRef = useRef();
124
- const [highlightedIndex, setHighlightedIndex] = useState(null);
125
- const updateBackground = useCallback((index) => {
126
- if (index === lastItemIdRef.current)
127
- return;
128
- const target = optionRefs.current[index];
129
- if (!target)
130
- return;
131
- if (!optionsWrapperRef.current)
132
- return;
133
- const { left, top, height } = target.getBoundingClientRect();
134
- const { left: contentLeft, top: contentTop } = optionsWrapperRef.current.getBoundingClientRect();
135
- const padding = 16;
136
- setBackgroundStyle({
137
- $opacity: 1,
138
- $width: `100%`,
139
- $height: `${height}px`,
140
- $top: `${padding + top - contentTop}px`,
141
- $left: `${left - contentLeft}px`,
142
- });
143
- lastItemIdRef.current = index;
144
- }, []);
145
- /**
146
- * When the user has the mouse over the dropdown and presses an up or down arrow key, the dropdown should
147
- * ignore the hover change, as the user is navigating with the keyboard
148
- */
149
- const [disableHoverChange, setDisableHoverChange] = useState(false);
150
- const timeoutRef = useRef(null);
151
- const scrollIntoView = (index) => {
152
- const option = optionRefs.current[index];
153
- if (option && dropdownRef.current) {
154
- option.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
155
- if (timeoutRef.current)
156
- clearTimeout(timeoutRef.current);
157
- const intersectionObserver = new IntersectionObserver(entries => {
158
- if (entries[0].isIntersecting) {
159
- setDisableHoverChange(true);
160
- timeoutRef.current = setTimeout(() => {
161
- timeoutRef.current = null;
162
- setDisableHoverChange(false);
163
- }, 200);
164
- }
165
- setTimeout(() => {
166
- intersectionObserver.disconnect();
167
- }, 100);
168
- });
169
- if (dropdownRef.current)
170
- intersectionObserver.observe(dropdownRef.current);
171
- }
172
- };
173
- useEffect(() => {
174
- if (!open) {
175
- setHighlightedIndex(null);
176
- setBackgroundStyle(backgroundStyle => (Object.assign(Object.assign({}, backgroundStyle), { $opacity: 0 })));
177
- return;
178
- }
179
- const handleKeyDown = (event) => {
180
- if (!filteredOptions.length)
181
- return;
182
- if (event.key === 'ArrowDown') {
183
- event.preventDefault();
184
- setHighlightedIndex(prevIndex => {
185
- const nextIndex = prevIndex === null || prevIndex === filteredOptions.length - 1 ? 0 : prevIndex + 1;
186
- scrollIntoView(nextIndex);
187
- updateBackground(nextIndex);
188
- const element = optionRefs.current[nextIndex];
189
- if (element) {
190
- const checkbox = element.querySelector('input');
191
- if (checkbox) {
192
- checkbox.focus();
193
- }
194
- }
195
- return nextIndex;
196
- });
197
- }
198
- if (event.key === 'ArrowUp') {
199
- event.preventDefault();
200
- setHighlightedIndex(prevIndex => {
201
- const nextIndex = prevIndex === null || prevIndex === 0 ? filteredOptions.length - 1 : prevIndex - 1;
202
- scrollIntoView(nextIndex);
203
- updateBackground(nextIndex);
204
- const element = optionRefs.current[nextIndex];
205
- if (element) {
206
- const checkbox = element.querySelector('input');
207
- if (checkbox) {
208
- checkbox.focus();
209
- }
210
- }
211
- return nextIndex;
212
- });
213
- }
214
- if (event.key === 'Enter' && highlightedIndex !== null) {
215
- event.preventDefault();
216
- onOptionClick(filteredOptions[highlightedIndex]);
217
- }
218
- };
219
- document.addEventListener('keydown', handleKeyDown);
220
- return () => {
221
- document.removeEventListener('keydown', handleKeyDown);
222
- };
223
- }, [open, filteredOptions, highlightedIndex, updateBackground, onOptionClick]);
224
- useEffect(() => {
225
- if (disableHoverChange && dropdownRef.current) {
226
- const element = dropdownRef.current;
227
- const handler = () => {
228
- setDisableHoverChange(false);
229
- };
230
- element.addEventListener('scrollend', handler);
231
- return () => {
232
- element.removeEventListener('scrollend', handler);
233
- };
234
- }
235
- }, [disableHoverChange]);
236
- /**
237
- * Used to handle the pointer enter event, it's used to highlight the option that the mouse is over
238
- */
239
- const onPointerEnter = useCallback((event, index) => {
240
- if (disableHoverChange)
241
- return;
242
- updateBackground(index);
243
- setHighlightedIndex(index);
244
- }, [disableHoverChange, updateBackground, setHighlightedIndex]);
245
- /**
246
- * Used to handle the pointer leave event, it's used to remove the highlight from the option that the mouse is over
247
- */
248
- const onPointerLeave = useCallback((event, index) => {
249
- if (disableHoverChange)
250
- return;
251
- if (index === lastItemIdRef.current) {
252
- setBackgroundStyle(currentStyle => (Object.assign(Object.assign({}, currentStyle), { $opacity: 0 })));
253
- lastItemIdRef.current = undefined;
254
- }
255
- }, [disableHoverChange]);
256
- return (React.createElement(SelectWrapper, Object.assign({}, props, { ref: wrapperRef }),
257
- React.createElement(Input, { disabled: disabled, leftIcon: leftIcon, rightIcon: React.createElement(React.Fragment, null,
258
- rightIcon,
259
- React.createElement(IconWrapper, { className: `icon ${open ? 'icon-rotate' : ''}`, src: chevronDownSVG, width: "16px", color: theme.colors.shade30 })), placeholder: placeholder, label: label, value: computedValue, readonly: !open, onChange: onInputChange, onClick: () => {
260
- if (!disabled) {
261
- setComputedValue('');
262
- setUsingInput(true);
263
- setOpen(true);
264
- }
265
- } }),
266
- open && (React.createElement(DropdownWrapper, null,
267
- React.createElement(Dropdown, { ref: dropdownRef, "$dropDownTop": props.dropDownTop, "$dropDownWidth": dropDownWidth, "$dropDownMaxHeight": props.dropDownMaxHeight },
268
- ((_b = options === null || options === void 0 ? void 0 : options.length) !== null && _b !== void 0 ? _b : 0) > 0 && (React.createElement(React.Fragment, null,
269
- React.createElement(OptionsWrapper, { ref: optionsWrapperRef }, filteredOptions.map((option, index) => {
270
- var _a, _b;
271
- return (React.createElement(OptionButton, { selected: (_a = selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.some(selectedOption => option.id === selectedOption.id)) !== null && _a !== void 0 ? _a : false, key: option.id, onClick: () => onOptionClick(option), ref: ref => (optionRefs.current[index] = ref), onPointerEnter: event => onPointerEnter(event, index), onPointerLeave: event => onPointerLeave(event, index) },
272
- React.createElement("input", { type: "checkbox", checked: (_b = selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.some(selectedOption => option.id === selectedOption.id)) !== null && _b !== void 0 ? _b : false, onChange: () => onOptionClick(option) }),
273
- (option === null || option === void 0 ? void 0 : option.badge) ? (React.createElement(OptionTextBadge, null,
274
- React.createElement("div", null, option.text),
275
- React.createElement(Paragraph, { strongBod: true, color: theme.colors.honey30 }, option.badge))) : (React.createElement(React.Fragment, null,
276
- option.icon,
277
- React.createElement(OptionText, null, option.text)))));
278
- })),
279
- React.createElement(OptionBackground, { "$opacity": backgroundStyle.$opacity, "$width": backgroundStyle.$width, "$height": backgroundStyle.$height, "$top": backgroundStyle.$top, "$left": backgroundStyle.$left }),
280
- filteredOptions.length === 0 && (options === null || options === void 0 ? void 0 : options.length) && React.createElement(NoResults, null, "Sem resultados"))),
281
- children)))));
282
- };
283
- export const MultiSelect = React.forwardRef(MultiSelectFowardRef);
284
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MultiSelect/index.tsx"],"names":[],"mappings":"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"}
@@ -1,39 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import { MultiSelect } from './index';
13
- import React from 'react';
14
- const meta = {
15
- title: 'Components/MultiSelect',
16
- component: MultiSelect,
17
- tags: ['autodocs'],
18
- argTypes: {
19
- placeholder: { control: 'text' },
20
- label: { control: 'text' },
21
- disabled: { control: 'boolean' },
22
- selectedOption: { control: 'number' },
23
- onOptionChange: { action: 'selectedOptionChange' },
24
- dropDownTop: { control: 'boolean' },
25
- },
26
- };
27
- export default meta;
28
- const ComponentWrapper = (_a) => {
29
- var { options } = _a, args = __rest(_a, ["options"]);
30
- const [selectedOption, setSelectOption] = React.useState([]);
31
- return (React.createElement(MultiSelect, Object.assign({ selectedOption: selectedOption, onOptionChange: option => setSelectOption(option), options: options !== null && options !== void 0 ? options : (new Array(5)).fill(0).map((_, index) => ({
32
- id: index,
33
- text: `Opção ${index + 1}`,
34
- })) }, args)));
35
- };
36
- export const Default = {
37
- render: () => React.createElement(ComponentWrapper, { label: "Label", placeholder: "Placeholder" }),
38
- };
39
- //# sourceMappingURL=stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"stories.js","sourceRoot":"","sources":["../../../src/components/MultiSelect/stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,EAAE,WAAW,EAAoB,MAAM,SAAS,CAAA;AACvD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,IAAI,GAA6B;IACrC,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,WAAW;IACtB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAChC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC1B,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QAChC,cAAc,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QACrC,cAAc,EAAE,EAAE,MAAM,EAAE,sBAAsB,EAAE;QAClD,WAAW,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACpC;CACiC,CAAA;AAEpC,eAAe,IAAI,CAAA;AAGnB,MAAM,gBAAgB,GAAG,CAAC,EAAsC,EAAE,EAAE;QAA1C,EAAE,OAAO,OAA6B,EAAxB,IAAI,cAAlB,WAAoB,CAAF;IAC1C,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqC,EAAE,CAAC,CAAA;IAEhG,OAAO,CACL,oBAAC,WAAW,kBACV,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,MAAM,CAAC,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,EACjD,OAAO,EACL,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;YACnD,EAAE,EAAE,KAAK;YACT,IAAI,EAAE,SAAS,KAAK,GAAG,CAAC,EAAE;SAC3B,CAAC,CAAC,IAED,IAAI,EACR,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,MAAM,EAAE,GAAG,EAAE,CAAC,oBAAC,gBAAgB,IAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,aAAa,GAAG;CAC3E,CAAA"}
@@ -1,14 +0,0 @@
1
- export declare const MultiSelectWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
- export interface DropdownProps {
3
- dropDownTop?: boolean;
4
- dropDownWidth?: string;
5
- dropDownMaxHeight?: string;
6
- }
7
- export declare const Dropdown: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DropdownProps>> & string;
8
- export declare const DropdownWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
9
- export interface OptionButtonProps {
10
- selected: boolean;
11
- }
12
- export declare const OptionButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, OptionButtonProps>> & string;
13
- export declare const OptionText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
14
- //# sourceMappingURL=styles.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,6NAU9B,CAAA;AACD,MAAM,WAAW,aAAa;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAED,eAAO,MAAM,QAAQ,kPAgBpB,CAAA;AAED,eAAO,MAAM,eAAe,6NAG3B,CAAA;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,YAAY,kQA2BxB,CAAA;AAED,eAAO,MAAM,UAAU,6NAEtB,CAAA"}
@@ -1,66 +0,0 @@
1
- import styled from 'styled-components';
2
- import { theme } from '../Themes';
3
- export const MultiSelectWrapper = styled.div `
4
- display: flex;
5
- flex-direction: column;
6
- position: relative;
7
- .icon {
8
- transition: transform 0.3s;
9
- }
10
- .icon-rotate {
11
- transform: rotate(180deg) translateY(5px);
12
- }
13
- `;
14
- export const Dropdown = styled.div `
15
- position: absolute;
16
-
17
- z-index: ${theme.zIndex.z9};
18
-
19
- background-color: ${theme.colors.white};
20
- width: ${({ dropDownWidth }) => (dropDownWidth ? dropDownWidth : '100%')};
21
- ${({ dropDownTop }) => (dropDownTop ? 'bottom: 58px;' : 'margin-top: 4px;')};
22
- padding: 16px;
23
-
24
- border-radius: 4px;
25
- border: 1px solid ${theme.colors.shade20};
26
- box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.05);
27
- height: auto;
28
- max-height: ${({ dropDownMaxHeight }) => (dropDownMaxHeight ? dropDownMaxHeight : '300px')};
29
- overflow-y: auto;
30
- `;
31
- export const DropdownWrapper = styled.div `
32
- position: relative;
33
- z-index: ${theme.zIndex.z9};
34
- `;
35
- export const OptionButton = styled.button `
36
- display: flex;
37
-
38
- align-items: center;
39
- justify-content: space-between;
40
- gap: 0.5rem;
41
- color: ${({ selected }) => (selected ? theme.colors.cyan30 : theme.colors.shade40)};
42
- background-color: transparent;
43
- border: none;
44
-
45
- cursor: pointer;
46
-
47
- font-family: 'Nunito Sans', sans-serif;
48
- font-size: ${theme.paragraph.medium};
49
- text-align: left;
50
-
51
- height: 46px;
52
- width: 100%;
53
- padding: 0;
54
-
55
- &:not(:last-child) {
56
- border-bottom: 1px solid ${theme.colors.shade10};
57
- }
58
-
59
- &:hover {
60
- color: ${theme.colors.cyan30};
61
- }
62
- `;
63
- export const OptionText = styled.div `
64
- flex-grow: 1;
65
- `;
66
- //# sourceMappingURL=styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/MultiSelect/styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;CAU3C,CAAA;AAOD,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAe;;;aAGpC,KAAK,CAAC,MAAM,CAAC,EAAE;;sBAEN,KAAK,CAAC,MAAM,CAAC,KAAK;WAC7B,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC;IACtE,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,CAAC;;;;sBAIvD,KAAK,CAAC,MAAM,CAAC,OAAO;;;gBAG1B,CAAC,EAAE,iBAAiB,EAAE,EAAE,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC;;CAE3F,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;aAE5B,KAAK,CAAC,MAAM,CAAC,EAAE;CAC3B,CAAA;AAMD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAmB;;;;;;WAMjD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;;;;;;;eAOrE,KAAK,CAAC,SAAS,CAAC,MAAM;;;;;;;;+BAQN,KAAK,CAAC,MAAM,CAAC,OAAO;;;;aAItC,KAAK,CAAC,MAAM,CAAC,MAAM;;CAE/B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEnC,CAAA"}
@@ -1,63 +0,0 @@
1
- import React from 'react';
2
- import { Container } from './styles';
3
- import { IconWrapper } from '../IconWrapper';
4
- import { chevronLeftSVG, chevronRightSVG } from '../../assets/icon';
5
- import { Select } from '../Select';
6
- export const Paginate = ({ currentPage, itemCount, onChangePage, itemsPerPage, onChangeItemsPerPage, itemPerPageOptions = [], dropDownTop, }) => {
7
- // Se itemsPerPage for undefined, o valor default e 20
8
- let itemsPerPageValue = itemsPerPage || 20;
9
- const pageCount = Math.ceil(itemCount / itemsPerPageValue);
10
- const pages = [];
11
- // o interval indica quantas paginas mostrar antes e depois da pagina atual
12
- const interval = 2;
13
- // Adiciona a primeira pagina
14
- if (pageCount > 0 && currentPage - interval > 1) {
15
- pages.push(1);
16
- }
17
- // Adiciona as paginas entre a primeira e a ultima do intervalo
18
- const start = Math.max(currentPage - interval, 1);
19
- const end = Math.min(currentPage + interval, pageCount);
20
- if (start > 2) {
21
- pages.push('elipsis');
22
- }
23
- for (let i = start; i <= end; i++) {
24
- pages.push(i);
25
- }
26
- if (end < pageCount - 1) {
27
- pages.push('elipsis');
28
- }
29
- if (pageCount > currentPage + interval) {
30
- pages.push(pageCount);
31
- }
32
- const minItem = (currentPage - 1) * itemsPerPageValue + 1;
33
- const maxItem = Math.min(currentPage * itemsPerPageValue, itemCount);
34
- const itemPerPageOptionsCopy = Array.from(itemPerPageOptions);
35
- if (itemsPerPage)
36
- itemPerPageOptionsCopy.push(itemsPerPage);
37
- const itemPerPageOptionsSorted = Array.from(new Set(itemPerPageOptionsCopy)).sort((a, b) => a - b);
38
- return (React.createElement(Container, null,
39
- React.createElement("ul", { className: "pagination" },
40
- React.createElement(IconWrapper, { className: currentPage === 1 ? 'icon-disabled' : 'icon', src: chevronLeftSVG, width: "14px", onClick: () => currentPage !== 1 && onChangePage(currentPage - 1) }),
41
- pages.map((page, index) => {
42
- if (page === 'elipsis') {
43
- return React.createElement("li", { key: `elipsis-${index}` }, "...");
44
- }
45
- return (React.createElement("li", { key: page, className: page === currentPage ? 'page-active' : 'page', onClick: () => onChangePage(page) }, page));
46
- }),
47
- React.createElement(IconWrapper, { className: currentPage === pageCount ? 'icon-disabled' : 'icon', src: chevronRightSVG, width: "14px", onClick: () => currentPage !== pageCount && onChangePage(currentPage + 1) })),
48
- React.createElement("div", { className: "items-per-page-wrapper" },
49
- React.createElement("div", { className: "item-per-page" }, "Itens por pa\u0301gina"),
50
- React.createElement(Select, { disableSearch: true, className: "select", dropDownTop: dropDownTop !== false, value: itemsPerPageValue.toString(), onOptionChange: option => {
51
- option && onChangeItemsPerPage(option.id);
52
- }, disabled: itemPerPageOptions.length <= 1, options: itemPerPageOptionsSorted.map(count => ({
53
- id: count,
54
- text: count === null || count === void 0 ? void 0 : count.toString(),
55
- })) }),
56
- React.createElement("div", { className: "items-per-page-selected" },
57
- minItem,
58
- " - ",
59
- maxItem,
60
- " de ",
61
- itemCount))));
62
- };
63
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Paginate/index.tsx"],"names":[],"mappings":"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"}
@@ -1,44 +0,0 @@
1
- import React, { useState } from 'react';
2
- import { action } from '@storybook/addon-actions';
3
- import { fn } from '@storybook/test';
4
- import { Paginate } from '.';
5
- const meta = {
6
- title: 'Components/Paginate',
7
- component: Paginate,
8
- tags: ['autodocs'],
9
- args: {
10
- currentPage: 1,
11
- itemCount: 100,
12
- itemsPerPage: 10,
13
- onChangePage: fn(),
14
- onChangeItemsPerPage: fn(),
15
- dropDownTop: true,
16
- },
17
- };
18
- export default meta;
19
- const NewPaginate = (args) => {
20
- const [currentPage, setCurrentPage] = useState(args.currentPage);
21
- const [itemsPerPage, setItemsPerPage] = useState(args.itemsPerPage);
22
- const handleChangePage = (page) => {
23
- setCurrentPage(page);
24
- action('changePage')(page);
25
- };
26
- const handleChangeItemsPerPage = (items) => {
27
- setItemsPerPage(items);
28
- action('changeItemsPerPage')(items);
29
- };
30
- return (React.createElement(React.Fragment, null,
31
- React.createElement("div", { style: { height: '500px', width: '100%' } }),
32
- React.createElement(Paginate, Object.assign({}, args, { currentPage: currentPage, itemCount: args.itemCount, itemsPerPage: itemsPerPage, onChangePage: handleChangePage, onChangeItemsPerPage: handleChangeItemsPerPage }))));
33
- };
34
- export const Default = {
35
- render: args => {
36
- return React.createElement(NewPaginate, Object.assign({}, args));
37
- },
38
- };
39
- export const Bottom = {
40
- render: args => {
41
- return React.createElement(NewPaginate, Object.assign({}, args, { itemPerPageOptions: [10, 50, 100] }));
42
- },
43
- };
44
- //# sourceMappingURL=stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"stories.js","sourceRoot":"","sources":["../../../src/components/Paginate/stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAA;AACjD,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAA;AACpC,OAAO,EAAE,QAAQ,EAAiB,MAAM,GAAG,CAAA;AAE3C,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,IAAI,EAAE;QACJ,WAAW,EAAE,CAAC;QACd,SAAS,EAAE,GAAG;QACd,YAAY,EAAE,EAAE;QAChB,YAAY,EAAE,EAAE,EAAE;QAClB,oBAAoB,EAAE,EAAE,EAAE;QAC1B,WAAW,EAAE,IAAI;KAClB;CAC4B,CAAA;AAE/B,eAAe,IAAI,CAAA;AAEnB,MAAM,WAAW,GAAG,CAAC,IAAmB,EAAE,EAAE;IAC1C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA;IAChE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;IAEnE,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,EAAE;QACxC,cAAc,CAAC,IAAI,CAAC,CAAA;QACpB,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,CAAA;IAC5B,CAAC,CAAA;IAED,MAAM,wBAAwB,GAAG,CAAC,KAAa,EAAE,EAAE;QACjD,eAAe,CAAC,KAAK,CAAC,CAAA;QACtB,MAAM,CAAC,oBAAoB,CAAC,CAAC,KAAK,CAAC,CAAA;IACrC,CAAC,CAAA;IACD,OAAO,CACL;QACE,6BAAK,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,GAAQ;QACtD,oBAAC,QAAQ,oBACH,IAAI,IACR,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,gBAAgB,EAC9B,oBAAoB,EAAE,wBAAwB,IAC9C,CACD,CACJ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAA4B;IAC9C,MAAM,EAAE,IAAI,CAAC,EAAE;QACb,OAAO,oBAAC,WAAW,oBAAK,IAAI,EAAI,CAAA;IAClC,CAAC;CACF,CAAA;AAED,MAAM,CAAC,MAAM,MAAM,GAA4B;IAC7C,MAAM,EAAE,IAAI,CAAC,EAAE;QACb,OAAO,oBAAC,WAAW,oBAAK,IAAI,IAAE,kBAAkB,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,IAAI,CAAA;IACrE,CAAC;CACF,CAAA"}