@react-typed-forms/schemas-rn 2.2.1 → 2.2.3

package/lib/index.js

@@ -61,6 +61,7 @@ const defaultTailwindTheme = {
     buttonClass: "rounded-lg p-3 text-white disabled:opacity-75",
     primaryClass: "bg-primary-500",
     secondaryClass: "bg-secondary-500",
+    linkTextClass: "text-primary-500 underline",
     iconBeforeClass: "px-2",
     iconAfterClass: "px-2",
     busyIcon: fontAwesomeIcon("spinner fa-spin")
@@ -73,7 +74,7 @@ const defaultTailwindTheme = {
     inputClass: "border rounded p-2",
     displayOnlyClass: "flex flex-row items-center gap-2",
     checkOptions: {
-      className: "flex items-center gap-4",
+      className: "flex gap-4",
       entryClass: "flex items-center gap-1"
     },
     selectOptions: {
@@ -114,7 +115,7 @@ const defaultRnTailwindTheme = deepMerge({
   data: {
     checkOptions: {
       entryClass: "flex flex-row items-center gap-[8px]",
-      labelClass: "flex-1"
+      labelClass: "body shrink"
     },
     selectOptions: {
       emptyText: "select"
@@ -170,14 +171,14 @@ function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
 
-const _excluded$d = ["className", "asChild"];
+const _excluded$e = ["className", "asChild"];
 const TextClassContext = /*#__PURE__*/React.createContext(undefined);
 const RNText = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       className,
       asChild = false
     } = _ref,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$d);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
   const textClass = React.useContext(TextClassContext);
   const Component = asChild ? Slot.Text : Text;
   return jsx(Component, _extends({
@@ -187,7 +188,7 @@ const RNText = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 RNText.displayName = "RNText";
 
-const _excluded$c = ["className", "variant", "size"];
+const _excluded$d = ["className", "variant", "size"];
 const buttonVariants = 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: {
@@ -238,7 +239,7 @@ const RNButton$1 = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       variant,
       size
     } = _ref,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$d);
   return jsx(TextClassContext.Provider, {
     value: buttonTextVariants({
       variant,
@@ -294,7 +295,7 @@ function Icon({
   }
 }
 
-const _excluded$b = ["className"];
+const _excluded$c = ["className"];
 function createRNCheckboxRenderer(options = {}) {
   return createDataRenderer((props, renderer) => p => _extends({}, p, {
     label: undefined,
@@ -348,7 +349,7 @@ const RNCheckbox = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       className
     } = _ref,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$c);
   return jsx(CheckboxPrimitive.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)
@@ -367,7 +368,7 @@ const RNCheckbox = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 RNCheckbox.displayName = CheckboxPrimitive.Root.displayName;
 
-const _excluded$a = ["renderOptions", "control", "readonly"],
+const _excluded$b = ["renderOptions", "control", "readonly"],
   _excluded2$5 = ["className", "placeholderClassName"];
 function createRNTextInputRenderer(inputClass, inputTextClass) {
   return createDataRenderer(p => {
@@ -376,7 +377,7 @@ function createRNTextInputRenderer(inputClass, inputTextClass) {
         control,
         readonly
       } = p,
-      rest = _objectWithoutPropertiesLoose(p, _excluded$a);
+      rest = _objectWithoutPropertiesLoose(p, _excluded$b);
     const {
       disabled
     } = formControlProps(control);
@@ -423,7 +424,7 @@ function RNTextInput(_ref) {
 }
 RNTextInput.displayName = "RNInput";
 
-const _excluded$9 = ["control", "mode", "locale", "is24Hour", "className"];
+const _excluded$a = ["control", "mode", "locale", "is24Hour", "className"];
 function createRNDateTimePickerRenderer(options = {}) {
   return createDataRenderer(p => {
     const mode = p.field.type == FieldType.DateTime ? "datetime" : p.field.type == FieldType.Time ? "time" : "date";
@@ -447,7 +448,7 @@ function RNDateTimePicker(_ref) {
         is24Hour = true,
         className
       } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$a);
     const disabled = control.disabled;
     const {
       maximumDate,
@@ -571,7 +572,7 @@ function RNDateTimePicker(_ref) {
   }
 }
 
-const _excluded$8 = ["className", "html", "style", "contentWidth", "noSelection"];
+const _excluded$9 = ["className", "html", "style", "contentWidth", "noSelection"];
 function RNHtmlRenderer(_ref) {
   var _effect = useComponentTracking();
   try {
@@ -582,7 +583,7 @@ function RNHtmlRenderer(_ref) {
         contentWidth,
         noSelection
       } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$9);
     if (!html) return;
     const source = {
       html: html
@@ -603,14 +604,14 @@ function RNHtmlRenderer(_ref) {
   }
 }
 
-const _excluded$7 = ["className", "checked", "onChange"];
+const _excluded$8 = ["className", "checked", "onChange"];
 const RNRadioItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       className,
       checked,
       onChange
     } = _ref,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
   return jsx(Pressable, _extends({
     ref: ref,
     onPress: onChange,
@@ -641,10 +642,10 @@ function createSelectConversion(ft) {
   }
 }
 
-const _excluded$6 = ["state", "options", "className", "convert", "required", "emptyText", "requiredText", "portalHost", "readonly"],
+const _excluded$7 = ["state", "options", "className", "convert", "required", "emptyText", "requiredText", "portalHost", "readonly"],
   _excluded2$4 = ["ref", "className", "children"],
   _excluded3$2 = ["className", "children", "position", "portalHost"],
-  _excluded4$2 = ["className"],
+  _excluded4$1 = ["className"],
   _excluded5 = ["className", "children"];
 function createRNSelectRenderer(options = {}) {
   return createDataRenderer((props, asArray) => {
@@ -681,7 +682,7 @@ function RNSelectRenderer(_ref) {
         portalHost,
         readonly
       } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
     const insets = useSafeAreaInsets();
     const contentInsets = {
       top: insets.top,
@@ -827,7 +828,7 @@ const SelectLabel = /*#__PURE__*/React.forwardRef((_ref4, ref) => {
   let {
       className
     } = _ref4,
-    props = _objectWithoutPropertiesLoose(_ref4, _excluded4$2);
+    props = _objectWithoutPropertiesLoose(_ref4, _excluded4$1);
   return jsx(SelectPrimitive.Label, _extends({
     ref: ref,
     className: cn("py-1.5 native:pb-2 pl-2 native:pl-2 pr-2 text-popover-foreground text-sm native:text-base font-semibold", className)
@@ -858,10 +859,10 @@ const SelectItem = /*#__PURE__*/React.forwardRef((_ref5, ref) => {
 });
 SelectItem.displayName = SelectPrimitive.Item.displayName;
 
-const _excluded$5 = ["className"],
+const _excluded$6 = ["className"],
   _excluded2$3 = ["className", "children"],
   _excluded3$1 = ["className", "children", "portalHost", "closeOnOutsidePress"],
-  _excluded4$1 = ["className"];
+  _excluded4 = ["className"];
 const Dialog = DialogPrimitive.Root;
 const DialogTrigger = DialogPrimitive.Trigger;
 const DialogPortal = DialogPrimitive.Portal;
@@ -872,7 +873,7 @@ function DialogOverlayWeb(_ref) {
     let {
         className
       } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
     const {
       open
     } = DialogPrimitive.useRootContext();
@@ -938,7 +939,7 @@ const DialogTitle = /*#__PURE__*/React.forwardRef((_ref4, ref) => {
   let {
       className
     } = _ref4,
-    props = _objectWithoutPropertiesLoose(_ref4, _excluded4$1);
+    props = _objectWithoutPropertiesLoose(_ref4, _excluded4);
   return jsx(DialogPrimitive.Title, _extends({
     ref: ref,
     className: cn(className)
@@ -1111,6 +1112,60 @@ function RNScrollListRenderer({
   }
 }
 
+const _excluded$5 = ["className", "html", "children", "textClass", "text", "style", "inline", "role", "selectable"];
+function RNDiv(_ref) {
+  var _effect = useComponentTracking();
+  try {
+    let {
+        className,
+        html,
+        children,
+        textClass,
+        text,
+        style,
+        inline,
+        role,
+        selectable
+      } = _ref,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+    if (html != null) {
+      return jsx(RNHtmlRenderer, _extends({}, props, {
+        html: html,
+        noSelection: !selectable
+      }));
+    }
+    if (inline) {
+      return jsx(Text, {
+        style: style,
+        className: textClass,
+        selectable: selectable,
+        children: text != null ? text : children
+      });
+    }
+    if (text != null) {
+      return jsx(View, _extends({
+        className: className,
+        style: style,
+        role: role
+      }, props, {
+        children: jsx(Text, {
+          className: textClass,
+          selectable: selectable,
+          children: text
+        })
+      }));
+    }
+    return jsx(View, _extends({
+      className: className,
+      style: style,
+      children: children,
+      role: role
+    }, props));
+  } finally {
+    _effect();
+  }
+}
+
 const _excluded$4 = ["htmlClassName"];
 function createDefaultDisplayRenderer(options = {}) {
   return {
@@ -1141,8 +1196,7 @@ function DefaultDisplay({
       I,
       Div,
       B,
-      H1,
-      Span
+      H1
     } = renderer.html;
     switch (data.type) {
       case DisplayDataType.Icon:
@@ -1161,7 +1215,7 @@ function DefaultDisplay({
           textClass: rendererClass(textClass, options.textTextClass),
           text: text,
           inline: displayProps.inline,
-          noSelection: displayProps.noSelection
+          selectable: !displayProps.noSelection
         });
       case DisplayDataType.Html:
         const {
@@ -1336,7 +1390,7 @@ function RNCheckButtons(props) {
                 }
               }), jsx(Label, {
                 className: classes.labelClass,
-                textClass: classes.labelClass,
+                textClass: classes.labelTextClass,
                 htmlFor: name + "_" + i,
                 children: o.name
               })]
@@ -1375,7 +1429,7 @@ function DefaultDisplayOnly({
       textClass: textClass,
       text: text,
       inline: inline,
-      noSelection: noSelection
+      selectable: !noSelection
     });
   } finally {
     _effect();
@@ -2234,18 +2288,16 @@ function createDefaultGroupRenderer(options, adornmentOptions) {
     } : {
       className: standardClassName
     };
-    const {
-      Div
-    } = renderer.html;
     const inline = renderOptions.type == GroupRenderType.Inline;
     const children = formNode.children.map((c, i) => renderChild(c, {
       inline
     }));
-    return jsx(Div, {
+    return jsx(RNDiv, {
       className: rendererClass(props.className, clsx$1(className, gcn)),
       textClass: props.textClass,
       style: style,
       inline: inline,
+      selectable: inline && !props.definition.noSelection,
       children: children
     });
   }
@@ -2320,8 +2372,7 @@ function createButtonActionRenderer(actionId, options = {}) {
     const iconPlacement = busyIcon ? busyPlacement : stdIconPlacement;
     const {
       Button,
-      I,
-      Span
+      I
     } = renderer.html;
     const isLink = actionStyle == ActionStyle.Link;
     const isGroup = actionStyle == ActionStyle.Group;
@@ -2332,7 +2383,7 @@ function createButtonActionRenderer(actionId, options = {}) {
       iconLibrary: icon.library,
       className: rendererClass(textClassNames, iconPlacement == IconPlacement.BeforeText ? options.iconBeforeClass : options.iconAfterClass)
     });
-    const textElement = actionContent != null ? actionContent : actionText && jsx(Span, {
+    const textElement = actionContent != null ? actionContent : actionText && jsx(Text, {
       className: textClassNames,
       children: actionText
     });
@@ -2356,8 +2407,7 @@ function createButtonActionRenderer(actionId, options = {}) {
 
 const _excluded = ["inline", "textClass", "children", "notWrapInText", "androidRippleColor", "nonTextContent", "onClick"],
   _excluded2 = ["className", "html", "children", "textClass", "text", "style", "inline", "role"],
-  _excluded3 = ["className", "html", "children", "textClass", "text", "style", "inline", "role", "noSelection"],
-  _excluded4 = ["id", "type", "onChangeValue", "onChangeChecked", "checked", "value"];
+  _excluded3 = ["id", "type", "onChangeValue", "onChangeChecked", "checked", "value"];
 function createDefaultDataRenderer(options = {}) {
   var _options$checkboxOpti, _options$checkboxOpti2, _options$radioOptions, _options$checkListOpt;
   const elementSelectedRenderer = createElementSelectedRenderer((_options$checkboxOpti = options.checkboxOptions) != null ? _options$checkboxOpti : options.checkOptions);
@@ -2690,60 +2740,8 @@ function RNLabel(_ref3) {
     _effect4();
   }
 }
-function RNDiv(_ref4) {
-  var _effect5 = useComponentTracking();
-  try {
-    let {
-        className,
-        html,
-        children,
-        textClass,
-        text,
-        style,
-        inline,
-        role,
-        noSelection
-      } = _ref4,
-      props = _objectWithoutPropertiesLoose(_ref4, _excluded3);
-    if (html != null) {
-      return jsx(RNHtmlRenderer, _extends({}, props, {
-        html: html,
-        noSelection: noSelection
-      }));
-    }
-    if (inline) {
-      return jsx(Text, {
-        style: style,
-        className: textClass,
-        selectable: !noSelection,
-        children: text != null ? text : children
-      });
-    }
-    if (text != null) {
-      return jsx(View, _extends({
-        className: className,
-        style: style,
-        role: role
-      }, props, {
-        children: jsx(Text, {
-          className: textClass,
-          selectable: !noSelection,
-          children: text
-        })
-      }));
-    }
-    return jsx(View, _extends({
-      className: className,
-      style: style,
-      children: children,
-      role: role
-    }, props));
-  } finally {
-    _effect5();
-  }
-}
 function RNInput(props) {
-  var _effect6 = useComponentTracking();
+  var _effect5 = useComponentTracking();
   try {
     const {
         id,
@@ -2753,7 +2751,7 @@ function RNInput(props) {
         checked,
         value
       } = props,
-      rest = _objectWithoutPropertiesLoose(props, _excluded4);
+      rest = _objectWithoutPropertiesLoose(props, _excluded3);
     switch (type) {
       case "radio":
         return jsx(RNRadioItem, _extends({}, rest, {
@@ -2772,7 +2770,7 @@ function RNInput(props) {
         }));
     }
   } finally {
-    _effect6();
+    _effect5();
   }
 }
 // React Native HTML Components
@@ -2822,5 +2820,5 @@ function isNodeEmpty(node) {
   return false;
 }
 
-export { DefaultBoolOptions, Dialog, DialogClose, DialogContent, DialogPortal, DialogTitle, DialogTrigger, Icon, RNButton$1 as RNButton, RNCheckbox, RNDialog, RNDiv, RNHtmlRenderer, RNRadioItem, RNSelectRenderer, RNText, RNTextInput, ReactNativeHtmlComponents, TextClassContext, buttonTextVariants, buttonVariants, createButtonActionRenderer, createDefaultAdornmentRenderer, createDefaultDataRenderer, createDefaultLabelRenderer, createDefaultRenderers, createRNCheckboxRenderer, createRNDateTimePickerRenderer, createRNScrollListRenderer, createRNSelectRenderer, createRNTextInputRenderer, createSelectConversion, defaultRnTailwindTheme, defaultTailwindTheme };
+export { DefaultBoolOptions, Dialog, DialogClose, DialogContent, DialogPortal, DialogTitle, DialogTrigger, Icon, RNButton$1 as RNButton, RNCheckbox, RNDialog, RNHtmlRenderer, RNRadioItem, RNSelectRenderer, RNText, RNTextInput, ReactNativeHtmlComponents, TextClassContext, buttonTextVariants, buttonVariants, createButtonActionRenderer, createDefaultAdornmentRenderer, createDefaultDataRenderer, createDefaultLabelRenderer, createDefaultRenderers, createRNCheckboxRenderer, createRNDateTimePickerRenderer, createRNScrollListRenderer, createRNSelectRenderer, createRNTextInputRenderer, createSelectConversion, defaultRnTailwindTheme, defaultTailwindTheme };
 //# sourceMappingURL=index.js.map