dgz-ui-shared 1.2.19 → 1.2.21
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/chunks/DateRangePicker-CUv-qznZ.cjs.js +2 -0
- package/dist/chunks/DateRangePicker-CUv-qznZ.cjs.js.map +1 -0
- package/dist/chunks/{DateRangePicker-BEguo3VF.es.js → DateRangePicker-DeoV3xqL.es.js} +59 -59
- package/dist/chunks/DateRangePicker-DeoV3xqL.es.js.map +1 -0
- package/dist/components/datepicker/index.cjs.js +1 -1
- package/dist/components/datepicker/index.es.js +1 -1
- package/dist/components/form/index.cjs.js +1 -1
- package/dist/components/form/index.es.js +1 -1
- package/package.json +1 -2
- package/dist/chunks/DateRangePicker-BEguo3VF.es.js.map +0 -1
- package/dist/chunks/DateRangePicker-lHqe5Mb6.cjs.js +0 -2
- package/dist/chunks/DateRangePicker-lHqe5Mb6.cjs.js.map +0 -1
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),k=require("dgz-ui/button"),u=require("dgz-ui/calendar"),L=require("dgz-ui/form"),h=require("dgz-ui/popover"),a=require("dgz-ui/utils"),v=require("lucide-react"),c=require("react"),P=require("react-i18next"),w=({className:j,format:f=u.DATE,selected:s,timezone:y,onRangeSelected:i=()=>{},placeholder:O,disabled:l,error:T,inputProps:q,...b})=>{const{t:r}=P.useTranslation(),[N,D]=c.useState(!1),[t,m]=c.useState();c.useEffect(()=>{m(s)},[s]);const C=c.useMemo(()=>{const o=a.dayjs().endOf("day");return[{from:o.startOf("week").toDate(),to:o.endOf("week").toDate(),label:r("This week")},{from:o.startOf("month").toDate(),to:o.endOf("month").toDate(),label:r("This month")},{from:o.startOf("year").toDate(),to:o.endOf("year").toDate(),label:r("This year")},{from:o.subtract(7,"day").startOf("day").toDate(),to:o.toDate(),label:r("Last 7 days")},{from:o.subtract(30,"day").startOf("day").toDate(),to:o.toDate(),label:r("Last 30 days")},{from:o.subtract(3,"month").startOf("day").toDate(),to:o.toDate(),label:r("Last 3 months")},{from:o.subtract(6,"month").startOf("day").toDate(),to:o.toDate(),label:r("Last 6 months")},{from:o.subtract(12,"month").startOf("day").toDate(),to:o.toDate(),label:r("Last 12 months")}].map(n=>{var p,x;return{...n,isActive:((p=s==null?void 0:s.from)==null?void 0:p.getTime())===n.from.getTime()&&((x=s==null?void 0:s.to)==null?void 0:x.getTime())===n.to.getTime()}})},[r,s]),d=o=>{m(o),o!=null&&o.from&&(o!=null&&o.to)&&(i(o),D(!1))};return e.jsxs(h.Popover,{open:N,onOpenChange:D,children:[e.jsx(h.PopoverTrigger,{asChild:!0,className:"m-0!",disabled:l,children:e.jsxs("div",{className:"relative",children:[e.jsx(L.Input,{variant:T?"failure":"default",...q,readOnly:!0,value:t!=null&&t.from?t.to?`${a.dayjs(t.from).format(f)}-${a.dayjs(t.to).format(f)}`:a.dayjs(t.from).format(f):"",placeholder:O,disabled:l,className:a.cn(j)}),t&&e.jsx(v.XIcon,{onClick:()=>{m(void 0),i==null||i(void 0)},className:a.cn("text-secondary absolute top-3 right-8 size-4 cursor-pointer",l&&"pointer-events-none opacity-50")}),e.jsx(v.Calendar1,{className:a.cn("text-secondary absolute top-2.5 right-2 size-5",l&&"pointer-events-none opacity-50")})]})}),e.jsxs(h.PopoverContent,{className:"flex w-auto p-0",align:"end",side:"bottom",children:[e.jsx("div",{className:"border-border-alpha-light flex flex-col space-y-1 border-e p-2",children:C.map((o,n)=>e.jsx(k.Button,{size:"xs",variant:o.isActive?"default":"ghost",className:"justify-start",onClick:()=>d(o),children:o.label},n))}),e.jsx(u.Calendar,{...b,className:"border-border-alpha-light border-e",mode:"single",endMonth:t==null?void 0:t.to,selected:t==null?void 0:t.from,selectedToDate:t==null?void 0:t.to,selectedFromDate:t==null?void 0:t.from,timeZone:y,disabled:t!=null&&t.to?{after:t.to}:void 0,onSelect:o=>{m({...t,from:o})}}),e.jsx(u.Calendar,{...b,mode:"single",startMonth:t==null?void 0:t.from,selected:t==null?void 0:t.to,timeZone:y,disabled:t!=null&&t.from?{before:t.from}:void 0,selectedToDate:t==null?void 0:t.to,selectedFromDate:t==null?void 0:t.from,onSelect:o=>{t&&d({...t,to:o})}})]})]})};exports.DateRangePicker=w;
|
|
2
|
+
//# sourceMappingURL=DateRangePicker-CUv-qznZ.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker-CUv-qznZ.cjs.js","sources":["../../src/components/datepicker/DateRangePicker.tsx"],"sourcesContent":["import { Button } from 'dgz-ui/button';\nimport { Calendar, type CalendarProps, DATE } from 'dgz-ui/calendar';\nimport { Input, type InputProps } from 'dgz-ui/form';\nimport { Popover, PopoverContent, PopoverTrigger } from 'dgz-ui/popover';\nimport { cn, dayjs } from 'dgz-ui/utils';\nimport { Calendar1, XIcon } from 'lucide-react';\nimport { type ReactNode, useEffect, useMemo, useState } from 'react';\nimport { type DateRange } from 'react-day-picker';\nimport { useTranslation } from 'react-i18next';\n\n/**\n * Props for the DateRangePicker component.\n */\nexport type DateRangePickerProps = Omit<\n CalendarProps,\n 'mode' | 'disabled' | 'selected'\n> & {\n /** The date format string (e.g., 'YYYY-MM-DD'). */\n format?: string;\n /** Placeholder text when no date is selected. */\n placeholder?: string;\n /** The currently selected date range. */\n selected?: DateRange;\n /** Timezone for date calculations. */\n timezone?: string;\n /** Error message to display (modifies styling). */\n error?: string;\n /** Callback function when a date range is selected. */\n onRangeSelected?: (value?: DateRange) => void;\n inputProps?: InputProps;\n disabled?: boolean;\n};\n\n/**\n * Type definition for a date range preset configuration.\n */\ntype PresetType = DateRange & {\n /** Label for the preset (e.g., \"Last 7 days\"). */\n label: ReactNode;\n isActive?: boolean;\n};\n\n/**\n * DateRangePicker displays a two-month range picker with helpful presets.\n *\n * @param props.format - Display date format.\n * @param props.selected - Currently selected date range.\n * @param props.timezone - Time zone for date calculations.\n * @param props.onRangeSelected - Callback when a full range is selected.\n * @param props.placeholder - Placeholder when no date selected.\n * @param props.error - Optional error message that adjusts styling.\n * @param props.inputProps - Props passed to the underlying Input component.\n * @param props.disabled - Whether the date range picker is disabled.\n * @returns A date range picker component.\n */\nexport const DateRangePicker = ({\n className,\n format = DATE,\n selected,\n timezone,\n onRangeSelected = () => {},\n placeholder,\n disabled,\n error,\n inputProps,\n ...props\n}: DateRangePickerProps) => {\n const { t } = useTranslation();\n const [open, setOpen] = useState(false);\n const [date, setDate] = useState<DateRange | undefined>();\n\n useEffect(() => {\n setDate(selected);\n }, [selected]);\n\n const presets: PresetType[] = useMemo(() => {\n const today = dayjs().endOf('day');\n return [\n {\n from: today.startOf('week').toDate(),\n to: today.endOf('week').toDate(),\n label: t('This week'),\n },\n {\n from: today.startOf('month').toDate(),\n to: today.endOf('month').toDate(),\n label: t('This month'),\n },\n {\n from: today.startOf('year').toDate(),\n to: today.endOf('year').toDate(),\n label: t('This year'),\n },\n {\n from: today.subtract(7, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 7 days'),\n },\n {\n from: today.subtract(30, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 30 days'),\n },\n {\n from: today.subtract(3, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 3 months'),\n },\n {\n from: today.subtract(6, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 6 months'),\n },\n {\n from: today.subtract(12, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 12 months'),\n },\n ].map((item) => ({\n ...item,\n isActive:\n selected?.from?.getTime() === item.from.getTime() &&\n selected?.to?.getTime() === item.to.getTime(),\n }));\n }, [t, selected]);\n\n const handleRangeSelect = (range: DateRange) => {\n setDate(range);\n if (range?.from && range?.to) {\n onRangeSelected(range);\n setOpen(false);\n }\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild className={'m-0!'} disabled={disabled}>\n <div className={'relative'}>\n <Input\n variant={error ? 'failure' : 'default'}\n {...inputProps}\n readOnly\n value={\n date?.from\n ? date.to\n ? `${dayjs(date.from).format(format)}-${dayjs(date.to).format(format)}`\n : dayjs(date.from).format(format)\n : ''\n }\n placeholder={placeholder}\n disabled={disabled}\n className={cn(className)}\n />\n {date && (\n <XIcon\n onClick={() => {\n setDate(undefined);\n onRangeSelected?.(undefined);\n }}\n className={cn(\n 'text-secondary absolute top-3 right-8 size-4 cursor-pointer',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n )}\n <Calendar1\n className={cn(\n 'text-secondary absolute top-2.5 right-2 size-5',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n </div>\n </PopoverTrigger>\n <PopoverContent className=\"flex w-auto p-0\" align=\"end\" side={'bottom'}>\n <div\n className={\n 'border-border-alpha-light flex flex-col space-y-1 border-e p-2'\n }\n >\n {presets.map((preset, index) => (\n <Button\n size={'xs'}\n key={index}\n variant={preset.isActive ? 'default' : 'ghost'}\n className={'justify-start'}\n onClick={() => handleRangeSelect(preset)}\n >\n {preset.label}\n </Button>\n ))}\n </div>\n <Calendar\n {...props}\n className={'border-border-alpha-light border-e'}\n mode=\"single\"\n endMonth={date?.to}\n selected={date?.from}\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n timeZone={timezone}\n disabled={\n date?.to\n ? {\n after: date.to,\n }\n : undefined\n }\n onSelect={(from) => {\n setDate({ ...date, from: from as Date | undefined });\n }}\n />\n <Calendar\n {...props}\n mode=\"single\"\n startMonth={date?.from}\n selected={date?.to}\n timeZone={timezone}\n disabled={\n date?.from\n ? {\n before: date.from,\n }\n : undefined\n }\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n onSelect={(to) => {\n if (date) {\n handleRangeSelect({ ...date, to: to as Date | undefined });\n }\n }}\n />\n </PopoverContent>\n </Popover>\n );\n};\n"],"names":["DateRangePicker","className","format","DATE","selected","timezone","onRangeSelected","placeholder","disabled","error","inputProps","props","t","useTranslation","open","setOpen","useState","date","setDate","useEffect","presets","useMemo","today","dayjs","item","_a","_b","handleRangeSelect","range","jsxs","Popover","jsx","PopoverTrigger","Input","cn","XIcon","Calendar1","PopoverContent","preset","index","Button","Calendar","from","to"],"mappings":"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"}
|
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { Button as
|
|
3
|
-
import { DATE as
|
|
4
|
-
import { Input as
|
|
5
|
-
import { Popover as
|
|
6
|
-
import { cn as
|
|
7
|
-
import { XIcon as
|
|
8
|
-
import { useState as
|
|
9
|
-
import { useTranslation as
|
|
10
|
-
const
|
|
11
|
-
className:
|
|
12
|
-
format:
|
|
1
|
+
import { jsxs as c, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { Button as j } from "dgz-ui/button";
|
|
3
|
+
import { DATE as w, Calendar as O } from "dgz-ui/calendar";
|
|
4
|
+
import { Input as P } from "dgz-ui/form";
|
|
5
|
+
import { Popover as A, PopoverTrigger as M, PopoverContent as z } from "dgz-ui/popover";
|
|
6
|
+
import { dayjs as l, cn as h } from "dgz-ui/utils";
|
|
7
|
+
import { XIcon as E, Calendar1 as F } from "lucide-react";
|
|
8
|
+
import { useState as d, useEffect as I, useMemo as Z } from "react";
|
|
9
|
+
import { useTranslation as $ } from "react-i18next";
|
|
10
|
+
const U = ({
|
|
11
|
+
className: T,
|
|
12
|
+
format: n = w,
|
|
13
13
|
selected: r,
|
|
14
|
-
timezone:
|
|
14
|
+
timezone: p,
|
|
15
15
|
onRangeSelected: m = () => {
|
|
16
16
|
},
|
|
17
|
-
placeholder:
|
|
17
|
+
placeholder: x,
|
|
18
18
|
disabled: i,
|
|
19
|
-
error:
|
|
20
|
-
inputProps:
|
|
21
|
-
...
|
|
19
|
+
error: N,
|
|
20
|
+
inputProps: C,
|
|
21
|
+
...u
|
|
22
22
|
}) => {
|
|
23
|
-
const { t: a } =
|
|
24
|
-
|
|
23
|
+
const { t: a } = $(), [k, D] = d(!1), [t, f] = d();
|
|
24
|
+
I(() => {
|
|
25
25
|
f(r);
|
|
26
26
|
}, [r]);
|
|
27
|
-
const
|
|
28
|
-
const o =
|
|
27
|
+
const L = Z(() => {
|
|
28
|
+
const o = l().endOf("day");
|
|
29
29
|
return [
|
|
30
30
|
{
|
|
31
31
|
from: o.startOf("week").toDate(),
|
|
@@ -67,81 +67,81 @@ const Q = ({
|
|
|
67
67
|
to: o.toDate(),
|
|
68
68
|
label: a("Last 12 months")
|
|
69
69
|
}
|
|
70
|
-
].map((
|
|
71
|
-
var
|
|
70
|
+
].map((s) => {
|
|
71
|
+
var y, v;
|
|
72
72
|
return {
|
|
73
|
-
...
|
|
74
|
-
isActive: ((
|
|
73
|
+
...s,
|
|
74
|
+
isActive: ((y = r == null ? void 0 : r.from) == null ? void 0 : y.getTime()) === s.from.getTime() && ((v = r == null ? void 0 : r.to) == null ? void 0 : v.getTime()) === s.to.getTime()
|
|
75
75
|
};
|
|
76
76
|
});
|
|
77
|
-
}, [a, r]),
|
|
78
|
-
f(o), o != null && o.from && (o != null && o.to) && (m(o),
|
|
77
|
+
}, [a, r]), b = (o) => {
|
|
78
|
+
f(o), o != null && o.from && (o != null && o.to) && (m(o), D(!1));
|
|
79
79
|
};
|
|
80
|
-
return /* @__PURE__ */
|
|
81
|
-
/* @__PURE__ */
|
|
82
|
-
/* @__PURE__ */
|
|
83
|
-
|
|
80
|
+
return /* @__PURE__ */ c(A, { open: k, onOpenChange: D, children: [
|
|
81
|
+
/* @__PURE__ */ e(M, { asChild: !0, className: "m-0!", disabled: i, children: /* @__PURE__ */ c("div", { className: "relative", children: [
|
|
82
|
+
/* @__PURE__ */ e(
|
|
83
|
+
P,
|
|
84
84
|
{
|
|
85
|
-
variant:
|
|
86
|
-
...
|
|
85
|
+
variant: N ? "failure" : "default",
|
|
86
|
+
...C,
|
|
87
87
|
readOnly: !0,
|
|
88
|
-
value: t != null && t.from ? t.to ? `${
|
|
89
|
-
placeholder:
|
|
88
|
+
value: t != null && t.from ? t.to ? `${l(t.from).format(n)}-${l(t.to).format(n)}` : l(t.from).format(n) : "",
|
|
89
|
+
placeholder: x,
|
|
90
90
|
disabled: i,
|
|
91
|
-
className:
|
|
91
|
+
className: h(T)
|
|
92
92
|
}
|
|
93
93
|
),
|
|
94
|
-
t && /* @__PURE__ */
|
|
95
|
-
|
|
94
|
+
t && /* @__PURE__ */ e(
|
|
95
|
+
E,
|
|
96
96
|
{
|
|
97
97
|
onClick: () => {
|
|
98
98
|
f(void 0), m == null || m(void 0);
|
|
99
99
|
},
|
|
100
|
-
className:
|
|
100
|
+
className: h(
|
|
101
101
|
"text-secondary absolute top-3 right-8 size-4 cursor-pointer",
|
|
102
102
|
i && "pointer-events-none opacity-50"
|
|
103
103
|
)
|
|
104
104
|
}
|
|
105
105
|
),
|
|
106
|
-
/* @__PURE__ */
|
|
107
|
-
|
|
106
|
+
/* @__PURE__ */ e(
|
|
107
|
+
F,
|
|
108
108
|
{
|
|
109
|
-
className:
|
|
109
|
+
className: h(
|
|
110
110
|
"text-secondary absolute top-2.5 right-2 size-5",
|
|
111
111
|
i && "pointer-events-none opacity-50"
|
|
112
112
|
)
|
|
113
113
|
}
|
|
114
114
|
)
|
|
115
115
|
] }) }),
|
|
116
|
-
/* @__PURE__ */
|
|
117
|
-
/* @__PURE__ */
|
|
116
|
+
/* @__PURE__ */ c(z, { className: "flex w-auto p-0", align: "end", side: "bottom", children: [
|
|
117
|
+
/* @__PURE__ */ e(
|
|
118
118
|
"div",
|
|
119
119
|
{
|
|
120
120
|
className: "border-border-alpha-light flex flex-col space-y-1 border-e p-2",
|
|
121
|
-
children:
|
|
122
|
-
|
|
121
|
+
children: L.map((o, s) => /* @__PURE__ */ e(
|
|
122
|
+
j,
|
|
123
123
|
{
|
|
124
124
|
size: "xs",
|
|
125
125
|
variant: o.isActive ? "default" : "ghost",
|
|
126
126
|
className: "justify-start",
|
|
127
|
-
onClick: () =>
|
|
127
|
+
onClick: () => b(o),
|
|
128
128
|
children: o.label
|
|
129
129
|
},
|
|
130
|
-
|
|
130
|
+
s
|
|
131
131
|
))
|
|
132
132
|
}
|
|
133
133
|
),
|
|
134
|
-
/* @__PURE__ */
|
|
135
|
-
|
|
134
|
+
/* @__PURE__ */ e(
|
|
135
|
+
O,
|
|
136
136
|
{
|
|
137
|
-
...
|
|
137
|
+
...u,
|
|
138
138
|
className: "border-border-alpha-light border-e",
|
|
139
139
|
mode: "single",
|
|
140
140
|
endMonth: t == null ? void 0 : t.to,
|
|
141
141
|
selected: t == null ? void 0 : t.from,
|
|
142
142
|
selectedToDate: t == null ? void 0 : t.to,
|
|
143
143
|
selectedFromDate: t == null ? void 0 : t.from,
|
|
144
|
-
timeZone:
|
|
144
|
+
timeZone: p,
|
|
145
145
|
disabled: t != null && t.to ? {
|
|
146
146
|
after: t.to
|
|
147
147
|
} : void 0,
|
|
@@ -150,21 +150,21 @@ const Q = ({
|
|
|
150
150
|
}
|
|
151
151
|
}
|
|
152
152
|
),
|
|
153
|
-
/* @__PURE__ */
|
|
154
|
-
|
|
153
|
+
/* @__PURE__ */ e(
|
|
154
|
+
O,
|
|
155
155
|
{
|
|
156
|
-
...
|
|
156
|
+
...u,
|
|
157
157
|
mode: "single",
|
|
158
158
|
startMonth: t == null ? void 0 : t.from,
|
|
159
159
|
selected: t == null ? void 0 : t.to,
|
|
160
|
-
timeZone:
|
|
160
|
+
timeZone: p,
|
|
161
161
|
disabled: t != null && t.from ? {
|
|
162
162
|
before: t.from
|
|
163
163
|
} : void 0,
|
|
164
164
|
selectedToDate: t == null ? void 0 : t.to,
|
|
165
165
|
selectedFromDate: t == null ? void 0 : t.from,
|
|
166
166
|
onSelect: (o) => {
|
|
167
|
-
t &&
|
|
167
|
+
t && b({ ...t, to: o });
|
|
168
168
|
}
|
|
169
169
|
}
|
|
170
170
|
)
|
|
@@ -172,6 +172,6 @@ const Q = ({
|
|
|
172
172
|
] });
|
|
173
173
|
};
|
|
174
174
|
export {
|
|
175
|
-
|
|
175
|
+
U as D
|
|
176
176
|
};
|
|
177
|
-
//# sourceMappingURL=DateRangePicker-
|
|
177
|
+
//# sourceMappingURL=DateRangePicker-DeoV3xqL.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker-DeoV3xqL.es.js","sources":["../../src/components/datepicker/DateRangePicker.tsx"],"sourcesContent":["import { Button } from 'dgz-ui/button';\nimport { Calendar, type CalendarProps, DATE } from 'dgz-ui/calendar';\nimport { Input, type InputProps } from 'dgz-ui/form';\nimport { Popover, PopoverContent, PopoverTrigger } from 'dgz-ui/popover';\nimport { cn, dayjs } from 'dgz-ui/utils';\nimport { Calendar1, XIcon } from 'lucide-react';\nimport { type ReactNode, useEffect, useMemo, useState } from 'react';\nimport { type DateRange } from 'react-day-picker';\nimport { useTranslation } from 'react-i18next';\n\n/**\n * Props for the DateRangePicker component.\n */\nexport type DateRangePickerProps = Omit<\n CalendarProps,\n 'mode' | 'disabled' | 'selected'\n> & {\n /** The date format string (e.g., 'YYYY-MM-DD'). */\n format?: string;\n /** Placeholder text when no date is selected. */\n placeholder?: string;\n /** The currently selected date range. */\n selected?: DateRange;\n /** Timezone for date calculations. */\n timezone?: string;\n /** Error message to display (modifies styling). */\n error?: string;\n /** Callback function when a date range is selected. */\n onRangeSelected?: (value?: DateRange) => void;\n inputProps?: InputProps;\n disabled?: boolean;\n};\n\n/**\n * Type definition for a date range preset configuration.\n */\ntype PresetType = DateRange & {\n /** Label for the preset (e.g., \"Last 7 days\"). */\n label: ReactNode;\n isActive?: boolean;\n};\n\n/**\n * DateRangePicker displays a two-month range picker with helpful presets.\n *\n * @param props.format - Display date format.\n * @param props.selected - Currently selected date range.\n * @param props.timezone - Time zone for date calculations.\n * @param props.onRangeSelected - Callback when a full range is selected.\n * @param props.placeholder - Placeholder when no date selected.\n * @param props.error - Optional error message that adjusts styling.\n * @param props.inputProps - Props passed to the underlying Input component.\n * @param props.disabled - Whether the date range picker is disabled.\n * @returns A date range picker component.\n */\nexport const DateRangePicker = ({\n className,\n format = DATE,\n selected,\n timezone,\n onRangeSelected = () => {},\n placeholder,\n disabled,\n error,\n inputProps,\n ...props\n}: DateRangePickerProps) => {\n const { t } = useTranslation();\n const [open, setOpen] = useState(false);\n const [date, setDate] = useState<DateRange | undefined>();\n\n useEffect(() => {\n setDate(selected);\n }, [selected]);\n\n const presets: PresetType[] = useMemo(() => {\n const today = dayjs().endOf('day');\n return [\n {\n from: today.startOf('week').toDate(),\n to: today.endOf('week').toDate(),\n label: t('This week'),\n },\n {\n from: today.startOf('month').toDate(),\n to: today.endOf('month').toDate(),\n label: t('This month'),\n },\n {\n from: today.startOf('year').toDate(),\n to: today.endOf('year').toDate(),\n label: t('This year'),\n },\n {\n from: today.subtract(7, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 7 days'),\n },\n {\n from: today.subtract(30, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 30 days'),\n },\n {\n from: today.subtract(3, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 3 months'),\n },\n {\n from: today.subtract(6, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 6 months'),\n },\n {\n from: today.subtract(12, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 12 months'),\n },\n ].map((item) => ({\n ...item,\n isActive:\n selected?.from?.getTime() === item.from.getTime() &&\n selected?.to?.getTime() === item.to.getTime(),\n }));\n }, [t, selected]);\n\n const handleRangeSelect = (range: DateRange) => {\n setDate(range);\n if (range?.from && range?.to) {\n onRangeSelected(range);\n setOpen(false);\n }\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild className={'m-0!'} disabled={disabled}>\n <div className={'relative'}>\n <Input\n variant={error ? 'failure' : 'default'}\n {...inputProps}\n readOnly\n value={\n date?.from\n ? date.to\n ? `${dayjs(date.from).format(format)}-${dayjs(date.to).format(format)}`\n : dayjs(date.from).format(format)\n : ''\n }\n placeholder={placeholder}\n disabled={disabled}\n className={cn(className)}\n />\n {date && (\n <XIcon\n onClick={() => {\n setDate(undefined);\n onRangeSelected?.(undefined);\n }}\n className={cn(\n 'text-secondary absolute top-3 right-8 size-4 cursor-pointer',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n )}\n <Calendar1\n className={cn(\n 'text-secondary absolute top-2.5 right-2 size-5',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n </div>\n </PopoverTrigger>\n <PopoverContent className=\"flex w-auto p-0\" align=\"end\" side={'bottom'}>\n <div\n className={\n 'border-border-alpha-light flex flex-col space-y-1 border-e p-2'\n }\n >\n {presets.map((preset, index) => (\n <Button\n size={'xs'}\n key={index}\n variant={preset.isActive ? 'default' : 'ghost'}\n className={'justify-start'}\n onClick={() => handleRangeSelect(preset)}\n >\n {preset.label}\n </Button>\n ))}\n </div>\n <Calendar\n {...props}\n className={'border-border-alpha-light border-e'}\n mode=\"single\"\n endMonth={date?.to}\n selected={date?.from}\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n timeZone={timezone}\n disabled={\n date?.to\n ? {\n after: date.to,\n }\n : undefined\n }\n onSelect={(from) => {\n setDate({ ...date, from: from as Date | undefined });\n }}\n />\n <Calendar\n {...props}\n mode=\"single\"\n startMonth={date?.from}\n selected={date?.to}\n timeZone={timezone}\n disabled={\n date?.from\n ? {\n before: date.from,\n }\n : undefined\n }\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n onSelect={(to) => {\n if (date) {\n handleRangeSelect({ ...date, to: to as Date | undefined });\n }\n }}\n />\n </PopoverContent>\n </Popover>\n );\n};\n"],"names":["DateRangePicker","className","format","DATE","selected","timezone","onRangeSelected","placeholder","disabled","error","inputProps","props","t","useTranslation","open","setOpen","useState","date","setDate","useEffect","presets","useMemo","today","dayjs","item","_a","_b","handleRangeSelect","range","jsxs","Popover","jsx","PopoverTrigger","Input","cn","XIcon","Calendar1","PopoverContent","preset","index","Button","Calendar","from","to"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/DateRangePicker-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/DateRangePicker-CUv-qznZ.cjs.js");exports.DateRangePicker=e.DateRangePicker;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("dgz-ui/form"),e=require("react/jsx-runtime"),F=require("react"),j=require("dgz-ui/calendar"),u=require("dgz-ui/popover"),d=require("dgz-ui/utils"),y=require("../../chunks/lodash-BjH0kD7j.cjs.js"),p=require("lucide-react"),b=require("../../chunks/DateRangePicker-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("dgz-ui/form"),e=require("react/jsx-runtime"),F=require("react"),j=require("dgz-ui/calendar"),u=require("dgz-ui/popover"),d=require("dgz-ui/utils"),y=require("../../chunks/lodash-BjH0kD7j.cjs.js"),p=require("lucide-react"),b=require("../../chunks/DateRangePicker-CUv-qznZ.cjs.js"),C=require("../../chunks/MyInput-C9PNyYby.cjs.js"),v=require("../../chunks/MySelect-Ovb1pK5c.cjs.js"),I=({control:r,name:a,label:c,rules:o,...n})=>{const l=F.useId();return a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:o,render:({field:t})=>e.jsx(s.FormLabel,{className:"block",htmlFor:n.id||l,children:e.jsxs(s.FormItem,{className:"flex flex-row items-start gap-3",children:[e.jsx(s.FormControl,{children:e.jsx(s.Checkbox,{id:n.id||l,checked:t.value,onCheckedChange:t.onChange,...n})}),e.jsx("div",{className:"space-y-1 leading-none",children:c&&e.jsx("div",{children:c})})]})})})||null},P=({control:r,name:a,label:c,required:o,rules:n,format:l=j.DATE,floatingError:t,placeholder:i,disabled:m,register:x,className:N,inputProps:M,...g})=>a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:n,render:({field:h,formState:k})=>e.jsxs(s.FormItem,{className:d.cn(t&&"space-y-0"),children:[c&&e.jsxs(s.FormLabel,{className:"block",children:[c," ",o&&e.jsx("span",{className:"text-red-600",children:"*"})]}),e.jsxs(u.Popover,{children:[e.jsx(u.PopoverTrigger,{asChild:!0,children:e.jsx(s.FormControl,{children:e.jsxs("div",{className:"relative",children:[e.jsx(s.Input,{...M,variant:y.lodashExports.get(k.errors,`${a}.message`)?"failure":"default",disabled:m,...h,readOnly:!0,placeholder:i||"Pick a date",value:d.dayjs(h.value).format(l),className:d.cn("m-0 text-start",N)}),e.jsx(p.Calendar1,{className:d.cn("text-secondary absolute top-2.5 right-2 size-5",m&&"pointer-events-none opacity-50")})]})})}),!m&&e.jsx(u.PopoverContent,{className:"w-auto p-0",align:"start",children:e.jsx(j.Calendar,{...g,mode:"single",selected:h.value,onSelect:h.onChange})})]}),e.jsx(s.FormMessage,{className:d.cn(t&&"absolute -bottom-5")})]})})||null,q=({control:r,name:a,label:c,required:o,rules:n,placeholder:l,floatingError:t,...i})=>a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:n,render:({field:m,formState:x})=>e.jsxs(s.FormItem,{className:d.cn(t&&"space-y-0"),children:[c&&e.jsxs(s.FormLabel,{className:"block",children:[c," ",o&&e.jsx("span",{className:"text-red-600",children:"*"})]}),e.jsx(s.FormControl,{children:e.jsx(b.DateRangePicker,{...i,error:`${y.lodashExports.get(x.errors,a,"")}`,selected:m.value,onRangeSelected:m.onChange,placeholder:l})}),e.jsx(s.FormMessage,{className:d.cn(t&&"absolute -bottom-5")})]})})||null,S=({control:r,name:a,label:c,rules:o,required:n,floatingError:l,...t})=>a&&r?e.jsx(s.FormField,{control:r,name:a,rules:o,render:({field:i})=>e.jsxs(s.FormItem,{className:d.cn(l&&"space-y-0"),children:[c&&e.jsxs(s.FormLabel,{className:"block",children:[c," ",n&&e.jsx("span",{className:"text-red-600",children:"*"})]}),e.jsx(s.FormControl,{children:e.jsx(s.HtmlEditor,{...i,...t})}),e.jsx(s.FormMessage,{className:d.cn(l&&"absolute -bottom-5")})]})}):e.jsx(s.HtmlEditor,{...t}),R=({control:r,name:a,label:c,rules:o,required:n,floatingError:l,...t})=>a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:o,render:({field:i})=>e.jsxs(s.FormItem,{className:d.cn(l&&"space-y-0"),children:[c&&e.jsxs(s.FormLabel,{className:"block",children:[c," ",n&&e.jsx("span",{className:"text-red-600",children:"*"})]}),e.jsx(s.FormControl,{children:e.jsx(s.MaskInput,{thousandsSeparator:" ",lazy:!1,placeholderChar:"_",unmask:!0,...i,...t,onAccept:m=>i.onChange(m)})}),e.jsx(s.FormMessage,{className:d.cn(l&&"absolute -bottom-5")})]})})||null,T=({control:r,name:a,label:c,rules:o,value:n,...l})=>{const t=F.useId();return a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:o,render:({field:i})=>e.jsx(s.FormLabel,{className:"block",htmlFor:l.id||t,children:e.jsxs(s.FormItem,{className:"flex flex-row items-start gap-3",children:[e.jsx(s.FormControl,{children:e.jsx(s.RadioGroupItem,{id:l.id||t,value:n,checked:i.value===n,onClick:()=>{i.value!==n&&i.onChange(n)},...l})}),e.jsx("div",{className:"space-y-1 leading-none",children:c&&e.jsx("div",{children:c})})]})})})||null},L=({control:r,name:a,label:c,rules:o,...n})=>{const l=F.useId();return a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:o,render:({field:t})=>e.jsx(s.FormLabel,{className:"block",htmlFor:n.id||l,children:e.jsxs(s.FormItem,{className:"flex flex-row items-start gap-3",children:[e.jsx(s.FormControl,{children:e.jsx(s.Switch,{id:n.id||l,className:"m-0",checked:t.value,onCheckedChange:t.onChange,...n})}),e.jsx("div",{className:"space-y-1 leading-none",children:c&&e.jsx("div",{children:c})})]})})})||null},w=({control:r,name:a,label:c,required:o,rules:n,className:l,floatingError:t,...i})=>a&&r&&e.jsx(s.FormField,{control:r,name:a,rules:n,render:({field:m,formState:x})=>e.jsxs(s.FormItem,{className:d.cn(t&&"space-y-0"),children:[c&&e.jsxs(s.FormLabel,{className:"block",children:[c," ",o&&e.jsx("span",{className:"text-red-600",children:"*"})]}),e.jsx(s.FormControl,{children:e.jsx(s.Textarea,{variant:y.lodashExports.get(x.errors,`${a}.message`)?"failure":"default",...i,...m,className:d.cn(l)})}),e.jsx(s.FormMessage,{className:d.cn(t&&"absolute -bottom-5")})]})})||null,D=({control:r,name:a,label:c,required:o,className:n,rules:l,floatingError:t,...i})=>a&&r?e.jsx(s.FormField,{control:r,name:a,rules:l,render:({field:m})=>e.jsxs(s.FormItem,{className:d.cn(t&&"space-y-0"),children:[c&&e.jsxs(s.FormLabel,{className:"block",children:[c," ",o&&e.jsx("span",{className:"text-red-600",children:"*"})]}),e.jsx(s.FormControl,{children:e.jsx(j.TimePicker,{...m,...i})}),e.jsx(s.FormMessage,{className:d.cn(t&&"absolute -bottom-5")})]})}):e.jsx(j.TimePicker,{className:"mt-2",...i});exports.MyInput=C.MyInput;exports.MySelect=v.MySelect;exports.MyCheckbox=I;exports.MyDatePicker=P;exports.MyDateRangePicker=q;exports.MyHtmlEditor=S;exports.MyMaskInput=R;exports.MyRadio=T;exports.MySwitch=L;exports.MyTextarea=w;exports.MyTimePicker=D;Object.keys(s).forEach(r=>{r!=="default"&&!Object.prototype.hasOwnProperty.call(exports,r)&&Object.defineProperty(exports,r,{enumerable:!0,get:()=>s[r]})});
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -7,7 +7,7 @@ import { Popover as z, PopoverTrigger as A, PopoverContent as H } from "dgz-ui/p
|
|
|
7
7
|
import { cn as o, dayjs as G } from "dgz-ui/utils";
|
|
8
8
|
import { l as v } from "../../chunks/lodash-CRDOWzbs.es.js";
|
|
9
9
|
import { Calendar1 as L } from "lucide-react";
|
|
10
|
-
import { D as O } from "../../chunks/DateRangePicker-
|
|
10
|
+
import { D as O } from "../../chunks/DateRangePicker-DeoV3xqL.es.js";
|
|
11
11
|
import { M as de } from "../../chunks/MyInput-Wb0DSWo_.es.js";
|
|
12
12
|
import { M as oe } from "../../chunks/MySelect-D8ML7nhM.es.js";
|
|
13
13
|
const X = ({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "dgz-ui-shared",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.21",
|
|
4
4
|
"description": "Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"dgz-ui",
|
|
@@ -176,7 +176,6 @@
|
|
|
176
176
|
},
|
|
177
177
|
"dependencies": {
|
|
178
178
|
"@hookform/resolvers": "^5.0.1",
|
|
179
|
-
"dayjs": "^1.11.19",
|
|
180
179
|
"dgz-ui": "^1.4.12",
|
|
181
180
|
"file-saver": "^2.0.5",
|
|
182
181
|
"lodash": "^4.17.21",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangePicker-BEguo3VF.es.js","sources":["../../src/components/datepicker/DateRangePicker.tsx"],"sourcesContent":["import { Button } from 'dgz-ui/button';\nimport { Calendar, type CalendarProps, DATE } from 'dgz-ui/calendar';\nimport { Input, type InputProps } from 'dgz-ui/form';\nimport { Popover, PopoverContent, PopoverTrigger } from 'dgz-ui/popover';\nimport { cn } from 'dgz-ui/utils';\nimport { Calendar1, XIcon } from 'lucide-react';\nimport { type ReactNode, useEffect, useMemo, useState } from 'react';\nimport { type DateRange } from 'react-day-picker';\nimport { useTranslation } from 'react-i18next';\n\n/**\n * Props for the DateRangePicker component.\n */\nexport type DateRangePickerProps = Omit<\n CalendarProps,\n 'mode' | 'disabled' | 'selected'\n> & {\n /** The date format string (e.g., 'YYYY-MM-DD'). */\n format?: string;\n /** Placeholder text when no date is selected. */\n placeholder?: string;\n /** The currently selected date range. */\n selected?: DateRange;\n /** Timezone for date calculations. */\n timezone?: string;\n /** Error message to display (modifies styling). */\n error?: string;\n /** Callback function when a date range is selected. */\n onRangeSelected?: (value?: DateRange) => void;\n inputProps?: InputProps;\n disabled?: boolean;\n};\n\n/**\n * Type definition for a date range preset configuration.\n */\ntype PresetType = DateRange & {\n /** Label for the preset (e.g., \"Last 7 days\"). */\n label: ReactNode;\n isActive?: boolean;\n};\n\n/**\n * DateRangePicker displays a two-month range picker with helpful presets.\n *\n * @param props.format - Display date format.\n * @param props.selected - Currently selected date range.\n * @param props.timezone - Time zone for date calculations.\n * @param props.onRangeSelected - Callback when a full range is selected.\n * @param props.placeholder - Placeholder when no date selected.\n * @param props.error - Optional error message that adjusts styling.\n * @param props.inputProps - Props passed to the underlying Input component.\n * @param props.disabled - Whether the date range picker is disabled.\n * @returns A date range picker component.\n */\nexport const DateRangePicker = ({\n className,\n format = DATE,\n selected,\n timezone,\n onRangeSelected = () => {},\n placeholder,\n disabled,\n error,\n inputProps,\n ...props\n}: DateRangePickerProps) => {\n const { t } = useTranslation();\n const [open, setOpen] = useState(false);\n const [date, setDate] = useState<DateRange | undefined>();\n\n useEffect(() => {\n setDate(selected);\n }, [selected]);\n\n const presets: PresetType[] = useMemo(() => {\n const today = dayjs().endOf('day');\n return [\n {\n from: today.startOf('week').toDate(),\n to: today.endOf('week').toDate(),\n label: t('This week'),\n },\n {\n from: today.startOf('month').toDate(),\n to: today.endOf('month').toDate(),\n label: t('This month'),\n },\n {\n from: today.startOf('year').toDate(),\n to: today.endOf('year').toDate(),\n label: t('This year'),\n },\n {\n from: today.subtract(7, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 7 days'),\n },\n {\n from: today.subtract(30, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 30 days'),\n },\n {\n from: today.subtract(3, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 3 months'),\n },\n {\n from: today.subtract(6, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 6 months'),\n },\n {\n from: today.subtract(12, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 12 months'),\n },\n ].map((item) => ({\n ...item,\n isActive:\n selected?.from?.getTime() === item.from.getTime() &&\n selected?.to?.getTime() === item.to.getTime(),\n }));\n }, [t, selected]);\n\n const handleRangeSelect = (range: DateRange) => {\n setDate(range);\n if (range?.from && range?.to) {\n onRangeSelected(range);\n setOpen(false);\n }\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild className={'m-0!'} disabled={disabled}>\n <div className={'relative'}>\n <Input\n variant={error ? 'failure' : 'default'}\n {...inputProps}\n readOnly\n value={\n date?.from\n ? date.to\n ? `${dayjs(date.from).format(format)}-${dayjs(date.to).format(format)}`\n : dayjs(date.from).format(format)\n : ''\n }\n placeholder={placeholder}\n disabled={disabled}\n className={cn(className)}\n />\n {date && (\n <XIcon\n onClick={() => {\n setDate(undefined);\n onRangeSelected?.(undefined);\n }}\n className={cn(\n 'text-secondary absolute top-3 right-8 size-4 cursor-pointer',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n )}\n <Calendar1\n className={cn(\n 'text-secondary absolute top-2.5 right-2 size-5',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n </div>\n </PopoverTrigger>\n <PopoverContent className=\"flex w-auto p-0\" align=\"end\" side={'bottom'}>\n <div\n className={\n 'border-border-alpha-light flex flex-col space-y-1 border-e p-2'\n }\n >\n {presets.map((preset, index) => (\n <Button\n size={'xs'}\n key={index}\n variant={preset.isActive ? 'default' : 'ghost'}\n className={'justify-start'}\n onClick={() => handleRangeSelect(preset)}\n >\n {preset.label}\n </Button>\n ))}\n </div>\n <Calendar\n {...props}\n className={'border-border-alpha-light border-e'}\n mode=\"single\"\n endMonth={date?.to}\n selected={date?.from}\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n timeZone={timezone}\n disabled={\n date?.to\n ? {\n after: date.to,\n }\n : undefined\n }\n onSelect={(from) => {\n setDate({ ...date, from: from as Date | undefined });\n }}\n />\n <Calendar\n {...props}\n mode=\"single\"\n startMonth={date?.from}\n selected={date?.to}\n timeZone={timezone}\n disabled={\n date?.from\n ? {\n before: date.from,\n }\n : undefined\n }\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n onSelect={(to) => {\n if (date) {\n handleRangeSelect({ ...date, to: to as Date | undefined });\n }\n }}\n />\n </PopoverContent>\n </Popover>\n );\n};\n"],"names":["DateRangePicker","className","format","DATE","selected","timezone","onRangeSelected","placeholder","disabled","error","inputProps","props","t","useTranslation","open","setOpen","useState","date","setDate","useEffect","presets","useMemo","today","item","_a","_b","handleRangeSelect","range","jsxs","Popover","jsx","PopoverTrigger","Input","cn","XIcon","Calendar1","PopoverContent","preset","index","Button","Calendar","from","to"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";const e=require("react/jsx-runtime"),k=require("dgz-ui/button"),f=require("dgz-ui/calendar"),L=require("dgz-ui/form"),u=require("dgz-ui/popover"),h=require("dgz-ui/utils"),v=require("lucide-react"),m=require("react"),P=require("react-i18next"),w=({className:j,format:c=f.DATE,selected:s,timezone:y,onRangeSelected:n=()=>{},placeholder:O,disabled:i,error:T,inputProps:q,...b})=>{const{t:r}=P.useTranslation(),[N,D]=m.useState(!1),[t,l]=m.useState();m.useEffect(()=>{l(s)},[s]);const C=m.useMemo(()=>{const o=dayjs().endOf("day");return[{from:o.startOf("week").toDate(),to:o.endOf("week").toDate(),label:r("This week")},{from:o.startOf("month").toDate(),to:o.endOf("month").toDate(),label:r("This month")},{from:o.startOf("year").toDate(),to:o.endOf("year").toDate(),label:r("This year")},{from:o.subtract(7,"day").startOf("day").toDate(),to:o.toDate(),label:r("Last 7 days")},{from:o.subtract(30,"day").startOf("day").toDate(),to:o.toDate(),label:r("Last 30 days")},{from:o.subtract(3,"month").startOf("day").toDate(),to:o.toDate(),label:r("Last 3 months")},{from:o.subtract(6,"month").startOf("day").toDate(),to:o.toDate(),label:r("Last 6 months")},{from:o.subtract(12,"month").startOf("day").toDate(),to:o.toDate(),label:r("Last 12 months")}].map(a=>{var p,x;return{...a,isActive:((p=s==null?void 0:s.from)==null?void 0:p.getTime())===a.from.getTime()&&((x=s==null?void 0:s.to)==null?void 0:x.getTime())===a.to.getTime()}})},[r,s]),d=o=>{l(o),o!=null&&o.from&&(o!=null&&o.to)&&(n(o),D(!1))};return e.jsxs(u.Popover,{open:N,onOpenChange:D,children:[e.jsx(u.PopoverTrigger,{asChild:!0,className:"m-0!",disabled:i,children:e.jsxs("div",{className:"relative",children:[e.jsx(L.Input,{variant:T?"failure":"default",...q,readOnly:!0,value:t!=null&&t.from?t.to?`${dayjs(t.from).format(c)}-${dayjs(t.to).format(c)}`:dayjs(t.from).format(c):"",placeholder:O,disabled:i,className:h.cn(j)}),t&&e.jsx(v.XIcon,{onClick:()=>{l(void 0),n==null||n(void 0)},className:h.cn("text-secondary absolute top-3 right-8 size-4 cursor-pointer",i&&"pointer-events-none opacity-50")}),e.jsx(v.Calendar1,{className:h.cn("text-secondary absolute top-2.5 right-2 size-5",i&&"pointer-events-none opacity-50")})]})}),e.jsxs(u.PopoverContent,{className:"flex w-auto p-0",align:"end",side:"bottom",children:[e.jsx("div",{className:"border-border-alpha-light flex flex-col space-y-1 border-e p-2",children:C.map((o,a)=>e.jsx(k.Button,{size:"xs",variant:o.isActive?"default":"ghost",className:"justify-start",onClick:()=>d(o),children:o.label},a))}),e.jsx(f.Calendar,{...b,className:"border-border-alpha-light border-e",mode:"single",endMonth:t==null?void 0:t.to,selected:t==null?void 0:t.from,selectedToDate:t==null?void 0:t.to,selectedFromDate:t==null?void 0:t.from,timeZone:y,disabled:t!=null&&t.to?{after:t.to}:void 0,onSelect:o=>{l({...t,from:o})}}),e.jsx(f.Calendar,{...b,mode:"single",startMonth:t==null?void 0:t.from,selected:t==null?void 0:t.to,timeZone:y,disabled:t!=null&&t.from?{before:t.from}:void 0,selectedToDate:t==null?void 0:t.to,selectedFromDate:t==null?void 0:t.from,onSelect:o=>{t&&d({...t,to:o})}})]})]})};exports.DateRangePicker=w;
|
|
2
|
-
//# sourceMappingURL=DateRangePicker-lHqe5Mb6.cjs.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangePicker-lHqe5Mb6.cjs.js","sources":["../../src/components/datepicker/DateRangePicker.tsx"],"sourcesContent":["import { Button } from 'dgz-ui/button';\nimport { Calendar, type CalendarProps, DATE } from 'dgz-ui/calendar';\nimport { Input, type InputProps } from 'dgz-ui/form';\nimport { Popover, PopoverContent, PopoverTrigger } from 'dgz-ui/popover';\nimport { cn } from 'dgz-ui/utils';\nimport { Calendar1, XIcon } from 'lucide-react';\nimport { type ReactNode, useEffect, useMemo, useState } from 'react';\nimport { type DateRange } from 'react-day-picker';\nimport { useTranslation } from 'react-i18next';\n\n/**\n * Props for the DateRangePicker component.\n */\nexport type DateRangePickerProps = Omit<\n CalendarProps,\n 'mode' | 'disabled' | 'selected'\n> & {\n /** The date format string (e.g., 'YYYY-MM-DD'). */\n format?: string;\n /** Placeholder text when no date is selected. */\n placeholder?: string;\n /** The currently selected date range. */\n selected?: DateRange;\n /** Timezone for date calculations. */\n timezone?: string;\n /** Error message to display (modifies styling). */\n error?: string;\n /** Callback function when a date range is selected. */\n onRangeSelected?: (value?: DateRange) => void;\n inputProps?: InputProps;\n disabled?: boolean;\n};\n\n/**\n * Type definition for a date range preset configuration.\n */\ntype PresetType = DateRange & {\n /** Label for the preset (e.g., \"Last 7 days\"). */\n label: ReactNode;\n isActive?: boolean;\n};\n\n/**\n * DateRangePicker displays a two-month range picker with helpful presets.\n *\n * @param props.format - Display date format.\n * @param props.selected - Currently selected date range.\n * @param props.timezone - Time zone for date calculations.\n * @param props.onRangeSelected - Callback when a full range is selected.\n * @param props.placeholder - Placeholder when no date selected.\n * @param props.error - Optional error message that adjusts styling.\n * @param props.inputProps - Props passed to the underlying Input component.\n * @param props.disabled - Whether the date range picker is disabled.\n * @returns A date range picker component.\n */\nexport const DateRangePicker = ({\n className,\n format = DATE,\n selected,\n timezone,\n onRangeSelected = () => {},\n placeholder,\n disabled,\n error,\n inputProps,\n ...props\n}: DateRangePickerProps) => {\n const { t } = useTranslation();\n const [open, setOpen] = useState(false);\n const [date, setDate] = useState<DateRange | undefined>();\n\n useEffect(() => {\n setDate(selected);\n }, [selected]);\n\n const presets: PresetType[] = useMemo(() => {\n const today = dayjs().endOf('day');\n return [\n {\n from: today.startOf('week').toDate(),\n to: today.endOf('week').toDate(),\n label: t('This week'),\n },\n {\n from: today.startOf('month').toDate(),\n to: today.endOf('month').toDate(),\n label: t('This month'),\n },\n {\n from: today.startOf('year').toDate(),\n to: today.endOf('year').toDate(),\n label: t('This year'),\n },\n {\n from: today.subtract(7, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 7 days'),\n },\n {\n from: today.subtract(30, 'day').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 30 days'),\n },\n {\n from: today.subtract(3, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 3 months'),\n },\n {\n from: today.subtract(6, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 6 months'),\n },\n {\n from: today.subtract(12, 'month').startOf('day').toDate(),\n to: today.toDate(),\n label: t('Last 12 months'),\n },\n ].map((item) => ({\n ...item,\n isActive:\n selected?.from?.getTime() === item.from.getTime() &&\n selected?.to?.getTime() === item.to.getTime(),\n }));\n }, [t, selected]);\n\n const handleRangeSelect = (range: DateRange) => {\n setDate(range);\n if (range?.from && range?.to) {\n onRangeSelected(range);\n setOpen(false);\n }\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild className={'m-0!'} disabled={disabled}>\n <div className={'relative'}>\n <Input\n variant={error ? 'failure' : 'default'}\n {...inputProps}\n readOnly\n value={\n date?.from\n ? date.to\n ? `${dayjs(date.from).format(format)}-${dayjs(date.to).format(format)}`\n : dayjs(date.from).format(format)\n : ''\n }\n placeholder={placeholder}\n disabled={disabled}\n className={cn(className)}\n />\n {date && (\n <XIcon\n onClick={() => {\n setDate(undefined);\n onRangeSelected?.(undefined);\n }}\n className={cn(\n 'text-secondary absolute top-3 right-8 size-4 cursor-pointer',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n )}\n <Calendar1\n className={cn(\n 'text-secondary absolute top-2.5 right-2 size-5',\n disabled && 'pointer-events-none opacity-50'\n )}\n />\n </div>\n </PopoverTrigger>\n <PopoverContent className=\"flex w-auto p-0\" align=\"end\" side={'bottom'}>\n <div\n className={\n 'border-border-alpha-light flex flex-col space-y-1 border-e p-2'\n }\n >\n {presets.map((preset, index) => (\n <Button\n size={'xs'}\n key={index}\n variant={preset.isActive ? 'default' : 'ghost'}\n className={'justify-start'}\n onClick={() => handleRangeSelect(preset)}\n >\n {preset.label}\n </Button>\n ))}\n </div>\n <Calendar\n {...props}\n className={'border-border-alpha-light border-e'}\n mode=\"single\"\n endMonth={date?.to}\n selected={date?.from}\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n timeZone={timezone}\n disabled={\n date?.to\n ? {\n after: date.to,\n }\n : undefined\n }\n onSelect={(from) => {\n setDate({ ...date, from: from as Date | undefined });\n }}\n />\n <Calendar\n {...props}\n mode=\"single\"\n startMonth={date?.from}\n selected={date?.to}\n timeZone={timezone}\n disabled={\n date?.from\n ? {\n before: date.from,\n }\n : undefined\n }\n selectedToDate={date?.to}\n selectedFromDate={date?.from}\n onSelect={(to) => {\n if (date) {\n handleRangeSelect({ ...date, to: to as Date | undefined });\n }\n }}\n />\n </PopoverContent>\n </Popover>\n );\n};\n"],"names":["DateRangePicker","className","format","DATE","selected","timezone","onRangeSelected","placeholder","disabled","error","inputProps","props","t","useTranslation","open","setOpen","useState","date","setDate","useEffect","presets","useMemo","today","item","_a","_b","handleRangeSelect","range","jsxs","Popover","jsx","PopoverTrigger","Input","cn","XIcon","Calendar1","PopoverContent","preset","index","Button","Calendar","from","to"],"mappings":"iQAuDaA,EAAkB,CAAC,CAC9B,UAAAC,EACA,OAAAC,EAASC,EAAAA,KACT,SAAAC,EACA,SAAAC,EACA,gBAAAC,EAAkB,IAAM,CAAC,EACzB,YAAAC,EACA,SAAAC,EACA,MAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAA4B,CAC1B,KAAM,CAAA,EAAEC,CAAA,EAAMC,iBAAA,EACR,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAChC,CAACC,EAAMC,CAAO,EAAIF,WAAA,EAExBG,EAAAA,UAAU,IAAM,CACdD,EAAQd,CAAQ,CAClB,EAAG,CAACA,CAAQ,CAAC,EAEb,MAAMgB,EAAwBC,EAAAA,QAAQ,IAAM,CAC1C,MAAMC,EAAQ,QAAQ,MAAM,KAAK,EACjC,MAAO,CACL,CACE,KAAMA,EAAM,QAAQ,MAAM,EAAE,OAAA,EAC5B,GAAIA,EAAM,MAAM,MAAM,EAAE,OAAA,EACxB,MAAOV,EAAE,WAAW,CAAA,EAEtB,CACE,KAAMU,EAAM,QAAQ,OAAO,EAAE,OAAA,EAC7B,GAAIA,EAAM,MAAM,OAAO,EAAE,OAAA,EACzB,MAAOV,EAAE,YAAY,CAAA,EAEvB,CACE,KAAMU,EAAM,QAAQ,MAAM,EAAE,OAAA,EAC5B,GAAIA,EAAM,MAAM,MAAM,EAAE,OAAA,EACxB,MAAOV,EAAE,WAAW,CAAA,EAEtB,CACE,KAAMU,EAAM,SAAS,EAAG,KAAK,EAAE,QAAQ,KAAK,EAAE,OAAA,EAC9C,GAAIA,EAAM,OAAA,EACV,MAAOV,EAAE,aAAa,CAAA,EAExB,CACE,KAAMU,EAAM,SAAS,GAAI,KAAK,EAAE,QAAQ,KAAK,EAAE,OAAA,EAC/C,GAAIA,EAAM,OAAA,EACV,MAAOV,EAAE,cAAc,CAAA,EAEzB,CACE,KAAMU,EAAM,SAAS,EAAG,OAAO,EAAE,QAAQ,KAAK,EAAE,OAAA,EAChD,GAAIA,EAAM,OAAA,EACV,MAAOV,EAAE,eAAe,CAAA,EAE1B,CACE,KAAMU,EAAM,SAAS,EAAG,OAAO,EAAE,QAAQ,KAAK,EAAE,OAAA,EAChD,GAAIA,EAAM,OAAA,EACV,MAAOV,EAAE,eAAe,CAAA,EAE1B,CACE,KAAMU,EAAM,SAAS,GAAI,OAAO,EAAE,QAAQ,KAAK,EAAE,OAAA,EACjD,GAAIA,EAAM,OAAA,EACV,MAAOV,EAAE,gBAAgB,CAAA,CAC3B,EACA,IAAKW,GAAA,SAAU,OACf,GAAGA,EACH,WACEC,EAAApB,GAAA,YAAAA,EAAU,OAAV,YAAAoB,EAAgB,aAAcD,EAAK,KAAK,QAAA,KACxCE,EAAArB,GAAA,YAAAA,EAAU,KAAV,YAAAqB,EAAc,aAAcF,EAAK,GAAG,QAAA,CAAQ,EAC9C,CACJ,EAAG,CAACX,EAAGR,CAAQ,CAAC,EAEVsB,EAAqBC,GAAqB,CAC9CT,EAAQS,CAAK,EACTA,GAAA,MAAAA,EAAO,OAAQA,GAAA,MAAAA,EAAO,MACxBrB,EAAgBqB,CAAK,EACrBZ,EAAQ,EAAK,EAEjB,EAEA,OACEa,EAAAA,KAACC,EAAAA,QAAA,CAAQ,KAAAf,EAAY,aAAcC,EACjC,SAAA,CAAAe,EAAAA,IAACC,EAAAA,eAAA,CAAe,QAAO,GAAC,UAAW,OAAQ,SAAAvB,EACzC,SAAAoB,EAAAA,KAAC,MAAA,CAAI,UAAW,WACd,SAAA,CAAAE,EAAAA,IAACE,EAAAA,MAAA,CACC,QAASvB,EAAQ,UAAY,UAC5B,GAAGC,EACJ,SAAQ,GACR,MACEO,GAAA,MAAAA,EAAM,KACFA,EAAK,GACH,GAAG,MAAMA,EAAK,IAAI,EAAE,OAAOf,CAAM,CAAC,IAAI,MAAMe,EAAK,EAAE,EAAE,OAAOf,CAAM,CAAC,GACnE,MAAMe,EAAK,IAAI,EAAE,OAAOf,CAAM,EAChC,GAEN,YAAAK,EACA,SAAAC,EACA,UAAWyB,EAAAA,GAAGhC,CAAS,CAAA,CAAA,EAExBgB,GACCa,EAAAA,IAACI,EAAAA,MAAA,CACC,QAAS,IAAM,CACbhB,EAAQ,MAAS,EACjBZ,GAAA,MAAAA,EAAkB,OACpB,EACA,UAAW2B,EAAAA,GACT,8DACAzB,GAAY,gCAAA,CACd,CAAA,EAGJsB,EAAAA,IAACK,EAAAA,UAAA,CACC,UAAWF,EAAAA,GACT,iDACAzB,GAAY,gCAAA,CACd,CAAA,CACF,CAAA,CACF,CAAA,CACF,SACC4B,EAAAA,eAAA,CAAe,UAAU,kBAAkB,MAAM,MAAM,KAAM,SAC5D,SAAA,CAAAN,EAAAA,IAAC,MAAA,CACC,UACE,iEAGD,SAAAV,EAAQ,IAAI,CAACiB,EAAQC,IACpBR,EAAAA,IAACS,EAAAA,OAAA,CACC,KAAM,KAEN,QAASF,EAAO,SAAW,UAAY,QACvC,UAAW,gBACX,QAAS,IAAMX,EAAkBW,CAAM,EAEtC,SAAAA,EAAO,KAAA,EALHC,CAAA,CAOR,CAAA,CAAA,EAEHR,EAAAA,IAACU,EAAAA,SAAA,CACE,GAAG7B,EACJ,UAAW,qCACX,KAAK,SACL,SAAUM,GAAA,YAAAA,EAAM,GAChB,SAAUA,GAAA,YAAAA,EAAM,KAChB,eAAgBA,GAAA,YAAAA,EAAM,GACtB,iBAAkBA,GAAA,YAAAA,EAAM,KACxB,SAAUZ,EACV,SACEY,GAAA,MAAAA,EAAM,GACF,CACE,MAAOA,EAAK,EAAA,EAEd,OAEN,SAAWwB,GAAS,CAClBvB,EAAQ,CAAE,GAAGD,EAAM,KAAAwB,EAAgC,CACrD,CAAA,CAAA,EAEFX,EAAAA,IAACU,EAAAA,SAAA,CACE,GAAG7B,EACJ,KAAK,SACL,WAAYM,GAAA,YAAAA,EAAM,KAClB,SAAUA,GAAA,YAAAA,EAAM,GAChB,SAAUZ,EACV,SACEY,GAAA,MAAAA,EAAM,KACF,CACE,OAAQA,EAAK,IAAA,EAEf,OAEN,eAAgBA,GAAA,YAAAA,EAAM,GACtB,iBAAkBA,GAAA,YAAAA,EAAM,KACxB,SAAWyB,GAAO,CACZzB,GACFS,EAAkB,CAAE,GAAGT,EAAM,GAAAyB,EAA4B,CAE7D,CAAA,CAAA,CACF,CAAA,CACF,CAAA,EACF,CAEJ"}
|