next-recomponents 1.6.89 → 1.6.91

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.
package/dist/index.d.mts CHANGED
@@ -161,8 +161,8 @@ declare function useDates(): {
161
161
 
162
162
  declare function useExcel(): {
163
163
  import: (file: File) => Promise<any[][]>;
164
- export: (data: any[][], fileName?: string) => void;
165
- exportAllPages: (data: Record<string, any[]>, fileName?: string) => void;
164
+ export: (data: any[][], fileName?: string) => Promise<void>;
165
+ exportAllPages: (data: Record<string, any[]>, fileName?: string) => Promise<void>;
166
166
  importAllPages: (file: File) => Promise<Record<string, any[]>>;
167
167
  };
168
168
 
package/dist/index.d.ts CHANGED
@@ -161,8 +161,8 @@ declare function useDates(): {
161
161
 
162
162
  declare function useExcel(): {
163
163
  import: (file: File) => Promise<any[][]>;
164
- export: (data: any[][], fileName?: string) => void;
165
- exportAllPages: (data: Record<string, any[]>, fileName?: string) => void;
164
+ export: (data: any[][], fileName?: string) => Promise<void>;
165
+ exportAllPages: (data: Record<string, any[]>, fileName?: string) => Promise<void>;
166
166
  importAllPages: (file: File) => Promise<Record<string, any[]>>;
167
167
  };
168
168
 
package/dist/index.js CHANGED
@@ -44354,64 +44354,72 @@ function useDates() {
44354
44354
  // src/use-excel/index.tsx
44355
44355
  function useExcel() {
44356
44356
  function importFileAllPages(file) {
44357
- return new Promise((resolve, reject) => {
44358
- const reader = new FileReader();
44359
- reader.onload = (event) => {
44360
- var _a;
44361
- try {
44362
- const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44363
- const workbook = readSync(data, { type: "array" });
44364
- const allSheetsData = {};
44365
- workbook.SheetNames.forEach((sheetName) => {
44366
- const sheet = workbook.Sheets[sheetName];
44367
- const jsonData = utils.sheet_to_json(sheet);
44368
- allSheetsData[sheetName] = jsonData;
44369
- });
44370
- resolve(allSheetsData);
44371
- } catch (error) {
44372
- reject(error);
44373
- }
44374
- };
44375
- reader.onerror = () => reject(reader.error);
44376
- reader.readAsArrayBuffer(file);
44357
+ return __async(this, null, function* () {
44358
+ return new Promise((resolve, reject) => {
44359
+ const reader = new FileReader();
44360
+ reader.onload = (event) => {
44361
+ var _a;
44362
+ try {
44363
+ const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44364
+ const workbook = readSync(data, { type: "array" });
44365
+ const allSheetsData = {};
44366
+ workbook.SheetNames.forEach((sheetName) => {
44367
+ const sheet = workbook.Sheets[sheetName];
44368
+ const jsonData = utils.sheet_to_json(sheet);
44369
+ allSheetsData[sheetName] = jsonData;
44370
+ });
44371
+ resolve(allSheetsData);
44372
+ } catch (error) {
44373
+ reject(error);
44374
+ }
44375
+ };
44376
+ reader.onerror = () => reject(reader.error);
44377
+ reader.readAsArrayBuffer(file);
44378
+ });
44377
44379
  });
44378
44380
  }
44379
44381
  function importFile(file) {
44380
- return new Promise((resolve, reject) => {
44381
- const reader = new FileReader();
44382
- reader.onload = (event) => {
44383
- var _a;
44384
- try {
44385
- const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44386
- const workbook = readSync(data, { type: "array" });
44387
- const sheetName = workbook.SheetNames[0];
44388
- const sheet = workbook.Sheets[sheetName];
44389
- const jsonData = utils.sheet_to_json(sheet);
44390
- resolve(jsonData);
44391
- } catch (error) {
44392
- reject(error);
44393
- }
44394
- };
44395
- reader.onerror = () => reject(reader.error);
44396
- reader.readAsArrayBuffer(file);
44382
+ return __async(this, null, function* () {
44383
+ return new Promise((resolve, reject) => {
44384
+ const reader = new FileReader();
44385
+ reader.onload = (event) => {
44386
+ var _a;
44387
+ try {
44388
+ const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44389
+ const workbook = readSync(data, { type: "array" });
44390
+ const sheetName = workbook.SheetNames[0];
44391
+ const sheet = workbook.Sheets[sheetName];
44392
+ const jsonData = utils.sheet_to_json(sheet);
44393
+ resolve(jsonData);
44394
+ } catch (error) {
44395
+ reject(error);
44396
+ }
44397
+ };
44398
+ reader.onerror = () => reject(reader.error);
44399
+ reader.readAsArrayBuffer(file);
44400
+ });
44397
44401
  });
44398
44402
  }
44399
44403
  function exportFile(data, fileName = "archivo.xlsx") {
44400
- const worksheet = utils.aoa_to_sheet(data);
44401
- const workbook = utils.book_new();
44402
- utils.book_append_sheet(workbook, worksheet, "Sheet1");
44403
- writeFileSync(workbook, fileName);
44404
+ return __async(this, null, function* () {
44405
+ const worksheet = utils.aoa_to_sheet(data);
44406
+ const workbook = utils.book_new();
44407
+ utils.book_append_sheet(workbook, worksheet, "Sheet1");
44408
+ writeFileSync(workbook, fileName);
44409
+ });
44404
44410
  }
44405
44411
  function exportFileAllPages(data, fileName = "archivo.xlsx") {
44406
- const workbook = utils.book_new();
44407
- for (const sheetName in data) {
44408
- if (data.hasOwnProperty(sheetName)) {
44409
- const sheetData = data[sheetName];
44410
- const worksheet = utils.json_to_sheet(sheetData);
44411
- utils.book_append_sheet(workbook, worksheet, sheetName);
44412
+ return __async(this, null, function* () {
44413
+ const workbook = utils.book_new();
44414
+ for (const sheetName in data) {
44415
+ if (data.hasOwnProperty(sheetName)) {
44416
+ const sheetData = data[sheetName];
44417
+ const worksheet = utils.json_to_sheet(sheetData);
44418
+ utils.book_append_sheet(workbook, worksheet, sheetName);
44419
+ }
44412
44420
  }
44413
- }
44414
- writeFileSync(workbook, fileName);
44421
+ writeFileSync(workbook, fileName);
44422
+ });
44415
44423
  }
44416
44424
  return {
44417
44425
  import: importFile,
package/dist/index.mjs CHANGED
@@ -44345,64 +44345,72 @@ function useDates() {
44345
44345
  // src/use-excel/index.tsx
44346
44346
  function useExcel() {
44347
44347
  function importFileAllPages(file) {
44348
- return new Promise((resolve, reject) => {
44349
- const reader = new FileReader();
44350
- reader.onload = (event) => {
44351
- var _a;
44352
- try {
44353
- const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44354
- const workbook = readSync(data, { type: "array" });
44355
- const allSheetsData = {};
44356
- workbook.SheetNames.forEach((sheetName) => {
44357
- const sheet = workbook.Sheets[sheetName];
44358
- const jsonData = utils.sheet_to_json(sheet);
44359
- allSheetsData[sheetName] = jsonData;
44360
- });
44361
- resolve(allSheetsData);
44362
- } catch (error) {
44363
- reject(error);
44364
- }
44365
- };
44366
- reader.onerror = () => reject(reader.error);
44367
- reader.readAsArrayBuffer(file);
44348
+ return __async(this, null, function* () {
44349
+ return new Promise((resolve, reject) => {
44350
+ const reader = new FileReader();
44351
+ reader.onload = (event) => {
44352
+ var _a;
44353
+ try {
44354
+ const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44355
+ const workbook = readSync(data, { type: "array" });
44356
+ const allSheetsData = {};
44357
+ workbook.SheetNames.forEach((sheetName) => {
44358
+ const sheet = workbook.Sheets[sheetName];
44359
+ const jsonData = utils.sheet_to_json(sheet);
44360
+ allSheetsData[sheetName] = jsonData;
44361
+ });
44362
+ resolve(allSheetsData);
44363
+ } catch (error) {
44364
+ reject(error);
44365
+ }
44366
+ };
44367
+ reader.onerror = () => reject(reader.error);
44368
+ reader.readAsArrayBuffer(file);
44369
+ });
44368
44370
  });
44369
44371
  }
44370
44372
  function importFile(file) {
44371
- return new Promise((resolve, reject) => {
44372
- const reader = new FileReader();
44373
- reader.onload = (event) => {
44374
- var _a;
44375
- try {
44376
- const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44377
- const workbook = readSync(data, { type: "array" });
44378
- const sheetName = workbook.SheetNames[0];
44379
- const sheet = workbook.Sheets[sheetName];
44380
- const jsonData = utils.sheet_to_json(sheet);
44381
- resolve(jsonData);
44382
- } catch (error) {
44383
- reject(error);
44384
- }
44385
- };
44386
- reader.onerror = () => reject(reader.error);
44387
- reader.readAsArrayBuffer(file);
44373
+ return __async(this, null, function* () {
44374
+ return new Promise((resolve, reject) => {
44375
+ const reader = new FileReader();
44376
+ reader.onload = (event) => {
44377
+ var _a;
44378
+ try {
44379
+ const data = new Uint8Array((_a = event.target) == null ? void 0 : _a.result);
44380
+ const workbook = readSync(data, { type: "array" });
44381
+ const sheetName = workbook.SheetNames[0];
44382
+ const sheet = workbook.Sheets[sheetName];
44383
+ const jsonData = utils.sheet_to_json(sheet);
44384
+ resolve(jsonData);
44385
+ } catch (error) {
44386
+ reject(error);
44387
+ }
44388
+ };
44389
+ reader.onerror = () => reject(reader.error);
44390
+ reader.readAsArrayBuffer(file);
44391
+ });
44388
44392
  });
44389
44393
  }
44390
44394
  function exportFile(data, fileName = "archivo.xlsx") {
44391
- const worksheet = utils.aoa_to_sheet(data);
44392
- const workbook = utils.book_new();
44393
- utils.book_append_sheet(workbook, worksheet, "Sheet1");
44394
- writeFileSync(workbook, fileName);
44395
+ return __async(this, null, function* () {
44396
+ const worksheet = utils.aoa_to_sheet(data);
44397
+ const workbook = utils.book_new();
44398
+ utils.book_append_sheet(workbook, worksheet, "Sheet1");
44399
+ writeFileSync(workbook, fileName);
44400
+ });
44395
44401
  }
44396
44402
  function exportFileAllPages(data, fileName = "archivo.xlsx") {
44397
- const workbook = utils.book_new();
44398
- for (const sheetName in data) {
44399
- if (data.hasOwnProperty(sheetName)) {
44400
- const sheetData = data[sheetName];
44401
- const worksheet = utils.json_to_sheet(sheetData);
44402
- utils.book_append_sheet(workbook, worksheet, sheetName);
44403
+ return __async(this, null, function* () {
44404
+ const workbook = utils.book_new();
44405
+ for (const sheetName in data) {
44406
+ if (data.hasOwnProperty(sheetName)) {
44407
+ const sheetData = data[sheetName];
44408
+ const worksheet = utils.json_to_sheet(sheetData);
44409
+ utils.book_append_sheet(workbook, worksheet, sheetName);
44410
+ }
44403
44411
  }
44404
- }
44405
- writeFileSync(workbook, fileName);
44412
+ writeFileSync(workbook, fileName);
44413
+ });
44406
44414
  }
44407
44415
  return {
44408
44416
  import: importFile,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "next-recomponents",
3
- "version": "1.6.89",
3
+ "version": "1.6.91",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -21,7 +21,7 @@
21
21
  "axios": "^1.9.0",
22
22
  "moment": "^2.30.1",
23
23
  "react": "^19.1.0",
24
- "react-calendar": "^6.0.0",
25
- "react-dom": "^19.1.0"
24
+ "react-dom": "^19.1.0",
25
+ "uninstall": "^0.0.0"
26
26
  }
27
27
  }
package/src/index.tsx CHANGED
@@ -12,4 +12,3 @@ export { default as Modal } from "./modal";
12
12
  export { default as Pre } from "./pre";
13
13
  export { default as useDates } from "./use-dates";
14
14
  export { default as useExcel } from "./use-excel";
15
- // export { default as MyCalendar } from "./calendar";
@@ -1,7 +1,9 @@
1
1
  import * as XLSX from "xlsx";
2
2
 
3
3
  export default function useExcel() {
4
- function importFileAllPages(file: File): Promise<Record<string, any[]>> {
4
+ async function importFileAllPages(
5
+ file: File
6
+ ): Promise<Record<string, any[]>> {
5
7
  return new Promise((resolve, reject) => {
6
8
  const reader = new FileReader();
7
9
 
@@ -29,7 +31,7 @@ export default function useExcel() {
29
31
  });
30
32
  }
31
33
 
32
- function importFile(file: File): Promise<any[][]> {
34
+ async function importFile(file: File): Promise<any[][]> {
33
35
  return new Promise((resolve, reject) => {
34
36
  const reader = new FileReader();
35
37
 
@@ -53,7 +55,7 @@ export default function useExcel() {
53
55
  });
54
56
  }
55
57
 
56
- function exportFile(data: any[][], fileName = "archivo.xlsx") {
58
+ async function exportFile(data: any[][], fileName = "archivo.xlsx") {
57
59
  const worksheet = XLSX.utils.aoa_to_sheet(data);
58
60
  const workbook = XLSX.utils.book_new();
59
61
  XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1");
@@ -61,7 +63,7 @@ export default function useExcel() {
61
63
  XLSX.writeFile(workbook, fileName);
62
64
  }
63
65
 
64
- function exportFileAllPages(
66
+ async function exportFileAllPages(
65
67
  data: Record<string, any[]>,
66
68
  fileName = "archivo.xlsx"
67
69
  ) {
package/dist/index.css DELETED
@@ -1,132 +0,0 @@
1
- /* src/calendar/calendar.css */
2
- .react-calendar {
3
- width: 350px;
4
- max-width: 100%;
5
- background: white;
6
- border: 1px solid #a0a096;
7
- font-family:
8
- "Arial",
9
- "Helvetica",
10
- sans-serif;
11
- line-height: 1.125em;
12
- }
13
- .react-calendar--doubleView {
14
- width: 700px;
15
- }
16
- .react-calendar--doubleView .react-calendar__viewContainer {
17
- display: flex;
18
- margin: -0.5em;
19
- }
20
- .react-calendar--doubleView .react-calendar__viewContainer > * {
21
- width: 50%;
22
- margin: 0.5em;
23
- }
24
- .react-calendar,
25
- .react-calendar *,
26
- .react-calendar *:before,
27
- .react-calendar *:after {
28
- -moz-box-sizing: border-box;
29
- -webkit-box-sizing: border-box;
30
- box-sizing: border-box;
31
- }
32
- .react-calendar button {
33
- margin: 0;
34
- border: 0;
35
- outline: none;
36
- }
37
- .react-calendar button:enabled:hover {
38
- cursor: pointer;
39
- }
40
- .react-calendar__navigation {
41
- display: flex;
42
- height: 44px;
43
- margin-bottom: 1em;
44
- }
45
- .react-calendar__navigation button {
46
- min-width: 44px;
47
- background: none;
48
- }
49
- .react-calendar__navigation button:disabled {
50
- background-color: #f0f0f0;
51
- }
52
- .react-calendar__navigation button:enabled:hover,
53
- .react-calendar__navigation button:enabled:focus {
54
- background-color: #e6e6e6;
55
- }
56
- .react-calendar__month-view__weekdays {
57
- text-align: center;
58
- text-transform: uppercase;
59
- font: inherit;
60
- font-size: 0.75em;
61
- font-weight: bold;
62
- }
63
- .react-calendar__month-view__weekdays__weekday {
64
- padding: 0.5em;
65
- }
66
- .react-calendar__month-view__weekNumbers .react-calendar__tile {
67
- display: flex;
68
- align-items: center;
69
- justify-content: center;
70
- font: inherit;
71
- font-size: 0.75em;
72
- font-weight: bold;
73
- }
74
- .react-calendar__month-view__days__day--weekend {
75
- color: #d10000;
76
- }
77
- .react-calendar__month-view__days__day--neighboringMonth,
78
- .react-calendar__decade-view__years__year--neighboringDecade,
79
- .react-calendar__century-view__decades__decade--neighboringCentury {
80
- color: #757575;
81
- }
82
- .react-calendar__year-view .react-calendar__tile,
83
- .react-calendar__decade-view .react-calendar__tile,
84
- .react-calendar__century-view .react-calendar__tile {
85
- padding: 2em 0.5em;
86
- }
87
- .react-calendar__tile {
88
- max-width: 100%;
89
- padding: 10px 6.6667px;
90
- background: none;
91
- text-align: center;
92
- font: inherit;
93
- font-size: 0.833em;
94
- }
95
- .react-calendar__tile:disabled {
96
- background-color: #f0f0f0;
97
- color: #ababab;
98
- }
99
- .react-calendar__month-view__days__day--neighboringMonth:disabled,
100
- .react-calendar__decade-view__years__year--neighboringDecade:disabled,
101
- .react-calendar__century-view__decades__decade--neighboringCentury:disabled {
102
- color: #cdcdcd;
103
- }
104
- .react-calendar__tile:enabled:hover,
105
- .react-calendar__tile:enabled:focus {
106
- background-color: #e6e6e6;
107
- }
108
- .react-calendar__tile--now {
109
- background: #ffff76;
110
- }
111
- .react-calendar__tile--now:enabled:hover,
112
- .react-calendar__tile--now:enabled:focus {
113
- background: #ffffa9;
114
- }
115
- .react-calendar__tile--hasActive {
116
- background: #76baff;
117
- }
118
- .react-calendar__tile--hasActive:enabled:hover,
119
- .react-calendar__tile--hasActive:enabled:focus {
120
- background: #a9d4ff;
121
- }
122
- .react-calendar__tile--active {
123
- background: #006edc;
124
- color: white;
125
- }
126
- .react-calendar__tile--active:enabled:hover,
127
- .react-calendar__tile--active:enabled:focus {
128
- background: #1087ff;
129
- }
130
- .react-calendar--selectRange .react-calendar__tile--hover {
131
- background-color: #e6e6e6;
132
- }
@@ -1,155 +0,0 @@
1
- .react-calendar {
2
- width: 350px;
3
- max-width: 100%;
4
- background: white;
5
- border: 1px solid #a0a096;
6
- font-family: "Arial", "Helvetica", sans-serif;
7
- line-height: 1.125em;
8
- }
9
-
10
- .react-calendar--doubleView {
11
- width: 700px;
12
- }
13
-
14
- .react-calendar--doubleView .react-calendar__viewContainer {
15
- display: flex;
16
- margin: -0.5em;
17
- }
18
-
19
- .react-calendar--doubleView .react-calendar__viewContainer > * {
20
- width: 50%;
21
- margin: 0.5em;
22
- }
23
-
24
- .react-calendar,
25
- .react-calendar *,
26
- .react-calendar *:before,
27
- .react-calendar *:after {
28
- -moz-box-sizing: border-box;
29
- -webkit-box-sizing: border-box;
30
- box-sizing: border-box;
31
- }
32
-
33
- .react-calendar button {
34
- margin: 0;
35
- border: 0;
36
- outline: none;
37
- }
38
-
39
- .react-calendar button:enabled:hover {
40
- cursor: pointer;
41
- }
42
-
43
- .react-calendar__navigation {
44
- display: flex;
45
- height: 44px;
46
- margin-bottom: 1em;
47
- }
48
-
49
- .react-calendar__navigation button {
50
- min-width: 44px;
51
- background: none;
52
- }
53
-
54
- .react-calendar__navigation button:disabled {
55
- background-color: #f0f0f0;
56
- }
57
-
58
- .react-calendar__navigation button:enabled:hover,
59
- .react-calendar__navigation button:enabled:focus {
60
- background-color: #e6e6e6;
61
- }
62
-
63
- .react-calendar__month-view__weekdays {
64
- text-align: center;
65
- text-transform: uppercase;
66
- font: inherit;
67
- font-size: 0.75em;
68
- font-weight: bold;
69
- }
70
-
71
- .react-calendar__month-view__weekdays__weekday {
72
- padding: 0.5em;
73
- }
74
-
75
- .react-calendar__month-view__weekNumbers .react-calendar__tile {
76
- display: flex;
77
- align-items: center;
78
- justify-content: center;
79
- font: inherit;
80
- font-size: 0.75em;
81
- font-weight: bold;
82
- }
83
-
84
- .react-calendar__month-view__days__day--weekend {
85
- color: #d10000;
86
- }
87
-
88
- .react-calendar__month-view__days__day--neighboringMonth,
89
- .react-calendar__decade-view__years__year--neighboringDecade,
90
- .react-calendar__century-view__decades__decade--neighboringCentury {
91
- color: #757575;
92
- }
93
-
94
- .react-calendar__year-view .react-calendar__tile,
95
- .react-calendar__decade-view .react-calendar__tile,
96
- .react-calendar__century-view .react-calendar__tile {
97
- padding: 2em 0.5em;
98
- }
99
-
100
- .react-calendar__tile {
101
- max-width: 100%;
102
- padding: 10px 6.6667px;
103
- background: none;
104
- text-align: center;
105
- font: inherit;
106
- font-size: 0.833em;
107
- }
108
-
109
- .react-calendar__tile:disabled {
110
- background-color: #f0f0f0;
111
- color: #ababab;
112
- }
113
-
114
- .react-calendar__month-view__days__day--neighboringMonth:disabled,
115
- .react-calendar__decade-view__years__year--neighboringDecade:disabled,
116
- .react-calendar__century-view__decades__decade--neighboringCentury:disabled {
117
- color: #cdcdcd;
118
- }
119
-
120
- .react-calendar__tile:enabled:hover,
121
- .react-calendar__tile:enabled:focus {
122
- background-color: #e6e6e6;
123
- }
124
-
125
- .react-calendar__tile--now {
126
- background: #ffff76;
127
- }
128
-
129
- .react-calendar__tile--now:enabled:hover,
130
- .react-calendar__tile--now:enabled:focus {
131
- background: #ffffa9;
132
- }
133
-
134
- .react-calendar__tile--hasActive {
135
- background: #76baff;
136
- }
137
-
138
- .react-calendar__tile--hasActive:enabled:hover,
139
- .react-calendar__tile--hasActive:enabled:focus {
140
- background: #a9d4ff;
141
- }
142
-
143
- .react-calendar__tile--active {
144
- background: #006edc;
145
- color: white;
146
- }
147
-
148
- .react-calendar__tile--active:enabled:hover,
149
- .react-calendar__tile--active:enabled:focus {
150
- background: #1087ff;
151
- }
152
-
153
- .react-calendar--selectRange .react-calendar__tile--hover {
154
- background-color: #e6e6e6;
155
- }
@@ -1,15 +0,0 @@
1
- export default function CalendarIcon() {
2
- return (
3
- <svg
4
- stroke="currentColor"
5
- fill="currentColor"
6
- strokeWidth="0"
7
- viewBox="0 0 448 512"
8
- height="20px"
9
- width="20px"
10
- xmlns="http://www.w3.org/2000/svg"
11
- >
12
- <path d="M12 192h424c6.6 0 12 5.4 12 12v260c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V204c0-6.6 5.4-12 12-12zm436-44v-36c0-26.5-21.5-48-48-48h-48V12c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v52H160V12c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v52H48C21.5 64 0 85.5 0 112v36c0 6.6 5.4 12 12 12h424c6.6 0 12-5.4 12-12z"></path>
13
- </svg>
14
- );
15
- }
@@ -1,91 +0,0 @@
1
- "use client";
2
- import { useEffect, useRef, useState } from "react";
3
- import "./calendar.css";
4
- import Calendar from "react-calendar";
5
- import CalendarIcon from "./calendar.icon";
6
-
7
- export default function MyCalendar({
8
- enabledDates,
9
- onChange,
10
- defaultValue = "",
11
- className = "",
12
- }: {
13
- enabledDates: Date[];
14
- onChange: (e: any) => void;
15
- defaultValue?: string;
16
- className?: string;
17
- }) {
18
- const modalRef = useRef<HTMLDialogElement>(null);
19
- const [date, setDate] = useState<any>(defaultValue);
20
- const [selectedDate, setSelectedDate] = useState<Date>(new Date());
21
- const [visible, setVisible] = useState(false);
22
- const isDateDisabled = ({ date, view }: { date: Date; view: any }) => {
23
- if (view === "month") {
24
- // Solo aplica en la vista mensual
25
- return !enabledDates.some(
26
- (enabledDate) =>
27
- date.getFullYear() === enabledDate.getFullYear() &&
28
- date.getMonth() === enabledDate.getMonth() &&
29
- date.getDate() === enabledDate.getDate()
30
- );
31
- }
32
- return false;
33
- };
34
-
35
- function handleChange(e: any) {
36
- setSelectedDate(e);
37
- const date = new Date(e);
38
- const formattedDate = date.toISOString().split("T")[0];
39
- setDate(formattedDate);
40
- onChange(e);
41
- modalRef?.current?.close?.();
42
- }
43
-
44
- useEffect(() => {
45
- setVisible(typeof window != "undefined");
46
- }, [typeof window]);
47
-
48
- return (
49
- <div className="relative">
50
- <div
51
- onClick={(e) => modalRef?.current?.showModal?.()}
52
- className="cursor-pointer flex items-center justify-center"
53
- >
54
- <input
55
- className={[
56
- "p-2 w-full rounded border shadow cursor-pointer",
57
- className,
58
- ].join(" ")}
59
- value={date}
60
- onChange={(e) => {}}
61
- readOnly
62
- />
63
- <div className="absolute" style={{ right: "10px" }}>
64
- <CalendarIcon />
65
- </div>
66
- </div>
67
-
68
- {visible && (
69
- <dialog
70
- ref={modalRef}
71
- onClick={(e) => {
72
- const element = e.target as HTMLElement;
73
-
74
- if (element?.id == "my-calendar-modal-item") {
75
- modalRef.current?.close();
76
- }
77
- }}
78
- id="my-calendar-modal-item"
79
- >
80
- <Calendar
81
- onChange={(e) => {
82
- handleChange(e);
83
- }}
84
- value={selectedDate}
85
- tileDisabled={isDateDisabled} // Aplica restricciones
86
- />
87
- </dialog>
88
- )}
89
- </div>
90
- );
91
- }