@react-typed-forms/schemas-rn 2.0.0 → 2.1.0

package/lib/components/RNHtmlRenderer.d.ts

@@ -1,5 +1,8 @@
+import { RenderHTMLProps } from "react-native-render-html";
+import React from "react";
 export type RNHtmlRendererProps = {
     className?: string;
     html?: string;
-};
-export declare function RNHtmlRenderer({ className, html }: RNHtmlRendererProps): import("react/jsx-runtime").JSX.Element | undefined;
+    style?: React.CSSProperties | undefined;
+} & Pick<RenderHTMLProps, "baseStyle" | "tagsStyles" | "systemFonts" | "contentWidth">;
+export declare function RNHtmlRenderer({ className, html, style, contentWidth, ...props }: RNHtmlRendererProps): import("react/jsx-runtime").JSX.Element | undefined;

package/lib/index.cjs

@@ -205,13 +205,13 @@ function cn() {
   return tailwindMerge.twMerge(clsx.clsx([].slice.call(arguments)));
 }
 
-var _excluded$b = ["className", "asChild"];
+var _excluded$d = ["className", "asChild"];
 var TextClassContext = /*#__PURE__*/React__namespace.createContext(undefined);
 var RNText = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$asChild = _ref.asChild,
     asChild = _ref$asChild === void 0 ? false : _ref$asChild,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$d);
   var textClass = React__namespace.useContext(TextClassContext);
   var Component = asChild ? Slot__namespace.Text : reactNative.Text;
   return jsxRuntime.jsx(Component, _extends({
@@ -221,7 +221,7 @@ var RNText = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
 });
 RNText.displayName = "RNText";
 
-var _excluded$a = ["className", "variant", "size"];
+var _excluded$c = ["className", "variant", "size"];
 var buttonVariants = classVarianceAuthority.cva("group flex items-center justify-center rounded-md web:ring-offset-background web:transition-colors web:focus-visible:outline-none web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2", {
   variants: {
     variant: {
@@ -270,7 +270,7 @@ var RNButton$1 = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     variant = _ref.variant,
     size = _ref.size,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$a);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$c);
   return jsxRuntime.jsx(TextClassContext.Provider, {
     value: buttonTextVariants({
       variant: variant,
@@ -326,7 +326,7 @@ function Icon(_ref) {
   }
 }
 
-var _excluded$9 = ["className"];
+var _excluded$b = ["className"];
 function createRNCheckboxRenderer(options) {
   if (options === void 0) {
     options = {};
@@ -382,7 +382,7 @@ function CheckBoxRenderer(_ref) {
 }
 var RNCheckbox = /*#__PURE__*/React__namespace.forwardRef(function (_ref2, ref) {
   var className = _ref2.className,
-    props = _objectWithoutPropertiesLoose(_ref2, _excluded$9);
+    props = _objectWithoutPropertiesLoose(_ref2, _excluded$b);
   return jsxRuntime.jsx(CheckboxPrimitive__namespace.Root, _extends({
     ref: ref,
     className: cn("web:peer h-4 w-4 native:h-[24px] native:w-[24px] shrink-0 rounded-sm native:rounded border border-accent web:ring-offset-background web:focus-visible:outline-none web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", className)
@@ -401,14 +401,14 @@ var RNCheckbox = /*#__PURE__*/React__namespace.forwardRef(function (_ref2, ref)
 });
 RNCheckbox.displayName = CheckboxPrimitive__namespace.Root.displayName;
 
-var _excluded$8 = ["renderOptions", "control", "readonly"],
+var _excluded$a = ["renderOptions", "control", "readonly"],
   _excluded2$5 = ["className", "placeholderClassName"];
 function createRNTextInputRenderer(inputClass, inputTextClass) {
   return schemas.createDataRenderer(function (p) {
     var renderOptions = p.renderOptions,
       control = p.control,
       readonly = p.readonly,
-      rest = _objectWithoutPropertiesLoose(p, _excluded$8);
+      rest = _objectWithoutPropertiesLoose(p, _excluded$a);
     var _formControlProps = core.formControlProps(control),
       disabled = _formControlProps.disabled;
     var placeholder = renderOptions.placeholder,
@@ -452,7 +452,7 @@ function RNTextInput(_ref) {
 }
 RNTextInput.displayName = "RNInput";
 
-var _excluded$7 = ["control", "mode", "locale", "is24Hour", "className"];
+var _excluded$9 = ["control", "mode", "locale", "is24Hour", "className"];
 function createRNDateTimePickerRenderer(options) {
   if (options === void 0) {
     options = {};
@@ -482,7 +482,7 @@ function RNDateTimePicker(_ref) {
       try {
         switch (mode) {
           case "date":
-            return date.parseDate(dateString).toDate(date.getLocalTimeZone());
+            return date.parseDate(dateString).toDate("UTC");
           case "datetime":
             return date.parseAbsolute(dateString, date.getLocalTimeZone()).toDate();
           case "time":
@@ -502,7 +502,7 @@ function RNDateTimePicker(_ref) {
               day: "2-digit",
               month: "2-digit",
               year: "numeric",
-              timeZone: date.getLocalTimeZone()
+              timeZone: "UTC"
             };
             break;
           case "datetime":
@@ -538,7 +538,7 @@ function RNDateTimePicker(_ref) {
       _ref$is24Hour = _ref.is24Hour,
       is24Hour = _ref$is24Hour === void 0 ? true : _ref$is24Hour,
       className = _ref.className,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
     var disabled = control.disabled;
     var maximumDate = props.maximumDate,
       minimumDate = props.minimumDate;
@@ -601,33 +601,38 @@ function RNDateTimePicker(_ref) {
   }
 }
 
+var _excluded$8 = ["className", "html", "style", "contentWidth"];
 function RNHtmlRenderer(_ref) {
   var _effect = core.useComponentTracking();
   try {
     var className = _ref.className,
-      html = _ref.html;
+      html = _ref.html,
+      style = _ref.style,
+      contentWidth = _ref.contentWidth,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
     if (!html) return;
     var source = {
       html: html
     };
     return jsxRuntime.jsx(reactNative.View, {
+      style: style,
       className: className,
-      children: jsxRuntime.jsx(RenderHtml__default["default"], {
-        contentWidth: reactNative.Dimensions.get("window").width,
+      children: jsxRuntime.jsx(RenderHtml__default["default"], _extends({
+        contentWidth: contentWidth != null ? contentWidth : reactNative.Dimensions.get("window").width,
         source: source
-      })
+      }, props))
     });
   } finally {
     _effect();
   }
 }
 
-var _excluded$6 = ["className", "checked", "onChange"];
+var _excluded$7 = ["className", "checked", "onChange"];
 var RNRadioItem = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     checked = _ref.checked,
     onChange = _ref.onChange,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
   return jsxRuntime.jsx(reactNative.Pressable, _extends({
     ref: ref,
     onPress: onChange,
@@ -660,7 +665,7 @@ function createSelectConversion(ft) {
   }
 }
 
-var _excluded$5 = ["state", "options", "className", "convert", "required", "emptyText", "requiredText", "portalHost", "readonly"],
+var _excluded$6 = ["state", "options", "className", "convert", "required", "emptyText", "requiredText", "portalHost", "readonly"],
   _excluded2$4 = ["ref", "className", "children"],
   _excluded3$2 = ["className", "children", "position", "portalHost"],
   _excluded4$2 = ["className"],
@@ -711,7 +716,7 @@ function RNSelectRenderer(_ref) {
       requiredText = _ref$requiredText === void 0 ? "Please select" : _ref$requiredText,
       portalHost = _ref.portalHost,
       readonly = _ref.readonly,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
     var insets = reactNativeSafeAreaContext.useSafeAreaInsets();
     var contentInsets = {
       top: insets.top,
@@ -813,10 +818,11 @@ function SelectTrigger(_ref2) {
       props = _objectWithoutPropertiesLoose(_ref2, _excluded2$4);
     return jsxRuntime.jsxs(SelectPrimitive__namespace.Trigger, _extends({
       ref: ref,
-      className: cn("flex flex-row h-10 native:h-12 items-center text-sm justify-between border border-[#E7E7E8] bg-background px-3 py-2 [&>span]:line-clamp-1 min-w-[128px]", props.disabled && "opacity-50", className)
+      className: cn("flex flex-row min-h-10 native:min-h-12 items-center text-sm justify-between border border-[#E7E7E8] bg-background px-3 py-2 [&>span]:line-clamp-1 min-w-[128px]", props.disabled && "opacity-50", className)
     }, props, {
       children: [jsxRuntime.jsx(reactNative.Pressable, {
         pointerEvents: "none",
+        className: "flex-1",
         children: children
       }), jsxRuntime.jsx(Icon, {
         name: "chevron-down",
@@ -890,7 +896,7 @@ var SelectItem = /*#__PURE__*/React__namespace.forwardRef(function (_ref5, ref)
 });
 SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
 
-var _excluded$4 = ["className"],
+var _excluded$5 = ["className"],
   _excluded2$3 = ["className", "children"],
   _excluded3$1 = ["className", "children", "portalHost", "closeOnOutsidePress"],
   _excluded4$1 = ["className"];
@@ -902,7 +908,7 @@ function DialogOverlayWeb(_ref) {
   var _effect = core.useComponentTracking();
   try {
     var className = _ref.className,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
     var _DialogPrimitive$useR = DialogPrimitive__namespace.useRootContext(),
       open = _DialogPrimitive$useR.open;
     return jsxRuntime.jsx(DialogPrimitive__namespace.Overlay, _extends({
@@ -1138,6 +1144,7 @@ function RNScrollListRenderer(_ref) {
   }
 }
 
+var _excluded$4 = ["htmlClassName"];
 function createDefaultDisplayRenderer(options) {
   if (options === void 0) {
     options = {};
@@ -1190,12 +1197,13 @@ function DefaultDisplay(_ref) {
           inline: displayProps.inline
         });
       case schemas.DisplayDataType.Html:
-        return jsxRuntime.jsx(Div, {
+        var htmlClassName = options.htmlClassName,
+          props = _objectWithoutPropertiesLoose(options, _excluded$4);
+        return jsxRuntime.jsx(RNHtmlRenderer, _extends({
           style: style,
-          className: schemas.rendererClass(className, options.htmlClassName),
-          inline: displayProps.inline,
+          className: schemas.rendererClass(className, htmlClassName),
           html: display ? schemas.coerceToString(display.value) : data.html
-        });
+        }, props));
       case schemas.DisplayDataType.Custom:
         return jsxRuntime.jsx(Div, {
           children: jsxRuntime.jsxs(B, {
@@ -1346,7 +1354,7 @@ function RNCheckButtons(props) {
           return jsxRuntime.jsxs(Button, {
             className: clsx.clsx(schemas.rendererClass(controlClasses == null ? void 0 : controlClasses.entryWrapperClass, classes.entryWrapperClass), selOrUnsel),
             onClick: function onClick() {
-              return !readonly && setChecked(control, o, !checked);
+              return !(readonly || disabled) && setChecked(control, o, !checked);
             },
             notWrapInText: true,
             children: [jsxRuntime.jsxs(Div, {
@@ -2250,12 +2258,21 @@ function DefaultDialogRenderer(_ref) {
               })
             })
           })]
-        }), allChildren.filter(function (x) {
-          return !x.definition.placement || x.definition.placement === "dialog";
-        }).map(function (x, i) {
-          return props.renderChild(x, {
-            actionOnClick: actionOnClick
-          });
+        }), jsxRuntime.jsx(reactNative.ScrollView, {
+          persistentScrollbar: true,
+          children: jsxRuntime.jsx(reactNative.View, {
+            className: "flex flex-col gap-[12px]",
+            onStartShouldSetResponder: function onStartShouldSetResponder() {
+              return true;
+            },
+            children: allChildren.filter(function (x) {
+              return !x.definition.placement || x.definition.placement === "dialog";
+            }).map(function (x, i) {
+              return props.renderChild(x, {
+                actionOnClick: actionOnClick
+              });
+            })
+          })
         })]
       })]
     });