@moontra/moonui 2.1.8 → 2.1.9

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.js CHANGED
@@ -8,7 +8,6 @@ var lucideReact = require('lucide-react');
8
8
  var jsxRuntime = require('react/jsx-runtime');
9
9
  var classVarianceAuthority = require('class-variance-authority');
10
10
  var AvatarPrimitive = require('@radix-ui/react-avatar');
11
- var dateFns = require('date-fns');
12
11
  var framerMotion = require('framer-motion');
13
12
  var CheckboxPrimitive = require('@radix-ui/react-checkbox');
14
13
  require('react-dom');
@@ -19,6 +18,7 @@ var TabsPrimitive = require('@radix-ui/react-tabs');
19
18
  var DialogPrimitive = require('@radix-ui/react-dialog');
20
19
  var SelectPrimitive = require('@radix-ui/react-select');
21
20
  var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
21
+ var dateFns = require('date-fns');
22
22
  var SeparatorPrimitive = require('@radix-ui/react-separator');
23
23
  var TooltipPrimitive = require('@radix-ui/react-tooltip');
24
24
  var SwitchPrimitives = require('@radix-ui/react-switch');
@@ -847,202 +847,6 @@ var Button = t__namespace.forwardRef(
847
847
  }
848
848
  );
849
849
  Button.displayName = "Button";
850
- function Calendar({
851
- mode = "single",
852
- selected,
853
- onSelect,
854
- disabled,
855
- showOutsideDays = false,
856
- className,
857
- classNames,
858
- numberOfMonths = 1,
859
- defaultMonth,
860
- ...props
861
- }) {
862
- const [currentMonth, setCurrentMonth] = t__namespace.useState(
863
- defaultMonth || selected && selected || /* @__PURE__ */ new Date()
864
- );
865
- const weekDays = [
866
- { short: "S", full: "Sunday" },
867
- { short: "M", full: "Monday" },
868
- { short: "T", full: "Tuesday" },
869
- { short: "W", full: "Wednesday" },
870
- { short: "T", full: "Thursday" },
871
- { short: "F", full: "Friday" },
872
- { short: "S", full: "Saturday" }
873
- ];
874
- const handlePreviousMonth = () => {
875
- setCurrentMonth(dateFns.subMonths(currentMonth, 1));
876
- };
877
- const handleNextMonth = () => {
878
- setCurrentMonth(dateFns.addMonths(currentMonth, 1));
879
- };
880
- const handleDateClick = (date) => {
881
- if (disabled?.(date))
882
- return;
883
- if (mode === "single") {
884
- onSelect?.(date);
885
- } else if (mode === "range") {
886
- const currentSelection = selected;
887
- if (!currentSelection?.from || currentSelection.from && currentSelection.to) {
888
- onSelect?.({ from: date, to: void 0 });
889
- } else {
890
- if (date < currentSelection.from) {
891
- onSelect?.({ from: date, to: currentSelection.from });
892
- } else {
893
- onSelect?.({ from: currentSelection.from, to: date });
894
- }
895
- }
896
- }
897
- };
898
- const isDateSelected = (date) => {
899
- if (!selected)
900
- return false;
901
- if (mode === "single") {
902
- return dateFns.isSameDay(date, selected);
903
- } else if (mode === "range") {
904
- const range = selected;
905
- if (range.from && range.to) {
906
- return date >= range.from && date <= range.to;
907
- }
908
- return range.from ? dateFns.isSameDay(date, range.from) : false;
909
- }
910
- return false;
911
- };
912
- const isRangeStart = (date) => {
913
- if (mode !== "range" || !selected)
914
- return false;
915
- const range = selected;
916
- return range.from ? dateFns.isSameDay(date, range.from) : false;
917
- };
918
- const isRangeEnd = (date) => {
919
- if (mode !== "range" || !selected)
920
- return false;
921
- const range = selected;
922
- return range.to ? dateFns.isSameDay(date, range.to) : false;
923
- };
924
- const isRangeMiddle = (date) => {
925
- if (mode !== "range" || !selected)
926
- return false;
927
- const range = selected;
928
- if (!range.from || !range.to)
929
- return false;
930
- return date > range.from && date < range.to;
931
- };
932
- const getDaysInMonth = () => {
933
- const start = dateFns.startOfMonth(currentMonth);
934
- const end = dateFns.endOfMonth(currentMonth);
935
- const days2 = dateFns.eachDayOfInterval({ start, end });
936
- const firstDayOfWeek = dateFns.getDay(start);
937
- const previousMonthDays = [];
938
- if (firstDayOfWeek > 0 && showOutsideDays) {
939
- const previousMonthStart = dateFns.startOfWeek(start);
940
- const previousMonthEnd = new Date(start);
941
- previousMonthEnd.setDate(previousMonthEnd.getDate() - 1);
942
- previousMonthDays.push(...dateFns.eachDayOfInterval({
943
- start: previousMonthStart,
944
- end: previousMonthEnd
945
- }));
946
- }
947
- const lastDayOfWeek = dateFns.getDay(end);
948
- const nextMonthDays = [];
949
- if (lastDayOfWeek < 6 && showOutsideDays) {
950
- const nextMonthStart = new Date(end);
951
- nextMonthStart.setDate(nextMonthStart.getDate() + 1);
952
- const nextMonthEnd = dateFns.endOfWeek(end);
953
- nextMonthDays.push(...dateFns.eachDayOfInterval({
954
- start: nextMonthStart,
955
- end: nextMonthEnd
956
- }));
957
- }
958
- const emptyCells = [];
959
- if (!showOutsideDays && firstDayOfWeek > 0) {
960
- for (let i = 0; i < firstDayOfWeek; i++) {
961
- emptyCells.push(null);
962
- }
963
- }
964
- return [...previousMonthDays, ...emptyCells, ...days2, ...nextMonthDays];
965
- };
966
- const days = getDaysInMonth();
967
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("p-0", className), children: [
968
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
969
- /* @__PURE__ */ jsxRuntime.jsx(
970
- "button",
971
- {
972
- onClick: handlePreviousMonth,
973
- className: cn(
974
- "h-10 w-10 bg-transparent p-0 rounded-lg",
975
- "hover:bg-muted transition-colors",
976
- "inline-flex items-center justify-center"
977
- ),
978
- type: "button",
979
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-5 w-5" })
980
- }
981
- ),
982
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-medium", children: dateFns.format(currentMonth, "MMMM yyyy") }),
983
- /* @__PURE__ */ jsxRuntime.jsx(
984
- "button",
985
- {
986
- onClick: handleNextMonth,
987
- className: cn(
988
- "h-10 w-10 bg-transparent p-0 rounded-lg",
989
- "hover:bg-muted transition-colors",
990
- "inline-flex items-center justify-center"
991
- ),
992
- type: "button",
993
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-5 w-5" })
994
- }
995
- )
996
- ] }),
997
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 pb-4", children: [
998
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 mb-2", children: weekDays.map((day, index) => /* @__PURE__ */ jsxRuntime.jsx(
999
- "div",
1000
- {
1001
- className: "text-muted-foreground text-xs font-medium h-10 flex items-center justify-center",
1002
- title: day.full,
1003
- children: day.short
1004
- },
1005
- `weekday-${index}`
1006
- )) }),
1007
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 gap-1", children: days.map((date, index) => {
1008
- if (!date) {
1009
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-10 w-10" }, `empty-${index}`);
1010
- }
1011
- const isOutsideMonth = !dateFns.isSameMonth(date, currentMonth);
1012
- const isDisabled = disabled?.(date) || false;
1013
- const isSelected = isDateSelected(date);
1014
- const isTodayDate = dateFns.isToday(date);
1015
- const rangeStart = isRangeStart(date);
1016
- const rangeEnd = isRangeEnd(date);
1017
- const rangeMiddle = isRangeMiddle(date);
1018
- return /* @__PURE__ */ jsxRuntime.jsx(
1019
- "button",
1020
- {
1021
- onClick: () => handleDateClick(date),
1022
- disabled: isDisabled,
1023
- className: cn(
1024
- "h-10 w-10 p-0 font-normal",
1025
- "inline-flex items-center justify-center rounded-lg",
1026
- "hover:bg-muted transition-colors text-sm",
1027
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
1028
- isOutsideMonth && "text-muted-foreground/50",
1029
- isDisabled && "text-muted-foreground/30 cursor-not-allowed hover:bg-transparent",
1030
- isSelected && !rangeMiddle && "bg-primary text-primary-foreground font-medium hover:bg-primary hover:text-primary-foreground",
1031
- isTodayDate && "font-semibold relative after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:h-1 after:w-1 after:rounded-full after:bg-primary",
1032
- rangeMiddle && "bg-accent/30 text-accent-foreground rounded-none",
1033
- rangeStart && "rounded-r-none",
1034
- rangeEnd && "rounded-l-none"
1035
- ),
1036
- type: "button",
1037
- children: dateFns.format(date, "d")
1038
- },
1039
- date.toISOString()
1040
- );
1041
- }) })
1042
- ] })
1043
- ] });
1044
- }
1045
- Calendar.displayName = "Calendar";
1046
850
  var microInteractionVariants = classVarianceAuthority.cva("", {
1047
851
  variants: {
1048
852
  hover: {
@@ -8136,6 +7940,202 @@ function createFilterableColumn(accessorKey, header, filterFn) {
8136
7940
  filterFn
8137
7941
  };
8138
7942
  }
7943
+ function Calendar({
7944
+ mode = "single",
7945
+ selected,
7946
+ onSelect,
7947
+ disabled,
7948
+ showOutsideDays = false,
7949
+ className,
7950
+ classNames,
7951
+ numberOfMonths = 1,
7952
+ defaultMonth,
7953
+ ...props
7954
+ }) {
7955
+ const [currentMonth, setCurrentMonth] = t__namespace.useState(
7956
+ defaultMonth || selected && selected || /* @__PURE__ */ new Date()
7957
+ );
7958
+ const weekDays = [
7959
+ { short: "S", full: "Sunday" },
7960
+ { short: "M", full: "Monday" },
7961
+ { short: "T", full: "Tuesday" },
7962
+ { short: "W", full: "Wednesday" },
7963
+ { short: "T", full: "Thursday" },
7964
+ { short: "F", full: "Friday" },
7965
+ { short: "S", full: "Saturday" }
7966
+ ];
7967
+ const handlePreviousMonth = () => {
7968
+ setCurrentMonth(dateFns.subMonths(currentMonth, 1));
7969
+ };
7970
+ const handleNextMonth = () => {
7971
+ setCurrentMonth(dateFns.addMonths(currentMonth, 1));
7972
+ };
7973
+ const handleDateClick = (date) => {
7974
+ if (disabled?.(date))
7975
+ return;
7976
+ if (mode === "single") {
7977
+ onSelect?.(date);
7978
+ } else if (mode === "range") {
7979
+ const currentSelection = selected;
7980
+ if (!currentSelection?.from || currentSelection.from && currentSelection.to) {
7981
+ onSelect?.({ from: date, to: void 0 });
7982
+ } else {
7983
+ if (date < currentSelection.from) {
7984
+ onSelect?.({ from: date, to: currentSelection.from });
7985
+ } else {
7986
+ onSelect?.({ from: currentSelection.from, to: date });
7987
+ }
7988
+ }
7989
+ }
7990
+ };
7991
+ const isDateSelected = (date) => {
7992
+ if (!selected)
7993
+ return false;
7994
+ if (mode === "single") {
7995
+ return dateFns.isSameDay(date, selected);
7996
+ } else if (mode === "range") {
7997
+ const range = selected;
7998
+ if (range.from && range.to) {
7999
+ return date >= range.from && date <= range.to;
8000
+ }
8001
+ return range.from ? dateFns.isSameDay(date, range.from) : false;
8002
+ }
8003
+ return false;
8004
+ };
8005
+ const isRangeStart = (date) => {
8006
+ if (mode !== "range" || !selected)
8007
+ return false;
8008
+ const range = selected;
8009
+ return range.from ? dateFns.isSameDay(date, range.from) : false;
8010
+ };
8011
+ const isRangeEnd = (date) => {
8012
+ if (mode !== "range" || !selected)
8013
+ return false;
8014
+ const range = selected;
8015
+ return range.to ? dateFns.isSameDay(date, range.to) : false;
8016
+ };
8017
+ const isRangeMiddle = (date) => {
8018
+ if (mode !== "range" || !selected)
8019
+ return false;
8020
+ const range = selected;
8021
+ if (!range.from || !range.to)
8022
+ return false;
8023
+ return date > range.from && date < range.to;
8024
+ };
8025
+ const getDaysInMonth = () => {
8026
+ const start = dateFns.startOfMonth(currentMonth);
8027
+ const end = dateFns.endOfMonth(currentMonth);
8028
+ const days2 = dateFns.eachDayOfInterval({ start, end });
8029
+ const firstDayOfWeek = dateFns.getDay(start);
8030
+ const previousMonthDays = [];
8031
+ if (firstDayOfWeek > 0 && showOutsideDays) {
8032
+ const previousMonthStart = dateFns.startOfWeek(start);
8033
+ const previousMonthEnd = new Date(start);
8034
+ previousMonthEnd.setDate(previousMonthEnd.getDate() - 1);
8035
+ previousMonthDays.push(...dateFns.eachDayOfInterval({
8036
+ start: previousMonthStart,
8037
+ end: previousMonthEnd
8038
+ }));
8039
+ }
8040
+ const lastDayOfWeek = dateFns.getDay(end);
8041
+ const nextMonthDays = [];
8042
+ if (lastDayOfWeek < 6 && showOutsideDays) {
8043
+ const nextMonthStart = new Date(end);
8044
+ nextMonthStart.setDate(nextMonthStart.getDate() + 1);
8045
+ const nextMonthEnd = dateFns.endOfWeek(end);
8046
+ nextMonthDays.push(...dateFns.eachDayOfInterval({
8047
+ start: nextMonthStart,
8048
+ end: nextMonthEnd
8049
+ }));
8050
+ }
8051
+ const emptyCells = [];
8052
+ if (!showOutsideDays && firstDayOfWeek > 0) {
8053
+ for (let i = 0; i < firstDayOfWeek; i++) {
8054
+ emptyCells.push(null);
8055
+ }
8056
+ }
8057
+ return [...previousMonthDays, ...emptyCells, ...days2, ...nextMonthDays];
8058
+ };
8059
+ const days = getDaysInMonth();
8060
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("p-0", className), children: [
8061
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
8062
+ /* @__PURE__ */ jsxRuntime.jsx(
8063
+ "button",
8064
+ {
8065
+ onClick: handlePreviousMonth,
8066
+ className: cn(
8067
+ "h-10 w-10 bg-transparent p-0 rounded-lg",
8068
+ "hover:bg-muted transition-colors",
8069
+ "inline-flex items-center justify-center"
8070
+ ),
8071
+ type: "button",
8072
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-5 w-5" })
8073
+ }
8074
+ ),
8075
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-medium", children: dateFns.format(currentMonth, "MMMM yyyy") }),
8076
+ /* @__PURE__ */ jsxRuntime.jsx(
8077
+ "button",
8078
+ {
8079
+ onClick: handleNextMonth,
8080
+ className: cn(
8081
+ "h-10 w-10 bg-transparent p-0 rounded-lg",
8082
+ "hover:bg-muted transition-colors",
8083
+ "inline-flex items-center justify-center"
8084
+ ),
8085
+ type: "button",
8086
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-5 w-5" })
8087
+ }
8088
+ )
8089
+ ] }),
8090
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 pb-4", children: [
8091
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 mb-2", children: weekDays.map((day, index) => /* @__PURE__ */ jsxRuntime.jsx(
8092
+ "div",
8093
+ {
8094
+ className: "text-muted-foreground text-xs font-medium h-10 flex items-center justify-center",
8095
+ title: day.full,
8096
+ children: day.short
8097
+ },
8098
+ `weekday-${index}`
8099
+ )) }),
8100
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 gap-1", children: days.map((date, index) => {
8101
+ if (!date) {
8102
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-10 w-10" }, `empty-${index}`);
8103
+ }
8104
+ const isOutsideMonth = !dateFns.isSameMonth(date, currentMonth);
8105
+ const isDisabled = disabled?.(date) || false;
8106
+ const isSelected = isDateSelected(date);
8107
+ const isTodayDate = dateFns.isToday(date);
8108
+ const rangeStart = isRangeStart(date);
8109
+ const rangeEnd = isRangeEnd(date);
8110
+ const rangeMiddle = isRangeMiddle(date);
8111
+ return /* @__PURE__ */ jsxRuntime.jsx(
8112
+ "button",
8113
+ {
8114
+ onClick: () => handleDateClick(date),
8115
+ disabled: isDisabled,
8116
+ className: cn(
8117
+ "h-10 w-10 p-0 font-normal",
8118
+ "inline-flex items-center justify-center rounded-lg",
8119
+ "hover:bg-muted transition-colors text-sm",
8120
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
8121
+ isOutsideMonth && "text-muted-foreground/50",
8122
+ isDisabled && "text-muted-foreground/30 cursor-not-allowed hover:bg-transparent",
8123
+ isSelected && !rangeMiddle && "bg-primary text-primary-foreground font-medium hover:bg-primary hover:text-primary-foreground",
8124
+ isTodayDate && "font-semibold relative after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:h-1 after:w-1 after:rounded-full after:bg-primary",
8125
+ rangeMiddle && "bg-accent/30 text-accent-foreground rounded-none",
8126
+ rangeStart && "rounded-r-none",
8127
+ rangeEnd && "rounded-l-none"
8128
+ ),
8129
+ type: "button",
8130
+ children: dateFns.format(date, "d")
8131
+ },
8132
+ date.toISOString()
8133
+ );
8134
+ }) })
8135
+ ] })
8136
+ ] });
8137
+ }
8138
+ Calendar.displayName = "Calendar";
8139
8139
  var datePickerVariants = classVarianceAuthority.cva(
8140
8140
  "w-full justify-start text-left font-normal",
8141
8141
  {
@@ -11000,7 +11000,6 @@ exports.BreadcrumbList = BreadcrumbList;
11000
11000
  exports.BreadcrumbPage = BreadcrumbPage;
11001
11001
  exports.BreadcrumbSeparator = BreadcrumbSeparator;
11002
11002
  exports.Button = Button;
11003
- exports.Calendar = Calendar;
11004
11003
  exports.Card = Card;
11005
11004
  exports.CardContent = CardContent;
11006
11005
  exports.CardDescription = CardDescription;