@multiplatform.one/forms 7.34.4 → 7.36.0

package/dist/cjs/fields/DatePicker/parts.cjs

@@ -50,8 +50,9 @@ __export(parts_exports, {
   yearPageSize: () => yearPageSize
 });
 module.exports = __toCommonJS(parts_exports);
-var import_react = require("@phosphor-icons/react");
 var import_theme = require("@multiplatform.one/theme");
+var import_react = require("@phosphor-icons/react");
+var import_theme2 = require("@multiplatform.one/theme");
 var import_react2 = require("react");
 var import_tamagui = require("tamagui");
 var import_FloatingPanel = require("../../FloatingPanel/index.cjs");
@@ -86,7 +87,7 @@ function useDateAnimation(current) {
     animationKey: current
   };
 }
-const monthNames = (0, import_theme.getMonthNames)();
+const monthNames = (0, import_theme2.getMonthNames)();
 function useCalendarData(displayDate) {
   return (0, import_react2.useMemo)(() => {
     const year = displayDate.getFullYear();
@@ -147,9 +148,7 @@ function dayCellRadius(knobProps) {
   };
 }
 function useCalendarKnobs() {
-  return (0, import_theme.useResolvedKnobs)({
-    compact: true
-  });
+  return (0, import_theme2.useResolvedKnobs)();
 }
 function CalendarPanelFrame({
   children
@@ -215,7 +214,7 @@ function CalendarChromeButton({
     focusStyle: {
       outlineWidth: 0
     },
-    focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)(),
+    focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)(),
     ...(!import_tamagui.isWeb ? {
       hitSlop
     } : {}),
@@ -242,7 +241,7 @@ function CalendarTextButton({
     focusStyle: {
       outlineWidth: 0
     },
-    focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)(),
+    focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)(),
     ...(import_tamagui.isWeb ? {
       tabIndex: 0,
       onKeyDown: calendarKeyHandler(onPress)
@@ -300,7 +299,7 @@ function CalendarDayCell({
   const {
     knobProps
   } = useCalendarKnobs();
-  const accentText = (0, import_theme.useAccentOnSurface)();
+  const accentText = (0, import_theme2.useAccentOnSurface)();
   const {
     px,
     hitSlop,
@@ -339,7 +338,7 @@ function CalendarDayCell({
     focusStyle: {
       outlineWidth: 0
     },
-    focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)({
+    focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)({
       outlineOffset: -2
     }),
     "data-nested-px": px,
@@ -412,7 +411,7 @@ function CalendarDays({
   const todayOutOfRange = minDate != null && calendarData.today < minDate || maxDate != null && calendarData.today > maxDate;
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, {
     children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
-      transition: knobProps.transition,
+      ...(0, import_theme.transitionProps)(knobProps.motion.slide),
       ...animation,
       alignSelf: "center",
       gap: "$1",
@@ -507,7 +506,7 @@ function CalendarHeader({
   const {
     knobProps
   } = useCalendarKnobs();
-  const glyphColor = (0, import_theme.useGlyphColor)();
+  const glyphColor = (0, import_theme2.useGlyphColor)();
   const {
     px
   } = knobProps.nestedControl;
@@ -533,11 +532,10 @@ function CalendarHeader({
       ...knobProps.gap,
       children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(CalendarTextButton, {
         onPress: onMonthPress,
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.SizableText, {
           color: "$color",
-          ...knobProps.label,
-          ...knobProps.textWeight,
-          fontWeight: "600",
+          size: knobProps.label.fontSize,
+          ...knobProps.heading,
           children: monthName
         })
       }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(CalendarTextButton, {
@@ -583,7 +581,7 @@ function MonthGrid({
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, {
     children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
       ...animation,
-      transition: knobProps.transition,
+      ...(0, import_theme.transitionProps)(knobProps.motion.slide),
       flexDirection: "row",
       flexWrap: "wrap",
       width: px * 7,
@@ -610,7 +608,7 @@ function MonthGrid({
           focusStyle: {
             outlineWidth: 0
           },
-          focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)({
+          focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)({
             outlineOffset: -2
           }),
           "data-nested-px": px,
@@ -644,7 +642,7 @@ function YearGrid({
   const {
     knobProps
   } = useCalendarKnobs();
-  const glyphColor = (0, import_theme.useGlyphColor)();
+  const glyphColor = (0, import_theme2.useGlyphColor)();
   const {
     px,
     hitSlop,
@@ -693,7 +691,7 @@ function YearGrid({
     }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, {
       children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
         ...animation,
-        transition: knobProps.transition,
+        ...(0, import_theme.transitionProps)(knobProps.motion.slide),
         flexDirection: "row",
         flexWrap: "wrap",
         width: px * 7,
@@ -719,7 +717,7 @@ function YearGrid({
             focusStyle: {
               outlineWidth: 0
             },
-            focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)({
+            focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)({
               outlineOffset: -2
             }),
             "data-nested-px": px,
@@ -769,7 +767,6 @@ function DatePickerInputTrigger({
   onReset,
   disabled,
   placeholder,
-  error,
   id,
   open,
   glyph = "calendar",
@@ -806,7 +803,6 @@ function DatePickerInputTrigger({
       cursor: disabled ? "not-allowed" : "pointer",
       pointerEvents: import_tamagui.isWeb ? void 0 : "none",
       children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
-        theme: error ? "error" : void 0,
         ...(import_tamagui.isWeb ? void 0 : {
           flex: 1,
           minWidth: 0
@@ -882,7 +878,6 @@ function DatePickerPopoverShell({
     disabled,
     sizing: "grow",
     contentPadding: "none",
-    compact: true,
     widthMode: "fit-content",
     triggerA11y,
     children
@@ -946,7 +941,7 @@ function CalendarViewSwitcher({
 }
 function formatDateDisplay(date) {
   if (!date) return "";
-  return (0, import_theme.formatAbsoluteDate)(date, {
+  return (0, import_theme2.formatAbsoluteDate)(date, {
     year: "always"
   });
 }

package/dist/cjs/fields/DatePicker/parts.native.js

@@ -53,8 +53,9 @@ __export(parts_exports, {
 });
 module.exports = __toCommonJS(parts_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("@phosphor-icons/react");
 var import_theme = require("@multiplatform.one/theme");
+var import_react = require("@phosphor-icons/react");
+var import_theme2 = require("@multiplatform.one/theme");
 var import_react2 = require("react");
 var import_tamagui = require("tamagui");
 var import_FloatingPanel = require("../../FloatingPanel");
@@ -90,7 +91,7 @@ function useDateAnimation(current) {
     animationKey: current
   };
 }
-var monthNames = (0, import_theme.getMonthNames)();
+var monthNames = (0, import_theme2.getMonthNames)();
 function useCalendarData(displayDate) {
   return (0, import_react2.useMemo)(function () {
     var year = displayDate.getFullYear();
@@ -151,9 +152,7 @@ function dayCellRadius(knobProps) {
   };
 }
 function useCalendarKnobs() {
-  return (0, import_theme.useResolvedKnobs)({
-    compact: true
-  });
+  return (0, import_theme2.useResolvedKnobs)();
 }
 function CalendarPanelFrame(param) {
   var {
@@ -222,7 +221,7 @@ function CalendarChromeButton(param) {
     focusStyle: {
       outlineWidth: 0
     },
-    focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)(),
+    focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)(),
     ...(!import_tamagui.isWeb ? {
       hitSlop
     } : {}),
@@ -250,7 +249,7 @@ function CalendarTextButton(param) {
     focusStyle: {
       outlineWidth: 0
     },
-    focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)(),
+    focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)(),
     ...(import_tamagui.isWeb ? {
       tabIndex: 0,
       onKeyDown: calendarKeyHandler(onPress)
@@ -311,7 +310,7 @@ function CalendarDayCell(param) {
   var {
     knobProps
   } = useCalendarKnobs();
-  var accentText = (0, import_theme.useAccentOnSurface)();
+  var accentText = (0, import_theme2.useAccentOnSurface)();
   var {
     px,
     hitSlop,
@@ -356,7 +355,7 @@ function CalendarDayCell(param) {
     focusStyle: {
       outlineWidth: 0
     },
-    focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)({
+    focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)({
       outlineOffset: -2
     }),
     "data-nested-px": px,
@@ -447,7 +446,7 @@ function CalendarDays(param) {
   var todayOutOfRange = minDate != null && calendarData.today < minDate || maxDate != null && calendarData.today > maxDate;
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, {
     children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
-      transition: knobProps.transition,
+      ...(0, import_theme.transitionProps)(knobProps.motion.slide),
       ...animation,
       alignSelf: "center",
       gap: "$1",
@@ -550,7 +549,7 @@ function CalendarHeader(param) {
   var {
     knobProps
   } = useCalendarKnobs();
-  var glyphColor = (0, import_theme.useGlyphColor)();
+  var glyphColor = (0, import_theme2.useGlyphColor)();
   var {
     px
   } = knobProps.nestedControl;
@@ -576,11 +575,10 @@ function CalendarHeader(param) {
       ...knobProps.gap,
       children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(CalendarTextButton, {
         onPress: onMonthPress,
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.SizableText, {
           color: "$color",
-          ...knobProps.label,
-          ...knobProps.textWeight,
-          fontWeight: "600",
+          size: knobProps.label.fontSize,
+          ...knobProps.heading,
           children: monthName
         })
       }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(CalendarTextButton, {
@@ -627,7 +625,7 @@ function MonthGrid(param) {
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, {
     children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
       ...animation,
-      transition: knobProps.transition,
+      ...(0, import_theme.transitionProps)(knobProps.motion.slide),
       flexDirection: "row",
       flexWrap: "wrap",
       width: px * 7,
@@ -656,7 +654,7 @@ function MonthGrid(param) {
           focusStyle: {
             outlineWidth: 0
           },
-          focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)({
+          focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)({
             outlineOffset: -2
           }),
           "data-nested-px": px,
@@ -693,7 +691,7 @@ function YearGrid(param) {
   var {
     knobProps
   } = useCalendarKnobs();
-  var glyphColor = (0, import_theme.useGlyphColor)();
+  var glyphColor = (0, import_theme2.useGlyphColor)();
   var {
     px,
     hitSlop,
@@ -742,7 +740,7 @@ function YearGrid(param) {
     }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, {
       children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
         ...animation,
-        transition: knobProps.transition,
+        ...(0, import_theme.transitionProps)(knobProps.motion.slide),
         flexDirection: "row",
         flexWrap: "wrap",
         width: px * 7,
@@ -770,7 +768,7 @@ function YearGrid(param) {
             focusStyle: {
               outlineWidth: 0
             },
-            focusVisibleStyle: (0, import_theme.ensureFocusVisibleRing)({
+            focusVisibleStyle: (0, import_theme2.ensureFocusVisibleRing)({
               outlineOffset: -2
             }),
             "data-nested-px": px,
@@ -824,7 +822,6 @@ function DatePickerInputTrigger(param) {
     onReset,
     disabled,
     placeholder,
-    error,
     id,
     open,
     glyph = "calendar",
@@ -864,7 +861,6 @@ function DatePickerInputTrigger(param) {
       // Native parents own the tap; expanded field paint must not consume it.
       pointerEvents: import_tamagui.isWeb ? void 0 : "none",
       children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
-        theme: error ? "error" : void 0,
         // Yoga has no intrinsic TextInput width to size this row child.
         ...(import_tamagui.isWeb ? void 0 : {
           flex: 1,
@@ -944,7 +940,6 @@ function DatePickerPopoverShell(param) {
     disabled,
     sizing: "grow",
     contentPadding: "none",
-    compact: true,
     widthMode: "fit-content",
     triggerA11y,
     children
@@ -1017,7 +1012,7 @@ function CalendarViewSwitcher(param) {
 }
 function formatDateDisplay(date) {
   if (!date) return "";
-  return (0, import_theme.formatAbsoluteDate)(date, {
+  return (0, import_theme2.formatAbsoluteDate)(date, {
     year: "always"
   });
 }