@mlw-packages/react-components 1.10.17 → 1.10.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +230 -3
- package/dist/index.d.mts +12 -4
- package/dist/index.d.ts +12 -4
- package/dist/index.js +257 -206
- package/dist/index.mjs +257 -206
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -2530,6 +2530,7 @@ var badgeVariants = cva(
|
|
|
2530
2530
|
function Badge({
|
|
2531
2531
|
className,
|
|
2532
2532
|
color,
|
|
2533
|
+
rank,
|
|
2533
2534
|
size = "md",
|
|
2534
2535
|
asChild = false,
|
|
2535
2536
|
children,
|
|
@@ -2546,6 +2547,12 @@ function Badge({
|
|
|
2546
2547
|
blue: "bg-blue-50 text-blue-500 border-blue-200",
|
|
2547
2548
|
purple: "bg-purple-50 text-purple-500 border-purple-200"
|
|
2548
2549
|
};
|
|
2550
|
+
const rankClasses = {
|
|
2551
|
+
diamond: "bg-cyan-100 text-cyan-600 border-cyan-300 dark:text-cyan-800 dark:border-cyan-800",
|
|
2552
|
+
gold: "bg-amber-50 text-amber-500 border-amber-300 dark:text-amber-600 dark:border-amber-600 dark:bg-amber-50",
|
|
2553
|
+
silver: "bg-gray-100 text-gray-500 border-gray-300 dark:text-gray-800 dark:border-gray-800",
|
|
2554
|
+
bronze: "bg-orange-100 text-orange-700 border-orange-300 dark:text-orange-800 dark:border-orange-800"
|
|
2555
|
+
};
|
|
2549
2556
|
return /* @__PURE__ */ jsx(
|
|
2550
2557
|
Comp,
|
|
2551
2558
|
{
|
|
@@ -2553,6 +2560,7 @@ function Badge({
|
|
|
2553
2560
|
className: cn(
|
|
2554
2561
|
badgeVariants({ size }),
|
|
2555
2562
|
color ? colorClasses[color] : void 0,
|
|
2563
|
+
rank ? rankClasses[rank] : void 0,
|
|
2556
2564
|
className
|
|
2557
2565
|
),
|
|
2558
2566
|
style: customStyle,
|
|
@@ -7816,7 +7824,8 @@ function DateTimePicker({
|
|
|
7816
7824
|
disabled,
|
|
7817
7825
|
className,
|
|
7818
7826
|
error,
|
|
7819
|
-
hideClear = true
|
|
7827
|
+
hideClear = true,
|
|
7828
|
+
triggerIcon
|
|
7820
7829
|
}) {
|
|
7821
7830
|
const [internalDate, setInternalDate] = useState(date);
|
|
7822
7831
|
const [open, setOpen] = useState(false);
|
|
@@ -7866,193 +7875,222 @@ function DateTimePicker({
|
|
|
7866
7875
|
const { ref: contentRef, center } = use_auto_center_default(open);
|
|
7867
7876
|
const basePopoverClass = "w-auto max-w-[calc(100vw-16px)] p-0 border-none shadow-none";
|
|
7868
7877
|
const centeredPopoverClass = "w-auto max-w-[calc(100vw-16px)] p-0 border-none shadow-none fixed left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-50";
|
|
7869
|
-
const renderTriggerButton = () =>
|
|
7870
|
-
|
|
7871
|
-
|
|
7872
|
-
|
|
7873
|
-
|
|
7874
|
-
|
|
7875
|
-
|
|
7876
|
-
|
|
7877
|
-
|
|
7878
|
-
|
|
7879
|
-
|
|
7880
|
-
|
|
7881
|
-
hideClear && (date || internalDate) && /* @__PURE__ */ jsx(
|
|
7882
|
-
ClearButton,
|
|
7883
|
-
{
|
|
7884
|
-
onClick: (e) => {
|
|
7885
|
-
e?.stopPropagation();
|
|
7886
|
-
setInternalDate(null);
|
|
7887
|
-
onChange?.(null);
|
|
7888
|
-
onConfirm?.(null);
|
|
7889
|
-
}
|
|
7890
|
-
}
|
|
7891
|
-
),
|
|
7892
|
-
/* @__PURE__ */ jsx(
|
|
7893
|
-
motion.div,
|
|
7894
|
-
{
|
|
7895
|
-
animate: { rotate: open ? 15 : 0 },
|
|
7896
|
-
transition: { duration: 0.03 },
|
|
7897
|
-
children: /* @__PURE__ */ jsx(CalendarBlankIcon, { className: "h-4 w-4" })
|
|
7898
|
-
}
|
|
7899
|
-
)
|
|
7900
|
-
] }) })
|
|
7901
|
-
]
|
|
7878
|
+
const renderTriggerButton = () => {
|
|
7879
|
+
if (triggerIcon) {
|
|
7880
|
+
return /* @__PURE__ */ jsx(
|
|
7881
|
+
ButtonBase,
|
|
7882
|
+
{
|
|
7883
|
+
variant: "outline",
|
|
7884
|
+
size: "icon",
|
|
7885
|
+
disabled,
|
|
7886
|
+
className: cn("no-active-animation", error && "border-red-500"),
|
|
7887
|
+
children: /* @__PURE__ */ jsx(CalendarBlankIcon, { className: "h-4 w-4" })
|
|
7888
|
+
}
|
|
7889
|
+
);
|
|
7902
7890
|
}
|
|
7903
|
-
|
|
7904
|
-
|
|
7905
|
-
isMobile && !hideTime ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-h-0", children: [
|
|
7906
|
-
internalDate && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg ", children: /* @__PURE__ */ jsxs("span", { className: "text-md font-semibold", children: [
|
|
7907
|
-
format(internalDate, "dd 'de' MMMM 'de' yyyy", {
|
|
7908
|
-
locale: ptBR
|
|
7909
|
-
}),
|
|
7910
|
-
" ",
|
|
7911
|
-
"- ",
|
|
7912
|
-
format(internalDate, hideSeconds ? "HH:mm" : "HH:mm:ss")
|
|
7913
|
-
] }) }),
|
|
7914
|
-
/* @__PURE__ */ jsxs(TabsBase, { value: activeTab, onValueChange: setActiveTab, children: [
|
|
7915
|
-
/* @__PURE__ */ jsxs(TabsListBase, { className: "", children: [
|
|
7916
|
-
/* @__PURE__ */ jsx(TabsTriggerBase, { value: "calendar", className: "flex-1", children: "Data" }),
|
|
7917
|
-
/* @__PURE__ */ jsx(TabsTriggerBase, { value: "time", className: "flex-1", children: "Hor\xE1rio" })
|
|
7918
|
-
] }),
|
|
7919
|
-
/* @__PURE__ */ jsx(TabsContentBase, { value: "calendar", className: "mt-0", children: /* @__PURE__ */ jsx(
|
|
7920
|
-
CalendarBase2,
|
|
7921
|
-
{
|
|
7922
|
-
mode: "single",
|
|
7923
|
-
locale: ptBR,
|
|
7924
|
-
selected: internalDate ?? void 0,
|
|
7925
|
-
onSelect: (d) => handleSelect(d ?? null),
|
|
7926
|
-
autoFocus: true,
|
|
7927
|
-
defaultMonth: fromDate ?? toDate ?? internalDate ?? void 0,
|
|
7928
|
-
...fromDate && { startMonth: fromDate },
|
|
7929
|
-
...toDate && { endMonth: toDate },
|
|
7930
|
-
...fromDate || toDate ? {
|
|
7931
|
-
disabled: [
|
|
7932
|
-
...fromDate ? [{ before: fromDate }] : [],
|
|
7933
|
-
...toDate ? [{ after: toDate }] : []
|
|
7934
|
-
]
|
|
7935
|
-
} : {},
|
|
7936
|
-
className: cn("w-full rounded-none border-none")
|
|
7937
|
-
}
|
|
7938
|
-
) }),
|
|
7939
|
-
/* @__PURE__ */ jsx(TabsContentBase, { value: "time", className: "mt-0", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center gap-4 py-2", children: /* @__PURE__ */ jsx(
|
|
7940
|
-
TimeScrollPicker,
|
|
7941
|
-
{
|
|
7942
|
-
setDate: (d) => handleTimeChange(d ?? null),
|
|
7943
|
-
date: internalDate,
|
|
7944
|
-
hideSeconds
|
|
7945
|
-
}
|
|
7946
|
-
) }) })
|
|
7947
|
-
] })
|
|
7948
|
-
] }) : /* @__PURE__ */ jsxs(
|
|
7949
|
-
"div",
|
|
7891
|
+
return /* @__PURE__ */ jsxs(
|
|
7892
|
+
ButtonBase,
|
|
7950
7893
|
{
|
|
7951
|
-
|
|
7952
|
-
|
|
7894
|
+
variant: "outline",
|
|
7895
|
+
disabled,
|
|
7896
|
+
className: cn(
|
|
7897
|
+
"w-full justify-start text-left min-w-0 overflow-hidden",
|
|
7898
|
+
!date && "text-muted-foreground"
|
|
7899
|
+
),
|
|
7953
7900
|
children: [
|
|
7954
7901
|
/* @__PURE__ */ jsx(
|
|
7955
|
-
|
|
7902
|
+
"span",
|
|
7956
7903
|
{
|
|
7957
|
-
|
|
7958
|
-
locale: ptBR
|
|
7959
|
-
selected: internalDate ?? void 0,
|
|
7960
|
-
onSelect: (d) => handleSelect(d ?? null),
|
|
7961
|
-
autoFocus: true,
|
|
7962
|
-
defaultMonth: fromDate ?? toDate ?? internalDate ?? void 0,
|
|
7963
|
-
...fromDate && { startMonth: fromDate },
|
|
7964
|
-
...toDate && { endMonth: toDate },
|
|
7965
|
-
...fromDate || toDate ? {
|
|
7966
|
-
disabled: [
|
|
7967
|
-
...fromDate ? [{ before: fromDate }] : [],
|
|
7968
|
-
...toDate ? [{ after: toDate }] : []
|
|
7969
|
-
]
|
|
7970
|
-
} : {},
|
|
7971
|
-
className: cn(
|
|
7972
|
-
"w-max rounded-none border-none",
|
|
7973
|
-
!hideTime && "sm:rounded-r-none"
|
|
7974
|
-
)
|
|
7904
|
+
className: cn("truncate flex-1", !date && "text-muted-foreground"),
|
|
7905
|
+
children: date ? format(date, getDisplayFormat(), { locale: ptBR }) : "Selecione uma data"
|
|
7975
7906
|
}
|
|
7976
7907
|
),
|
|
7977
|
-
|
|
7978
|
-
|
|
7979
|
-
|
|
7980
|
-
|
|
7981
|
-
|
|
7982
|
-
|
|
7983
|
-
|
|
7984
|
-
|
|
7985
|
-
|
|
7986
|
-
|
|
7987
|
-
|
|
7988
|
-
|
|
7989
|
-
|
|
7990
|
-
|
|
7991
|
-
|
|
7992
|
-
|
|
7993
|
-
|
|
7994
|
-
|
|
7995
|
-
|
|
7996
|
-
|
|
7908
|
+
/* @__PURE__ */ jsx(motion.span, { className: "flex items-center", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-row gap-0 items-center ", children: [
|
|
7909
|
+
hideClear && (date || internalDate) && /* @__PURE__ */ jsx(
|
|
7910
|
+
ClearButton,
|
|
7911
|
+
{
|
|
7912
|
+
onClick: (e) => {
|
|
7913
|
+
e?.stopPropagation();
|
|
7914
|
+
setInternalDate(null);
|
|
7915
|
+
onChange?.(null);
|
|
7916
|
+
onConfirm?.(null);
|
|
7917
|
+
}
|
|
7918
|
+
}
|
|
7919
|
+
),
|
|
7920
|
+
/* @__PURE__ */ jsx(
|
|
7921
|
+
motion.div,
|
|
7922
|
+
{
|
|
7923
|
+
animate: { rotate: open ? 15 : 0 },
|
|
7924
|
+
transition: { duration: 0.03 },
|
|
7925
|
+
children: /* @__PURE__ */ jsx(CalendarBlankIcon, { className: "h-4 w-4" })
|
|
7926
|
+
}
|
|
7927
|
+
)
|
|
7928
|
+
] }) })
|
|
7997
7929
|
]
|
|
7998
7930
|
}
|
|
7999
|
-
)
|
|
8000
|
-
|
|
8001
|
-
|
|
8002
|
-
|
|
8003
|
-
|
|
8004
|
-
|
|
8005
|
-
|
|
8006
|
-
|
|
8007
|
-
size: "icon",
|
|
8008
|
-
onClick: () => {
|
|
8009
|
-
const now = /* @__PURE__ */ new Date();
|
|
8010
|
-
const selected = hideTime ? new Date(
|
|
8011
|
-
Date.UTC(
|
|
8012
|
-
now.getUTCFullYear(),
|
|
8013
|
-
now.getUTCMonth(),
|
|
8014
|
-
now.getUTCDate(),
|
|
8015
|
-
0,
|
|
8016
|
-
0,
|
|
8017
|
-
0,
|
|
8018
|
-
0
|
|
8019
|
-
)
|
|
8020
|
-
) : now;
|
|
8021
|
-
setInternalDate(selected);
|
|
8022
|
-
onChange?.(selected);
|
|
8023
|
-
onConfirm?.(selected);
|
|
8024
|
-
},
|
|
8025
|
-
children: /* @__PURE__ */ jsx(CalendarDotIcon$1, { className: "h-4 w-4" })
|
|
8026
|
-
}
|
|
7931
|
+
);
|
|
7932
|
+
};
|
|
7933
|
+
const renderPickerContent = () => /* @__PURE__ */ jsxs(
|
|
7934
|
+
"div",
|
|
7935
|
+
{
|
|
7936
|
+
className: cn(
|
|
7937
|
+
"p-2 sm:p-3",
|
|
7938
|
+
!isMobile && "border border-border rounded-md"
|
|
8027
7939
|
),
|
|
8028
|
-
|
|
8029
|
-
/* @__PURE__ */
|
|
8030
|
-
|
|
7940
|
+
children: [
|
|
7941
|
+
isMobile && !hideTime ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-h-0", children: [
|
|
7942
|
+
internalDate && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg ", children: /* @__PURE__ */ jsxs("span", { className: "text-md font-semibold", children: [
|
|
7943
|
+
format(internalDate, "dd 'de' MMMM 'de' yyyy", {
|
|
7944
|
+
locale: ptBR
|
|
7945
|
+
}),
|
|
7946
|
+
" ",
|
|
7947
|
+
"- ",
|
|
7948
|
+
format(internalDate, hideSeconds ? "HH:mm" : "HH:mm:ss")
|
|
7949
|
+
] }) }),
|
|
7950
|
+
/* @__PURE__ */ jsxs(TabsBase, { value: activeTab, onValueChange: setActiveTab, children: [
|
|
7951
|
+
/* @__PURE__ */ jsxs(TabsListBase, { className: "", children: [
|
|
7952
|
+
/* @__PURE__ */ jsx(TabsTriggerBase, { value: "calendar", className: "flex-1", children: "Data" }),
|
|
7953
|
+
/* @__PURE__ */ jsx(TabsTriggerBase, { value: "time", className: "flex-1", children: "Hor\xE1rio" })
|
|
7954
|
+
] }),
|
|
7955
|
+
/* @__PURE__ */ jsx(TabsContentBase, { value: "calendar", className: "mt-0", children: /* @__PURE__ */ jsx(
|
|
7956
|
+
CalendarBase2,
|
|
7957
|
+
{
|
|
7958
|
+
mode: "single",
|
|
7959
|
+
locale: ptBR,
|
|
7960
|
+
selected: internalDate ?? void 0,
|
|
7961
|
+
onSelect: (d) => handleSelect(d ?? null),
|
|
7962
|
+
autoFocus: true,
|
|
7963
|
+
defaultMonth: fromDate ?? toDate ?? internalDate ?? void 0,
|
|
7964
|
+
...fromDate && { startMonth: fromDate },
|
|
7965
|
+
...toDate && { endMonth: toDate },
|
|
7966
|
+
...fromDate || toDate ? {
|
|
7967
|
+
disabled: [
|
|
7968
|
+
...fromDate ? [{ before: fromDate }] : [],
|
|
7969
|
+
...toDate ? [{ after: toDate }] : []
|
|
7970
|
+
]
|
|
7971
|
+
} : {},
|
|
7972
|
+
className: cn("w-full rounded-none border-none")
|
|
7973
|
+
}
|
|
7974
|
+
) }),
|
|
7975
|
+
/* @__PURE__ */ jsx(TabsContentBase, { value: "time", className: "mt-0", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center gap-4 py-2", children: /* @__PURE__ */ jsx(
|
|
7976
|
+
TimeScrollPicker,
|
|
7977
|
+
{
|
|
7978
|
+
setDate: (d) => handleTimeChange(d ?? null),
|
|
7979
|
+
date: internalDate,
|
|
7980
|
+
hideSeconds
|
|
7981
|
+
}
|
|
7982
|
+
) }) })
|
|
7983
|
+
] })
|
|
7984
|
+
] }) : /* @__PURE__ */ jsxs(
|
|
7985
|
+
"div",
|
|
8031
7986
|
{
|
|
8032
|
-
|
|
8033
|
-
|
|
8034
|
-
children:
|
|
7987
|
+
ref: contentRef,
|
|
7988
|
+
className: "flex flex-col sm:flex-row max-h-auto overflow-y-auto border-none rounded-md",
|
|
7989
|
+
children: [
|
|
7990
|
+
/* @__PURE__ */ jsx(
|
|
7991
|
+
CalendarBase2,
|
|
7992
|
+
{
|
|
7993
|
+
mode: "single",
|
|
7994
|
+
locale: ptBR,
|
|
7995
|
+
selected: internalDate ?? void 0,
|
|
7996
|
+
onSelect: (d) => handleSelect(d ?? null),
|
|
7997
|
+
autoFocus: true,
|
|
7998
|
+
defaultMonth: fromDate ?? toDate ?? internalDate ?? void 0,
|
|
7999
|
+
...fromDate && { startMonth: fromDate },
|
|
8000
|
+
...toDate && { endMonth: toDate },
|
|
8001
|
+
...fromDate || toDate ? {
|
|
8002
|
+
disabled: [
|
|
8003
|
+
...fromDate ? [{ before: fromDate }] : [],
|
|
8004
|
+
...toDate ? [{ after: toDate }] : []
|
|
8005
|
+
]
|
|
8006
|
+
} : {},
|
|
8007
|
+
className: cn(
|
|
8008
|
+
"w-max rounded-none border-none",
|
|
8009
|
+
!hideTime && "sm:rounded-r-none"
|
|
8010
|
+
)
|
|
8011
|
+
}
|
|
8012
|
+
),
|
|
8013
|
+
!hideTime && /* @__PURE__ */ jsxs(
|
|
8014
|
+
"div",
|
|
8015
|
+
{
|
|
8016
|
+
className: cn(
|
|
8017
|
+
"flex flex-col items-center justify-center",
|
|
8018
|
+
"border-l"
|
|
8019
|
+
),
|
|
8020
|
+
children: [
|
|
8021
|
+
/* @__PURE__ */ jsx("div", { className: "text-[clamp(0.85rem,1.4vw,1.125rem)] sm:text-[clamp(0.9rem,1.6vw,1.125rem)] font-semibold capitalize text-left", children: "Hor\xE1rio" }),
|
|
8022
|
+
/* @__PURE__ */ jsx(
|
|
8023
|
+
TimeScrollPicker,
|
|
8024
|
+
{
|
|
8025
|
+
setDate: (d) => handleTimeChange(d ?? null),
|
|
8026
|
+
date: internalDate,
|
|
8027
|
+
hideSeconds
|
|
8028
|
+
}
|
|
8029
|
+
)
|
|
8030
|
+
]
|
|
8031
|
+
}
|
|
8032
|
+
)
|
|
8033
|
+
]
|
|
8035
8034
|
}
|
|
8036
8035
|
),
|
|
8037
|
-
/* @__PURE__ */
|
|
8038
|
-
|
|
8039
|
-
|
|
8040
|
-
|
|
8041
|
-
|
|
8042
|
-
|
|
8036
|
+
/* @__PURE__ */ jsxs("div", { className: "flex rounded-md p-1.5 gap-2", children: [
|
|
8037
|
+
/* @__PURE__ */ jsx(
|
|
8038
|
+
ButtonBase,
|
|
8039
|
+
{
|
|
8040
|
+
variant: "outline",
|
|
8041
|
+
className: "no-active-animation",
|
|
8042
|
+
tooltip: "Hoje",
|
|
8043
|
+
size: "icon",
|
|
8044
|
+
onClick: () => {
|
|
8045
|
+
const now = /* @__PURE__ */ new Date();
|
|
8046
|
+
const selected = hideTime ? new Date(
|
|
8047
|
+
Date.UTC(
|
|
8048
|
+
now.getUTCFullYear(),
|
|
8049
|
+
now.getUTCMonth(),
|
|
8050
|
+
now.getUTCDate(),
|
|
8051
|
+
0,
|
|
8052
|
+
0,
|
|
8053
|
+
0,
|
|
8054
|
+
0
|
|
8055
|
+
)
|
|
8056
|
+
) : now;
|
|
8057
|
+
setInternalDate(selected);
|
|
8058
|
+
onChange?.(selected);
|
|
8059
|
+
onConfirm?.(selected);
|
|
8060
|
+
},
|
|
8061
|
+
children: /* @__PURE__ */ jsx(CalendarDotIcon$1, { className: "h-4 w-4" })
|
|
8062
|
+
}
|
|
8063
|
+
),
|
|
8064
|
+
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 sm:flex-row w-full gap-2", children: [
|
|
8065
|
+
/* @__PURE__ */ jsx(
|
|
8066
|
+
ButtonBase,
|
|
8067
|
+
{
|
|
8068
|
+
className: "no-active-animation rounded-md bg-background text-primary border hover:bg-muted/50 overflow-hidden flex-1 min-w-0 border-border",
|
|
8069
|
+
onClick: () => setOpen(false),
|
|
8070
|
+
children: "Cancelar"
|
|
8071
|
+
}
|
|
8043
8072
|
),
|
|
8044
|
-
|
|
8045
|
-
|
|
8046
|
-
|
|
8047
|
-
|
|
8048
|
-
|
|
8049
|
-
|
|
8050
|
-
|
|
8051
|
-
|
|
8052
|
-
|
|
8053
|
-
|
|
8054
|
-
|
|
8055
|
-
|
|
8073
|
+
/* @__PURE__ */ jsx(
|
|
8074
|
+
ButtonBase,
|
|
8075
|
+
{
|
|
8076
|
+
className: cn(
|
|
8077
|
+
"no-active-animation rounded-md bg-emerald-600",
|
|
8078
|
+
internalDate ? "hover:bg-emerald-700" : "opacity-50 cursor-not-allowed"
|
|
8079
|
+
),
|
|
8080
|
+
disabled: !internalDate,
|
|
8081
|
+
onClick: () => {
|
|
8082
|
+
if (!internalDate) return;
|
|
8083
|
+
setOpen(false);
|
|
8084
|
+
onConfirm?.(internalDate);
|
|
8085
|
+
},
|
|
8086
|
+
children: "Confirmar"
|
|
8087
|
+
}
|
|
8088
|
+
)
|
|
8089
|
+
] })
|
|
8090
|
+
] })
|
|
8091
|
+
]
|
|
8092
|
+
}
|
|
8093
|
+
);
|
|
8056
8094
|
return /* @__PURE__ */ jsxs("div", { className: cn("w-full sm:w-auto", className), children: [
|
|
8057
8095
|
label && /* @__PURE__ */ jsx(LabelBase_default, { children: label }),
|
|
8058
8096
|
isMobile ? /* @__PURE__ */ jsxs(DialogBase, { open, onOpenChange: setOpen, children: [
|
|
@@ -8066,7 +8104,7 @@ function DateTimePicker({
|
|
|
8066
8104
|
}
|
|
8067
8105
|
),
|
|
8068
8106
|
/* @__PURE__ */ jsx(ErrorMessage_default, { error }),
|
|
8069
|
-
/* @__PURE__ */ jsx(DialogContentBase, { className: "p-0 max-h-[95vh] w-
|
|
8107
|
+
/* @__PURE__ */ jsx(DialogContentBase, { className: "p-0 max-h-[95vh] w-[95%] sm:max-w-lg overflow-hidden flex flex-col", children: /* @__PURE__ */ jsx("div", { className: "overflow-y-auto flex-1", children: renderPickerContent() }) })
|
|
8070
8108
|
] }) : /* @__PURE__ */ jsxs(PopoverBase, { open, onOpenChange: setOpen, children: [
|
|
8071
8109
|
/* @__PURE__ */ jsx(
|
|
8072
8110
|
PopoverTriggerBase,
|
|
@@ -10096,28 +10134,37 @@ function EventAgenda({
|
|
|
10096
10134
|
initialDate,
|
|
10097
10135
|
onClick,
|
|
10098
10136
|
showYearView = false,
|
|
10099
|
-
noTime = false
|
|
10137
|
+
noTime = false,
|
|
10138
|
+
onlyDay,
|
|
10139
|
+
onlyMonth,
|
|
10140
|
+
onlyWeek,
|
|
10141
|
+
onlyAgenda,
|
|
10142
|
+
onlyYear
|
|
10100
10143
|
}) {
|
|
10144
|
+
const lockedView = onlyDay ? "day" : onlyMonth ? "month" : onlyWeek ? "week" : onlyAgenda ? "agenda" : onlyYear ? "year" : void 0;
|
|
10101
10145
|
const [currentDate, setCurrentDate] = useState(
|
|
10102
10146
|
initialDate && new Date(initialDate) || /* @__PURE__ */ new Date()
|
|
10103
10147
|
);
|
|
10104
|
-
const [view, setView] = useState(
|
|
10148
|
+
const [view, setView] = useState(
|
|
10149
|
+
lockedView || initialView
|
|
10150
|
+
);
|
|
10105
10151
|
const [selectedEvent, setSelectedEvent] = useState(null);
|
|
10152
|
+
const activeView = lockedView || view;
|
|
10106
10153
|
const goPrevious = () => {
|
|
10107
|
-
if (
|
|
10108
|
-
else if (
|
|
10109
|
-
else if (
|
|
10110
|
-
else if (
|
|
10154
|
+
if (activeView === "month") setCurrentDate((d) => subMonths(d, 1));
|
|
10155
|
+
else if (activeView === "week") setCurrentDate((d) => subWeeks(d, 1));
|
|
10156
|
+
else if (activeView === "day") setCurrentDate((d) => addDays(d, -1));
|
|
10157
|
+
else if (activeView === "agenda")
|
|
10111
10158
|
setCurrentDate((d) => addDays(d, -AgendaDaysToShowAgenda));
|
|
10112
|
-
else if (
|
|
10159
|
+
else if (activeView === "year") setCurrentDate((d) => subYears(d, 1));
|
|
10113
10160
|
};
|
|
10114
10161
|
const goNext = () => {
|
|
10115
|
-
if (
|
|
10116
|
-
else if (
|
|
10117
|
-
else if (
|
|
10118
|
-
else if (
|
|
10162
|
+
if (activeView === "month") setCurrentDate((d) => addMonths(d, 1));
|
|
10163
|
+
else if (activeView === "week") setCurrentDate((d) => addWeeks(d, 1));
|
|
10164
|
+
else if (activeView === "day") setCurrentDate((d) => addDays(d, 1));
|
|
10165
|
+
else if (activeView === "agenda")
|
|
10119
10166
|
setCurrentDate((d) => addDays(d, AgendaDaysToShowAgenda));
|
|
10120
|
-
else if (
|
|
10167
|
+
else if (activeView === "year") setCurrentDate((d) => addYears(d, 1));
|
|
10121
10168
|
};
|
|
10122
10169
|
const handleEventSelect = (event, e) => {
|
|
10123
10170
|
try {
|
|
@@ -10163,9 +10210,9 @@ function EventAgenda({
|
|
|
10163
10210
|
};
|
|
10164
10211
|
const viewTitle = useMemo(() => {
|
|
10165
10212
|
const capitalize2 = (s) => s ? s.charAt(0).toUpperCase() + s.slice(1) : s;
|
|
10166
|
-
if (
|
|
10213
|
+
if (activeView === "month")
|
|
10167
10214
|
return capitalize2(format(currentDate, "MMMM yyyy", { locale: ptBR }));
|
|
10168
|
-
if (
|
|
10215
|
+
if (activeView === "week") {
|
|
10169
10216
|
const start = startOfWeek(currentDate, { weekStartsOn: 1 });
|
|
10170
10217
|
const end = endOfWeek(currentDate, { weekStartsOn: 1 });
|
|
10171
10218
|
if (isSameMonth(start, end))
|
|
@@ -10174,17 +10221,19 @@ function EventAgenda({
|
|
|
10174
10221
|
const s2 = capitalize2(format(end, "MMM yyyy", { locale: ptBR }));
|
|
10175
10222
|
return `${s1} - ${s2}`;
|
|
10176
10223
|
}
|
|
10177
|
-
if (
|
|
10178
|
-
return
|
|
10179
|
-
|
|
10224
|
+
if (activeView === "day")
|
|
10225
|
+
return capitalize2(
|
|
10226
|
+
format(currentDate, "EEEE, d 'de' MMMM", { locale: ptBR })
|
|
10227
|
+
);
|
|
10228
|
+
if (activeView === "agenda") {
|
|
10180
10229
|
const start = currentDate;
|
|
10181
10230
|
return capitalize2(format(start, "MMMM yyyy", { locale: ptBR }));
|
|
10182
10231
|
}
|
|
10183
|
-
if (
|
|
10232
|
+
if (activeView === "year") {
|
|
10184
10233
|
return format(currentDate, "yyyy");
|
|
10185
10234
|
}
|
|
10186
10235
|
return capitalize2(format(currentDate, "MMMM yyyy", { locale: ptBR }));
|
|
10187
|
-
}, [currentDate,
|
|
10236
|
+
}, [currentDate, activeView]);
|
|
10188
10237
|
const availableViews = showYearView ? ["year", "month", "week", "day", "agenda"] : ["month", "week", "day", "agenda"];
|
|
10189
10238
|
const selectItems = availableViews.map(
|
|
10190
10239
|
(v) => ({
|
|
@@ -10232,22 +10281,22 @@ function EventAgenda({
|
|
|
10232
10281
|
] }),
|
|
10233
10282
|
/* @__PURE__ */ jsx("h2", { className: "font-semibold text-sm sm:text-base md:text-lg lg:text-xl xl:text-2xl min-w-0 truncate sm:whitespace-normal", children: viewTitle })
|
|
10234
10283
|
] }),
|
|
10235
|
-
/* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx(
|
|
10284
|
+
!lockedView && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx(
|
|
10236
10285
|
Select,
|
|
10237
10286
|
{
|
|
10238
|
-
selected:
|
|
10287
|
+
selected: activeView,
|
|
10239
10288
|
onChange: (v) => {
|
|
10240
10289
|
setView(v);
|
|
10241
10290
|
},
|
|
10242
10291
|
items: selectItems,
|
|
10243
|
-
placeholder: viewLabel(
|
|
10292
|
+
placeholder: viewLabel(activeView),
|
|
10244
10293
|
className: "min-w-24",
|
|
10245
10294
|
hideClear: true
|
|
10246
10295
|
}
|
|
10247
10296
|
) })
|
|
10248
10297
|
] }),
|
|
10249
10298
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col transition-all duration-200 ease-in-out", children: [
|
|
10250
|
-
|
|
10299
|
+
activeView === "month" && /* @__PURE__ */ jsx(
|
|
10251
10300
|
MonthViewAgenda,
|
|
10252
10301
|
{
|
|
10253
10302
|
currentDate,
|
|
@@ -10256,7 +10305,7 @@ function EventAgenda({
|
|
|
10256
10305
|
noTime
|
|
10257
10306
|
}
|
|
10258
10307
|
),
|
|
10259
|
-
|
|
10308
|
+
activeView === "week" && /* @__PURE__ */ jsx(
|
|
10260
10309
|
WeekViewAgenda,
|
|
10261
10310
|
{
|
|
10262
10311
|
currentDate,
|
|
@@ -10265,7 +10314,7 @@ function EventAgenda({
|
|
|
10265
10314
|
noTime
|
|
10266
10315
|
}
|
|
10267
10316
|
),
|
|
10268
|
-
|
|
10317
|
+
activeView === "day" && /* @__PURE__ */ jsx(
|
|
10269
10318
|
DayViewAgenda,
|
|
10270
10319
|
{
|
|
10271
10320
|
currentDate,
|
|
@@ -10274,7 +10323,7 @@ function EventAgenda({
|
|
|
10274
10323
|
noTime
|
|
10275
10324
|
}
|
|
10276
10325
|
),
|
|
10277
|
-
|
|
10326
|
+
activeView === "agenda" && /* @__PURE__ */ jsx(
|
|
10278
10327
|
Agenda,
|
|
10279
10328
|
{
|
|
10280
10329
|
currentDate,
|
|
@@ -10283,14 +10332,16 @@ function EventAgenda({
|
|
|
10283
10332
|
noTime
|
|
10284
10333
|
}
|
|
10285
10334
|
),
|
|
10286
|
-
|
|
10335
|
+
activeView === "year" && /* @__PURE__ */ jsx(
|
|
10287
10336
|
YearViewAgenda,
|
|
10288
10337
|
{
|
|
10289
10338
|
currentDate,
|
|
10290
10339
|
events,
|
|
10291
10340
|
onMonthSelect: (monthDate) => {
|
|
10292
10341
|
setCurrentDate(monthDate);
|
|
10293
|
-
|
|
10342
|
+
if (!lockedView) {
|
|
10343
|
+
setView("month");
|
|
10344
|
+
}
|
|
10294
10345
|
}
|
|
10295
10346
|
}
|
|
10296
10347
|
)
|
|
@@ -21724,7 +21775,7 @@ function useCommandPalette({
|
|
|
21724
21775
|
useEffect(() => {
|
|
21725
21776
|
setActiveIndex(0);
|
|
21726
21777
|
}, [page]);
|
|
21727
|
-
const displayedGroups =
|
|
21778
|
+
const displayedGroups = useMemo(() => {
|
|
21728
21779
|
const start = page * PAGE_SIZE;
|
|
21729
21780
|
const end = start + PAGE_SIZE;
|
|
21730
21781
|
let count = 0;
|
|
@@ -21743,12 +21794,12 @@ function useCommandPalette({
|
|
|
21743
21794
|
}
|
|
21744
21795
|
return result;
|
|
21745
21796
|
}, [allMatchedGroups, page]);
|
|
21746
|
-
const flatItems =
|
|
21797
|
+
const flatItems = useMemo(
|
|
21747
21798
|
() => displayedGroups.flatMap((g) => g.items),
|
|
21748
21799
|
[displayedGroups]
|
|
21749
21800
|
);
|
|
21750
21801
|
const pageItemCount = flatItems.length;
|
|
21751
|
-
|
|
21802
|
+
useEffect(() => {
|
|
21752
21803
|
setActiveIndex((i) => Math.min(i, Math.max(pageItemCount - 1, 0)));
|
|
21753
21804
|
}, [pageItemCount]);
|
|
21754
21805
|
function handleSelect(item) {
|