lecom-ui 5.2.70 → 5.2.72

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 (82) hide show
  1. package/dist/components/Combobox/Combobox.js +5 -19
  2. package/dist/components/CustomDivider/CustomDivider.js +18 -36
  3. package/dist/components/DataTable/DataTable.utils.js +1 -5
  4. package/dist/components/DataTable/Table.js +40 -60
  5. package/dist/components/Sheet/Sheet.js +1 -31
  6. package/dist/components/Steps/{StepsTimeline.js → Steps.js} +1 -0
  7. package/dist/components/Switch/Switch.js +20 -5
  8. package/dist/components/TagInput/TagInput.js +55 -58
  9. package/dist/index.d.ts +47 -93
  10. package/dist/index.js +2 -4
  11. package/dist/style.min.css +1 -1
  12. package/package.json +4 -3
  13. package/dist/badge.js +0 -26
  14. package/dist/button-dropdown.js +0 -117
  15. package/dist/button.js +0 -104
  16. package/dist/calendar.js +0 -62
  17. package/dist/card.js +0 -56
  18. package/dist/checkbox.js +0 -55
  19. package/dist/collapse.js +0 -60
  20. package/dist/collapsible.js +0 -7
  21. package/dist/command.js +0 -107
  22. package/dist/components/Collapse/Collapse.js +0 -94
  23. package/dist/components/DataTable/useOptimizedTable.js +0 -75
  24. package/dist/data-table/data-table.js +0 -490
  25. package/dist/date-picker.js +0 -92
  26. package/dist/dialog.js +0 -95
  27. package/dist/dropdown-menu.js +0 -138
  28. package/dist/fonts/Montserrat-Bold.otf +0 -0
  29. package/dist/fonts/Montserrat-Medium.otf +0 -0
  30. package/dist/fonts/Montserrat-Regular.otf +0 -0
  31. package/dist/fonts/Roboto-Bold.otf +0 -0
  32. package/dist/fonts/Roboto-Light.otf +0 -0
  33. package/dist/fonts/Roboto-Medium.otf +0 -0
  34. package/dist/fonts/Roboto-Regular.otf +0 -0
  35. package/dist/form.js +0 -102
  36. package/dist/header.js +0 -90
  37. package/dist/hook/useDebounce.js +0 -16
  38. package/dist/icon-handler.js +0 -72
  39. package/dist/icons/brandModules.js +0 -27
  40. package/dist/icons/companyLogo.js +0 -61
  41. package/dist/icons/createUseAuxiliary.js +0 -107
  42. package/dist/icons/footerInfo.js +0 -25
  43. package/dist/icons/logo_lecom.svg.js +0 -3
  44. package/dist/icons/newUpdate.js +0 -23
  45. package/dist/icons/robertyRPA.js +0 -30
  46. package/dist/ilustrations/access_denied.js +0 -252
  47. package/dist/ilustrations/page_not_found.js +0 -188
  48. package/dist/input.js +0 -42
  49. package/dist/label.js +0 -20
  50. package/dist/modal.js +0 -27
  51. package/dist/pagination.js +0 -474
  52. package/dist/plugin/extend.ts +0 -78
  53. package/dist/plugin/fontFaces.ts +0 -172
  54. package/dist/plugin/general.ts +0 -12
  55. package/dist/plugin/pluginDev.js +0 -5
  56. package/dist/plugin/pluginNext.js +0 -5
  57. package/dist/plugin/pluginVite.js +0 -5
  58. package/dist/plugin/template.ts +0 -31
  59. package/dist/plugin/typographies.ts +0 -152
  60. package/dist/plugin/varsTheme.ts +0 -79
  61. package/dist/plugin.cjs +0 -298
  62. package/dist/popover.js +0 -24
  63. package/dist/radio-group.js +0 -74
  64. package/dist/range-picker.js +0 -99
  65. package/dist/scroll-area.js +0 -37
  66. package/dist/search-bar.js +0 -151
  67. package/dist/select.js +0 -156
  68. package/dist/separator.js +0 -24
  69. package/dist/sheet.js +0 -106
  70. package/dist/sidebar.js +0 -188
  71. package/dist/skeleton.js +0 -17
  72. package/dist/slider.js +0 -23
  73. package/dist/status-screen.js +0 -71
  74. package/dist/switch.js +0 -27
  75. package/dist/table.js +0 -83
  76. package/dist/tabs.js +0 -44
  77. package/dist/tag.js +0 -33
  78. package/dist/textarea.js +0 -22
  79. package/dist/toast.js +0 -105
  80. package/dist/toaster.js +0 -23
  81. package/dist/tooltip.js +0 -133
  82. package/dist/use-toast.js +0 -121
@@ -1,490 +0,0 @@
1
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
- import { useState, useRef, useEffect } from 'react';
3
- import { useReactTable, getCoreRowModel, getSortedRowModel, getFilteredRowModel, getPaginationRowModel, flexRender } from '@tanstack/react-table';
4
- import { ArrowUpDownIcon, TriangleAlertIcon, ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';
5
- import { cn } from '../lib/utils.js';
6
- import { Button } from '../button.js';
7
- import { Skeleton } from '../skeleton.js';
8
- import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from '../table.js';
9
-
10
- const SelectByType = {
11
- SELECT_ALL: "all",
12
- SELECT_NONE: "none"
13
- };
14
- const DataTable = ({
15
- columns,
16
- dataSource,
17
- isLoading = false,
18
- renderEmptyContent,
19
- searchValue = "",
20
- searchableColumns = [],
21
- hiddenColumns = [],
22
- pagination = {
23
- controlExternal: false,
24
- currentPage: 0,
25
- pageSize: 10,
26
- totalPages: 0,
27
- totalItems: 0,
28
- position: "topRight",
29
- textOf: ""
30
- },
31
- rowSelection,
32
- showHeaderDivider,
33
- className,
34
- classNameTable,
35
- classNameHeader,
36
- classNameBody
37
- }) => {
38
- const [sorting, setSorting] = useState([]);
39
- const [columnFilters, setColumnFilters] = useState([]);
40
- const [columnVisibility, setColumnVisibility] = useState({});
41
- const [internalRowSelection, setInternalRowSelection] = useState({});
42
- const [search, setSearch] = useState(searchValue);
43
- const [columnPinning, setColumnPinning] = useState({
44
- left: [],
45
- right: []
46
- });
47
- const [page, setPage] = useState(pagination.currentPage ?? 0);
48
- const [pageSearch, setPageSearch] = useState(0);
49
- const [size, setSize] = useState(pagination.pageSize ?? 10);
50
- const selectedRowsRef = useRef([]);
51
- const tableRef = useRef(null);
52
- const table = useReactTable({
53
- data: dataSource,
54
- columns,
55
- getCoreRowModel: getCoreRowModel(),
56
- onSortingChange: setSorting,
57
- getSortedRowModel: getSortedRowModel(),
58
- onColumnFiltersChange: setColumnFilters,
59
- getFilteredRowModel: getFilteredRowModel(),
60
- onColumnVisibilityChange: setColumnVisibility,
61
- onColumnPinningChange: setColumnPinning,
62
- onRowSelectionChange: setInternalRowSelection,
63
- getPaginationRowModel: getPaginationRowModel(),
64
- state: {
65
- sorting,
66
- columnPinning,
67
- columnFilters,
68
- columnVisibility,
69
- rowSelection: internalRowSelection,
70
- pagination: { pageIndex: page, pageSize: size }
71
- }
72
- });
73
- useEffect(() => {
74
- setSearch(searchValue);
75
- }, [searchValue]);
76
- useEffect(() => {
77
- if (!table || !Array.isArray(searchableColumns))
78
- return;
79
- if (search.trim() === "") {
80
- searchableColumns.forEach((columnId) => {
81
- const column = table.getColumn(columnId);
82
- if (column) {
83
- column.setFilterValue("");
84
- }
85
- });
86
- setPage(pageSearch);
87
- table.setPageIndex(pageSearch);
88
- } else {
89
- searchableColumns.forEach((columnId) => {
90
- const column = table.getColumn(columnId);
91
- if (column)
92
- column.setFilterValue(search.trim());
93
- });
94
- setPage(0);
95
- table.setPageIndex(0);
96
- }
97
- }, [search, searchableColumns, table]);
98
- const total = pagination.totalItems || table.getPageCount() * size;
99
- const handlePageChange = (newPage) => {
100
- setPage(newPage);
101
- setPageSearch(newPage);
102
- table.setPageIndex(newPage);
103
- };
104
- useEffect(() => {
105
- if (pagination.pageSize !== void 0) {
106
- setSize(pagination.pageSize);
107
- }
108
- }, [pagination.pageSize]);
109
- useEffect(() => {
110
- if (pagination.currentPage !== void 0 && pagination.currentPage <= (pagination.totalPages ?? 0)) {
111
- setPage(pagination.currentPage);
112
- }
113
- }, [pagination.currentPage, pagination.totalPages]);
114
- useEffect(() => {
115
- if (!rowSelection) {
116
- return;
117
- }
118
- if (rowSelection?.controlExternal) {
119
- if (rowSelection?.selectedRowKeys.length === 0) {
120
- if (dataSource.length === Object.keys(table.getState().rowSelection).length) {
121
- table.setRowSelection({});
122
- }
123
- return;
124
- }
125
- const validRowSelection = rowSelection.selectedRowKeys.reduce(
126
- (acc, id) => {
127
- const rowIndex = table.getCoreRowModel().rows.findIndex((row) => {
128
- const rowId = "id" in row.original ? String(row.original.id) : String(row.id);
129
- return rowId === id;
130
- });
131
- if (rowIndex !== -1) {
132
- acc[rowIndex] = true;
133
- }
134
- return acc;
135
- },
136
- {}
137
- );
138
- table.setRowSelection(validRowSelection);
139
- }
140
- }, [rowSelection?.controlExternal, rowSelection?.selectedRowKeys, table]);
141
- useEffect(() => {
142
- if (!rowSelection || rowSelection?.controlExternal) {
143
- return;
144
- }
145
- if (rowSelection?.selectBy?.columnId === SelectByType.SELECT_ALL) {
146
- const allRows = table.getRowModel().rows.map((row) => row.id);
147
- if (rowSelection && rowSelection.onChange)
148
- rowSelection.onChange(allRows);
149
- table.setRowSelection(
150
- allRows.reduce((acc, id) => ({ ...acc, [id]: true }), {})
151
- );
152
- } else if (rowSelection?.selectBy?.columnId === SelectByType.SELECT_NONE) {
153
- if (rowSelection && rowSelection.onChange)
154
- rowSelection.onChange([]);
155
- table.setRowSelection({});
156
- } else {
157
- const selectedRows = table.getRowModel().rows.reduce((acc, row) => {
158
- if (rowSelection?.selectBy && row.original[rowSelection?.selectBy.columnId] === rowSelection?.selectBy.value) {
159
- acc[row.id] = true;
160
- }
161
- return acc;
162
- }, {});
163
- table.setRowSelection(selectedRows);
164
- if (rowSelection && rowSelection.onChange)
165
- rowSelection.onChange(Object.keys(selectedRows));
166
- table.setRowSelection(selectedRows);
167
- }
168
- }, [rowSelection?.selectBy, table, rowSelection?.controlExternal]);
169
- useEffect(() => {
170
- if (!rowSelection) {
171
- return;
172
- }
173
- const currentSelection = Object.keys(table.getState().rowSelection).map(
174
- (id) => {
175
- const row = table.getRow(id);
176
- return "id" in row.original ? String(row.original.id) : String(row.id);
177
- }
178
- );
179
- const hasSelectionChanged = currentSelection.length !== selectedRowsRef.current.length || !currentSelection.every((id, idx) => id === selectedRowsRef.current[idx]);
180
- const currentRows = table.getRowModel().rows;
181
- const selectedRowsVisible = currentRows.some(
182
- (row) => currentSelection.includes(
183
- "id" in row.original ? String(row.original.id) : String(row.id)
184
- )
185
- );
186
- if (hasSelectionChanged) {
187
- selectedRowsRef.current = currentSelection;
188
- rowSelection?.onChange?.(currentSelection);
189
- }
190
- if (!selectedRowsVisible && currentSelection.length > 0 && (rowSelection?.selectedRowKeys?.length ?? 0) > 0) {
191
- selectedRowsRef.current = [];
192
- rowSelection?.onChange?.([]);
193
- } else if (selectedRowsVisible && currentSelection.length === 0 && selectedRowsRef.current.length > 0) {
194
- rowSelection?.onChange?.(selectedRowsRef.current);
195
- }
196
- }, [table.getState().rowSelection, page]);
197
- useEffect(() => {
198
- const visibility = {};
199
- columns.forEach((column) => {
200
- if ("accessorKey" in column) {
201
- visibility[column.accessorKey] = !hiddenColumns.includes(
202
- column.accessorKey
203
- );
204
- }
205
- });
206
- setColumnVisibility(visibility);
207
- }, [hiddenColumns, columns]);
208
- const visibleColumns = columns.filter(
209
- (column) => "accessorKey" in column && !hiddenColumns.includes(column.accessorKey)
210
- );
211
- useEffect(() => {
212
- columns.forEach((column) => {
213
- if (column.meta && "isFixed" in column.meta && column.meta.isFixed) {
214
- if (column.id) {
215
- table.getColumn(column.id)?.pin(column.meta.isFixed);
216
- }
217
- }
218
- });
219
- }, [columns, table]);
220
- const getCommonPinningStyles = (column) => {
221
- const isPinned = column.getIsPinned();
222
- const isLastLeftPinnedColumn = isPinned === "left" && column.getIsLastColumn("left");
223
- const isFirstRightPinnedColumn = isPinned === "right" && column.getIsFirstColumn("right");
224
- return {
225
- boxShadow: isLastLeftPinnedColumn ? "-6px 0 4px -4px rgba(0, 0, 0, 0.1) inset" : isFirstRightPinnedColumn ? "6px 0 4px -4px rgba(0, 0, 0, 0.1) inset" : void 0,
226
- left: isPinned === "left" ? `${column.getStart("left")}px` : void 0,
227
- right: isPinned === "right" ? `${column.getAfter("right")}px` : void 0,
228
- opacity: isPinned ? 0.96 : 1,
229
- position: isPinned ? "sticky" : "relative",
230
- backgroundColor: isPinned ? "white" : void 0,
231
- zIndex: isPinned ? 20 : 0
232
- };
233
- };
234
- const tableWidth = (columnPinning.left?.length ?? 0) > 0 || (columnPinning.right?.length ?? 0) > 0 ? table.getTotalSize() : "100%";
235
- const columnsSkeleton = visibleColumns.length;
236
- const positionPagination = pagination.position ?? "topRight";
237
- const renderPagination = () => !pagination?.controlExternal && /* @__PURE__ */ jsx(
238
- DataTablePagination,
239
- {
240
- table,
241
- textOf: pagination.textOf,
242
- onPageChange: handlePageChange,
243
- totalItems: total,
244
- className: cn(
245
- "my-1 hover:bg-transparent",
246
- (positionPagination === "topLeft" || positionPagination === "bottomLeft") && "justify-start",
247
- (positionPagination === "topRight" || positionPagination === "bottomRight") && "justify-end",
248
- (positionPagination === "topCenter" || positionPagination === "bottomCenter") && "justify-center"
249
- )
250
- }
251
- );
252
- return /* @__PURE__ */ jsxs(
253
- "div",
254
- {
255
- className: cn(
256
- "rounded-md w-full overflow-auto scrollbar-thin relative",
257
- className
258
- ),
259
- children: [
260
- positionPagination.includes("top") && renderPagination(),
261
- /* @__PURE__ */ jsxs(
262
- Table,
263
- {
264
- ref: tableRef,
265
- className: cn(classNameTable),
266
- style: {
267
- width: tableWidth,
268
- borderCollapse: "separate",
269
- borderSpacing: 0,
270
- margin: tableWidth !== "100%" ? "0 auto" : void 0
271
- },
272
- children: [
273
- /* @__PURE__ */ jsx(TableHeader, { className: cn("text-base space-y-0 h-8", classNameHeader), children: isLoading ? /* @__PURE__ */ jsx(DataTableLoadingHeader, { columnsSkeleton }) : table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(
274
- TableRow,
275
- {
276
- className: cn("hover:bg-transparent"),
277
- children: headerGroup.headers.map((header, headerIndex) => {
278
- const columnDef = header.column.columnDef;
279
- const size2 = header.column.getSize() ?? "1fr";
280
- const alignment = columnDef.meta && "align" in columnDef.meta ? columnDef.meta.align : "left";
281
- const alignmentClass = alignment === "center" ? "justify-center" : alignment === "right" ? "justify-end" : "justify-start";
282
- const hasAccessorKey = "accessorKey" in columnDef;
283
- const isFirstColumn = headerIndex === 0;
284
- const isLastColumn = headerIndex === headerGroup.headers.length - 1;
285
- const hasRightAccessorKey = !isLastColumn && "accessorKey" in headerGroup.headers[headerIndex + 1].column.columnDef;
286
- const hasLeftAccessorKey = !isFirstColumn && "accessorKey" in headerGroup.headers[headerIndex - 1].column.columnDef;
287
- return /* @__PURE__ */ jsxs(
288
- TableHead,
289
- {
290
- className: cn("h-5"),
291
- colSpan: header.colSpan,
292
- style: {
293
- width: size2,
294
- ...getCommonPinningStyles(header.column)
295
- },
296
- children: [
297
- /* @__PURE__ */ jsx(
298
- "div",
299
- {
300
- className: cn(
301
- `text-base text-grays-scale29 font-normal font-roboto p-0 cursor-pointer flex items-center ${alignmentClass} whitespace-nowrap`
302
- ),
303
- children: header.isPlaceholder ? null : /* @__PURE__ */ jsx(Fragment, { children: columnDef.enableSorting && header.column.getCanSort() ? /* @__PURE__ */ jsxs(Fragment, { children: [
304
- flexRender(
305
- columnDef.header,
306
- header.getContext()
307
- ),
308
- /* @__PURE__ */ jsx(
309
- ArrowUpDownIcon,
310
- {
311
- className: "flex mt-1 ml-2 h-3 w-3",
312
- onClick: () => header.column.toggleSorting(
313
- header.column.getIsSorted() === "asc"
314
- )
315
- }
316
- )
317
- ] }) : flexRender(columnDef.header, header.getContext()) })
318
- }
319
- ),
320
- showHeaderDivider && /* @__PURE__ */ jsxs(Fragment, { children: [
321
- hasAccessorKey && hasLeftAccessorKey && /* @__PURE__ */ jsx("span", { className: "absolute top-3 left-0 bottom-0 h-3 border-l border-grays-scale89" }),
322
- hasAccessorKey && hasRightAccessorKey && /* @__PURE__ */ jsx("span", { className: "absolute top-3 right-0 bottom-0 h-3 border-r border-grays-scale89" })
323
- ] })
324
- ]
325
- },
326
- header.id
327
- );
328
- })
329
- },
330
- headerGroup.id
331
- )) }),
332
- /* @__PURE__ */ jsx(
333
- TableBody,
334
- {
335
- className: cn(
336
- "border-t border-grays-scale79",
337
- isLoading && "overflow-hidden",
338
- classNameBody
339
- ),
340
- children: isLoading ? /* @__PURE__ */ jsx(
341
- DataTableLoadingContent,
342
- {
343
- columnsSkeleton,
344
- visibleColumns
345
- }
346
- ) : table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => {
347
- return /* @__PURE__ */ jsx(
348
- TableRow,
349
- {
350
- "data-state": row.getIsSelected() && "selected",
351
- className: "border-grays-scale89 hover:bg-gray-50",
352
- style: {
353
- backgroundColor: row.getIsSelected() ? "#e6f7ff" : ""
354
- },
355
- children: row.getVisibleCells().map((cell) => {
356
- const columnDef = cell.column.columnDef;
357
- const size2 = cell.column.getSize() ?? "1fr";
358
- const alignment = columnDef.meta && "align" in columnDef.meta ? columnDef.meta.align : "left";
359
- const alignmentClass = alignment === "center" ? "text-center" : alignment === "right" ? "text-right" : "text-left";
360
- return /* @__PURE__ */ jsx(
361
- TableCell,
362
- {
363
- style: {
364
- width: size2,
365
- ...getCommonPinningStyles(cell.column)
366
- },
367
- className: cn(alignmentClass),
368
- children: flexRender(columnDef.cell, cell.getContext())
369
- },
370
- cell.id
371
- );
372
- })
373
- },
374
- row.id
375
- );
376
- }) : renderEmptyContent && typeof renderEmptyContent === "object" && "title" in renderEmptyContent ? /* @__PURE__ */ jsx(
377
- DataTableEmptyContent,
378
- {
379
- title: renderEmptyContent.title,
380
- description: renderEmptyContent.description,
381
- columnsLength: columns.length
382
- }
383
- ) : renderEmptyContent
384
- }
385
- )
386
- ]
387
- }
388
- ),
389
- positionPagination.includes("bottom") && renderPagination()
390
- ]
391
- }
392
- );
393
- };
394
- DataTable.displayName = "DataTable";
395
- function DataTablePagination({
396
- table,
397
- totalItems,
398
- onPageChange,
399
- variant = "ghost",
400
- textOf,
401
- className
402
- }) {
403
- return /* @__PURE__ */ jsx(
404
- "div",
405
- {
406
- className: cn(
407
- "flex items-center space-x-6 lg:space-x-8 w-full bg-transparent",
408
- className
409
- ),
410
- children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-5", children: [
411
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center text-base text-grays-scale29", children: [
412
- table.getState().pagination.pageIndex + 1,
413
- " -",
414
- " ",
415
- table.getState().pagination.pageSize,
416
- " ",
417
- textOf,
418
- " ",
419
- totalItems
420
- ] }),
421
- /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-2"), children: [
422
- /* @__PURE__ */ jsx(
423
- Button,
424
- {
425
- variant,
426
- className: cn("h-8 p-0 hover:bg-transparent cursor-pointer"),
427
- onClick: () => {
428
- onPageChange(table.getState().pagination.pageIndex - 1);
429
- table.previousPage();
430
- },
431
- disabled: !table.getCanPreviousPage(),
432
- children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "h-5 w-5 text-grays-scale79" })
433
- }
434
- ),
435
- /* @__PURE__ */ jsx(
436
- Button,
437
- {
438
- variant,
439
- className: cn("h-8 p-0 hover:bg-transparent cursor-pointer"),
440
- onClick: () => {
441
- onPageChange(table.getState().pagination.pageIndex + 1);
442
- table.nextPage();
443
- },
444
- disabled: !table.getCanNextPage(),
445
- children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-5 w-5 text-grays-scale79" })
446
- }
447
- )
448
- ] })
449
- ] })
450
- }
451
- );
452
- }
453
- function DataTableEmptyContent({
454
- title,
455
- description,
456
- columnsLength
457
- }) {
458
- return /* @__PURE__ */ jsx(TableRow, { className: "w-full border-grays-scale79 bg-white hover:bg-white", children: /* @__PURE__ */ jsx(
459
- TableCell,
460
- {
461
- colSpan: columnsLength,
462
- className: "text-center h-24 border-grays-scale79",
463
- children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5 items-center my-20", children: [
464
- /* @__PURE__ */ jsx(TriangleAlertIcon, { className: "h-44 w-48 text-grays-scale29" }),
465
- /* @__PURE__ */ jsx("h2", { className: "text-[1.5rem] font-semibold text-grays-scale29", children: title }),
466
- /* @__PURE__ */ jsx("p", { className: "text-[1rem] text-grays-scale29", children: description })
467
- ] })
468
- }
469
- ) });
470
- }
471
- function DataTableLoadingHeader({
472
- columnsSkeleton
473
- }) {
474
- return /* @__PURE__ */ jsx(TableRow, { className: cn("hover:bg-transparent"), children: Array.from({ length: columnsSkeleton }).map((_, index) => /* @__PURE__ */ jsx(
475
- TableHead,
476
- {
477
- className: cn("text-grays-scale79 font-normal h-5 relative"),
478
- children: /* @__PURE__ */ jsx(Skeleton, { className: "h-6 mb-2 w-full bg-grays-scale79" })
479
- },
480
- index
481
- )) });
482
- }
483
- function DataTableLoadingContent({
484
- visibleColumns = [],
485
- columnsSkeleton
486
- }) {
487
- return /* @__PURE__ */ jsx(Fragment, { children: Array.from({ length: columnsSkeleton }).map((_, index) => /* @__PURE__ */ jsx(TableRow, { className: "border-grays-scale79", children: visibleColumns.map((_2, colIndex) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "flex justify-center items-center h-6 bg-gray-scale79 w-full", children: /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-full animate-loading rounded-none drop-shadow-2xl" }) }) }, colIndex)) }, index)) });
488
- }
489
-
490
- export { DataTable, SelectByType };
@@ -1,92 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { useState } from 'react';
3
- import { parse, isValid, format } from 'date-fns';
4
- import { ptBR } from 'date-fns/locale';
5
- import { Calendar } from 'lucide-react';
6
- import { cn } from './lib/utils.js';
7
- import { Calendar as Calendar$1 } from './calendar.js';
8
- import { Input } from './input.js';
9
- import { Popover, PopoverTrigger, PopoverContent } from './popover.js';
10
-
11
- function DatePicker({
12
- selected,
13
- onSelect,
14
- format: format$1 = "dd/MM/yyyy",
15
- placeholder = "",
16
- className = "",
17
- ...props
18
- }) {
19
- const [isOpen, setIsOpen] = useState(false);
20
- const [inputValue, setInputValue] = useState("");
21
- const handleInputChange = (e) => {
22
- setInputValue(e.currentTarget.value);
23
- const date = parse(e.currentTarget.value, format$1, /* @__PURE__ */ new Date());
24
- if (isValid(date) && typeof onSelect === "function") ;
25
- };
26
- const handleSelect = (date) => {
27
- if (date) {
28
- setInputValue(format(date, format$1));
29
- setIsOpen(false);
30
- } else {
31
- setInputValue("");
32
- }
33
- };
34
- return /* @__PURE__ */ jsxs(
35
- Popover,
36
- {
37
- open: isOpen,
38
- onOpenChange: (open) => {
39
- setIsOpen(open);
40
- },
41
- children: [
42
- /* @__PURE__ */ jsx(
43
- PopoverTrigger,
44
- {
45
- onClick: (e) => {
46
- if (isOpen) {
47
- e.preventDefault();
48
- }
49
- },
50
- children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
51
- /* @__PURE__ */ jsx(Calendar, { className: "w-4 h-4 absolute right-[10px] top-[10px]" }),
52
- /* @__PURE__ */ jsx(
53
- Input,
54
- {
55
- placeholder,
56
- value: inputValue,
57
- onChange: handleInputChange,
58
- className: cn("pr-8", className)
59
- }
60
- )
61
- ] })
62
- }
63
- ),
64
- /* @__PURE__ */ jsx(
65
- PopoverContent,
66
- {
67
- className: "w-auto p-0",
68
- align: "start",
69
- onOpenAutoFocus: (e) => {
70
- e.preventDefault();
71
- },
72
- children: /* @__PURE__ */ jsx(
73
- Calendar$1,
74
- {
75
- mode: "single",
76
- locale: ptBR,
77
- selected,
78
- onSelect: handleSelect,
79
- month: selected,
80
- onMonthChange: onSelect,
81
- ...props
82
- }
83
- )
84
- }
85
- )
86
- ]
87
- }
88
- );
89
- }
90
- DatePicker.displayName = "DatePicker";
91
-
92
- export { DatePicker };
package/dist/dialog.js DELETED
@@ -1,95 +0,0 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import * as DialogPrimitive from '@radix-ui/react-dialog';
4
- import { Cross2Icon } from '@radix-ui/react-icons';
5
- import { cn } from './lib/utils.js';
6
-
7
- const Dialog = DialogPrimitive.Root;
8
- const DialogTrigger = DialogPrimitive.Trigger;
9
- const DialogPortal = DialogPrimitive.Portal;
10
- const DialogClose = DialogPrimitive.Close;
11
- const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
12
- DialogPrimitive.Overlay,
13
- {
14
- ref,
15
- className: cn(
16
- "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
17
- className
18
- ),
19
- ...props
20
- }
21
- ));
22
- DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
23
- const DialogContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
24
- /* @__PURE__ */ jsx(DialogOverlay, {}),
25
- /* @__PURE__ */ jsxs(
26
- DialogPrimitive.Content,
27
- {
28
- ref,
29
- className: cn(
30
- "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
31
- className
32
- ),
33
- ...props,
34
- children: [
35
- children,
36
- /* @__PURE__ */ jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:brightness-125 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
37
- /* @__PURE__ */ jsx(Cross2Icon, { className: "h-5 w-5" }),
38
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
39
- ] })
40
- ]
41
- }
42
- )
43
- ] }));
44
- DialogContent.displayName = DialogPrimitive.Content.displayName;
45
- const DialogHeader = ({
46
- className,
47
- ...props
48
- }) => /* @__PURE__ */ jsx(
49
- "div",
50
- {
51
- className: cn(
52
- "flex flex-col space-y-1.5 text-center sm:text-left",
53
- className
54
- ),
55
- ...props
56
- }
57
- );
58
- DialogHeader.displayName = "DialogHeader";
59
- const DialogFooter = ({
60
- className,
61
- ...props
62
- }) => /* @__PURE__ */ jsx(
63
- "div",
64
- {
65
- className: cn(
66
- "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
67
- className
68
- ),
69
- ...props
70
- }
71
- );
72
- DialogFooter.displayName = "DialogFooter";
73
- const DialogTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
74
- DialogPrimitive.Title,
75
- {
76
- ref,
77
- className: cn(
78
- "text-lg font-semibold leading-none tracking-tight",
79
- className
80
- ),
81
- ...props
82
- }
83
- ));
84
- DialogTitle.displayName = DialogPrimitive.Title.displayName;
85
- const DialogDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
86
- DialogPrimitive.Description,
87
- {
88
- ref,
89
- className: cn("text-sm text-muted-foreground", className),
90
- ...props
91
- }
92
- ));
93
- DialogDescription.displayName = DialogPrimitive.Description.displayName;
94
-
95
- export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };