@ttoss/components 2.10.1 → 2.10.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 (42) hide show
  1. package/package.json +12 -12
  2. package/dist/Accordion/index.d.ts +0 -16
  3. package/dist/DatePicker/index.d.ts +0 -19
  4. package/dist/Drawer/index.d.ts +0 -12
  5. package/dist/FileUploader/index.d.ts +0 -55
  6. package/dist/InstallPwa/index.d.ts +0 -10
  7. package/dist/JsonEditor/index.d.ts +0 -2
  8. package/dist/JsonView/index.d.ts +0 -1
  9. package/dist/List/index.d.ts +0 -13
  10. package/dist/Markdown/index.d.ts +0 -11
  11. package/dist/Menu/index.d.ts +0 -11
  12. package/dist/Modal/index.d.ts +0 -10
  13. package/dist/NavList/index.d.ts +0 -55
  14. package/dist/NotificationCard/index.d.ts +0 -21
  15. package/dist/NotificationsMenu/index.d.ts +0 -21
  16. package/dist/Search/index.d.ts +0 -11
  17. package/dist/SpotlightCard/index.d.ts +0 -27
  18. package/dist/Table/index.d.ts +0 -16
  19. package/dist/Tabs/index.d.ts +0 -18
  20. package/dist/Toast/index.d.ts +0 -8
  21. package/dist/esm/Accordion/index.js +0 -49
  22. package/dist/esm/DatePicker/index.js +0 -2476
  23. package/dist/esm/Drawer/index.js +0 -59
  24. package/dist/esm/FileUploader/index.js +0 -401
  25. package/dist/esm/InstallPwa/index.js +0 -61
  26. package/dist/esm/JsonEditor/index.js +0 -6
  27. package/dist/esm/JsonView/index.js +0 -6
  28. package/dist/esm/List/index.js +0 -30
  29. package/dist/esm/Markdown/index.js +0 -23
  30. package/dist/esm/Menu/index.js +0 -131
  31. package/dist/esm/Modal/index.js +0 -65
  32. package/dist/esm/NavList/index.js +0 -246
  33. package/dist/esm/NotificationCard/index.js +0 -5
  34. package/dist/esm/NotificationsMenu/index.js +0 -205
  35. package/dist/esm/Search/index.js +0 -29
  36. package/dist/esm/SpotlightCard/index.js +0 -212
  37. package/dist/esm/Table/index.js +0 -63
  38. package/dist/esm/Tabs/index.js +0 -75
  39. package/dist/esm/Toast/index.js +0 -38
  40. package/dist/esm/chunk-2R7AUPJL.js +0 -2176
  41. package/dist/esm/chunk-4GBVRL7E.js +0 -156
  42. package/dist/esm/chunk-V4MHYKRI.js +0 -7
@@ -1,59 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { __name } from "../chunk-V4MHYKRI.js";
3
-
4
- // src/components/Drawer/Drawer.tsx
5
- import { Box } from "@ttoss/ui";
6
- import * as React from "react";
7
- import DrawerUi from "react-modern-drawer";
8
- var Drawer = /* @__PURE__ */__name(({
9
- children,
10
- sx,
11
- ...props
12
- }) => {
13
- return /* @__PURE__ */React.createElement(Box, {
14
- "data-testid": "drawer-container",
15
- sx: {
16
- /**
17
- * https://github.com/Farzin-Firoozi/react-modern-drawer/blob/master/src/styles.css
18
- */
19
- zIndex: "overlay",
20
- width: "100%",
21
- height: "100%",
22
- ".EZDrawer__checkbox": {
23
- display: "none"
24
- },
25
- ".EZDrawer__checkbox:checked ~ .EZDrawer__overlay": {
26
- display: "block",
27
- opacity: 1
28
- },
29
- ".EZDrawer__checkbox:checked ~ .EZDrawer__container": {
30
- visibility: "visible",
31
- transform: "translate3d(0, 0, 0) !important"
32
- },
33
- ".EZDrawer__overlay ": {
34
- display: "none",
35
- height: "100vh",
36
- left: "0",
37
- position: "fixed",
38
- top: "0",
39
- width: "100%"
40
- },
41
- ".EZDrawer__container": {
42
- position: "fixed",
43
- visibility: "hidden",
44
- backgroundColor: "navigation.background.muted.default",
45
- transition: "all",
46
- boxShadow: "0 0 10px 5px rgba(0, 0, 0, 0.1)",
47
- paddingX: "6",
48
- overflowY: "auto"
49
- },
50
- ...sx
51
- }
52
- }, /* @__PURE__ */React.createElement(DrawerUi, props, /* @__PURE__ */React.createElement(Box, {
53
- sx: {
54
- width: "100%",
55
- height: "100%"
56
- }
57
- }, children)));
58
- }, "Drawer");
59
- export { Drawer };
@@ -1,401 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { __name } from "../chunk-V4MHYKRI.js";
3
-
4
- // src/components/FileUploader/FileUploader.tsx
5
- import { useI18n } from "@ttoss/react-i18n";
6
- import { Box, Button, Flex, Stack, Text } from "@ttoss/ui";
7
- import * as React from "react";
8
- var FileUploader = /* @__PURE__ */__name(({
9
- onUpload,
10
- onUploadStart,
11
- onUploadProgress,
12
- onUploadComplete,
13
- onUploadError,
14
- onFilesChange,
15
- onRemove,
16
- accept,
17
- multiple = true,
18
- maxSize = 10 * 1024 * 1024,
19
- maxFiles = 5,
20
- disabled = false,
21
- autoUpload = true,
22
- retryAttempts = 2,
23
- placeholder,
24
- error,
25
- children,
26
- showFileList = true,
27
- FileListComponent,
28
- files: uploadedFiles = []
29
- }) => {
30
- const {
31
- intl
32
- } = useI18n();
33
- const [files, setFiles] = React.useState([]);
34
- const [isDragOver, setIsDragOver] = React.useState(false);
35
- const fileInputRef = React.useRef(null);
36
- const formatFileSize = /* @__PURE__ */__name(bytes => {
37
- if (bytes === 0) return "0 Bytes";
38
- const k = 1024;
39
- const sizes = ["Bytes", "KB", "MB", "GB"];
40
- const i = Math.floor(Math.log(bytes) / Math.log(k));
41
- return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
42
- }, "formatFileSize");
43
- const validateFiles = /* @__PURE__ */__name(newFiles => {
44
- const fileArray = Array.from(newFiles);
45
- const validFiles = [];
46
- const currentFileCount = files.length;
47
- if (currentFileCount >= maxFiles) {
48
- return [];
49
- }
50
- for (const file of fileArray) {
51
- if (maxSize && file.size > maxSize) {
52
- continue;
53
- }
54
- if (validFiles.length + currentFileCount >= maxFiles) {
55
- break;
56
- }
57
- validFiles.push(file);
58
- }
59
- return validFiles;
60
- }, "validateFiles");
61
- const updateFileState = React.useCallback((file, updates) => {
62
- setFiles(prevFiles => {
63
- const newFiles = prevFiles.map(f => {
64
- return f.file === file ? {
65
- ...f,
66
- ...updates
67
- } : f;
68
- });
69
- onFilesChange?.(newFiles);
70
- return newFiles;
71
- });
72
- }, [onFilesChange]);
73
- const uploadFile = React.useCallback(async (fileState, attempts = 0) => {
74
- try {
75
- onUploadStart?.(fileState.file);
76
- updateFileState(fileState.file, {
77
- status: "uploading",
78
- progress: 0
79
- });
80
- const result = await onUpload(fileState.file, progress => {
81
- updateFileState(fileState.file, {
82
- progress
83
- });
84
- onUploadProgress?.(fileState.file, progress);
85
- });
86
- updateFileState(fileState.file, {
87
- status: "completed",
88
- progress: 100,
89
- result
90
- });
91
- onUploadComplete?.(fileState.file, result);
92
- } catch (error_) {
93
- const error2 = error_;
94
- if (attempts < retryAttempts) {
95
- setTimeout(() => {
96
- return uploadFile(fileState, attempts + 1);
97
- }, 1e3 * (attempts + 1));
98
- } else {
99
- updateFileState(fileState.file, {
100
- status: "error",
101
- error: error2
102
- });
103
- onUploadError?.(fileState.file, error2);
104
- }
105
- }
106
- }, [onUpload, onUploadStart, onUploadProgress, onUploadComplete, onUploadError, retryAttempts, updateFileState]);
107
- const addFiles = /* @__PURE__ */__name(newFiles => {
108
- const newFileStates = newFiles.map(file => {
109
- return {
110
- file,
111
- status: "pending"
112
- };
113
- });
114
- setFiles(prevFiles => {
115
- const updatedFiles = [...prevFiles, ...newFileStates];
116
- onFilesChange?.(updatedFiles);
117
- return updatedFiles;
118
- });
119
- if (autoUpload) {
120
- for (const fileState of newFileStates) {
121
- uploadFile(fileState);
122
- }
123
- }
124
- }, "addFiles");
125
- const handleFileChange = /* @__PURE__ */__name(event => {
126
- if (event.target.files) {
127
- const validFiles = validateFiles(event.target.files);
128
- addFiles(validFiles);
129
- }
130
- }, "handleFileChange");
131
- const handleDrop = /* @__PURE__ */__name(event => {
132
- event.preventDefault();
133
- setIsDragOver(false);
134
- if (disabled || files.length >= maxFiles) return;
135
- const droppedFiles = event.dataTransfer.files;
136
- if (droppedFiles) {
137
- const validFiles = validateFiles(droppedFiles);
138
- addFiles(validFiles);
139
- }
140
- }, "handleDrop");
141
- const handleDragOver = /* @__PURE__ */__name(event => {
142
- event.preventDefault();
143
- if (!disabled && files.length < maxFiles) {
144
- setIsDragOver(true);
145
- }
146
- }, "handleDragOver");
147
- const handleDragLeave = /* @__PURE__ */__name(event => {
148
- event.preventDefault();
149
- setIsDragOver(false);
150
- }, "handleDragLeave");
151
- const handleClick = /* @__PURE__ */__name(() => {
152
- if (!disabled && files.length < maxFiles && fileInputRef.current) {
153
- fileInputRef.current.click();
154
- }
155
- }, "handleClick");
156
- const handleRemoveFile = React.useCallback(index => {
157
- const fileToRemove = uploadedFiles[index];
158
- onRemove?.(fileToRemove, index);
159
- }, [uploadedFiles, onRemove]);
160
- const isUploading = files.some(f => {
161
- return f.status === "uploading";
162
- });
163
- const isMaxFilesReached = files.length >= maxFiles;
164
- const fileListNode = React.useMemo(() => {
165
- if (!showFileList || files.length === 0 && uploadedFiles.length === 0) {
166
- return null;
167
- }
168
- if (FileListComponent) {
169
- return /* @__PURE__ */React.createElement(FileListComponent, {
170
- files: uploadedFiles,
171
- onRemove: handleRemoveFile
172
- });
173
- }
174
- return /* @__PURE__ */React.createElement(Stack, {
175
- sx: {
176
- gap: 1,
177
- width: "100%"
178
- }
179
- }, uploadedFiles.map((file, index) => {
180
- return /* @__PURE__ */React.createElement(Flex, {
181
- key: file.id,
182
- sx: {
183
- width: "full",
184
- alignItems: "center",
185
- justifyContent: "space-between",
186
- p: 2,
187
- backgroundColor: "display.background.secondary.default",
188
- borderRadius: "md",
189
- gap: 2
190
- }
191
- }, /* @__PURE__ */React.createElement(Flex, {
192
- sx: {
193
- alignItems: "center",
194
- gap: 2,
195
- flex: 1
196
- }
197
- }, file.imageUrl && /* @__PURE__ */React.createElement(Box, {
198
- sx: {
199
- width: 32,
200
- height: 32
201
- }
202
- }, /* @__PURE__ */React.createElement("img", {
203
- src: file.imageUrl,
204
- alt: file.name,
205
- style: {
206
- width: "100%",
207
- height: "100%",
208
- objectFit: "cover",
209
- borderRadius: 4
210
- }
211
- })), /* @__PURE__ */React.createElement(Box, {
212
- sx: {
213
- flex: 1
214
- }
215
- }, /* @__PURE__ */React.createElement("a", {
216
- href: file.url,
217
- target: "_blank",
218
- rel: "noopener noreferrer",
219
- style: {
220
- textDecoration: "none",
221
- color: "inherit"
222
- }
223
- }, /* @__PURE__ */React.createElement(Text, {
224
- variant: "body",
225
- sx: {
226
- fontWeight: "medium",
227
- "&:hover": {
228
- textDecoration: "underline",
229
- color: "primary.default"
230
- }
231
- }
232
- }, file.name)))), /* @__PURE__ */React.createElement(Button, {
233
- variant: "destructive",
234
- onClick: /* @__PURE__ */__name(() => {
235
- return handleRemoveFile(index);
236
- }, "onClick"),
237
- sx: {
238
- fontSize: "sm",
239
- color: "text.muted",
240
- "&:hover": {
241
- color: "error.default"
242
- }
243
- }
244
- }, intl.formatMessage({
245
- id: "G/yZLu",
246
- defaultMessage: [{
247
- "type": 0,
248
- "value": "Remove"
249
- }]
250
- })));
251
- }));
252
- }, [files.length, uploadedFiles, handleRemoveFile, intl, showFileList, FileListComponent]);
253
- const placeholderTexts = React.useMemo(() => {
254
- const texts = [];
255
- if (isUploading) {
256
- texts.push(intl.formatMessage({
257
- id: "JEsxDw",
258
- defaultMessage: [{
259
- "type": 0,
260
- "value": "Uploading..."
261
- }]
262
- }));
263
- } else if (isMaxFilesReached) {
264
- texts.push(intl.formatMessage({
265
- id: "eRShvB",
266
- defaultMessage: [{
267
- "type": 0,
268
- "value": "Maximum files reached"
269
- }]
270
- }));
271
- } else {
272
- texts.push(placeholder || intl.formatMessage({
273
- id: "gy0Ynb",
274
- defaultMessage: [{
275
- "type": 0,
276
- "value": "Click or drag files here"
277
- }]
278
- }));
279
- }
280
- if (!isUploading && !isMaxFilesReached) {
281
- if (accept) texts.push(accept);
282
- if (maxSize) texts.push(`Max ${formatFileSize(maxSize)}`);
283
- if (multiple && maxFiles) texts.push(intl.formatMessage({
284
- id: "fOOwej",
285
- defaultMessage: [{
286
- "type": 6,
287
- "value": "max_files",
288
- "options": {
289
- "one": {
290
- "value": [{
291
- "type": 0,
292
- "value": "Up to "
293
- }, {
294
- "type": 7
295
- }, {
296
- "type": 0,
297
- "value": " file"
298
- }]
299
- },
300
- "other": {
301
- "value": [{
302
- "type": 0,
303
- "value": "Up to "
304
- }, {
305
- "type": 7
306
- }, {
307
- "type": 0,
308
- "value": " files"
309
- }]
310
- }
311
- },
312
- "offset": 0,
313
- "pluralType": "cardinal"
314
- }]
315
- }, {
316
- max_files: maxFiles
317
- }));
318
- }
319
- return texts.filter(Boolean).join(" \u2022 ");
320
- }, [isUploading, isMaxFilesReached, intl, placeholder, accept, maxSize, multiple, maxFiles]);
321
- return /* @__PURE__ */React.createElement(Stack, {
322
- sx: {
323
- gap: 3,
324
- justifyContent: "stretch",
325
- width: "100%"
326
- }
327
- }, /* @__PURE__ */React.createElement(Box, {
328
- onDrop: handleDrop,
329
- onDragOver: handleDragOver,
330
- onDragLeave: handleDragLeave,
331
- onClick: handleClick,
332
- sx: {
333
- width: "100%",
334
- border: "2px dashed",
335
- borderColor: error ? "error.default" : isDragOver ? "primary.default" : "display.border.muted.default",
336
- borderRadius: "xl",
337
- padding: 6,
338
- textAlign: "center",
339
- cursor: disabled || isUploading || isMaxFilesReached ? "not-allowed" : "pointer",
340
- backgroundColor: isDragOver ? "primary.muted" : "display.background.secondary.default",
341
- transition: "all 0.2s ease",
342
- opacity: disabled || isMaxFilesReached ? 0.6 : 1,
343
- "&:hover": {
344
- borderColor: !disabled && !isUploading && !error && !isMaxFilesReached ? "primary.default" : void 0,
345
- backgroundColor: !disabled && !isUploading && !isMaxFilesReached ? "primary.muted" : void 0
346
- }
347
- }
348
- }, /* @__PURE__ */React.createElement("input", {
349
- ref: fileInputRef,
350
- type: "file",
351
- accept,
352
- multiple,
353
- onChange: handleFileChange,
354
- disabled: disabled || isUploading || isMaxFilesReached,
355
- style: {
356
- display: "none"
357
- }
358
- }), children || /* @__PURE__ */React.createElement(Flex, {
359
- sx: {
360
- flexDirection: "column",
361
- alignItems: "center",
362
- gap: 3,
363
- justifyContent: "center"
364
- }
365
- }, /* @__PURE__ */React.createElement(Text, {
366
- sx: {
367
- fontSize: "2xl"
368
- }
369
- }, intl.formatMessage({
370
- id: "XKyo5X",
371
- defaultMessage: [{
372
- "type": 0,
373
- "value": "File Upload"
374
- }]
375
- })), /* @__PURE__ */React.createElement(Box, {
376
- sx: {
377
- textAlign: "center"
378
- }
379
- }, /* @__PURE__ */React.createElement(Text, {
380
- variant: "body",
381
- sx: {
382
- color: "text.default",
383
- mb: 1
384
- }
385
- }, placeholderTexts)), !isUploading && !isMaxFilesReached && /* @__PURE__ */React.createElement(Button, {
386
- variant: "secondary",
387
- disabled
388
- }, intl.formatMessage({
389
- id: "fDCMA6",
390
- defaultMessage: [{
391
- "type": 0,
392
- "value": "Select Files"
393
- }]
394
- })))), error && /* @__PURE__ */React.createElement(Text, {
395
- variant: "caption",
396
- sx: {
397
- color: "error.default"
398
- }
399
- }, error), fileListNode);
400
- }, "FileUploader");
401
- export { FileUploader };
@@ -1,61 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import { __name } from "../chunk-V4MHYKRI.js";
3
-
4
- // src/components/InstallPwa/InstallPwa.tsx
5
- import * as React from "react";
6
- import { Button, Flex, Text } from "@ttoss/ui";
7
- var InstallPwaUi = /* @__PURE__ */__name(({
8
- onInstall
9
- }) => {
10
- return /* @__PURE__ */React.createElement(Flex, {
11
- sx: {
12
- position: "absolute",
13
- bottom: 4,
14
- width: "100%",
15
- justifyContent: "center"
16
- }
17
- }, /* @__PURE__ */React.createElement(Flex, {
18
- sx: {
19
- backgroundColor: "background",
20
- justifyContent: "center",
21
- alignItems: "center",
22
- gap: 3,
23
- width: "auto",
24
- border: "1px solid",
25
- borderColor: "muted",
26
- borderRadius: 1,
27
- padding: 4
28
- }
29
- }, /* @__PURE__ */React.createElement(Text, null, "Deseja instalar o nosso aplicativo?"), /* @__PURE__ */React.createElement(Button, {
30
- onClick: onInstall
31
- }, "Instalar")));
32
- }, "InstallPwaUi");
33
- var InstallPwa = /* @__PURE__ */__name(() => {
34
- const [supportsPwa, setSupportsPwa] = React.useState(false);
35
- const [promptInstall, setPromptInstall] = React.useState(null);
36
- React.useEffect(() => {
37
- const handler = /* @__PURE__ */__name(e => {
38
- e.preventDefault();
39
- setSupportsPwa(true);
40
- setPromptInstall(e);
41
- }, "handler");
42
- window.addEventListener("beforeinstallprompt", handler);
43
- return () => {
44
- return window.removeEventListener("transitionend", handler);
45
- };
46
- }, []);
47
- const onInstall = /* @__PURE__ */__name(e => {
48
- e.preventDefault();
49
- if (!promptInstall) {
50
- return;
51
- }
52
- promptInstall.prompt();
53
- }, "onInstall");
54
- if (!supportsPwa) {
55
- return null;
56
- }
57
- return /* @__PURE__ */React.createElement(InstallPwaUi, {
58
- onInstall
59
- });
60
- }, "InstallPwa");
61
- export { InstallPwa, InstallPwaUi };
@@ -1,6 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import "../chunk-V4MHYKRI.js";
3
-
4
- // src/components/JsonEditor/index.ts
5
- import { JsonEditor } from "json-edit-react";
6
- export { JsonEditor };
@@ -1,6 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import "../chunk-V4MHYKRI.js";
3
-
4
- // src/components/JsonView/index.ts
5
- import { JsonView } from "react-json-view-lite";
6
- export { JsonView };
@@ -1,30 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import "../chunk-V4MHYKRI.js";
3
-
4
- // src/components/List/List.tsx
5
- import * as React from "react";
6
- var List = /* @__PURE__ */React.forwardRef(({
7
- children,
8
- ...props
9
- }, ref) => {
10
- return /* @__PURE__ */React.createElement("ul", {
11
- ...props,
12
- ref
13
- }, children);
14
- });
15
- List.displayName = "List";
16
-
17
- // src/components/List/ListItem.tsx
18
- import * as React2 from "react";
19
- var ListItem = /* @__PURE__ */React2.forwardRef((props, ref) => {
20
- const {
21
- children,
22
- ...rest
23
- } = props;
24
- return /* @__PURE__ */React2.createElement("li", {
25
- ...rest,
26
- ref
27
- }, children);
28
- });
29
- ListItem.displayName = "ListItem";
30
- export { List, ListItem };
@@ -1,23 +0,0 @@
1
- /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
- import * as React from 'react';
3
- import { __name } from "../chunk-V4MHYKRI.js";
4
-
5
- // src/components/Markdown/Markdown.tsx
6
- import { BaseStyles } from "@ttoss/ui";
7
- import ReactMarkdown from "react-markdown";
8
- import rehypeRaw from "rehype-raw";
9
- import remarkGfm from "remark-gfm";
10
- var Markdown = /* @__PURE__ */__name(({
11
- children,
12
- sx,
13
- ...props
14
- }) => {
15
- return /* @__PURE__ */React.createElement(BaseStyles, {
16
- sx
17
- }, /* @__PURE__ */React.createElement(ReactMarkdown, {
18
- rehypePlugins: [rehypeRaw],
19
- remarkPlugins: [remarkGfm],
20
- ...props
21
- }, children));
22
- }, "Markdown");
23
- export { Markdown };