@comet/admin 9.0.0-beta.4 → 9.0.0-beta.6

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 (67) hide show
  1. package/lib/common/ClearInputAdornment.d.ts.map +1 -1
  2. package/lib/common/ClearInputAdornment.js +6 -2
  3. package/lib/common/DeleteDialog.d.ts +1 -0
  4. package/lib/common/DeleteDialog.d.ts.map +1 -1
  5. package/lib/common/DeleteDialog.js +8 -1
  6. package/lib/common/buttons/clearinput/ClearInputButton.js +1 -1
  7. package/lib/dataGrid/excelExport/generateExcelFile.d.ts.map +1 -1
  8. package/lib/dataGrid/excelExport/generateExcelFile.js +23 -1
  9. package/lib/dateTime/timePicker/TimePicker.d.ts.map +1 -1
  10. package/lib/dateTime/timePicker/TimePicker.js +2 -17
  11. package/lib/dateTime/timeRangePicker/TimeRangePicker.d.ts +71 -0
  12. package/lib/dateTime/timeRangePicker/TimeRangePicker.d.ts.map +1 -0
  13. package/lib/dateTime/timeRangePicker/TimeRangePicker.js +191 -0
  14. package/lib/dateTime/timeRangePickerField/TimeRangePickerField.d.ts +13 -0
  15. package/lib/dateTime/timeRangePickerField/TimeRangePickerField.d.ts.map +1 -0
  16. package/lib/dateTime/timeRangePickerField/TimeRangePickerField.js +31 -0
  17. package/lib/dateTime/utils.d.ts +6 -0
  18. package/lib/dateTime/utils.d.ts.map +1 -1
  19. package/lib/dateTime/utils.js +19 -1
  20. package/lib/{EditDialog.d.ts → editDialog/EditDialog.d.ts} +1 -1
  21. package/lib/editDialog/EditDialog.d.ts.map +1 -0
  22. package/lib/{EditDialog.js → editDialog/EditDialog.js} +5 -5
  23. package/lib/editDialog/EditDialogApiContext.d.ts.map +1 -0
  24. package/lib/form/FinalFormNumberInput.d.ts.map +1 -1
  25. package/lib/form/FinalFormNumberInput.js +2 -3
  26. package/lib/helpers/useTopOffset.js +1 -1
  27. package/lib/index.d.ts +4 -2
  28. package/lib/index.d.ts.map +1 -1
  29. package/lib/index.js +4 -2
  30. package/lib/theme/componentsTheme/MuiDataGrid.js +1 -1
  31. package/package.json +26 -19
  32. package/lib/EditDialog.d.ts.map +0 -1
  33. package/lib/EditDialogApiContext.d.ts.map +0 -1
  34. package/lib/alert/__stories__/Alert.stories.js +0 -152
  35. package/lib/common/__stories__/Tooltip.stories.js +0 -404
  36. package/lib/common/buttons/__stories__/Button.stories.js +0 -445
  37. package/lib/common/buttons/delete/__stories__/DeleteButton.stories.js +0 -8
  38. package/lib/dateTime/datePicker/__stories__/DatePicker.stories.js +0 -214
  39. package/lib/dateTime/datePickerField/__stories__/DatePickerField.stories.js +0 -220
  40. package/lib/dateTime/dateRangePicker/__stories__/DateRangePicker.stories.js +0 -238
  41. package/lib/dateTime/dateRangePickerField/__stories__/DateRangePickerField.stories.js +0 -224
  42. package/lib/dateTime/dateTimePicker/__stories__/DateTimePicker.stories.js +0 -214
  43. package/lib/dateTime/dateTimePickerField/__stories__/DateTimePickerField.stories.js +0 -220
  44. package/lib/dateTime/dateTimeRangePicker/__stories__/DateTimeRangePicker.stories.js +0 -238
  45. package/lib/dateTime/dateTimeRangePickerField/__stories__/DateTimeRangePickerField.stories.js +0 -223
  46. package/lib/dateTime/timePicker/__stories__/TimePicker.stories.js +0 -219
  47. package/lib/dateTime/timePickerField/__stories__/TimePickerField.stories.js +0 -229
  48. package/lib/section/__stories__/SectionHeadline.stories.js +0 -71
  49. package/lib/stack/__stories__/RouterTabsNestedStack.stories.js +0 -51
  50. package/lib/stack/__stories__/Stack.stories.js +0 -14
  51. package/lib/stack/__stories__/StackBackButton.stories.js +0 -50
  52. package/lib/stack/__stories__/StackBreadcrumbs.stories.js +0 -139
  53. package/lib/stack/__stories__/StackBreadcrumbsTabs.stories.js +0 -47
  54. package/lib/stack/__stories__/StackCustomSeparator.stories.js +0 -47
  55. package/lib/stack/__stories__/StackLink.stories.js +0 -41
  56. package/lib/stack/__stories__/StackNested.stories.js +0 -58
  57. package/lib/stack/__stories__/StackNestedOnInitialPage.stories.js +0 -78
  58. package/lib/stack/__stories__/StackNestedOneStack.stories.js +0 -90
  59. package/lib/stack/__stories__/StackPageTitle.stories.js +0 -121
  60. package/lib/stack/__stories__/StackReactNodeTitle.stories.js +0 -54
  61. package/lib/stack/__stories__/StackRefApi.stories.js +0 -56
  62. package/lib/stack/__stories__/StackTableFormQueryAtStack.stories.js +0 -155
  63. package/lib/stack/__stories__/StackTableFormQueryInTable.stories.js +0 -160
  64. package/lib/stack/__stories__/StackUrl.stories.js +0 -66
  65. package/lib/translator/__stories__/ContentTranslation.stories.js +0 -104
  66. /package/lib/{EditDialogApiContext.d.ts → editDialog/EditDialogApiContext.d.ts} +0 -0
  67. /package/lib/{EditDialogApiContext.js → editDialog/EditDialogApiContext.js} +0 -0
@@ -1,445 +0,0 @@
1
- import { Add, ArrowRight, Favorite, Wrench } from "@comet/admin-icons";
2
- import { Box, Chip, Stack } from "@mui/material";
3
- import { Button } from "../Button";
4
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
5
- var config = {
6
- component: Button,
7
- title: "components/common/buttons/Button"
8
- };
9
- export default config;
10
- export var Default = {
11
- parameters: {
12
- layout: "fullscreen"
13
- },
14
- args: {
15
- variant: "primary",
16
- responsive: false,
17
- disabled: false,
18
- startIcon: true,
19
- endIcon: false
20
- },
21
- argTypes: {
22
- variant: {
23
- name: "Variant",
24
- control: "select",
25
- options: ["primary", "secondary", "outlined", "destructive", "success", "textLight", "textDark"]
26
- },
27
- responsive: {
28
- name: "Responsive",
29
- control: "boolean"
30
- },
31
- disabled: {
32
- name: "Disabled",
33
- control: "boolean"
34
- },
35
- startIcon: {
36
- name: "Start Icon",
37
- control: "boolean"
38
- },
39
- endIcon: {
40
- name: "End Icon",
41
- control: "boolean"
42
- }
43
- },
44
- render: function render(_ref) {
45
- var startIcon = _ref.startIcon,
46
- endIcon = _ref.endIcon,
47
- disabled = _ref.disabled,
48
- variant = _ref.variant,
49
- responsive = _ref.responsive;
50
- var showDarkBackground = variant === "textLight";
51
- return /*#__PURE__*/_jsx(Box, {
52
- py: 10,
53
- px: 8,
54
- bgcolor: showDarkBackground ? "#333" : "transparent",
55
- children: /*#__PURE__*/_jsx(Button, {
56
- onClick: function onClick() {
57
- alert("Button clicked");
58
- },
59
- startIcon: startIcon ? /*#__PURE__*/_jsx(Wrench, {}) : undefined,
60
- endIcon: endIcon ? /*#__PURE__*/_jsx(Favorite, {}) : undefined,
61
- disabled: disabled,
62
- variant: variant,
63
- responsive: responsive,
64
- children: "This is a button"
65
- })
66
- });
67
- }
68
- };
69
- export var AllVariants = {
70
- render: function render() {
71
- return /*#__PURE__*/_jsxs(Stack, {
72
- spacing: 10,
73
- children: [/*#__PURE__*/_jsxs(Stack, {
74
- direction: "row",
75
- alignItems: "center",
76
- spacing: 8,
77
- children: [/*#__PURE__*/_jsx(Button, {
78
- children: "Button"
79
- }), /*#__PURE__*/_jsx(Button, {
80
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
81
- children: "Button"
82
- }), /*#__PURE__*/_jsx(Button, {
83
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
84
- children: "Button"
85
- }), /*#__PURE__*/_jsx(Button, {
86
- endIcon: /*#__PURE__*/_jsx(Chip, {
87
- label: "5"
88
- }),
89
- children: "Button"
90
- }), /*#__PURE__*/_jsx(Button, {
91
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
92
- endIcon: /*#__PURE__*/_jsx(Chip, {
93
- label: "5"
94
- }),
95
- children: "Button"
96
- }), /*#__PURE__*/_jsx(Button, {
97
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
98
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
99
- label: "5"
100
- })]
101
- }),
102
- children: "Button"
103
- }), /*#__PURE__*/_jsx(Button, {
104
- children: /*#__PURE__*/_jsx(ArrowRight, {})
105
- }), /*#__PURE__*/_jsx(Button, {
106
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
107
- disabled: true,
108
- children: "Button"
109
- })]
110
- }), /*#__PURE__*/_jsxs(Stack, {
111
- direction: "row",
112
- alignItems: "center",
113
- spacing: 8,
114
- children: [/*#__PURE__*/_jsx(Button, {
115
- variant: "secondary",
116
- children: "Button"
117
- }), /*#__PURE__*/_jsx(Button, {
118
- variant: "secondary",
119
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
120
- children: "Button"
121
- }), /*#__PURE__*/_jsx(Button, {
122
- variant: "secondary",
123
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
124
- children: "Button"
125
- }), /*#__PURE__*/_jsx(Button, {
126
- variant: "secondary",
127
- endIcon: /*#__PURE__*/_jsx(Chip, {
128
- label: "5"
129
- }),
130
- children: "Button"
131
- }), /*#__PURE__*/_jsx(Button, {
132
- variant: "secondary",
133
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
134
- endIcon: /*#__PURE__*/_jsx(Chip, {
135
- label: "5"
136
- }),
137
- children: "Button"
138
- }), /*#__PURE__*/_jsx(Button, {
139
- variant: "secondary",
140
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
141
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
142
- label: "5"
143
- })]
144
- }),
145
- children: "Button"
146
- }), /*#__PURE__*/_jsx(Button, {
147
- variant: "secondary",
148
- children: /*#__PURE__*/_jsx(ArrowRight, {})
149
- }), /*#__PURE__*/_jsx(Button, {
150
- variant: "secondary",
151
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
152
- disabled: true,
153
- children: "Button"
154
- })]
155
- }), /*#__PURE__*/_jsxs(Stack, {
156
- direction: "row",
157
- alignItems: "center",
158
- spacing: 8,
159
- children: [/*#__PURE__*/_jsx(Button, {
160
- variant: "outlined",
161
- children: "Button"
162
- }), /*#__PURE__*/_jsx(Button, {
163
- variant: "outlined",
164
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
165
- children: "Button"
166
- }), /*#__PURE__*/_jsx(Button, {
167
- variant: "outlined",
168
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
169
- children: "Button"
170
- }), /*#__PURE__*/_jsx(Button, {
171
- variant: "outlined",
172
- endIcon: /*#__PURE__*/_jsx(Chip, {
173
- label: "5"
174
- }),
175
- children: "Button"
176
- }), /*#__PURE__*/_jsx(Button, {
177
- variant: "outlined",
178
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
179
- endIcon: /*#__PURE__*/_jsx(Chip, {
180
- label: "5"
181
- }),
182
- children: "Button"
183
- }), /*#__PURE__*/_jsx(Button, {
184
- variant: "outlined",
185
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
186
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
187
- label: "5"
188
- })]
189
- }),
190
- children: "Button"
191
- }), /*#__PURE__*/_jsx(Button, {
192
- variant: "outlined",
193
- children: /*#__PURE__*/_jsx(ArrowRight, {})
194
- }), /*#__PURE__*/_jsx(Button, {
195
- variant: "outlined",
196
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
197
- disabled: true,
198
- children: "Button"
199
- })]
200
- }), /*#__PURE__*/_jsxs(Stack, {
201
- direction: "row",
202
- alignItems: "center",
203
- spacing: 8,
204
- children: [/*#__PURE__*/_jsx(Button, {
205
- variant: "destructive",
206
- children: "Button"
207
- }), /*#__PURE__*/_jsx(Button, {
208
- variant: "destructive",
209
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
210
- children: "Button"
211
- }), /*#__PURE__*/_jsx(Button, {
212
- variant: "destructive",
213
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
214
- children: "Button"
215
- }), /*#__PURE__*/_jsx(Button, {
216
- variant: "destructive",
217
- endIcon: /*#__PURE__*/_jsx(Chip, {
218
- label: "5"
219
- }),
220
- children: "Button"
221
- }), /*#__PURE__*/_jsx(Button, {
222
- variant: "destructive",
223
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
224
- endIcon: /*#__PURE__*/_jsx(Chip, {
225
- label: "5"
226
- }),
227
- children: "Button"
228
- }), /*#__PURE__*/_jsx(Button, {
229
- variant: "destructive",
230
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
231
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
232
- label: "5"
233
- })]
234
- }),
235
- children: "Button"
236
- }), /*#__PURE__*/_jsx(Button, {
237
- variant: "destructive",
238
- children: /*#__PURE__*/_jsx(ArrowRight, {})
239
- }), /*#__PURE__*/_jsx(Button, {
240
- variant: "destructive",
241
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
242
- disabled: true,
243
- children: "Button"
244
- })]
245
- }), /*#__PURE__*/_jsxs(Stack, {
246
- direction: "row",
247
- alignItems: "center",
248
- spacing: 8,
249
- children: [/*#__PURE__*/_jsx(Button, {
250
- variant: "success",
251
- children: "Button"
252
- }), /*#__PURE__*/_jsx(Button, {
253
- variant: "success",
254
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
255
- children: "Button"
256
- }), /*#__PURE__*/_jsx(Button, {
257
- variant: "success",
258
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
259
- children: "Button"
260
- }), /*#__PURE__*/_jsx(Button, {
261
- variant: "success",
262
- endIcon: /*#__PURE__*/_jsx(Chip, {
263
- label: "5"
264
- }),
265
- children: "Button"
266
- }), /*#__PURE__*/_jsx(Button, {
267
- variant: "success",
268
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
269
- endIcon: /*#__PURE__*/_jsx(Chip, {
270
- label: "5"
271
- }),
272
- children: "Button"
273
- }), /*#__PURE__*/_jsx(Button, {
274
- variant: "success",
275
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
276
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
277
- label: "5"
278
- })]
279
- }),
280
- children: "Button"
281
- }), /*#__PURE__*/_jsx(Button, {
282
- variant: "success",
283
- children: /*#__PURE__*/_jsx(ArrowRight, {})
284
- }), /*#__PURE__*/_jsx(Button, {
285
- variant: "success",
286
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
287
- disabled: true,
288
- children: "Button"
289
- })]
290
- }), /*#__PURE__*/_jsxs(Stack, {
291
- direction: "row",
292
- alignItems: "center",
293
- spacing: 8,
294
- paddingTop: 8,
295
- paddingBottom: 8,
296
- sx: {
297
- backgroundColor: function backgroundColor(theme) {
298
- return theme.palette.grey[800];
299
- }
300
- },
301
- children: [/*#__PURE__*/_jsx(Button, {
302
- variant: "textLight",
303
- children: "Button"
304
- }), /*#__PURE__*/_jsx(Button, {
305
- variant: "textLight",
306
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
307
- children: "Button"
308
- }), /*#__PURE__*/_jsx(Button, {
309
- variant: "textLight",
310
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
311
- children: "Button"
312
- }), /*#__PURE__*/_jsx(Button, {
313
- variant: "textLight",
314
- endIcon: /*#__PURE__*/_jsx(Chip, {
315
- label: "5"
316
- }),
317
- children: "Button"
318
- }), /*#__PURE__*/_jsx(Button, {
319
- variant: "textLight",
320
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
321
- endIcon: /*#__PURE__*/_jsx(Chip, {
322
- label: "5"
323
- }),
324
- children: "Button"
325
- }), /*#__PURE__*/_jsx(Button, {
326
- variant: "textLight",
327
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
328
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
329
- label: "5"
330
- })]
331
- }),
332
- children: "Button"
333
- }), /*#__PURE__*/_jsx(Button, {
334
- variant: "textLight",
335
- children: /*#__PURE__*/_jsx(ArrowRight, {})
336
- }), /*#__PURE__*/_jsx(Button, {
337
- variant: "textLight",
338
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
339
- disabled: true,
340
- children: "Button"
341
- })]
342
- }), /*#__PURE__*/_jsxs(Stack, {
343
- direction: "row",
344
- alignItems: "center",
345
- spacing: 8,
346
- children: [/*#__PURE__*/_jsx(Button, {
347
- variant: "textDark",
348
- children: "Button"
349
- }), /*#__PURE__*/_jsx(Button, {
350
- variant: "textDark",
351
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
352
- children: "Button"
353
- }), /*#__PURE__*/_jsx(Button, {
354
- variant: "textDark",
355
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
356
- children: "Button"
357
- }), /*#__PURE__*/_jsx(Button, {
358
- variant: "textDark",
359
- endIcon: /*#__PURE__*/_jsx(Chip, {
360
- label: "5"
361
- }),
362
- children: "Button"
363
- }), /*#__PURE__*/_jsx(Button, {
364
- variant: "textDark",
365
- startIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
366
- endIcon: /*#__PURE__*/_jsx(Chip, {
367
- label: "5"
368
- }),
369
- children: "Button"
370
- }), /*#__PURE__*/_jsx(Button, {
371
- variant: "textDark",
372
- endIcon: /*#__PURE__*/_jsxs(_Fragment, {
373
- children: [/*#__PURE__*/_jsx(ArrowRight, {}), /*#__PURE__*/_jsx(Chip, {
374
- label: "5"
375
- })]
376
- }),
377
- children: "Button"
378
- }), /*#__PURE__*/_jsx(Button, {
379
- variant: "textDark",
380
- children: /*#__PURE__*/_jsx(ArrowRight, {})
381
- }), /*#__PURE__*/_jsx(Button, {
382
- variant: "textDark",
383
- endIcon: /*#__PURE__*/_jsx(ArrowRight, {}),
384
- disabled: true,
385
- children: "Button"
386
- })]
387
- })]
388
- });
389
- }
390
- };
391
- export var Responsive = {
392
- args: {
393
- startIcon: true,
394
- endIcon: false,
395
- mobileIcon: "auto",
396
- mobileBreakpoint: "sm",
397
- disabled: false
398
- },
399
- argTypes: {
400
- startIcon: {
401
- name: "Start Icon",
402
- control: "boolean"
403
- },
404
- endIcon: {
405
- name: "End Icon",
406
- control: "boolean"
407
- },
408
- mobileIcon: {
409
- name: "Mobile Icon",
410
- control: "select",
411
- options: ["auto", "startIcon", "endIcon", "custom"]
412
- },
413
- mobileBreakpoint: {
414
- name: "Mobile Breakpoint",
415
- control: "select",
416
- options: ["xs", "sm", "md", "lg", "xl"]
417
- },
418
- disabled: {
419
- name: "Disabled",
420
- control: "boolean"
421
- }
422
- },
423
- render: function render(_ref2) {
424
- var startIcon = _ref2.startIcon,
425
- endIcon = _ref2.endIcon,
426
- mobileIcon = _ref2.mobileIcon,
427
- mobileBreakpoint = _ref2.mobileBreakpoint,
428
- disabled = _ref2.disabled;
429
- var customMobileIcon = /*#__PURE__*/_jsx(Favorite, {});
430
- return /*#__PURE__*/_jsx(Stack, {
431
- direction: "row",
432
- alignItems: "center",
433
- spacing: 2,
434
- children: /*#__PURE__*/_jsx(Button, {
435
- responsive: true,
436
- startIcon: startIcon ? /*#__PURE__*/_jsx(Wrench, {}) : undefined,
437
- endIcon: endIcon ? /*#__PURE__*/_jsx(Add, {}) : undefined,
438
- mobileIcon: mobileIcon === "custom" ? customMobileIcon : mobileIcon,
439
- mobileBreakpoint: mobileBreakpoint,
440
- disabled: disabled,
441
- children: "This is a responsive button"
442
- })
443
- });
444
- }
445
- };
@@ -1,8 +0,0 @@
1
- import { DeleteButton } from "../DeleteButton";
2
- var config = {
3
- component: DeleteButton,
4
- title: "components/common/buttons/delete/DeleteButton"
5
- };
6
- export default config;
7
- export var DeleteButtonStory = {};
8
- DeleteButtonStory.storyName = "DeleteButton";
@@ -1,214 +0,0 @@
1
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
- function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
5
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
6
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
7
- function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
8
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
9
- function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
10
- function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
11
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
12
- function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
13
- import { Edit } from "@comet/admin-icons";
14
- import { Box, Typography } from "@mui/material";
15
- import { useState } from "react";
16
- import { DatePicker } from "../DatePicker";
17
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
18
- var config = {
19
- component: DatePicker,
20
- title: "components/dateTime/DatePicker"
21
- };
22
- export default config;
23
-
24
- /**
25
- * The basic DatePicker component allows users to select a date from a calendar interface.
26
- *
27
- * Use this for date input fields where users need to pick a specific date.
28
- */
29
- export var Default = {
30
- render: function render(args) {
31
- var _useState = useState("2024-01-15"),
32
- _useState2 = _slicedToArray(_useState, 2),
33
- value = _useState2[0],
34
- setValue = _useState2[1];
35
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
36
- value: value,
37
- onChange: setValue
38
- }));
39
- }
40
- };
41
- export var FullWidth = {
42
- render: function render(args) {
43
- var _useState3 = useState("2024-01-15"),
44
- _useState4 = _slicedToArray(_useState3, 2),
45
- value = _useState4[0],
46
- setValue = _useState4[1];
47
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
48
- fullWidth: true,
49
- value: value,
50
- onChange: setValue
51
- }));
52
- }
53
- };
54
-
55
- /**
56
- * DatePicker in a required state.
57
- *
58
- * Use this when:
59
- * - The date selection is mandatory
60
- * - Form validation requires a date value
61
- * - Users must select a date to proceed
62
- *
63
- * Note: The clear button is automatically hidden when the field is required.
64
- */
65
- export var Required = {
66
- render: function render(args) {
67
- var _useState5 = useState("2024-01-15"),
68
- _useState6 = _slicedToArray(_useState5, 2),
69
- value = _useState6[0],
70
- setValue = _useState6[1];
71
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
72
- required: true,
73
- value: value,
74
- onChange: setValue
75
- }));
76
- }
77
- };
78
-
79
- /**
80
- * DatePicker in a disabled state.
81
- *
82
- * Use this when:
83
- * - The date cannot be changed due to permissions or state
84
- * - You want to show a date value but prevent interaction
85
- * - Form logic requires the field to be temporarily disabled
86
- */
87
- export var Disabled = {
88
- render: function render(args) {
89
- var _useState7 = useState("2024-01-15"),
90
- _useState8 = _slicedToArray(_useState7, 2),
91
- value = _useState8[0],
92
- setValue = _useState8[1];
93
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
94
- disabled: true,
95
- value: value,
96
- onChange: setValue
97
- }));
98
- }
99
- };
100
-
101
- /**
102
- * DatePicker in a read-only state.
103
- *
104
- * Use this when:
105
- * - The date should be visible but not editable
106
- * - You want to display a date value that cannot be modified
107
- * - The field is used for reference only
108
- */
109
- export var ReadOnly = {
110
- render: function render(args) {
111
- var _useState9 = useState("2024-01-15"),
112
- _useState0 = _slicedToArray(_useState9, 2),
113
- value = _useState0[0],
114
- setValue = _useState0[1];
115
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
116
- readOnly: true,
117
- value: value,
118
- onChange: setValue
119
- }));
120
- }
121
- };
122
-
123
- /**
124
- * DatePicker with a custom icon.
125
- *
126
- * Use this when:
127
- * - You want to match your brand's icon style
128
- * - The default calendar icon doesn't fit your design
129
- * - You need to indicate a specific type of date selection
130
- */
131
- export var WithCustomIcon = {
132
- render: function render(args) {
133
- var _useState1 = useState("2024-01-15"),
134
- _useState10 = _slicedToArray(_useState1, 2),
135
- value = _useState10[0],
136
- setValue = _useState10[1];
137
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
138
- value: value,
139
- onChange: setValue,
140
- iconMapping: {
141
- openPicker: /*#__PURE__*/_jsx(Edit, {})
142
- }
143
- }));
144
- }
145
- };
146
-
147
- /**
148
- * DatePicker with date restrictions.
149
- *
150
- * Use this when:
151
- * - Only certain dates should be selectable
152
- * - You need to limit selection to future or past dates
153
- * - Business rules require date range restrictions
154
- */
155
- export var WithDateRestrictions = {
156
- args: {
157
- minDate: new Date()
158
- },
159
- argTypes: {
160
- minDate: {
161
- control: "date"
162
- }
163
- },
164
- render: function render(args) {
165
- var _useState11 = useState(),
166
- _useState12 = _slicedToArray(_useState11, 2),
167
- value = _useState12[0],
168
- setValue = _useState12[1];
169
- return /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
170
- label: "Future Date Only",
171
- minDate: args.minDate,
172
- value: value,
173
- onChange: setValue
174
- }));
175
- }
176
- };
177
-
178
- /**
179
- * Multiple DatePicker instances demonstrating different configurations.
180
- *
181
- * This example shows how DatePickers can be combined in forms or interfaces
182
- * to collect multiple date values with different requirements and states.
183
- */
184
- export var MultiplePickers = {
185
- render: function render(args) {
186
- var _useState13 = useState("2024-01-15"),
187
- _useState14 = _slicedToArray(_useState13, 2),
188
- startDate = _useState14[0],
189
- setStartDate = _useState14[1];
190
- var _useState15 = useState("2024-01-30"),
191
- _useState16 = _slicedToArray(_useState15, 2),
192
- endDate = _useState16[0],
193
- setEndDate = _useState16[1];
194
- return /*#__PURE__*/_jsxs(Box, {
195
- display: "flex",
196
- flexDirection: "column",
197
- gap: 4,
198
- children: [/*#__PURE__*/_jsx(Typography, {
199
- variant: "h5",
200
- children: "Date Range Selection"
201
- }), /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
202
- label: "Start Date",
203
- fullWidth: true,
204
- value: startDate,
205
- onChange: setStartDate
206
- })), /*#__PURE__*/_jsx(DatePicker, _objectSpread(_objectSpread({}, args), {}, {
207
- label: "End Date",
208
- fullWidth: true,
209
- value: endDate,
210
- onChange: setEndDate
211
- }))]
212
- });
213
- }
214
- };