@multiplatform.one/forms 6.0.0

package/dist/esm/fields/DatePicker/ThemeRefactor.spec.mjs

@@ -0,0 +1,99 @@
+import { describe, it, expect, vi } from "vitest";
+import { renderWithProviders } from "@multiplatform.one/test-utils";
+import { jsx } from "react/jsx-runtime";
+vi.mock("@multiplatform.one/router", () => ({
+  useUrlState: () => [null, () => {}]
+}));
+vi.mock("@tamagui/lucide-icons-2", () => ({
+  Calendar: () => null,
+  ChevronLeft: () => null,
+  ChevronRight: () => null,
+  X: () => null
+}));
+vi.mock("react-native-reanimated", () => ({
+  default: {
+    useSharedValue: init => ({
+      value: init
+    }),
+    useAnimatedStyle: () => ({}),
+    withTiming: val => val,
+    withSpring: val => val,
+    createAnimatedComponent: component => component,
+    runOnJS: fn => fn,
+    runOnUI: fn => fn,
+    useDerivedValue: fn => ({
+      value: fn()
+    }),
+    useAnimatedRef: () => ({
+      current: null
+    }),
+    Easing: {
+      linear: v => v,
+      ease: v => v,
+      bezier: () => v => v
+    },
+    FadeIn: {
+      duration: () => ({})
+    },
+    FadeOut: {
+      duration: () => ({})
+    },
+    Layout: {
+      duration: () => ({})
+    },
+    Extrapolation: {
+      CLAMP: "clamp"
+    },
+    measure: () => null,
+    scrollTo: () => {},
+    makeMutable: init => ({
+      value: init
+    })
+  },
+  useSharedValue: init => ({
+    value: init
+  }),
+  useAnimatedStyle: () => ({}),
+  withTiming: val => val,
+  withSpring: val => val,
+  createAnimatedComponent: component => component,
+  runOnJS: fn => fn,
+  runOnUI: fn => fn,
+  useDerivedValue: fn => ({
+    value: fn()
+  }),
+  useAnimatedRef: () => ({
+    current: null
+  }),
+  Easing: {
+    linear: v => v,
+    ease: v => v,
+    bezier: () => v => v
+  },
+  FadeIn: {
+    duration: () => ({})
+  },
+  FadeOut: {
+    duration: () => ({})
+  },
+  Layout: {
+    duration: () => ({})
+  }
+}));
+async function loadDatePicker() {
+  return (await import("./index.mjs")).DatePicker;
+}
+describe("DatePicker uses premium patterns", () => {
+  it("renders with label and input trigger", async () => {
+    const DatePicker = await loadDatePicker();
+    const result = renderWithProviders(/* @__PURE__ */jsx(DatePicker, {
+      label: "Due Date",
+      placeholder: "Select date"
+    }));
+    const labelEl = result.findTextElement("Due Date");
+    expect(labelEl).toBeTruthy();
+    const input = result.container.querySelector("input");
+    expect(input?.getAttribute("placeholder")).toBe("Select date");
+  });
+});
+//# sourceMappingURL=ThemeRefactor.spec.mjs.map

package/dist/esm/fields/DatePicker/ThemeRefactor.spec.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["describe","it","expect","vi","renderWithProviders","jsx","mock","useUrlState","Calendar","ChevronLeft","ChevronRight","X","default","useSharedValue","init","value","useAnimatedStyle","withTiming","val","withSpring","createAnimatedComponent","component","runOnJS","fn","runOnUI","useDerivedValue","useAnimatedRef","current","Easing","linear","v","ease","bezier","FadeIn","duration","FadeOut","Layout","Extrapolation","CLAMP","measure","scrollTo","makeMutable","loadDatePicker","DatePicker","result","label","placeholder","labelEl","findTextElement","toBeTruthy","input","container","querySelector","getAttribute","toBe"],"sources":["../../../../src/fields/DatePicker/ThemeRefactor.spec.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/fields/DatePicker/ThemeRefactor.spec.native.js

@@ -0,0 +1,183 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect, vi } from "vitest";
+import { renderWithProviders } from "@multiplatform.one/test-utils";
+vi.mock("@multiplatform.one/router", function () {
+  return {
+    useUrlState: function useUrlState() {
+      return [null, function () {}];
+    }
+  };
+});
+vi.mock("@tamagui/lucide-icons-2", function () {
+  return {
+    Calendar: function Calendar() {
+      return null;
+    },
+    ChevronLeft: function ChevronLeft() {
+      return null;
+    },
+    ChevronRight: function ChevronRight() {
+      return null;
+    },
+    X: function X() {
+      return null;
+    }
+  };
+});
+vi.mock("react-native-reanimated", function () {
+  return {
+    default: {
+      useSharedValue: function useSharedValue(init) {
+        return {
+          value: init
+        };
+      },
+      useAnimatedStyle: function useAnimatedStyle() {
+        return {};
+      },
+      withTiming: function withTiming(val) {
+        return val;
+      },
+      withSpring: function withSpring(val) {
+        return val;
+      },
+      createAnimatedComponent: function createAnimatedComponent(component) {
+        return component;
+      },
+      runOnJS: function runOnJS(fn) {
+        return fn;
+      },
+      runOnUI: function runOnUI(fn) {
+        return fn;
+      },
+      useDerivedValue: function useDerivedValue(fn) {
+        return {
+          value: fn()
+        };
+      },
+      useAnimatedRef: function useAnimatedRef() {
+        return {
+          current: null
+        };
+      },
+      Easing: {
+        linear: function linear(v) {
+          return v;
+        },
+        ease: function ease(v) {
+          return v;
+        },
+        bezier: function bezier() {
+          return function (v) {
+            return v;
+          };
+        }
+      },
+      FadeIn: {
+        duration: function duration() {
+          return {};
+        }
+      },
+      FadeOut: {
+        duration: function duration() {
+          return {};
+        }
+      },
+      Layout: {
+        duration: function duration() {
+          return {};
+        }
+      },
+      Extrapolation: {
+        CLAMP: "clamp"
+      },
+      measure: function measure() {
+        return null;
+      },
+      scrollTo: function scrollTo() {},
+      makeMutable: function makeMutable(init) {
+        return {
+          value: init
+        };
+      }
+    },
+    useSharedValue: function useSharedValue(init) {
+      return {
+        value: init
+      };
+    },
+    useAnimatedStyle: function useAnimatedStyle() {
+      return {};
+    },
+    withTiming: function withTiming(val) {
+      return val;
+    },
+    withSpring: function withSpring(val) {
+      return val;
+    },
+    createAnimatedComponent: function createAnimatedComponent(component) {
+      return component;
+    },
+    runOnJS: function runOnJS(fn) {
+      return fn;
+    },
+    runOnUI: function runOnUI(fn) {
+      return fn;
+    },
+    useDerivedValue: function useDerivedValue(fn) {
+      return {
+        value: fn()
+      };
+    },
+    useAnimatedRef: function useAnimatedRef() {
+      return {
+        current: null
+      };
+    },
+    Easing: {
+      linear: function linear(v) {
+        return v;
+      },
+      ease: function ease(v) {
+        return v;
+      },
+      bezier: function bezier() {
+        return function (v) {
+          return v;
+        };
+      }
+    },
+    FadeIn: {
+      duration: function duration() {
+        return {};
+      }
+    },
+    FadeOut: {
+      duration: function duration() {
+        return {};
+      }
+    },
+    Layout: {
+      duration: function duration() {
+        return {};
+      }
+    }
+  };
+});
+async function loadDatePicker() {
+  return (await import("./index.native.js")).DatePicker;
+}
+describe("DatePicker uses premium patterns", function () {
+  it("renders with label and input trigger", async function () {
+    var DatePicker = await loadDatePicker();
+    var result = renderWithProviders(/* @__PURE__ */_jsx(DatePicker, {
+      label: "Due Date",
+      placeholder: "Select date"
+    }));
+    var labelEl = result.findTextElement("Due Date");
+    expect(labelEl).toBeTruthy();
+    var input = result.container.querySelector("input");
+    expect(input === null || input === void 0 ? void 0 : input.getAttribute("placeholder")).toBe("Select date");
+  });
+});
+//# sourceMappingURL=ThemeRefactor.spec.native.js.map

package/dist/esm/fields/DatePicker/ThemeRefactor.spec.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jsx","_jsx","describe","it","expect","vi","renderWithProviders","mock","useUrlState","Calendar","ChevronLeft","ChevronRight","X","default","useSharedValue","init","value","useAnimatedStyle","withTiming","val","withSpring","createAnimatedComponent","component","runOnJS","fn","runOnUI","useDerivedValue"],"sources":["../../../../src/fields/DatePicker/ThemeRefactor.spec.tsx"],"sourcesContent":[null],"mappings":"AAOA,SAASA,GAAA,IAAAC,IAAU,QAAI,mBAAkB;AAgDzC,SAASC,QAAA,EAAAC,EAAA,EAAAC,MAAA,EAAAC,EAAA,QAA2B;AAUG,SAAAC,mBAAA;AAxDvCD,EAAA,CAAGE,IAAA,CAAK,6BAA6B,YAAO;EAC1C;IAAkCC,WAAA,WAAAA,YAAA;MAClC,QAEM,MACN,YAAgB,CAChB,EACA;IACA;EACA;AAEF;AAA0CH,EACxC,CAAAE,IAAA,0BAAS;EAAA,OACP;IACAE,QAAA,WAAkBA,QAAQA,CAAA;MAC1B,WAAa;IACb;IACAC,WAAA,WAAAA,WAA0BA,CAAA;MAC1B,OAAS,IAAC;IACV;IACAC,YAAA,WAAkBA,YAA4BA,CAAA,EAAG;MACjD;IACA;IACAC,CAAA,WAAUA,EAAA;MACV,OAAS,IAAE;IACX;EAA+B;AACC;AACjBP,EAAA,CAAAE,IACf,0BAAgB;EAAA,OAAC;IACjBM,OAAA;MACFC,cAAA,WAAAA,eAAAC,IAAA;QACA;UACAC,KAAA,EAAAD;QACA;MACA;MACAE,gBAAA,WAA0BA,gBAAmBA,CAAA;QAC7C,OAAU;MACV;MACAC,UAAA,WAAkBA,UAA4BA,CAAAC,GAAG,EAAE;QACnD,OAAAA,GAAgB;MAChB;MACAC,UAAU,WAAUA,UAAWA,CAAAD,GAAA;QAC/B,OAAWA,GAAA;MACX;MACAE,uBAAA,WAAAA,wBAAAC,SAAA;QAIF,OAAeA,SAAA;MACb;MACFC,OAAA,WAAAA,QAAAC,EAAA;QAEA,OAASA,EAAA;MACJ;MACDC,OAAM,WAAaA,OAAMA,CAAAD,EAAA;QAEzB,OAAMA,EAAA;MAEN;MACAE,eAAgB,WAAWA,gBAAAF,EAAA;QAC3B,OAAM;UACNR,KAAO,EAAAQ,EAAO;QACf;MACF","ignoreList":[]}

package/dist/esm/fields/DatePicker/index.mjs

@@ -0,0 +1,314 @@
+import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { coerceToDate } from "./utils.mjs";
+import { AnimatePresence, View, useProps } from "tamagui";
+import { Button } from "../../Button/index.mjs";
+import { Field, FieldLayout } from "../../fieldLayout.mjs";
+import { formCommonColors } from "../../shared/colorRamps.mjs";
+import { getFieldError, mergeFieldHandler, useFormField, useResolvedValidators } from "../../shared/utils.mjs";
+import { Input as InputParts } from "../../InputParts/index.mjs";
+import { Skeleton } from "../../Skeleton/index.mjs";
+import { CalendarHeader, DatePickerInputTrigger, DatePickerPopoverShell, ViewSwitcher, WeekView, formatDateDisplay, isSameDay, toWeeks, useCalendarData, useDateAnimation, useDateNavigation, yearPageSize } from "./parts.mjs";
+import { MultiDatePicker } from "./MultiDatePicker.mjs";
+import { DateRangePicker } from "./DateRangePicker.mjs";
+import { Calendar } from "./Calendar.mjs";
+import { MonthPicker } from "./MonthPicker.mjs";
+import { DatetimePicker } from "./DatetimePicker.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DayGrid({
+  calendarData,
+  selectedDate,
+  onSelectDate,
+  minDate,
+  maxDate
+}) {
+  const {
+    knobProps
+  } = useResolvedKnobs();
+  const {
+    animation,
+    animationKey
+  } = useDateAnimation(`${calendarData.year}-${calendarData.month}`);
+  const weeks = toWeeks(calendarData.days);
+  return /* @__PURE__ */jsx(AnimatePresence, {
+    children: /* @__PURE__ */jsxs(View, {
+      width: "100%",
+      ...knobProps.gap,
+      transition: "medium",
+      ...animation,
+      children: [/* @__PURE__ */jsx(WeekView, {}), /* @__PURE__ */jsx(View, {
+        flexDirection: "column",
+        gap: "$1",
+        width: "100%",
+        children: weeks.map(week => /* @__PURE__ */jsx(View, {
+          flexDirection: "row",
+          gap: "$1",
+          justifyContent: "space-between",
+          width: "100%",
+          children: week.map(day => {
+            const isCurrentMonth = day.getMonth() === calendarData.month;
+            const isSelected = isSameDay(selectedDate, day);
+            const isToday = isSameDay(calendarData.today, day);
+            const isOutOfRange = minDate != null && day < minDate || maxDate != null && day > maxDate;
+            const isDisabled = !isCurrentMonth || isOutOfRange;
+            return /* @__PURE__ */jsx(Button, {
+              chromeless: true,
+              circular: true,
+              flex: 1,
+              size: knobProps.sizeToken,
+              disabled: isDisabled,
+              onPress: () => !isDisabled && onSelectDate(day),
+              backgroundColor: isSelected ? "$background" : "transparent",
+              theme: isSelected ? "accent" : void 0,
+              opacity: isCurrentMonth ? 1 : 0,
+              pointerEvents: isCurrentMonth ? "auto" : "none",
+              borderWidth: knobProps.borderRadius.borderWidth || 1,
+              borderColor: isSelected ? "$backgroundStrong" : "transparent",
+              children: isSelected ? /* @__PURE__ */jsx(Button.Text, {
+                transition: "quicker",
+                enterStyle: {
+                  opacity: 0,
+                  y: 20
+                },
+                exitStyle: {
+                  opacity: 0,
+                  y: 20
+                },
+                opacity: 1,
+                fontWeight: "bold",
+                children: day.getDate()
+              }, "text-selected") : /* @__PURE__ */jsx(Button.Text, {
+                color: isToday ? "$accentColor" : isCurrentMonth ? formCommonColors.text : formCommonColors.muted,
+                children: day.getDate()
+              }, "text-normal")
+            }, day.toISOString());
+          })
+        }, week[0].toISOString()))
+      })]
+    })
+  }, animationKey);
+}
+function CalendarBody({
+  displayDate,
+  selectedDate,
+  onSelectDate,
+  onNavigateMonth,
+  onSetDisplayDate,
+  minDate,
+  maxDate
+}) {
+  const {
+    knobProps
+  } = useResolvedKnobs();
+  const [viewMode, setViewMode] = useState("day");
+  const calendarData = useCalendarData(displayDate);
+  const [yearPageStart, setYearPageStart] = useState(() => calendarData.year - calendarData.year % yearPageSize);
+  return /* @__PURE__ */jsx(ViewSwitcher, {
+    calendarData,
+    displayDate,
+    onSetDisplayDate,
+    viewMode,
+    setViewMode,
+    yearPageStart,
+    setYearPageStart,
+    children: /* @__PURE__ */jsxs(View, {
+      flexDirection: "column",
+      alignItems: "center",
+      ...knobProps.gapLg,
+      width: "100%",
+      ...knobProps.panelPadding,
+      children: [/* @__PURE__ */jsx(CalendarHeader, {
+        year: calendarData.year,
+        monthName: calendarData.monthName,
+        onPrevMonth: () => onNavigateMonth("prev"),
+        onNextMonth: () => onNavigateMonth("next"),
+        onYearPress: () => {
+          setYearPageStart(calendarData.year - calendarData.year % yearPageSize);
+          setViewMode("year");
+        },
+        onMonthPress: () => setViewMode("month")
+      }), /* @__PURE__ */jsx(DayGrid, {
+        calendarData,
+        selectedDate,
+        onSelectDate,
+        minDate,
+        maxDate
+      })]
+    })
+  });
+}
+function DatePicker(props) {
+  const {
+    defaultValue,
+    value: controlledValue,
+    onValueChange,
+    form,
+    inputProps: _inputProps,
+    placeholder = "Select date",
+    format: _format = "MM/DD/YYYY",
+    minDate,
+    maxDate,
+    disabled,
+    mode,
+    name,
+    preserveValue,
+    validators,
+    label,
+    labelProps,
+    error: errorProp,
+    helperText,
+    required,
+    size,
+    readOnly,
+    onBlur,
+    skeleton,
+    compact,
+    id: idProp,
+    ..._restProps
+  } = useProps(props);
+  const {
+    resolvedForm,
+    knobProps,
+    id
+  } = useFormField({
+    form,
+    id: idProp,
+    compact
+  });
+  const resolvedValidators = useResolvedValidators(required, validators, label, name);
+  const [open, setOpen] = useState(false);
+  const [selectedDate, setSelectedDate] = useState(() => coerceToDate(controlledValue ?? defaultValue));
+  useEffect(() => {
+    if (controlledValue === void 0) return;
+    setSelectedDate(coerceToDate(controlledValue));
+  }, [controlledValue]);
+  const {
+    displayDate,
+    setDisplayDate,
+    navigateMonth
+  } = useDateNavigation();
+  const popoverRef = useRef(null);
+  const closePopover = useCallback(() => {
+    setOpen(false);
+    popoverRef.current?.close();
+  }, []);
+  useEffect(() => {
+    if (selectedDate) closePopover();
+  }, [selectedDate, closePopover]);
+  const handleDateSelect = useCallback(date => {
+    if (minDate && date < minDate) return;
+    if (maxDate && date > maxDate) return;
+    setSelectedDate(date);
+    setDisplayDate(date);
+    onValueChange?.(date);
+    closePopover();
+  }, [minDate, maxDate, setDisplayDate, closePopover, onValueChange]);
+  const handleClearDate = useCallback(() => {
+    setSelectedDate(null);
+    setDisplayDate(/* @__PURE__ */new Date());
+    onValueChange?.(null);
+  }, [setDisplayDate, onValueChange]);
+  const calendarContent = /* @__PURE__ */jsx(CalendarBody, {
+    displayDate,
+    selectedDate,
+    onSelectDate: handleDateSelect,
+    onNavigateMonth: navigateMonth,
+    onSetDisplayDate: setDisplayDate,
+    minDate,
+    maxDate
+  });
+  const renderPopover = (hasError, blurHandler) => {
+    if (readOnly) {
+      return /* @__PURE__ */jsx(InputParts.Box, {
+        children: /* @__PURE__ */jsx(InputParts.Area, {
+          value: formatDateDisplay(selectedDate),
+          readOnly: true,
+          "aria-readonly": "true",
+          "aria-required": required || void 0,
+          "aria-invalid": hasError || void 0,
+          placeholder
+        })
+      });
+    }
+    const handleOpenChange = isOpen => {
+      setOpen(isOpen);
+      if (!isOpen) {
+        blurHandler?.();
+      }
+    };
+    return /* @__PURE__ */jsx(DatePickerPopoverShell, {
+      open,
+      onOpenChange: handleOpenChange,
+      popoverRef,
+      trigger: /* @__PURE__ */jsx(DatePickerInputTrigger, {
+        value: formatDateDisplay(selectedDate),
+        placeholder,
+        disabled,
+        onReset: handleClearDate,
+        onButtonPress: () => setOpen(true),
+        error: !!hasError,
+        "aria-required": required || void 0,
+        "aria-invalid": hasError || void 0
+      }),
+      children: calendarContent
+    });
+  };
+  if (skeleton) {
+    return /* @__PURE__ */jsx(FieldLayout, {
+      id,
+      label,
+      size,
+      knobProps,
+      children: /* @__PURE__ */jsx(Skeleton, {
+        variant: "rounded",
+        width: "100%",
+        height: knobProps.sizeToken
+      })
+    });
+  }
+  if (!resolvedForm || !name) {
+    return /* @__PURE__ */jsx(FieldLayout, {
+      id,
+      label,
+      labelProps,
+      error: errorProp,
+      helperText,
+      required,
+      size,
+      knobProps,
+      onBlur,
+      children: /* @__PURE__ */jsx(InputParts, {
+        size: size || knobProps.sizeToken,
+        children: renderPopover(!!errorProp)
+      })
+    });
+  }
+  return /* @__PURE__ */jsx(Field, {
+    defaultValue,
+    form: resolvedForm,
+    mode,
+    name,
+    preserveValue,
+    validators: resolvedValidators,
+    children: field => {
+      const resolvedError = getFieldError(field, errorProp);
+      const blurHandler = mergeFieldHandler(field, "handleBlur", onBlur);
+      return /* @__PURE__ */jsx(FieldLayout, {
+        id,
+        label,
+        labelProps,
+        error: resolvedError,
+        helperText,
+        required,
+        size,
+        knobProps,
+        children: /* @__PURE__ */jsx(InputParts, {
+          size: size || knobProps.sizeToken,
+          children: renderPopover(!!resolvedError, blurHandler)
+        })
+      });
+    }
+  });
+}
+export { Calendar, DatePicker, DateRangePicker, DatetimePicker, MonthPicker, MultiDatePicker };
+//# sourceMappingURL=index.mjs.map

package/dist/esm/fields/DatePicker/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["useResolvedKnobs","useCallback","useEffect","useRef","useState","coerceToDate","AnimatePresence","View","useProps","Button","Field","FieldLayout","formCommonColors","getFieldError","mergeFieldHandler","useFormField","useResolvedValidators","Input","InputParts","Skeleton","CalendarHeader","DatePickerInputTrigger","DatePickerPopoverShell","ViewSwitcher","WeekView","formatDateDisplay","isSameDay","toWeeks","useCalendarData","useDateAnimation","useDateNavigation","yearPageSize","MultiDatePicker","DateRangePicker","Calendar","MonthPicker","DatetimePicker","jsx","jsxs","DayGrid","calendarData","selectedDate","onSelectDate","minDate","maxDate","knobProps","animation","animationKey","year","month","weeks","days","children","width","gap","transition","flexDirection","map","week","justifyContent","day","isCurrentMonth","getMonth","isSelected","isToday","today","isOutOfRange","isDisabled","chromeless","circular","flex","size","sizeToken","disabled","onPress","backgroundColor","theme","opacity","pointerEvents","borderWidth","borderRadius","borderColor","Text","enterStyle","y","exitStyle","fontWeight","getDate","color","text","muted","toISOString","CalendarBody","displayDate","onNavigateMonth","onSetDisplayDate","viewMode","setViewMode","yearPageStart","setYearPageStart","alignItems","gapLg","panelPadding","monthName","onPrevMonth","onNextMonth","onYearPress","onMonthPress","DatePicker","props","defaultValue","value","controlledValue","onValueChange","form","inputProps","_inputProps","placeholder","format","_format","mode","name","preserveValue","validators","label","labelProps","error","errorProp","helperText","required","readOnly","onBlur","skeleton","compact","id","idProp","_restProps","resolvedForm","resolvedValidators","open","setOpen","setSelectedDate","setDisplayDate","navigateMonth","popoverRef","closePopover","current","close","handleDateSelect","date","handleClearDate","Date","calendarContent","renderPopover","hasError","blurHandler","Box","Area","handleOpenChange","isOpen","onOpenChange","trigger","onReset","onButtonPress","variant","height","field","resolvedError"],"sources":["../../../../src/fields/DatePicker/index.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}