@react-typed-forms/schemas-html 4.1.0 → 4.2.0

package/lib/components/DefaultDialogRenderer.d.ts

@@ -3,12 +3,14 @@ export interface DefaultDialogRenderOptions {
     classes?: {
         className?: string;
         titleClass?: string;
+        containerClass?: string;
     };
 }
 export declare const defaultDialogOptions: {
     classes: {
         className: string;
         titleClass: string;
+        containerClass: string;
     };
 };
 export declare function createDialogRenderer(options?: DefaultDialogRenderOptions): import("@react-typed-forms/schemas").GroupRendererRegistration;

package/lib/components/DefaultDisplayOnly.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { FormRenderer, SchemaDataNode, SchemaInterface } from "@react-typed-forms/schemas";
-export declare function DefaultDisplayOnly({ dataNode, className, emptyText, schemaInterface, style, renderer, textClass, inline, }: {
+import { ControlState, FormRenderer, SchemaDataNode, SchemaInterface } from "@react-typed-forms/schemas";
+export declare function DefaultDisplayOnly({ dataNode, className, emptyText, schemaInterface, style, renderer, textClass, inline, state, }: {
     dataNode: SchemaDataNode;
     schemaInterface: SchemaInterface;
     className?: string;
@@ -9,4 +9,5 @@ export declare function DefaultDisplayOnly({ dataNode, className, emptyText, sch
     inline: boolean;
     renderer: FormRenderer;
     emptyText?: string | null;
+    state: ControlState;
 }): JSX.Element;

package/lib/index.cjs

@@ -644,8 +644,9 @@ function DefaultDisplayOnly(_ref) {
       style = _ref.style,
       renderer = _ref.renderer,
       textClass = _ref.textClass,
-      inline = _ref.inline;
-    var text = (_ref2 = schemaInterface.isEmptyValue(dataNode.schema.field, dataNode.control.value) ? emptyText : schemaInterface.textValueForData(dataNode)) != null ? _ref2 : "";
+      inline = _ref.inline,
+      state = _ref.state;
+    var text = state.display != null ? state.display : (_ref2 = schemaInterface.isEmptyValue(dataNode.schema.field, dataNode.control.value) ? emptyText : schemaInterface.textValueForData(dataNode)) != null ? _ref2 : "";
     var Div = renderer.html.Div;
     return /*#__PURE__*/jsxRuntime.jsx(Div, {
       style: style,
@@ -1018,7 +1019,8 @@ function renderWizard(props, isChildVisible) {
 var defaultDialogOptions = {
   classes: {
     className: "",
-    titleClass: "text-2xl font-bold"
+    titleClass: "text-2xl font-bold",
+    containerClass: "relative m-4 p-4 min-w-[400px] max-w-[80%] rounded-lg bg-white shadow-sm"
   }
 };
 function createDialogRenderer(options) {
@@ -1055,7 +1057,8 @@ function DefaultDialogRenderer(_ref) {
     var _deepMerge = schemas.deepMerge(options, defaultDialogOptions),
       _deepMerge$classes = _deepMerge.classes,
       titleClass = _deepMerge$classes.titleClass,
-      className = _deepMerge$classes.className;
+      className = _deepMerge$classes.className,
+      containerClass = _deepMerge$classes.containerClass;
     var open = core.useControl(false);
     var overlayState = ariaBase.createOverlayState(open);
     var actionOnClick = function actionOnClick(action) {
@@ -1093,6 +1096,7 @@ function DefaultDialogRenderer(_ref) {
       }), props.designMode ? designContent() : open.value && /*#__PURE__*/jsxRuntime.jsx(ariaBase.Modal, {
         state: overlayState,
         isDismissable: true,
+        containerClass: containerClass,
         children: dialogContent
       })]
     });
@@ -2055,7 +2059,7 @@ function createButtonActionRenderer(actionId, options) {
     var iconElement = icon && /*#__PURE__*/jsxRuntime.jsx(I, {
       iconName: icon.name,
       iconLibrary: icon.library,
-      className: iconPlacement == schemas.IconPlacement.BeforeText ? options.iconBeforeClass : options.iconAfterClass
+      className: schemas.rendererClass(textClass, iconPlacement == schemas.IconPlacement.BeforeText ? options.iconBeforeClass : options.iconAfterClass)
     });
     var textClassNames = schemas.rendererClass(textClass, isLink ? options.linkTextClass : schemas.rendererClass(options.textClass, actionStyle == schemas.ActionStyle.Secondary ? options.secondaryTextClass : options.primaryTextClass));
     var textElement = actionContent != null ? actionContent : actionText && /*#__PURE__*/jsxRuntime.jsx(Span, {
@@ -2141,6 +2145,7 @@ function createDefaultDataRenderer(options) {
         className: "@ " + schemas.rendererClass(p.className, displayOnlyClass),
         children: /*#__PURE__*/jsxRuntime.jsx(DefaultDisplayOnly, {
           dataNode: props.dataNode,
+          state: props.state,
           schemaInterface: props.dataContext.schemaInterface,
           className: props.className,
           textClass: props.textClass,
@@ -2420,8 +2425,11 @@ function DefaultHtmlIconRenderer(_ref9) {
       switch (iconLibrary) {
         case schemas.IconLibrary.FontAwesome:
           return "fa fa-" + iconName;
-        default:
+        case schemas.IconLibrary.Material:
+        case schemas.IconLibrary.CssClass:
           return iconName;
+        default:
+          return iconLibrary + " fa-" + iconName;
       }
     };
     var iconName = _ref9.iconName,