@trsys-tech/matrix-library 0.4.8 → 0.5.0-alpha.1

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 (21) hide show
  1. package/dist/calendar.es.js +38 -38
  2. package/dist/calendar.es.js.map +1 -1
  3. package/dist/components/data-grid/DataGrid.d.ts +6 -3
  4. package/dist/components/data-grid/DataGrid.d.ts.map +1 -1
  5. package/dist/components/date-picker/DesktopDatePicker.d.ts.map +1 -1
  6. package/dist/components/date-picker/DesktopDateRangePicker.d.ts.map +1 -1
  7. package/dist/components/date-picker/MobileDatePicker.d.ts.map +1 -1
  8. package/dist/components/date-picker/MobileDateRangePicker.d.ts.map +1 -1
  9. package/dist/components/date-picker/calendar.d.ts.map +1 -1
  10. package/dist/datagrid.es.js +104 -97
  11. package/dist/datagrid.es.js.map +1 -1
  12. package/dist/desktopdatepicker.es.js +27 -24
  13. package/dist/desktopdatepicker.es.js.map +1 -1
  14. package/dist/desktopdaterangepicker.es.js +24 -12
  15. package/dist/desktopdaterangepicker.es.js.map +1 -1
  16. package/dist/mobiledatepicker.es.js +37 -25
  17. package/dist/mobiledatepicker.es.js.map +1 -1
  18. package/dist/mobiledaterangepicker.es.js +54 -42
  19. package/dist/mobiledaterangepicker.es.js.map +1 -1
  20. package/dist/style.css +1 -1
  21. package/package.json +3 -3
package/dist/mobiledaterangepicker.es.js CHANGED
@@ -1,15 +1,15 @@
1
- import { jsxs as a, Fragment as R, jsx as r } from "react/jsx-runtime";
1
+ import { jsxs as t, Fragment as F, jsx as o } from "react/jsx-runtime";
2
2
  import * as f from "react";
3
- import { VisuallyHidden as F } from "@radix-ui/react-visually-hidden";
3
+ import { VisuallyHidden as R } from "@radix-ui/react-visually-hidden";
4
4
  import { Calendar as O } from "@trsys-tech/matrix-icons";
5
5
  import { cn as p } from "./utils.es.js";
6
6
  import { Calendar as P } from "./calendar.es.js";
7
7
  import { Button as m } from "./button.es.js";
8
8
  import { Dialog as $, DialogContent as A, DialogHeader as H, DialogTitle as B, DialogDescription as I } from "./dialog.es.js";
9
9
  import { formatDate as l } from "./format.es.js";
10
- const L = ({
10
+ const K = ({
11
11
  formatStr: n,
12
- selected: o,
12
+ selected: r,
13
13
  placeholder: d,
14
14
  className: h,
15
15
  calendarClassName: g,
@@ -17,20 +17,20 @@ const L = ({
17
17
  cancelText: x,
18
18
  applyText: u,
19
19
  onSelect: b,
20
- fromText: v,
21
- toText: N,
22
- disabled: M,
23
- ...C
20
+ fromText: M,
21
+ toText: v,
22
+ disabled: N,
23
+ ...D
24
24
  }) => {
25
- const [T, s] = f.useState(!1), [e, i] = f.useState(o), D = (t, k, j) => {
26
- y?.(t, k, j), !e || !e.from ? i({ from: t, to: void 0 }) : t < e.from ? e.to ? i({ from: t, to: e.to }) : i({ from: t, to: e.from }) : e?.from?.getTime() === t?.getTime() && (e?.from?.getTime() === e?.to?.getTime() || !e.to) ? i(void 0) : e?.from?.getTime() !== e?.to?.getTime() && (e.from?.getTime() === t?.getTime() || e?.to?.getTime() === t?.getTime()) ? i({ from: t, to: t }) : i({ ...e, to: t });
25
+ const [w, s] = f.useState(!1), [e, i] = f.useState(r), C = (a, k, j) => {
26
+ y?.(a, k, j), !e || !e.from ? i({ from: a, to: void 0 }) : a < e.from ? e.to ? i({ from: a, to: e.to }) : i({ from: a, to: e.from }) : e?.from?.getTime() === a?.getTime() && (e?.from?.getTime() === e?.to?.getTime() || !e.to) ? i(void 0) : e?.from?.getTime() !== e?.to?.getTime() && (e.from?.getTime() === a?.getTime() || e?.to?.getTime() === a?.getTime()) ? i({ from: a, to: a }) : i({ ...e, to: a });
27
27
  }, c = () => {
28
- s(!1), i(o);
29
- }, w = () => {
28
+ s(!1), i(r);
29
+ }, T = () => {
30
30
  b?.(e), s(!1);
31
31
  };
32
- return /* @__PURE__ */ a(R, { children: [
33
- /* @__PURE__ */ a(
32
+ return /* @__PURE__ */ t(F, { children: [
33
+ /* @__PURE__ */ t(
34
34
  m,
35
35
  {
36
36
  variant: "text",
@@ -38,53 +38,65 @@ const L = ({
38
38
  "flex h-8 w-full items-center justify-between whitespace-nowrap rounded-sm border border-input bg-transparent ps-3 pe-1 py-1.5 text-sm ring-offset-background data-[placeholder]:text-muted-foreground hover:border hover:border-primary hover:bg-transparent focus:border focus:border-primary focus:outline-none focus:ring focus:ring-primary-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-text-300 disabled:border-gray-100 [&>span]:line-clamp-1 [&_svg]:disabled:text-text-300",
39
39
  h
40
40
  ),
41
- "data-placeholder": o ? void 0 : "",
41
+ "data-placeholder": r ? void 0 : "",
42
42
  onClick: () => s(!0),
43
- "aria-label": o ? `Selected date: ${o?.from ? l(o.from, n ?? "yyyy/MM/dd") : ""} - ${o?.to ? l(o.to, n ?? "yyyy/MM/dd") : ""}` : d,
44
- disabled: M,
43
+ "aria-label": r ? `Selected date: ${r?.from ? l(r.from, n ?? "yyyy/MM/dd") : ""} - ${r?.to ? l(r.to, n ?? "yyyy/MM/dd") : ""}` : d,
44
+ disabled: N,
45
45
  children: [
46
- o ? /* @__PURE__ */ a("div", { className: "grid grid-cols-2 flex-1 justify-items-start", children: [
47
- /* @__PURE__ */ a("span", { children: [
48
- v ?? "From",
46
+ r ? /* @__PURE__ */ t("div", { className: "grid grid-cols-2 flex-1 justify-items-start", children: [
47
+ /* @__PURE__ */ t("span", { children: [
48
+ M ?? "From",
49
49
  ": ",
50
- o?.from ? l(o.from, n ?? "yyyy/MM/dd") : "-"
50
+ r?.from ? l(r.from, n ?? "yyyy/MM/dd") : "-"
51
51
  ] }),
52
52
  " ",
53
- /* @__PURE__ */ a("span", { children: [
54
- N ?? "To",
53
+ /* @__PURE__ */ t("span", { children: [
54
+ v ?? "To",
55
55
  ": ",
56
- o?.to ? l(o.to, n ?? "yyyy/MM/dd") : "-"
56
+ r?.to ? l(r.to, n ?? "yyyy/MM/dd") : "-"
57
57
  ] })
58
- ] }) : /* @__PURE__ */ r("span", { children: d ?? "Pick a Range" }),
59
- /* @__PURE__ */ r(O, { className: "mr-2 h-5 w-4 ms-auto" })
58
+ ] }) : /* @__PURE__ */ o("span", { children: d ?? "Pick a Range" }),
59
+ /* @__PURE__ */ o(O, { className: "mr-2 h-5 w-4 ms-auto" })
60
60
  ]
61
61
  }
62
62
  ),
63
- /* @__PURE__ */ r($, { open: T, onOpenChange: c, children: /* @__PURE__ */ a(A, { className: "h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none", children: [
64
- /* @__PURE__ */ a(H, { children: [
65
- /* @__PURE__ */ r(B, { asChild: !0, children: /* @__PURE__ */ a("div", { className: "grid grid-cols-2 border-b border-b-gray-200 mt-3", children: [
66
- /* @__PURE__ */ a("div", { className: "text-sm font-bold space-y-1 border-e border-e-gray-200 p-4", children: [
67
- /* @__PURE__ */ r("h5", { className: "text-text-300 font-medium text-xs", children: "From" }),
68
- /* @__PURE__ */ r("h6", { className: "", children: e?.from ? l(e.from, n ?? "eee, MMM dd") : /* @__PURE__ */ r("pre", { children: " " }) })
63
+ /* @__PURE__ */ o($, { open: w, onOpenChange: c, children: /* @__PURE__ */ t(A, { className: "h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none", children: [
64
+ /* @__PURE__ */ t(H, { children: [
65
+ /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ t("div", { className: "grid grid-cols-2 border-b border-b-gray-200 mt-3", children: [
66
+ /* @__PURE__ */ t("div", { className: "text-sm font-bold space-y-1 border-e border-e-gray-200 p-4", children: [
67
+ /* @__PURE__ */ o("h5", { className: "text-text-300 font-medium text-xs", children: "From" }),
68
+ /* @__PURE__ */ o("h6", { className: "", children: e?.from ? l(e.from, n ?? "eee, MMM dd") : /* @__PURE__ */ o("pre", { children: " " }) })
69
69
  ] }),
70
- /* @__PURE__ */ a("div", { className: "text-sm font-bold space-y-1 p-4 flex flex-col justify-center", children: [
71
- /* @__PURE__ */ r("h5", { className: "text-text-300 font-medium text-xs", children: "To" }),
72
- /* @__PURE__ */ r("h6", { className: "", children: e?.to ? l(e.to, n ?? "eee, MMM dd") : /* @__PURE__ */ r("pre", { children: " " }) })
70
+ /* @__PURE__ */ t("div", { className: "text-sm font-bold space-y-1 p-4 flex flex-col justify-center", children: [
71
+ /* @__PURE__ */ o("h5", { className: "text-text-300 font-medium text-xs", children: "To" }),
72
+ /* @__PURE__ */ o("h6", { className: "", children: e?.to ? l(e.to, n ?? "eee, MMM dd") : /* @__PURE__ */ o("pre", { children: " " }) })
73
73
  ] })
74
74
  ] }) }),
75
- /* @__PURE__ */ r(F, { children: /* @__PURE__ */ r(I, { children: "Date Picker" }) })
75
+ /* @__PURE__ */ o(R, { children: /* @__PURE__ */ o(I, { children: "Date Picker" }) })
76
76
  ] }),
77
- /* @__PURE__ */ a("div", { className: "flex-1 flex flex-col items-center p-4", children: [
78
- /* @__PURE__ */ r(P, { ...C, mode: "range", selected: o, onDayClick: D, className: p("p-0", g) }),
79
- /* @__PURE__ */ a("div", { className: "flex justify-center items-center gap-4 mt-auto w-full", children: [
80
- /* @__PURE__ */ r(m, { variant: "text", className: "flex-1 h-10", onClick: c, children: x ?? "Cancel" }),
81
- /* @__PURE__ */ r(m, { variant: "primary", className: "flex-1 h-10", onClick: w, children: u ?? "Apply" })
77
+ /* @__PURE__ */ t("div", { className: "flex-1 flex flex-col items-center p-4", children: [
78
+ /* @__PURE__ */ o(
79
+ P,
80
+ {
81
+ defaultMonth: r?.from,
82
+ startMonth: new Date(2e3, 0, 1),
83
+ endMonth: new Date((/* @__PURE__ */ new Date()).getFullYear() + 2, 11, 31),
84
+ ...D,
85
+ mode: "range",
86
+ selected: r,
87
+ onDayClick: C,
88
+ className: p("p-0", g)
89
+ }
90
+ ),
91
+ /* @__PURE__ */ t("div", { className: "flex justify-center items-center gap-4 mt-auto w-full", children: [
92
+ /* @__PURE__ */ o(m, { variant: "text", className: "flex-1 h-10", onClick: c, children: x ?? "Cancel" }),
93
+ /* @__PURE__ */ o(m, { variant: "primary", className: "flex-1 h-10", onClick: T, children: u ?? "Apply" })
82
94
  ] })
83
95
  ] })
84
96
  ] }) })
85
97
  ] });
86
98
  };
87
99
  export {
88
- L as MobileDateRangePicker
100
+ K as MobileDateRangePicker
89
101
  };
90
102
  //# sourceMappingURL=mobiledaterangepicker.es.js.map
package/dist/mobiledaterangepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"mobiledaterangepicker.es.js","sources":["../src/components/date-picker/MobileDateRangePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\nimport { PropsBase, PropsRange, DateRange, DayEventHandler } from \"react-day-picker\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from \"../dialog/Dialog\";\r\n\r\ntype MobileDateRangePickerProps = PropsBase &\r\n Omit<PropsRange, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: DateRange;\r\n required?: boolean;\r\n cancelText?: string;\r\n applyText?: string;\r\n onSelect?: (date: DateRange | undefined) => void;\r\n fromText?: string;\r\n toText?: string;\r\n disabled?: boolean;\r\n };\r\n\r\nconst MobileDateRangePicker: React.FC<MobileDateRangePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n onDayClick,\r\n cancelText,\r\n applyText,\r\n onSelect,\r\n fromText,\r\n toText,\r\n disabled,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n const [range, setRange] = React.useState<DateRange | undefined>(selected);\r\n\r\n const handleDayClick: DayEventHandler<React.MouseEvent<Element, MouseEvent>> = (date, modifiers, e) => {\r\n onDayClick?.(date, modifiers, e);\r\n if (!range || !range.from) {\r\n setRange({ from: date, to: undefined });\r\n } else if (date < range.from) {\r\n if (!range.to) {\r\n setRange({ from: date, to: range.from });\r\n } else {\r\n setRange({ from: date, to: range.to });\r\n }\r\n } else if (range?.from?.getTime() === date?.getTime() && (range?.from?.getTime() === range?.to?.getTime() || !range.to)) {\r\n setRange(undefined);\r\n } else if (\r\n range?.from?.getTime() !== range?.to?.getTime() &&\r\n (range.from?.getTime() === date?.getTime() || range?.to?.getTime() === date?.getTime())\r\n ) {\r\n setRange({ from: date, to: date });\r\n } else {\r\n setRange({ ...range, to: date });\r\n }\r\n };\r\n\r\n const handleCancel = () => {\r\n setIsOpen(false);\r\n setRange(selected);\r\n };\r\n\r\n const handleApply = () => {\r\n onSelect?.(range);\r\n setIsOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <Button\r\n variant=\"text\"\r\n className={cn(\r\n \"flex h-8 w-full items-center justify-between whitespace-nowrap rounded-sm border border-input bg-transparent ps-3 pe-1 py-1.5 text-sm ring-offset-background data-[placeholder]:text-muted-foreground hover:border hover:border-primary hover:bg-transparent focus:border focus:border-primary focus:outline-none focus:ring focus:ring-primary-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-text-300 disabled:border-gray-100 [&>span]:line-clamp-1 [&_svg]:disabled:text-text-300\",\r\n className,\r\n )}\r\n data-placeholder={!selected ? \"\" : undefined}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={\r\n selected\r\n ? `Selected date: ${selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"\"} - ${selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"\"}`\r\n : placeholder\r\n }\r\n disabled={disabled}\r\n >\r\n {selected ? (\r\n <div className=\"grid grid-cols-2 flex-1 justify-items-start\">\r\n <span>\r\n {fromText ?? \"From\"}: {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>{\" \"}\r\n <span>\r\n {toText ?? \"To\"}: {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>\r\n </div>\r\n ) : (\r\n <span>{placeholder ?? \"Pick a Range\"}</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-5 w-4 ms-auto\" />\r\n </Button>\r\n <Dialog open={isOpen} onOpenChange={handleCancel}>\r\n <DialogContent className=\"h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none\">\r\n <DialogHeader>\r\n <DialogTitle asChild>\r\n <div className=\"grid grid-cols-2 border-b border-b-gray-200 mt-3\">\r\n <div className=\"text-sm font-bold space-y-1 border-e border-e-gray-200 p-4\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">From</h5>\r\n <h6 className=\"\">{range?.from ? format(range.from, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n <div className=\"text-sm font-bold space-y-1 p-4 flex flex-col justify-center\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">To</h5>\r\n <h6 className=\"\">{range?.to ? format(range.to, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n </div>\r\n </DialogTitle>\r\n <VisuallyHidden>\r\n <DialogDescription>{\"Date Picker\"}</DialogDescription>\r\n </VisuallyHidden>\r\n </DialogHeader>\r\n <div className=\"flex-1 flex flex-col items-center p-4\">\r\n <Calendar {...props} mode=\"range\" selected={selected} onDayClick={handleDayClick} className={cn(\"p-0\", calendarClassName)} />\r\n\r\n <div className=\"flex justify-center items-center gap-4 mt-auto w-full\">\r\n <Button variant=\"text\" className=\"flex-1 h-10\" onClick={handleCancel}>\r\n {cancelText ?? \"Cancel\"}\r\n </Button>\r\n <Button variant=\"primary\" className=\"flex-1 h-10\" onClick={handleApply}>\r\n {applyText ?? \"Apply\"}\r\n </Button>\r\n </div>\r\n </div>\r\n </DialogContent>\r\n </Dialog>\r\n </>\r\n );\r\n};\r\n\r\nexport { MobileDateRangePicker, type MobileDateRangePickerProps };\r\n"],"names":["MobileDateRangePicker","formatStr","selected","placeholder","className","calendarClassName","onDayClick","cancelText","applyText","onSelect","fromText","toText","disabled","props","isOpen","setIsOpen","React","range","setRange","handleDayClick","date","modifiers","e","handleCancel","handleApply","jsxs","Fragment","Button","cn","format","jsx","CalendarIcon","Dialog","DialogContent","DialogHeader","DialogTitle","VisuallyHidden","DialogDescription","Calendar"],"mappings":";;;;;;;;;AA4BA,MAAMA,IAA8D,CAAC;AAAA,EACnE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAC1C,CAACC,GAAOC,CAAQ,IAAIF,EAAM,SAAgCd,CAAQ,GAElEiB,IAAyE,CAACC,GAAMC,GAAWC,MAAM;AACxF,IAAAhB,IAAAc,GAAMC,GAAWC,CAAC,GAC3B,CAACL,KAAS,CAACA,EAAM,OACnBC,EAAS,EAAE,MAAME,GAAM,IAAI,QAAW,IAC7BA,IAAOH,EAAM,OACjBA,EAAM,KAGTC,EAAS,EAAE,MAAME,GAAM,IAAIH,EAAM,IAAI,IAFrCC,EAAS,EAAE,MAAME,GAAM,IAAIH,EAAM,MAAM,IAIhCA,GAAO,MAAM,QAAc,MAAAG,GAAM,cAAcH,GAAO,MAAM,QAAA,MAAcA,GAAO,IAAI,aAAa,CAACA,EAAM,MAClHC,EAAS,MAAS,IAElBD,GAAO,MAAM,cAAcA,GAAO,IAAI,cACrCA,EAAM,MAAM,cAAcG,GAAM,QAAa,KAAAH,GAAO,IAAI,cAAcG,GAAM,QAAA,KAE7EF,EAAS,EAAE,MAAME,GAAM,IAAIA,GAAM,IAEjCF,EAAS,EAAE,GAAGD,GAAO,IAAIG,GAAM;AAAA,EAEnC,GAEMG,IAAe,MAAM;AACzB,IAAAR,EAAU,EAAK,GACfG,EAAShB,CAAQ;AAAA,EACnB,GAEMsB,IAAc,MAAM;AACxB,IAAAf,IAAWQ,CAAK,GAChBF,EAAU,EAAK;AAAA,EACjB;AAEA,SAEI,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAWC;AAAA,UACT;AAAA,UACAxB;AAAA,QACF;AAAA,QACA,oBAAmBF,IAAgB,SAAL;AAAA,QAC9B,SAAS,MAAMa,EAAU,EAAI;AAAA,QAC7B,cACEb,IACI,kBAAkBA,GAAU,OAAO2B,EAAO3B,EAAS,MAAMD,KAAa,YAAY,IAAI,EAAE,MAAMC,GAAU,KAAK2B,EAAO3B,EAAS,IAAID,KAAa,YAAY,IAAI,EAAE,KAChKE;AAAA,QAEN,UAAAS;AAAA,QAEC,UAAA;AAAA,UACCV,IAAA,gBAAAuB,EAAC,OAAI,EAAA,WAAU,+CACb,UAAA;AAAA,YAAA,gBAAAA,EAAC,QACE,EAAA,UAAA;AAAA,cAAYf,KAAA;AAAA,cAAO;AAAA,cAAGR,GAAU,OAAO2B,EAAO3B,EAAS,MAAMD,KAAa,YAAY,IAAI;AAAA,YAAA,GAC7F;AAAA,YAAQ;AAAA,8BACP,QACE,EAAA,UAAA;AAAA,cAAUU,KAAA;AAAA,cAAK;AAAA,cAAGT,GAAU,KAAK2B,EAAO3B,EAAS,IAAID,KAAa,YAAY,IAAI;AAAA,YAAA,EACrF,CAAA;AAAA,UAAA,EACF,CAAA,IAEA,gBAAA6B,EAAC,QAAM,EAAA,UAAA3B,KAAe,gBAAe;AAAA,UAEvC,gBAAA2B,EAACC,GAAa,EAAA,WAAU,uBAAuB,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACjD;AAAA,IACA,gBAAAD,EAACE,KAAO,MAAMlB,GAAQ,cAAcS,GAClC,UAAA,gBAAAE,EAACQ,GAAc,EAAA,WAAU,qLACvB,UAAA;AAAA,MAAA,gBAAAR,EAACS,GACC,EAAA,UAAA;AAAA,QAAA,gBAAAJ,EAACK,KAAY,SAAO,IAClB,UAAC,gBAAAV,EAAA,OAAA,EAAI,WAAU,oDACb,UAAA;AAAA,UAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,8DACb,UAAA;AAAA,YAAC,gBAAAK,EAAA,MAAA,EAAG,WAAU,qCAAoC,UAAI,QAAA;AAAA,YACrD,gBAAAA,EAAA,MAAA,EAAG,WAAU,IAAI,aAAO,OAAOD,EAAOZ,EAAM,MAAMhB,KAAa,aAAa,IAAK,gBAAA6B,EAAA,OAAA,EAAI,eAAC,EAAO,CAAA;AAAA,UAAA,GAChG;AAAA,UACA,gBAAAL,EAAC,OAAI,EAAA,WAAU,gEACb,UAAA;AAAA,YAAC,gBAAAK,EAAA,MAAA,EAAG,WAAU,qCAAoC,UAAE,MAAA;AAAA,YACnD,gBAAAA,EAAA,MAAA,EAAG,WAAU,IAAI,aAAO,KAAKD,EAAOZ,EAAM,IAAIhB,KAAa,aAAa,IAAK,gBAAA6B,EAAA,OAAA,EAAI,eAAC,EAAO,CAAA;AAAA,UAAA,EAC5F,CAAA;AAAA,QAAA,EAAA,CACF,EACF,CAAA;AAAA,QACC,gBAAAA,EAAAM,GAAA,EACC,UAAC,gBAAAN,EAAAO,GAAA,EAAmB,yBAAc,EACpC,CAAA;AAAA,MAAA,GACF;AAAA,MACA,gBAAAZ,EAAC,OAAI,EAAA,WAAU,yCACb,UAAA;AAAA,QAAA,gBAAAK,EAACQ,GAAU,EAAA,GAAGzB,GAAO,MAAK,SAAQ,UAAAX,GAAoB,YAAYiB,GAAgB,WAAWS,EAAG,OAAOvB,CAAiB,EAAG,CAAA;AAAA,QAE3H,gBAAAoB,EAAC,OAAI,EAAA,WAAU,yDACb,UAAA;AAAA,UAAC,gBAAAK,EAAAH,GAAA,EAAO,SAAQ,QAAO,WAAU,eAAc,SAASJ,GACrD,eAAc,SACjB,CAAA;AAAA,UACA,gBAAAO,EAACH,KAAO,SAAQ,WAAU,WAAU,eAAc,SAASH,GACxD,UAAAhB,KAAa,QAChB,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA,EAAA,CACF,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"mobiledaterangepicker.es.js","sources":["../src/components/date-picker/MobileDateRangePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\nimport { PropsBase, PropsRange, DateRange, DayEventHandler } from \"react-day-picker\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from \"../dialog/Dialog\";\r\n\r\ntype MobileDateRangePickerProps = PropsBase &\r\n Omit<PropsRange, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: DateRange;\r\n required?: boolean;\r\n cancelText?: string;\r\n applyText?: string;\r\n onSelect?: (date: DateRange | undefined) => void;\r\n fromText?: string;\r\n toText?: string;\r\n disabled?: boolean;\r\n };\r\n\r\nconst MobileDateRangePicker: React.FC<MobileDateRangePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n onDayClick,\r\n cancelText,\r\n applyText,\r\n onSelect,\r\n fromText,\r\n toText,\r\n disabled,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n const [range, setRange] = React.useState<DateRange | undefined>(selected);\r\n\r\n const handleDayClick: DayEventHandler<React.MouseEvent<Element, MouseEvent>> = (date, modifiers, e) => {\r\n onDayClick?.(date, modifiers, e);\r\n if (!range || !range.from) {\r\n setRange({ from: date, to: undefined });\r\n } else if (date < range.from) {\r\n if (!range.to) {\r\n setRange({ from: date, to: range.from });\r\n } else {\r\n setRange({ from: date, to: range.to });\r\n }\r\n } else if (range?.from?.getTime() === date?.getTime() && (range?.from?.getTime() === range?.to?.getTime() || !range.to)) {\r\n setRange(undefined);\r\n } else if (\r\n range?.from?.getTime() !== range?.to?.getTime() &&\r\n (range.from?.getTime() === date?.getTime() || range?.to?.getTime() === date?.getTime())\r\n ) {\r\n setRange({ from: date, to: date });\r\n } else {\r\n setRange({ ...range, to: date });\r\n }\r\n };\r\n\r\n const handleCancel = () => {\r\n setIsOpen(false);\r\n setRange(selected);\r\n };\r\n\r\n const handleApply = () => {\r\n onSelect?.(range);\r\n setIsOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <Button\r\n variant=\"text\"\r\n className={cn(\r\n \"flex h-8 w-full items-center justify-between whitespace-nowrap rounded-sm border border-input bg-transparent ps-3 pe-1 py-1.5 text-sm ring-offset-background data-[placeholder]:text-muted-foreground hover:border hover:border-primary hover:bg-transparent focus:border focus:border-primary focus:outline-none focus:ring focus:ring-primary-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-text-300 disabled:border-gray-100 [&>span]:line-clamp-1 [&_svg]:disabled:text-text-300\",\r\n className,\r\n )}\r\n data-placeholder={!selected ? \"\" : undefined}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={\r\n selected\r\n ? `Selected date: ${selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"\"} - ${selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"\"}`\r\n : placeholder\r\n }\r\n disabled={disabled}\r\n >\r\n {selected ? (\r\n <div className=\"grid grid-cols-2 flex-1 justify-items-start\">\r\n <span>\r\n {fromText ?? \"From\"}: {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>{\" \"}\r\n <span>\r\n {toText ?? \"To\"}: {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>\r\n </div>\r\n ) : (\r\n <span>{placeholder ?? \"Pick a Range\"}</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-5 w-4 ms-auto\" />\r\n </Button>\r\n <Dialog open={isOpen} onOpenChange={handleCancel}>\r\n <DialogContent className=\"h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none\">\r\n <DialogHeader>\r\n <DialogTitle asChild>\r\n <div className=\"grid grid-cols-2 border-b border-b-gray-200 mt-3\">\r\n <div className=\"text-sm font-bold space-y-1 border-e border-e-gray-200 p-4\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">From</h5>\r\n <h6 className=\"\">{range?.from ? format(range.from, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n <div className=\"text-sm font-bold space-y-1 p-4 flex flex-col justify-center\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">To</h5>\r\n <h6 className=\"\">{range?.to ? format(range.to, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n </div>\r\n </DialogTitle>\r\n <VisuallyHidden>\r\n <DialogDescription>{\"Date Picker\"}</DialogDescription>\r\n </VisuallyHidden>\r\n </DialogHeader>\r\n <div className=\"flex-1 flex flex-col items-center p-4\">\r\n <Calendar\r\n defaultMonth={selected?.from}\r\n startMonth={new Date(2000, 0, 1)}\r\n endMonth={new Date(new Date().getFullYear() + 2, 11, 31)}\r\n {...props}\r\n mode=\"range\"\r\n selected={selected}\r\n onDayClick={handleDayClick}\r\n className={cn(\"p-0\", calendarClassName)}\r\n />\r\n\r\n <div className=\"flex justify-center items-center gap-4 mt-auto w-full\">\r\n <Button variant=\"text\" className=\"flex-1 h-10\" onClick={handleCancel}>\r\n {cancelText ?? \"Cancel\"}\r\n </Button>\r\n <Button variant=\"primary\" className=\"flex-1 h-10\" onClick={handleApply}>\r\n {applyText ?? \"Apply\"}\r\n </Button>\r\n </div>\r\n </div>\r\n </DialogContent>\r\n </Dialog>\r\n </>\r\n );\r\n};\r\n\r\nexport { MobileDateRangePicker, type MobileDateRangePickerProps };\r\n"],"names":["MobileDateRangePicker","formatStr","selected","placeholder","className","calendarClassName","onDayClick","cancelText","applyText","onSelect","fromText","toText","disabled","props","isOpen","setIsOpen","React","range","setRange","handleDayClick","date","modifiers","e","handleCancel","handleApply","jsxs","Fragment","Button","cn","format","jsx","CalendarIcon","Dialog","DialogContent","DialogHeader","DialogTitle","VisuallyHidden","DialogDescription","Calendar"],"mappings":"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"}