hs-uix 1.3.0 → 1.4.0

package/dist/form.js

@@ -55,6 +55,7 @@ var getEmptyValue = (field) => {
     case "datetime":
       return void 0;
     case "display":
+    case "slot":
     case "crmPropertyList":
     case "crmAssociationPropertyList":
       return void 0;
@@ -198,7 +199,7 @@ var collectAsyncValidatorPromises = (value, field, allValues, context) => {
 var runValidators = (value, field, allValues, fieldTypes, options = {}) => {
   const includeCustomValidators = options.includeCustomValidators !== false;
   const msg = options.messages || {};
-  if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
+  if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
   const isRequired = resolveRequired(field, allValues);
   const plugin = fieldTypes && fieldTypes[field.type];
   const empty = plugin && plugin.isEmpty ? plugin.isEmpty(value) : isValueEmpty(value, field);
@@ -421,6 +422,8 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
     // explicit row layout array (overrides columns + columnWidth)
     sections,
     // FormBuilderSection[] — accordion field grouping
+    groups,
+    // Record<string, FormBuilderGroupOptions> — per-group rendering options keyed by group name
     gap = "sm",
     // gap between fields
     showRequiredIndicator = true,
@@ -630,7 +633,7 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
     const resolved = transformInitialValues && initialValues ? transformInitialValues(initialValues) : initialValues;
     const vals = {};
     for (const field of fields) {
-      if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
+      if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
       if (field.type === "fieldGroup" && field.items && field.fields) {
         for (const item of field.items) {
           const subFields = field.fields(item);
@@ -1162,7 +1165,7 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
       const rawValues = {};
       for (const key of Object.keys(formValues)) {
         const f = fieldByName.get(key);
-        if (f && (f.type === "display" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
+        if (f && (f.type === "display" || f.type === "slot" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
         rawValues[key] = f && f.transformOut ? f.transformOut(formValues[key]) : formValues[key];
       }
       for (const f of fields) {
@@ -1313,7 +1316,7 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
     const isReadOnly = field.readOnly || formReadOnly;
     const isDisabled = disabled || resolveDisabled(field, formValues) || formReadOnly;
     const fieldOnChange = field.debounce ? (v) => handleDebouncedFieldChange(field.name, v) : (v) => handleFieldChange(field.name, v);
-    if (field.type === "display") {
+    if (field.type === "display" || field.type === "slot") {
       if (field.render) {
         return field.render({
           values: formValues,
@@ -1885,7 +1888,7 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
   const getFieldColSpan = (field) => {
     if (field.colSpan != null) return Math.min(field.colSpan, columns);
     if (field.width === "full" && columns > 1) return columns;
-    if (columns > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
+    if (columns > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
     return 1;
   };
   const getDependents = (parentField) => visibleFields.filter(
@@ -1910,7 +1913,7 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
     const colSpan = (field) => {
       if (field.colSpan != null) return Math.min(field.colSpan, cols);
       if (field.width === "full" && cols > 1) return cols;
-      if (cols > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
+      if (cols > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
       return 1;
     };
     const flushRow = () => {
@@ -2074,13 +2077,23 @@ var FormBuilder = (0, import_react.forwardRef)(function FormBuilder2(props, ref)
     const elements = [];
     for (let i = 0; i < chunks.length; i++) {
       const chunk = chunks[i];
-      if (i > 0) {
+      const opts = chunk.group && groups && groups[chunk.group] || {};
+      const showDivider = opts.showDivider !== false;
+      const showLabel = opts.showLabel !== false;
+      if (i > 0 && showDivider) {
         elements.push(/* @__PURE__ */ import_react.default.createElement(import_ui_extensions.Divider, { key: `group-div-${i}` }));
       }
-      if (chunk.group) {
-        elements.push(
-          /* @__PURE__ */ import_react.default.createElement(import_ui_extensions.Text, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, chunk.group)
-        );
+      if (chunk.group && showLabel) {
+        if (typeof opts.renderHeader === "function") {
+          const header = opts.renderHeader(chunk.group, chunk.fields, formValues);
+          if (header) elements.push(
+            /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, { key: `group-header-${i}` }, header)
+          );
+        } else {
+          elements.push(
+            /* @__PURE__ */ import_react.default.createElement(import_ui_extensions.Text, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, opts.label || chunk.group)
+          );
+        }
       }
       const chunkElements = renderFn(chunk.fields);
       if (Array.isArray(chunkElements)) {

package/dist/form.mjs

@@ -59,6 +59,7 @@ var getEmptyValue = (field) => {
     case "datetime":
       return void 0;
     case "display":
+    case "slot":
     case "crmPropertyList":
     case "crmAssociationPropertyList":
       return void 0;
@@ -202,7 +203,7 @@ var collectAsyncValidatorPromises = (value, field, allValues, context) => {
 var runValidators = (value, field, allValues, fieldTypes, options = {}) => {
   const includeCustomValidators = options.includeCustomValidators !== false;
   const msg = options.messages || {};
-  if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
+  if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
   const isRequired = resolveRequired(field, allValues);
   const plugin = fieldTypes && fieldTypes[field.type];
   const empty = plugin && plugin.isEmpty ? plugin.isEmpty(value) : isValueEmpty(value, field);
@@ -425,6 +426,8 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     // explicit row layout array (overrides columns + columnWidth)
     sections,
     // FormBuilderSection[] — accordion field grouping
+    groups,
+    // Record<string, FormBuilderGroupOptions> — per-group rendering options keyed by group name
     gap = "sm",
     // gap between fields
     showRequiredIndicator = true,
@@ -634,7 +637,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const resolved = transformInitialValues && initialValues ? transformInitialValues(initialValues) : initialValues;
     const vals = {};
     for (const field of fields) {
-      if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
+      if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
       if (field.type === "fieldGroup" && field.items && field.fields) {
         for (const item of field.items) {
           const subFields = field.fields(item);
@@ -1166,7 +1169,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
       const rawValues = {};
       for (const key of Object.keys(formValues)) {
         const f = fieldByName.get(key);
-        if (f && (f.type === "display" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
+        if (f && (f.type === "display" || f.type === "slot" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
         rawValues[key] = f && f.transformOut ? f.transformOut(formValues[key]) : formValues[key];
       }
       for (const f of fields) {
@@ -1317,7 +1320,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const isReadOnly = field.readOnly || formReadOnly;
     const isDisabled = disabled || resolveDisabled(field, formValues) || formReadOnly;
     const fieldOnChange = field.debounce ? (v) => handleDebouncedFieldChange(field.name, v) : (v) => handleFieldChange(field.name, v);
-    if (field.type === "display") {
+    if (field.type === "display" || field.type === "slot") {
       if (field.render) {
         return field.render({
           values: formValues,
@@ -1889,7 +1892,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
   const getFieldColSpan = (field) => {
     if (field.colSpan != null) return Math.min(field.colSpan, columns);
     if (field.width === "full" && columns > 1) return columns;
-    if (columns > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
+    if (columns > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
     return 1;
   };
   const getDependents = (parentField) => visibleFields.filter(
@@ -1914,7 +1917,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const colSpan = (field) => {
       if (field.colSpan != null) return Math.min(field.colSpan, cols);
       if (field.width === "full" && cols > 1) return cols;
-      if (cols > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
+      if (cols > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
       return 1;
     };
     const flushRow = () => {
@@ -2078,13 +2081,23 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const elements = [];
     for (let i = 0; i < chunks.length; i++) {
       const chunk = chunks[i];
-      if (i > 0) {
+      const opts = chunk.group && groups && groups[chunk.group] || {};
+      const showDivider = opts.showDivider !== false;
+      const showLabel = opts.showLabel !== false;
+      if (i > 0 && showDivider) {
         elements.push(/* @__PURE__ */ React.createElement(Divider, { key: `group-div-${i}` }));
       }
-      if (chunk.group) {
-        elements.push(
-          /* @__PURE__ */ React.createElement(Text, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, chunk.group)
-        );
+      if (chunk.group && showLabel) {
+        if (typeof opts.renderHeader === "function") {
+          const header = opts.renderHeader(chunk.group, chunk.fields, formValues);
+          if (header) elements.push(
+            /* @__PURE__ */ React.createElement(React.Fragment, { key: `group-header-${i}` }, header)
+          );
+        } else {
+          elements.push(
+            /* @__PURE__ */ React.createElement(Text, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, opts.label || chunk.group)
+          );
+        }
       }
       const chunkElements = renderFn(chunk.fields);
       if (Array.isArray(chunkElements)) {

package/dist/index.js

@@ -1126,6 +1126,7 @@ var getEmptyValue = (field) => {
     case "datetime":
       return void 0;
     case "display":
+    case "slot":
     case "crmPropertyList":
     case "crmAssociationPropertyList":
       return void 0;
@@ -1269,7 +1270,7 @@ var collectAsyncValidatorPromises = (value, field, allValues, context) => {
 var runValidators = (value, field, allValues, fieldTypes, options = {}) => {
   const includeCustomValidators = options.includeCustomValidators !== false;
   const msg = options.messages || {};
-  if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
+  if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
   const isRequired = resolveRequired(field, allValues);
   const plugin = fieldTypes && fieldTypes[field.type];
   const empty = plugin && plugin.isEmpty ? plugin.isEmpty(value) : isValueEmpty(value, field);
@@ -1492,6 +1493,8 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
     // explicit row layout array (overrides columns + columnWidth)
     sections,
     // FormBuilderSection[] — accordion field grouping
+    groups,
+    // Record<string, FormBuilderGroupOptions> — per-group rendering options keyed by group name
     gap = "sm",
     // gap between fields
     showRequiredIndicator = true,
@@ -1701,7 +1704,7 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
     const resolved = transformInitialValues && initialValues ? transformInitialValues(initialValues) : initialValues;
     const vals = {};
     for (const field of fields) {
-      if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
+      if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
       if (field.type === "fieldGroup" && field.items && field.fields) {
         for (const item of field.items) {
           const subFields = field.fields(item);
@@ -2233,7 +2236,7 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
       const rawValues = {};
       for (const key of Object.keys(formValues)) {
         const f = fieldByName.get(key);
-        if (f && (f.type === "display" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
+        if (f && (f.type === "display" || f.type === "slot" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
         rawValues[key] = f && f.transformOut ? f.transformOut(formValues[key]) : formValues[key];
       }
       for (const f of fields) {
@@ -2384,7 +2387,7 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
     const isReadOnly = field.readOnly || formReadOnly;
     const isDisabled = disabled || resolveDisabled(field, formValues) || formReadOnly;
     const fieldOnChange = field.debounce ? (v) => handleDebouncedFieldChange(field.name, v) : (v) => handleFieldChange(field.name, v);
-    if (field.type === "display") {
+    if (field.type === "display" || field.type === "slot") {
       if (field.render) {
         return field.render({
           values: formValues,
@@ -2956,7 +2959,7 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
   const getFieldColSpan = (field) => {
     if (field.colSpan != null) return Math.min(field.colSpan, columns);
     if (field.width === "full" && columns > 1) return columns;
-    if (columns > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
+    if (columns > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
     return 1;
   };
   const getDependents = (parentField) => visibleFields.filter(
@@ -2981,7 +2984,7 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
     const colSpan = (field) => {
       if (field.colSpan != null) return Math.min(field.colSpan, cols);
       if (field.width === "full" && cols > 1) return cols;
-      if (cols > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
+      if (cols > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
       return 1;
     };
     const flushRow = () => {
@@ -3145,13 +3148,23 @@ var FormBuilder = (0, import_react2.forwardRef)(function FormBuilder2(props, ref
     const elements = [];
     for (let i = 0; i < chunks.length; i++) {
       const chunk = chunks[i];
-      if (i > 0) {
+      const opts = chunk.group && groups && groups[chunk.group] || {};
+      const showDivider = opts.showDivider !== false;
+      const showLabel = opts.showLabel !== false;
+      if (i > 0 && showDivider) {
         elements.push(/* @__PURE__ */ import_react2.default.createElement(import_ui_extensions2.Divider, { key: `group-div-${i}` }));
       }
-      if (chunk.group) {
-        elements.push(
-          /* @__PURE__ */ import_react2.default.createElement(import_ui_extensions2.Text, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, chunk.group)
-        );
+      if (chunk.group && showLabel) {
+        if (typeof opts.renderHeader === "function") {
+          const header = opts.renderHeader(chunk.group, chunk.fields, formValues);
+          if (header) elements.push(
+            /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, { key: `group-header-${i}` }, header)
+          );
+        } else {
+          elements.push(
+            /* @__PURE__ */ import_react2.default.createElement(import_ui_extensions2.Text, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, opts.label || chunk.group)
+          );
+        }
       }
       const chunkElements = renderFn(chunk.fields);
       if (Array.isArray(chunkElements)) {

package/dist/index.mjs

@@ -1159,6 +1159,7 @@ var getEmptyValue = (field) => {
     case "datetime":
       return void 0;
     case "display":
+    case "slot":
     case "crmPropertyList":
     case "crmAssociationPropertyList":
       return void 0;
@@ -1302,7 +1303,7 @@ var collectAsyncValidatorPromises = (value, field, allValues, context) => {
 var runValidators = (value, field, allValues, fieldTypes, options = {}) => {
   const includeCustomValidators = options.includeCustomValidators !== false;
   const msg = options.messages || {};
-  if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
+  if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList" || field.type === "fieldGroup") return null;
   const isRequired = resolveRequired(field, allValues);
   const plugin = fieldTypes && fieldTypes[field.type];
   const empty = plugin && plugin.isEmpty ? plugin.isEmpty(value) : isValueEmpty(value, field);
@@ -1525,6 +1526,8 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     // explicit row layout array (overrides columns + columnWidth)
     sections,
     // FormBuilderSection[] — accordion field grouping
+    groups,
+    // Record<string, FormBuilderGroupOptions> — per-group rendering options keyed by group name
     gap = "sm",
     // gap between fields
     showRequiredIndicator = true,
@@ -1734,7 +1737,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const resolved = transformInitialValues && initialValues ? transformInitialValues(initialValues) : initialValues;
     const vals = {};
     for (const field of fields) {
-      if (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
+      if (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList") continue;
       if (field.type === "fieldGroup" && field.items && field.fields) {
         for (const item of field.items) {
           const subFields = field.fields(item);
@@ -2266,7 +2269,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
       const rawValues = {};
       for (const key of Object.keys(formValues)) {
         const f = fieldByName.get(key);
-        if (f && (f.type === "display" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
+        if (f && (f.type === "display" || f.type === "slot" || f.type === "crmPropertyList" || f.type === "crmAssociationPropertyList" || f.type === "fieldGroup")) continue;
         rawValues[key] = f && f.transformOut ? f.transformOut(formValues[key]) : formValues[key];
       }
       for (const f of fields) {
@@ -2417,7 +2420,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const isReadOnly = field.readOnly || formReadOnly;
     const isDisabled = disabled || resolveDisabled(field, formValues) || formReadOnly;
     const fieldOnChange = field.debounce ? (v) => handleDebouncedFieldChange(field.name, v) : (v) => handleFieldChange(field.name, v);
-    if (field.type === "display") {
+    if (field.type === "display" || field.type === "slot") {
       if (field.render) {
         return field.render({
           values: formValues,
@@ -2989,7 +2992,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
   const getFieldColSpan = (field) => {
     if (field.colSpan != null) return Math.min(field.colSpan, columns);
     if (field.width === "full" && columns > 1) return columns;
-    if (columns > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
+    if (columns > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return columns;
     return 1;
   };
   const getDependents = (parentField) => visibleFields.filter(
@@ -3014,7 +3017,7 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const colSpan = (field) => {
       if (field.colSpan != null) return Math.min(field.colSpan, cols);
       if (field.width === "full" && cols > 1) return cols;
-      if (cols > 1 && (field.type === "display" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
+      if (cols > 1 && (field.type === "display" || field.type === "slot" || field.type === "crmPropertyList" || field.type === "crmAssociationPropertyList")) return cols;
       return 1;
     };
     const flushRow = () => {
@@ -3178,13 +3181,23 @@ var FormBuilder = forwardRef(function FormBuilder2(props, ref) {
     const elements = [];
     for (let i = 0; i < chunks.length; i++) {
       const chunk = chunks[i];
-      if (i > 0) {
+      const opts = chunk.group && groups && groups[chunk.group] || {};
+      const showDivider = opts.showDivider !== false;
+      const showLabel = opts.showLabel !== false;
+      if (i > 0 && showDivider) {
         elements.push(/* @__PURE__ */ React2.createElement(Divider, { key: `group-div-${i}` }));
       }
-      if (chunk.group) {
-        elements.push(
-          /* @__PURE__ */ React2.createElement(Text2, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, chunk.group)
-        );
+      if (chunk.group && showLabel) {
+        if (typeof opts.renderHeader === "function") {
+          const header = opts.renderHeader(chunk.group, chunk.fields, formValues);
+          if (header) elements.push(
+            /* @__PURE__ */ React2.createElement(React2.Fragment, { key: `group-header-${i}` }, header)
+          );
+        } else {
+          elements.push(
+            /* @__PURE__ */ React2.createElement(Text2, { key: `group-label-${i}`, format: { fontWeight: "demibold" } }, opts.label || chunk.group)
+          );
+        }
       }
       const chunkElements = renderFn(chunk.fields);
       if (Array.isArray(chunkElements)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hs-uix",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "Production-ready UI components for HubSpot UI Extensions — DataTable, FormBuilder, and more",
   "license": "MIT",
   "main": "./dist/index.js",