@dynamic-field-kit/react 1.1.1 → 1.2.0

package/README.md

@@ -12,6 +12,10 @@ Demo app: https://github.com/vannt-dev/dynamic-field-kit-demo
 npm install @dynamic-field-kit/core @dynamic-field-kit/react react
 ```
 
+Note: Core is shared runtime. Install core separately and ensure a single version is used across adapters to avoid duplicate registries.
+
+- Install with core: `npm install @dynamic-field-kit/core @dynamic-field-kit/react`
+
 ## Exports
 
 - `DynamicInput`
@@ -39,44 +43,44 @@ Built-in layouts:
 Register React components or function components through the React adapter:
 
 ```tsx
-import { fieldRegistry } from "@dynamic-field-kit/react"
+import { fieldRegistry } from '@dynamic-field-kit/react';
 
-fieldRegistry.register("text", ({ value, onValueChange, label }) => (
-  <label style={{ display: "grid", gap: 4 }}>
+fieldRegistry.register('text', ({ value, onValueChange, label }) => (
+  <label style={{ display: 'grid', gap: 4 }}>
     <span>{label}</span>
     <input
-      value={value ?? ""}
+      value={value ?? ''}
       onChange={(e) => onValueChange?.(e.target.value)}
     />
   </label>
-))
+));
 
-fieldRegistry.register("number", ({ value, onValueChange, label }) => (
-  <label style={{ display: "grid", gap: 4 }}>
+fieldRegistry.register('number', ({ value, onValueChange, label }) => (
+  <label style={{ display: 'grid', gap: 4 }}>
     <span>{label}</span>
     <input
       type="number"
-      value={value ?? ""}
+      value={value ?? ''}
       onChange={(e) => onValueChange?.(Number(e.target.value))}
     />
   </label>
-))
+));
 ```
 
 ## Basic usage
 
 ```tsx
-import { useState } from "react"
-import { MultiFieldInput } from "@dynamic-field-kit/react"
-import type { FieldDescription } from "@dynamic-field-kit/core"
+import { useState } from 'react';
+import { MultiFieldInput } from '@dynamic-field-kit/react';
+import type { FieldDescription } from '@dynamic-field-kit/core';
 
 const fields: FieldDescription[] = [
-  { name: "name", type: "text", label: "Name" },
-  { name: "age", type: "number", label: "Age" },
-]
+  { name: 'name', type: 'text', label: 'Name' },
+  { name: 'age', type: 'number', label: 'Age' },
+];
 
 export function Example() {
-  const [data, setData] = useState({})
+  const [data, setData] = useState({});
 
   return (
     <MultiFieldInput
@@ -84,7 +88,7 @@ export function Example() {
       properties={data}
       onChange={setData}
     />
-  )
+  );
 }
 ```
 
@@ -101,7 +105,7 @@ Use a layout config object:
 ```tsx
 <MultiFieldInput
   fieldDescriptions={fields}
-  layout={{ type: "grid", columns: 3, gap: 16 }}
+  layout={{ type: 'grid', columns: 3, gap: 16 }}
 />
 ```
 
@@ -111,9 +115,9 @@ Use the built-in responsive layout:
 <MultiFieldInput
   fieldDescriptions={fields}
   layout={{
-    type: "responsive",
-    mobile: "column",
-    desktop: { type: "grid", columns: 2, gap: 12 },
+    type: 'responsive',
+    mobile: 'column',
+    desktop: { type: 'grid', columns: 2, gap: 12 },
   }}
 />
 ```
@@ -121,11 +125,11 @@ Use the built-in responsive layout:
 Register a custom layout:
 
 ```tsx
-import { layoutRegistry } from "@dynamic-field-kit/react"
+import { layoutRegistry } from '@dynamic-field-kit/react';
 
-layoutRegistry.register("stack-tight", ({ children }) => (
-  <div style={{ display: "grid", gap: 8 }}>{children}</div>
-))
+layoutRegistry.register('stack-tight', ({ children }) => (
+  <div style={{ display: 'grid', gap: 8 }}>{children}</div>
+));
 ```
 
 ## Type augmentation
@@ -133,12 +137,12 @@ layoutRegistry.register("stack-tight", ({ children }) => (
 Add your app's field types through module augmentation:
 
 ```ts
-import "@dynamic-field-kit/core"
+import '@dynamic-field-kit/core';
 
-declare module "@dynamic-field-kit/core" {
+declare module '@dynamic-field-kit/core' {
   interface FieldTypeMap {
-    text: string
-    number: number
+    text: string;
+    number: number;
   }
 }
 ```

package/dist/index.d.mts

@@ -14,13 +14,13 @@ declare class LayoutRegistry {
 }
 declare const layoutRegistry: LayoutRegistry;
 
-type BaseLayout = "column" | "row" | {
-    type: "grid";
+type BaseLayout = 'column' | 'row' | {
+    type: 'grid';
     columns?: number;
     gap?: number;
 };
 type LayoutConfig = BaseLayout | {
-    type: "responsive";
+    type: 'responsive';
     mobile: BaseLayout;
     desktop: BaseLayout;
 };
@@ -34,14 +34,14 @@ interface Props$2<T extends FieldTypeKey> {
     className?: string;
     description?: ReactNode;
 }
-declare const DynamicInput: <T extends FieldTypeKey>({ type, value, onChange, label, options, className, description }: Props$2<T>) => react_jsx_runtime.JSX.Element;
+declare const DynamicInput: <T extends FieldTypeKey>({ type, value, onChange, label, options, className, description, }: Props$2<T>) => react_jsx_runtime.JSX.Element;
 
 interface Props$1 {
     fieldDescription: FieldDescription;
     renderInfos: Properties;
     onValueChangeField: (value: any, key: string) => void;
 }
-declare const FieldInput: ({ fieldDescription, renderInfos, onValueChangeField }: Props$1) => react_jsx_runtime.JSX.Element;
+declare const FieldInput: ({ fieldDescription, renderInfos, onValueChangeField, }: Props$1) => react_jsx_runtime.JSX.Element;
 
 interface Props {
     fieldDescriptions: FieldDescription[];
@@ -49,7 +49,7 @@ interface Props {
     onChange?: (data: Properties) => void;
     layout?: LayoutConfig;
 }
-declare const MultiFieldInput: ({ fieldDescriptions, properties, onChange, layout }: Props) => react_jsx_runtime.JSX.Element;
+declare const MultiFieldInput: ({ fieldDescriptions, properties, onChange, layout, }: Props) => react_jsx_runtime.JSX.Element;
 
 type ReactFieldRenderer<T = any> = ComponentType<FieldRendererProps<T>>;
 interface ReactFieldRegistry {

package/dist/index.d.ts

@@ -14,13 +14,13 @@ declare class LayoutRegistry {
 }
 declare const layoutRegistry: LayoutRegistry;
 
-type BaseLayout = "column" | "row" | {
-    type: "grid";
+type BaseLayout = 'column' | 'row' | {
+    type: 'grid';
     columns?: number;
     gap?: number;
 };
 type LayoutConfig = BaseLayout | {
-    type: "responsive";
+    type: 'responsive';
     mobile: BaseLayout;
     desktop: BaseLayout;
 };
@@ -34,14 +34,14 @@ interface Props$2<T extends FieldTypeKey> {
     className?: string;
     description?: ReactNode;
 }
-declare const DynamicInput: <T extends FieldTypeKey>({ type, value, onChange, label, options, className, description }: Props$2<T>) => react_jsx_runtime.JSX.Element;
+declare const DynamicInput: <T extends FieldTypeKey>({ type, value, onChange, label, options, className, description, }: Props$2<T>) => react_jsx_runtime.JSX.Element;
 
 interface Props$1 {
     fieldDescription: FieldDescription;
     renderInfos: Properties;
     onValueChangeField: (value: any, key: string) => void;
 }
-declare const FieldInput: ({ fieldDescription, renderInfos, onValueChangeField }: Props$1) => react_jsx_runtime.JSX.Element;
+declare const FieldInput: ({ fieldDescription, renderInfos, onValueChangeField, }: Props$1) => react_jsx_runtime.JSX.Element;
 
 interface Props {
     fieldDescriptions: FieldDescription[];
@@ -49,7 +49,7 @@ interface Props {
     onChange?: (data: Properties) => void;
     layout?: LayoutConfig;
 }
-declare const MultiFieldInput: ({ fieldDescriptions, properties, onChange, layout }: Props) => react_jsx_runtime.JSX.Element;
+declare const MultiFieldInput: ({ fieldDescriptions, properties, onChange, layout, }: Props) => react_jsx_runtime.JSX.Element;
 
 type ReactFieldRenderer<T = any> = ComponentType<FieldRendererProps<T>>;
 interface ReactFieldRegistry {

package/dist/index.js

@@ -5,9 +5,6 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -30,49 +27,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// ../core/dist/index.js
-var require_dist = __commonJS({
-  "../core/dist/index.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty;
-    var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
-    var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __hasOwnProp2 = Object.prototype.hasOwnProperty;
-    var __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: true });
-    };
-    var __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from === "object" || typeof from === "function") {
-        for (let key of __getOwnPropNames2(from))
-          if (!__hasOwnProp2.call(to, key) && key !== except)
-            __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      }
-      return to;
-    };
-    var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
-    var index_exports2 = {};
-    __export2(index_exports2, {
-      FieldRegistry: () => FieldRegistry,
-      fieldRegistry: () => fieldRegistry2
-    });
-    module2.exports = __toCommonJS2(index_exports2);
-    var FieldRegistry = class {
-      constructor() {
-        this.registry = {};
-      }
-      // ✅ Type safety API
-      register(type, renderer) {
-        this.registry[type] = renderer;
-      }
-      get(type) {
-        return this.registry[type];
-      }
-    };
-    var fieldRegistry2 = new FieldRegistry();
-  }
-});
-
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
@@ -148,38 +102,67 @@ function resolve(layout) {
 layoutRegistry.register("responsive", ({ children, config }) => {
   const isMobile = typeof window !== "undefined" && window.innerWidth < 768;
   const current = isMobile ? config.mobile : config.desktop;
-  if (!current) return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-    children,
-    " "
-  ] });
+  if (!current) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
+      children,
+      " "
+    ] });
+  }
   const { type, config: childConfig } = resolve(current);
   const Renderer = layoutRegistry.get(type);
-  if (!Renderer) return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-    children,
-    " "
-  ] });
+  if (!Renderer) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
+      children,
+      " "
+    ] });
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Renderer, { config: childConfig, children });
 });
 
+// src/components/DynamicInput.tsx
+var import_react = __toESM(require("react"));
+
 // src/fieldRegistry.ts
-var import_core = __toESM(require_dist());
+var import_core = require("@dynamic-field-kit/core");
 var fieldRegistry = import_core.fieldRegistry;
 
 // src/components/DynamicInput.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
-var DynamicInput = ({ type, value, onChange, label, options, className, description }) => {
-  const Renderer = fieldRegistry.get(type);
-  if (!Renderer) return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
-    "Unknown field type: ",
-    type
-  ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Renderer, { value, onValueChange: onChange, label, options, className, description });
+var DynamicInput = ({
+  type,
+  value,
+  onChange,
+  label,
+  options,
+  className,
+  description
+}) => {
+  const Renderer = (0, import_react.useMemo)(() => fieldRegistry.get(type), [type]);
+  if (!Renderer) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
+      "Unknown field type: ",
+      type
+    ] });
+  }
+  const RendererEl = Renderer;
+  return import_react.default.createElement(RendererEl, {
+    value,
+    onValueChange: onChange,
+    label,
+    options,
+    className,
+    description
+  });
 };
 var DynamicInput_default = DynamicInput;
 
 // src/components/FieldInput.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
-var FieldInput = ({ fieldDescription, renderInfos, onValueChangeField }) => {
+var FieldInput = ({
+  fieldDescription,
+  renderInfos,
+  onValueChangeField
+}) => {
   const { name, type, label, options, className, description } = fieldDescription;
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     DynamicInput_default,
@@ -197,20 +180,33 @@ var FieldInput = ({ fieldDescription, renderInfos, onValueChangeField }) => {
 var FieldInput_default = FieldInput;
 
 // src/components/MultiFieldInput.tsx
-var import_react = require("react");
+var import_react2 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function resolveLayout(layout) {
-  if (!layout) return { type: "column", config: {} };
-  if (typeof layout === "string") return { type: layout, config: {} };
+  if (!layout) {
+    return { type: "column", config: {} };
+  }
+  if (typeof layout === "string") {
+    return { type: layout, config: {} };
+  }
   return { type: layout.type, config: layout };
 }
-var MultiFieldInput = ({ fieldDescriptions, properties, onChange, layout }) => {
-  const [data, setData] = (0, import_react.useState)({});
-  (0, import_react.useEffect)(() => {
-    if (properties) setData(properties);
+var MultiFieldInput = ({
+  fieldDescriptions,
+  properties,
+  onChange,
+  layout
+}) => {
+  const [data, setData] = (0, import_react2.useState)({});
+  (0, import_react2.useEffect)(() => {
+    if (properties) {
+      setData(properties);
+    }
   }, [properties]);
-  const visibleFields = (0, import_react.useMemo)(
-    () => fieldDescriptions.filter((f) => !f.appearCondition || f.appearCondition(data)),
+  const visibleFields = (0, import_react2.useMemo)(
+    () => fieldDescriptions.filter(
+      (f) => !f.appearCondition || f.appearCondition(data)
+    ),
     [fieldDescriptions, data]
   );
   const { type, config } = resolveLayout(layout);

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../core/src/index.ts","../../core/src/FieldRegistry.ts","../src/index.ts","../src/layout/layoutRegistry.ts","../src/layout/defaultLayouts.tsx","../src/layout/responsiveLayout.tsx","../src/fieldRegistry.ts","../src/components/DynamicInput.tsx","../src/components/FieldInput.tsx","../src/components/MultiFieldInput.tsx"],"sourcesContent":["export * from \"./types\"\r\nexport * from \"./FieldRegistry\"\r\n","import type { FieldRendererProps, FieldTypeMap } from \"./types\"\n\nexport type FieldRenderer<T = any, TResult = unknown> = (\n    props: FieldRendererProps<T>\n) => TResult\n\r\nexport class FieldRegistry {\r\n    // ❗ INTERNAL = string, not constrain\r\n    private registry: Record<string, FieldRenderer<any>> = {}\r\n\r\n    // ✅ Type safety API\r\n    register<K extends keyof FieldTypeMap>(\r\n        type: K,\r\n        renderer: FieldRenderer<FieldTypeMap[K]>\r\n    ) {\r\n        this.registry[type as string] = renderer\r\n    }\r\n\r\n    get<K extends keyof FieldTypeMap>(\r\n        type: K\r\n    ): FieldRenderer<FieldTypeMap[K]> | undefined {\r\n        return this.registry[type as string]\r\n    }\r\n}\r\n\r\nexport const fieldRegistry = new FieldRegistry()\r\n","import \"./layout/defaultLayouts\"\r\nimport \"./layout/responsiveLayout\"\r\n\r\n\r\nexport { layoutRegistry } from \"./layout\"\r\n\r\n\r\nexport { default as DynamicInput } from \"./components/DynamicInput\"\nexport { default as FieldInput } from \"./components/FieldInput\"\nexport { default as MultiFieldInput } from \"./components/MultiFieldInput\"\nexport { fieldRegistry, type ReactFieldRenderer, type ReactFieldRegistry } from \"./fieldRegistry\"\n\n\nexport type { LayoutConfig } from \"./types/layout\"\n// Re-export selected core APIs\nexport {\n    type FieldTypeKey,\n    type FieldDescription,\n    type FieldRendererProps,\n} from \"@dynamic-field-kit/core\"\n","import React from \"react\"\r\n\r\nexport type LayoutRenderer<C = any> = (props: {\r\n    children: React.ReactNode\r\n    config?: C\r\n}) => React.ReactElement\r\n\r\nexport class LayoutRegistry {\r\n    private layouts = new Map<string, LayoutRenderer>()\r\n\r\n    register(type: string, renderer: LayoutRenderer) {\r\n        if (this.layouts.has(type)) {\r\n            console.warn(`[dynamic-field-kit] Layout \"${type}\" already exists`)\r\n        }\r\n        this.layouts.set(type, renderer)\r\n    }\r\n\r\n    get(type: string): LayoutRenderer | undefined {\r\n        return this.layouts.get(type)\r\n    }\r\n}\r\n\r\nexport const layoutRegistry = new LayoutRegistry()\r\n","import { layoutRegistry } from \"./layoutRegistry\"\r\n\r\nlayoutRegistry.register(\"column\", ({ children, config }) => (\r\n    <div\r\n        style={{\r\n            display: \"flex\",\r\n            flexDirection: \"column\",\r\n            gap: config?.gap ?? 12,\r\n        }}\r\n    >\r\n        {children}\r\n    </div>\r\n))\r\n\r\nlayoutRegistry.register(\"row\", ({ children, config }) => (\r\n    <div\r\n        style={{\r\n            display: \"flex\",\r\n            flexDirection: \"row\",\r\n            gap: config?.gap ?? 12,\r\n        }}\r\n    >\r\n        {children}\r\n    </div>\r\n))\r\n\r\nlayoutRegistry.register(\"grid\", ({ children, config }) => (\r\n    <div\r\n        style={{\r\n            display: \"grid\",\r\n            gridTemplateColumns: `repeat(${config?.columns ?? 2}, 1fr)`,\r\n            gap: config?.gap ?? 12,\r\n        }}\r\n    >\r\n        {children}\r\n    </div>\r\n))","import { layoutRegistry } from \"./layoutRegistry\"\r\nimport { LayoutConfig } from \"../types/layout\"\r\n\r\nfunction resolve(layout: LayoutConfig) {\r\n    if (typeof layout === \"string\") {\r\n        return { type: layout, config: {} }\r\n    }\r\n    return { type: layout.type, config: layout }\r\n}\r\n\r\nlayoutRegistry.register(\"responsive\", ({ children, config }) => {\r\n    const isMobile =\r\n        typeof window !== \"undefined\" && window.innerWidth < 768\r\n\r\n    const current = isMobile ? config.mobile : config.desktop\r\n    if (!current) return <>{ children } </>\r\n\r\n    const { type, config: childConfig } = resolve(current)\r\n    const Renderer = layoutRegistry.get(type)\r\n\r\n    if (!Renderer) return <>{ children } </>\r\n\r\n    return (\r\n        <Renderer config= { childConfig } >\r\n        { children }\r\n        </Renderer>\r\n    )\r\n})\r\n","import {\n    fieldRegistry as coreFieldRegistry,\n    type FieldRendererProps,\n    type FieldTypeMap,\n} from \"@dynamic-field-kit/core\"\nimport type { ComponentType } from \"react\"\n\nexport type ReactFieldRenderer<T = any> = ComponentType<FieldRendererProps<T>>\n\nexport interface ReactFieldRegistry {\n    register<K extends keyof FieldTypeMap>(\n        type: K,\n        renderer: ReactFieldRenderer<FieldTypeMap[K]>\n    ): void\n    get<K extends keyof FieldTypeMap>(\n        type: K\n    ): ReactFieldRenderer<FieldTypeMap[K]> | undefined\n}\n\nexport const fieldRegistry = coreFieldRegistry as ReactFieldRegistry\n","import { FieldTypeKey, Properties } from \"@dynamic-field-kit/core\"\nimport { ReactNode } from \"react\"\nimport { fieldRegistry } from \"../fieldRegistry\"\n\r\ninterface Props<T extends FieldTypeKey> {\r\n    type: T\r\n    value?: any\r\n    onChange?: (value: any) => void\r\n    label?: string\r\n    options?: Properties[]\r\n    className?: string\r\n    description?: ReactNode\r\n}\r\n\r\n\r\nconst DynamicInput = <T extends FieldTypeKey>({ type, value, onChange, label, options, className, description }: Props<T>) => {\r\n    const Renderer = fieldRegistry.get(type)\r\n\r\n\r\n    if (!Renderer) return <div>Unknown field type: {type}</div>\r\n\r\n\r\n    return <Renderer value={value} onValueChange={onChange} label={label} options={options} className={className} description={description} />\r\n}\r\n\r\n\r\nexport default DynamicInput\n","import { FieldDescription, Properties } from \"@dynamic-field-kit/core\"\r\nimport DynamicInput from \"./DynamicInput\"\r\n\r\ninterface Props {\r\n  fieldDescription: FieldDescription\r\n  renderInfos: Properties\r\n  onValueChangeField: (value: any, key: string) => void\r\n}\r\n\r\n\r\nconst FieldInput = ({ fieldDescription, renderInfos, onValueChangeField }: Props) => {\r\n  const { name, type, label, options, className, description } = fieldDescription\r\n\r\n\r\n  return (\r\n    <DynamicInput\r\n      type={type}\r\n      label={label}\r\n      value={renderInfos[name]}\r\n      options={options}\r\n      className={className}\r\n      description={description}\r\n      onChange={(v) => onValueChangeField(v, name)}\r\n    />\r\n  )\r\n}\r\n\r\n\r\nexport default FieldInput\r\n","import { FieldDescription, Properties } from \"@dynamic-field-kit/core\"\r\nimport { Fragment, useEffect, useMemo, useState } from \"react\"\r\nimport FieldInput from \"./FieldInput\"\r\nimport { layoutRegistry } from \"../layout\"\r\nimport { LayoutConfig } from \"../types/layout\"\r\n\r\n\r\ninterface Props {\r\n  fieldDescriptions: FieldDescription[]\r\n  properties?: Properties\r\n  onChange?: (data: Properties) => void\r\n  layout?: LayoutConfig\r\n}\r\n\r\n\r\nfunction resolveLayout(layout?: LayoutConfig) {\r\n  if (!layout) return { type: \"column\", config: {} }\r\n  if (typeof layout === \"string\") return { type: layout, config: {} }\r\n  return { type: layout.type, config: layout }\r\n}\r\n\r\n\r\nconst MultiFieldInput = ({ fieldDescriptions, properties, onChange, layout }: Props) => {\r\n  const [data, setData] = useState<Properties>({})\r\n\r\n  useEffect(() => {\r\n    if (properties) setData(properties)\r\n  }, [properties])\r\n\r\n  const visibleFields = useMemo(\r\n    () => fieldDescriptions.filter((f) => !f.appearCondition || f.appearCondition(data)),\r\n    [fieldDescriptions, data]\r\n  )\r\n\r\n  const { type, config } = resolveLayout(layout)\r\n  \r\n  const Layout = layoutRegistry.get(type)\r\n\r\n  if (!Layout) {\r\n    throw new Error(`Unknown layout: ${type}`)\r\n  }\r\n\r\n  return (\r\n    <Layout config={config}>\r\n      {visibleFields.map((f) => (\r\n        <FieldInput\r\n          key={f.name}\r\n          fieldDescription={f}\r\n          renderInfos={data}\r\n          onValueChangeField={(value, key) => {\r\n            const next = { ...data, [key]: value }\r\n            setData(next)\r\n            onChange?.(next)\r\n          }}\r\n        />\r\n      ))}\r\n    </Layout>\r\n  )\r\n}\r\n\r\n\r\nexport default MultiFieldInput\r\n"],"mappings":"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","names":["index_exports","__export","fieldRegistry","module","__toCommonJS","import_jsx_runtime","coreFieldRegistry","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}
+{"version":3,"sources":["../src/index.ts","../src/layout/layoutRegistry.ts","../src/layout/defaultLayouts.tsx","../src/layout/responsiveLayout.tsx","../src/components/DynamicInput.tsx","../src/fieldRegistry.ts","../src/components/FieldInput.tsx","../src/components/MultiFieldInput.tsx"],"sourcesContent":["import './layout/defaultLayouts';\nimport './layout/responsiveLayout';\n\nexport { layoutRegistry } from './layout';\n\nexport { default as DynamicInput } from './components/DynamicInput';\nexport { default as FieldInput } from './components/FieldInput';\nexport { default as MultiFieldInput } from './components/MultiFieldInput';\nexport {\n  fieldRegistry,\n  type ReactFieldRenderer,\n  type ReactFieldRegistry,\n} from './fieldRegistry';\n\nexport type { LayoutConfig } from './types/layout';\n// Re-export selected core APIs\nexport {\n  type FieldTypeKey,\n  type FieldDescription,\n  type FieldRendererProps,\n} from '@dynamic-field-kit/core';\n","import React from 'react';\n\nexport type LayoutRenderer<C = any> = (props: {\n  children: React.ReactNode;\n  config?: C;\n}) => React.ReactElement;\n\nexport class LayoutRegistry {\n  private layouts = new Map<string, LayoutRenderer>();\n\n  register(type: string, renderer: LayoutRenderer) {\n    if (this.layouts.has(type)) {\n      console.warn(`[dynamic-field-kit] Layout \"${type}\" already exists`);\n    }\n    this.layouts.set(type, renderer);\n  }\n\n  get(type: string): LayoutRenderer | undefined {\n    return this.layouts.get(type);\n  }\n}\n\nexport const layoutRegistry = new LayoutRegistry();\n","import { layoutRegistry } from './layoutRegistry';\n\nlayoutRegistry.register('column', ({ children, config }) => (\n  <div\n    style={{\n      display: 'flex',\n      flexDirection: 'column',\n      gap: config?.gap ?? 12,\n    }}\n  >\n    {children}\n  </div>\n));\n\nlayoutRegistry.register('row', ({ children, config }) => (\n  <div\n    style={{\n      display: 'flex',\n      flexDirection: 'row',\n      gap: config?.gap ?? 12,\n    }}\n  >\n    {children}\n  </div>\n));\n\nlayoutRegistry.register('grid', ({ children, config }) => (\n  <div\n    style={{\n      display: 'grid',\n      gridTemplateColumns: `repeat(${config?.columns ?? 2}, 1fr)`,\n      gap: config?.gap ?? 12,\n    }}\n  >\n    {children}\n  </div>\n));\n","import React from 'react';\nimport { LayoutConfig } from '../types/layout';\nimport { layoutRegistry } from './layoutRegistry';\n\nfunction resolve(layout: LayoutConfig) {\n  if (typeof layout === 'string') {\n    return { type: layout, config: {} };\n  }\n  return { type: layout.type, config: layout };\n}\n\nlayoutRegistry.register('responsive', ({ children, config }) => {\n  const isMobile = typeof window !== 'undefined' && window.innerWidth < 768;\n\n  const current = isMobile ? config.mobile : config.desktop;\n  if (!current) {\n    return <>{children} </>;\n  }\n\n  const { type, config: childConfig } = resolve(current);\n  const Renderer = layoutRegistry.get(type);\n\n  if (!Renderer) {\n    return <>{children} </>;\n  }\n\n  return <Renderer config={childConfig}>{children}</Renderer>;\n});\n","import { FieldTypeKey, Properties } from '@dynamic-field-kit/core';\nimport React, { ReactNode, useMemo } from 'react';\nimport { fieldRegistry } from '../fieldRegistry';\n\ninterface Props<T extends FieldTypeKey> {\n  type: T;\n  value?: any;\n  onChange?: (value: any) => void;\n  label?: string;\n  options?: Properties[];\n  className?: string;\n  description?: ReactNode;\n}\n\nconst DynamicInput = <T extends FieldTypeKey>({\n  type,\n  value,\n  onChange,\n  label,\n  options,\n  className,\n  description,\n}: Props<T>) => {\n  // Memoize renderer lookup to avoid unnecessary work on re-renders\n  const Renderer = useMemo(() => fieldRegistry.get(type), [type]) as any;\n\n  if (!Renderer) {\n    return <div>Unknown field type: {type}</div>;\n  }\n\n  // Use direct element creation to avoid TSX generic typing pitfalls\n  const RendererEl = Renderer as any;\n  return React.createElement(RendererEl, {\n    value,\n    onValueChange: onChange,\n    label,\n    options,\n    className,\n    description,\n  });\n};\n\nexport default DynamicInput;\n","import {\n  fieldRegistry as coreFieldRegistry,\n  type FieldRendererProps,\n  type FieldTypeMap,\n} from '@dynamic-field-kit/core';\nimport type { ComponentType } from 'react';\n\nexport type ReactFieldRenderer<T = any> = ComponentType<FieldRendererProps<T>>;\n\nexport interface ReactFieldRegistry {\n  register<K extends keyof FieldTypeMap>(\n    type: K,\n    renderer: ReactFieldRenderer<FieldTypeMap[K]>\n  ): void;\n  get<K extends keyof FieldTypeMap>(\n    type: K\n  ): ReactFieldRenderer<FieldTypeMap[K]> | undefined;\n}\n\nexport const fieldRegistry = coreFieldRegistry as ReactFieldRegistry;\n","import { FieldDescription, Properties } from '@dynamic-field-kit/core';\nimport DynamicInput from './DynamicInput';\n\ninterface Props {\n  fieldDescription: FieldDescription;\n  renderInfos: Properties;\n  onValueChangeField: (value: any, key: string) => void;\n}\n\nconst FieldInput = ({\n  fieldDescription,\n  renderInfos,\n  onValueChangeField,\n}: Props) => {\n  const { name, type, label, options, className, description } =\n    fieldDescription;\n\n  return (\n    <DynamicInput\n      type={type}\n      label={label}\n      value={renderInfos[name]}\n      options={options}\n      className={className}\n      description={description}\n      onChange={(v) => onValueChangeField(v, name)}\n    />\n  );\n};\n\nexport default FieldInput;\n","import { FieldDescription, Properties } from '@dynamic-field-kit/core';\r\nimport React, { useEffect, useMemo, useState } from 'react';\r\n\r\nimport { layoutRegistry } from '../layout';\r\nimport { LayoutConfig } from '../types/layout';\r\nimport FieldInput from './FieldInput';\r\n\r\ninterface Props {\r\n  fieldDescriptions: FieldDescription[];\r\n  properties?: Properties;\r\n  onChange?: (data: Properties) => void;\r\n  layout?: LayoutConfig;\r\n}\r\n\r\nfunction resolveLayout(layout?: LayoutConfig) {\r\n  if (!layout) {\r\n    return { type: 'column', config: {} };\r\n  }\r\n  if (typeof layout === 'string') {\r\n    return { type: layout, config: {} };\r\n  }\r\n  return { type: layout.type, config: layout };\r\n}\r\n\r\nconst MultiFieldInput = ({\r\n  fieldDescriptions,\r\n  properties,\r\n  onChange,\r\n  layout,\r\n}: Props) => {\r\n  const [data, setData] = useState<Properties>({});\r\n\r\n  useEffect(() => {\r\n    if (properties) {\r\n      setData(properties);\r\n    }\r\n  }, [properties]);\r\n\r\n  const visibleFields = useMemo(\r\n    () =>\r\n      fieldDescriptions.filter(\r\n        (f) => !f.appearCondition || f.appearCondition(data)\r\n      ),\r\n    [fieldDescriptions, data]\r\n  );\r\n\r\n  const { type, config } = resolveLayout(layout);\r\n\r\n  const Layout = layoutRegistry.get(type);\r\n\r\n  if (!Layout) {\r\n    throw new Error(`Unknown layout: ${type}`);\r\n  }\r\n\r\n  return (\r\n    <Layout config={config}>\r\n      {visibleFields.map((f) => (\r\n        <FieldInput\r\n          key={f.name}\r\n          fieldDescription={f}\r\n          renderInfos={data}\r\n          onValueChangeField={(value, key) => {\r\n            const next = { ...data, [key]: value };\r\n            setData(next);\r\n            onChange?.(next);\r\n          }}\r\n        />\r\n      ))}\r\n    </Layout>\r\n  );\r\n};\r\n\r\nexport default MultiFieldInput;\r\n"],"mappings":"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","names":["import_jsx_runtime","coreFieldRegistry","import_jsx_runtime","React","import_jsx_runtime","import_react","import_jsx_runtime"]}

package/dist/index.mjs

@@ -1,72 +1,3 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-
-// ../core/dist/index.js
-var require_dist = __commonJS({
-  "../core/dist/index.js"(exports, module) {
-    "use strict";
-    var __defProp2 = Object.defineProperty;
-    var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
-    var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __hasOwnProp2 = Object.prototype.hasOwnProperty;
-    var __export = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: true });
-    };
-    var __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from === "object" || typeof from === "function") {
-        for (let key of __getOwnPropNames2(from))
-          if (!__hasOwnProp2.call(to, key) && key !== except)
-            __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      }
-      return to;
-    };
-    var __toCommonJS = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
-    var index_exports = {};
-    __export(index_exports, {
-      FieldRegistry: () => FieldRegistry,
-      fieldRegistry: () => fieldRegistry2
-    });
-    module.exports = __toCommonJS(index_exports);
-    var FieldRegistry = class {
-      constructor() {
-        this.registry = {};
-      }
-      // ✅ Type safety API
-      register(type, renderer) {
-        this.registry[type] = renderer;
-      }
-      get(type) {
-        return this.registry[type];
-      }
-    };
-    var fieldRegistry2 = new FieldRegistry();
-  }
-});
-
 // src/layout/layoutRegistry.ts
 var LayoutRegistry = class {
   constructor() {
@@ -131,40 +62,71 @@ function resolve(layout) {
 layoutRegistry.register("responsive", ({ children, config }) => {
   const isMobile = typeof window !== "undefined" && window.innerWidth < 768;
   const current = isMobile ? config.mobile : config.desktop;
-  if (!current) return /* @__PURE__ */ jsxs(Fragment, { children: [
-    children,
-    " "
-  ] });
+  if (!current) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      children,
+      " "
+    ] });
+  }
   const { type, config: childConfig } = resolve(current);
   const Renderer = layoutRegistry.get(type);
-  if (!Renderer) return /* @__PURE__ */ jsxs(Fragment, { children: [
-    children,
-    " "
-  ] });
+  if (!Renderer) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      children,
+      " "
+    ] });
+  }
   return /* @__PURE__ */ jsx2(Renderer, { config: childConfig, children });
 });
 
+// src/components/DynamicInput.tsx
+import React, { useMemo } from "react";
+
 // src/fieldRegistry.ts
-var import_core = __toESM(require_dist());
-var fieldRegistry = import_core.fieldRegistry;
+import {
+  fieldRegistry as coreFieldRegistry
+} from "@dynamic-field-kit/core";
+var fieldRegistry = coreFieldRegistry;
 
 // src/components/DynamicInput.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var DynamicInput = ({ type, value, onChange, label, options, className, description }) => {
-  const Renderer = fieldRegistry.get(type);
-  if (!Renderer) return /* @__PURE__ */ jsxs2("div", { children: [
-    "Unknown field type: ",
-    type
-  ] });
-  return /* @__PURE__ */ jsx3(Renderer, { value, onValueChange: onChange, label, options, className, description });
+import { jsxs as jsxs2 } from "react/jsx-runtime";
+var DynamicInput = ({
+  type,
+  value,
+  onChange,
+  label,
+  options,
+  className,
+  description
+}) => {
+  const Renderer = useMemo(() => fieldRegistry.get(type), [type]);
+  if (!Renderer) {
+    return /* @__PURE__ */ jsxs2("div", { children: [
+      "Unknown field type: ",
+      type
+    ] });
+  }
+  const RendererEl = Renderer;
+  return React.createElement(RendererEl, {
+    value,
+    onValueChange: onChange,
+    label,
+    options,
+    className,
+    description
+  });
 };
 var DynamicInput_default = DynamicInput;
 
 // src/components/FieldInput.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
-var FieldInput = ({ fieldDescription, renderInfos, onValueChangeField }) => {
+import { jsx as jsx3 } from "react/jsx-runtime";
+var FieldInput = ({
+  fieldDescription,
+  renderInfos,
+  onValueChangeField
+}) => {
   const { name, type, label, options, className, description } = fieldDescription;
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx3(
     DynamicInput_default,
     {
       type,
@@ -180,20 +142,33 @@ var FieldInput = ({ fieldDescription, renderInfos, onValueChangeField }) => {
 var FieldInput_default = FieldInput;
 
 // src/components/MultiFieldInput.tsx
-import { useEffect, useMemo, useState } from "react";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { useEffect, useMemo as useMemo2, useState } from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
 function resolveLayout(layout) {
-  if (!layout) return { type: "column", config: {} };
-  if (typeof layout === "string") return { type: layout, config: {} };
+  if (!layout) {
+    return { type: "column", config: {} };
+  }
+  if (typeof layout === "string") {
+    return { type: layout, config: {} };
+  }
   return { type: layout.type, config: layout };
 }
-var MultiFieldInput = ({ fieldDescriptions, properties, onChange, layout }) => {
+var MultiFieldInput = ({
+  fieldDescriptions,
+  properties,
+  onChange,
+  layout
+}) => {
   const [data, setData] = useState({});
   useEffect(() => {
-    if (properties) setData(properties);
+    if (properties) {
+      setData(properties);
+    }
   }, [properties]);
-  const visibleFields = useMemo(
-    () => fieldDescriptions.filter((f) => !f.appearCondition || f.appearCondition(data)),
+  const visibleFields = useMemo2(
+    () => fieldDescriptions.filter(
+      (f) => !f.appearCondition || f.appearCondition(data)
+    ),
     [fieldDescriptions, data]
   );
   const { type, config } = resolveLayout(layout);
@@ -201,7 +176,7 @@ var MultiFieldInput = ({ fieldDescriptions, properties, onChange, layout }) => {
   if (!Layout) {
     throw new Error(`Unknown layout: ${type}`);
   }
-  return /* @__PURE__ */ jsx5(Layout, { config, children: visibleFields.map((f) => /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx4(Layout, { config, children: visibleFields.map((f) => /* @__PURE__ */ jsx4(
     FieldInput_default,
     {
       fieldDescription: f,

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../core/src/index.ts","../../core/src/FieldRegistry.ts","../src/layout/layoutRegistry.ts","../src/layout/defaultLayouts.tsx","../src/layout/responsiveLayout.tsx","../src/fieldRegistry.ts","../src/components/DynamicInput.tsx","../src/components/FieldInput.tsx","../src/components/MultiFieldInput.tsx"],"sourcesContent":["export * from \"./types\"\r\nexport * from \"./FieldRegistry\"\r\n","import type { FieldRendererProps, FieldTypeMap } from \"./types\"\n\nexport type FieldRenderer<T = any, TResult = unknown> = (\n    props: FieldRendererProps<T>\n) => TResult\n\r\nexport class FieldRegistry {\r\n    // ❗ INTERNAL = string, not constrain\r\n    private registry: Record<string, FieldRenderer<any>> = {}\r\n\r\n    // ✅ Type safety API\r\n    register<K extends keyof FieldTypeMap>(\r\n        type: K,\r\n        renderer: FieldRenderer<FieldTypeMap[K]>\r\n    ) {\r\n        this.registry[type as string] = renderer\r\n    }\r\n\r\n    get<K extends keyof FieldTypeMap>(\r\n        type: K\r\n    ): FieldRenderer<FieldTypeMap[K]> | undefined {\r\n        return this.registry[type as string]\r\n    }\r\n}\r\n\r\nexport const fieldRegistry = new FieldRegistry()\r\n","import React from \"react\"\r\n\r\nexport type LayoutRenderer<C = any> = (props: {\r\n    children: React.ReactNode\r\n    config?: C\r\n}) => React.ReactElement\r\n\r\nexport class LayoutRegistry {\r\n    private layouts = new Map<string, LayoutRenderer>()\r\n\r\n    register(type: string, renderer: LayoutRenderer) {\r\n        if (this.layouts.has(type)) {\r\n            console.warn(`[dynamic-field-kit] Layout \"${type}\" already exists`)\r\n        }\r\n        this.layouts.set(type, renderer)\r\n    }\r\n\r\n    get(type: string): LayoutRenderer | undefined {\r\n        return this.layouts.get(type)\r\n    }\r\n}\r\n\r\nexport const layoutRegistry = new LayoutRegistry()\r\n","import { layoutRegistry } from \"./layoutRegistry\"\r\n\r\nlayoutRegistry.register(\"column\", ({ children, config }) => (\r\n    <div\r\n        style={{\r\n            display: \"flex\",\r\n            flexDirection: \"column\",\r\n            gap: config?.gap ?? 12,\r\n        }}\r\n    >\r\n        {children}\r\n    </div>\r\n))\r\n\r\nlayoutRegistry.register(\"row\", ({ children, config }) => (\r\n    <div\r\n        style={{\r\n            display: \"flex\",\r\n            flexDirection: \"row\",\r\n            gap: config?.gap ?? 12,\r\n        }}\r\n    >\r\n        {children}\r\n    </div>\r\n))\r\n\r\nlayoutRegistry.register(\"grid\", ({ children, config }) => (\r\n    <div\r\n        style={{\r\n            display: \"grid\",\r\n            gridTemplateColumns: `repeat(${config?.columns ?? 2}, 1fr)`,\r\n            gap: config?.gap ?? 12,\r\n        }}\r\n    >\r\n        {children}\r\n    </div>\r\n))","import { layoutRegistry } from \"./layoutRegistry\"\r\nimport { LayoutConfig } from \"../types/layout\"\r\n\r\nfunction resolve(layout: LayoutConfig) {\r\n    if (typeof layout === \"string\") {\r\n        return { type: layout, config: {} }\r\n    }\r\n    return { type: layout.type, config: layout }\r\n}\r\n\r\nlayoutRegistry.register(\"responsive\", ({ children, config }) => {\r\n    const isMobile =\r\n        typeof window !== \"undefined\" && window.innerWidth < 768\r\n\r\n    const current = isMobile ? config.mobile : config.desktop\r\n    if (!current) return <>{ children } </>\r\n\r\n    const { type, config: childConfig } = resolve(current)\r\n    const Renderer = layoutRegistry.get(type)\r\n\r\n    if (!Renderer) return <>{ children } </>\r\n\r\n    return (\r\n        <Renderer config= { childConfig } >\r\n        { children }\r\n        </Renderer>\r\n    )\r\n})\r\n","import {\n    fieldRegistry as coreFieldRegistry,\n    type FieldRendererProps,\n    type FieldTypeMap,\n} from \"@dynamic-field-kit/core\"\nimport type { ComponentType } from \"react\"\n\nexport type ReactFieldRenderer<T = any> = ComponentType<FieldRendererProps<T>>\n\nexport interface ReactFieldRegistry {\n    register<K extends keyof FieldTypeMap>(\n        type: K,\n        renderer: ReactFieldRenderer<FieldTypeMap[K]>\n    ): void\n    get<K extends keyof FieldTypeMap>(\n        type: K\n    ): ReactFieldRenderer<FieldTypeMap[K]> | undefined\n}\n\nexport const fieldRegistry = coreFieldRegistry as ReactFieldRegistry\n","import { FieldTypeKey, Properties } from \"@dynamic-field-kit/core\"\nimport { ReactNode } from \"react\"\nimport { fieldRegistry } from \"../fieldRegistry\"\n\r\ninterface Props<T extends FieldTypeKey> {\r\n    type: T\r\n    value?: any\r\n    onChange?: (value: any) => void\r\n    label?: string\r\n    options?: Properties[]\r\n    className?: string\r\n    description?: ReactNode\r\n}\r\n\r\n\r\nconst DynamicInput = <T extends FieldTypeKey>({ type, value, onChange, label, options, className, description }: Props<T>) => {\r\n    const Renderer = fieldRegistry.get(type)\r\n\r\n\r\n    if (!Renderer) return <div>Unknown field type: {type}</div>\r\n\r\n\r\n    return <Renderer value={value} onValueChange={onChange} label={label} options={options} className={className} description={description} />\r\n}\r\n\r\n\r\nexport default DynamicInput\n","import { FieldDescription, Properties } from \"@dynamic-field-kit/core\"\r\nimport DynamicInput from \"./DynamicInput\"\r\n\r\ninterface Props {\r\n  fieldDescription: FieldDescription\r\n  renderInfos: Properties\r\n  onValueChangeField: (value: any, key: string) => void\r\n}\r\n\r\n\r\nconst FieldInput = ({ fieldDescription, renderInfos, onValueChangeField }: Props) => {\r\n  const { name, type, label, options, className, description } = fieldDescription\r\n\r\n\r\n  return (\r\n    <DynamicInput\r\n      type={type}\r\n      label={label}\r\n      value={renderInfos[name]}\r\n      options={options}\r\n      className={className}\r\n      description={description}\r\n      onChange={(v) => onValueChangeField(v, name)}\r\n    />\r\n  )\r\n}\r\n\r\n\r\nexport default FieldInput\r\n","import { FieldDescription, Properties } from \"@dynamic-field-kit/core\"\r\nimport { Fragment, useEffect, useMemo, useState } from \"react\"\r\nimport FieldInput from \"./FieldInput\"\r\nimport { layoutRegistry } from \"../layout\"\r\nimport { LayoutConfig } from \"../types/layout\"\r\n\r\n\r\ninterface Props {\r\n  fieldDescriptions: FieldDescription[]\r\n  properties?: Properties\r\n  onChange?: (data: Properties) => void\r\n  layout?: LayoutConfig\r\n}\r\n\r\n\r\nfunction resolveLayout(layout?: LayoutConfig) {\r\n  if (!layout) return { type: \"column\", config: {} }\r\n  if (typeof layout === \"string\") return { type: layout, config: {} }\r\n  return { type: layout.type, config: layout }\r\n}\r\n\r\n\r\nconst MultiFieldInput = ({ fieldDescriptions, properties, onChange, layout }: Props) => {\r\n  const [data, setData] = useState<Properties>({})\r\n\r\n  useEffect(() => {\r\n    if (properties) setData(properties)\r\n  }, [properties])\r\n\r\n  const visibleFields = useMemo(\r\n    () => fieldDescriptions.filter((f) => !f.appearCondition || f.appearCondition(data)),\r\n    [fieldDescriptions, data]\r\n  )\r\n\r\n  const { type, config } = resolveLayout(layout)\r\n  \r\n  const Layout = layoutRegistry.get(type)\r\n\r\n  if (!Layout) {\r\n    throw new Error(`Unknown layout: ${type}`)\r\n  }\r\n\r\n  return (\r\n    <Layout config={config}>\r\n      {visibleFields.map((f) => (\r\n        <FieldInput\r\n          key={f.name}\r\n          fieldDescription={f}\r\n          renderInfos={data}\r\n          onValueChangeField={(value, key) => {\r\n            const next = { ...data, [key]: value }\r\n            setData(next)\r\n            onChange?.(next)\r\n          }}\r\n        />\r\n      ))}\r\n    </Layout>\r\n  )\r\n}\r\n\r\n\r\nexport default MultiFieldInput\r\n"],"mappings":"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","names":["fieldRegistry","jsx","coreFieldRegistry","jsx","jsxs","jsx","jsx"]}
+{"version":3,"sources":["../src/layout/layoutRegistry.ts","../src/layout/defaultLayouts.tsx","../src/layout/responsiveLayout.tsx","../src/components/DynamicInput.tsx","../src/fieldRegistry.ts","../src/components/FieldInput.tsx","../src/components/MultiFieldInput.tsx"],"sourcesContent":["import React from 'react';\n\nexport type LayoutRenderer<C = any> = (props: {\n  children: React.ReactNode;\n  config?: C;\n}) => React.ReactElement;\n\nexport class LayoutRegistry {\n  private layouts = new Map<string, LayoutRenderer>();\n\n  register(type: string, renderer: LayoutRenderer) {\n    if (this.layouts.has(type)) {\n      console.warn(`[dynamic-field-kit] Layout \"${type}\" already exists`);\n    }\n    this.layouts.set(type, renderer);\n  }\n\n  get(type: string): LayoutRenderer | undefined {\n    return this.layouts.get(type);\n  }\n}\n\nexport const layoutRegistry = new LayoutRegistry();\n","import { layoutRegistry } from './layoutRegistry';\n\nlayoutRegistry.register('column', ({ children, config }) => (\n  <div\n    style={{\n      display: 'flex',\n      flexDirection: 'column',\n      gap: config?.gap ?? 12,\n    }}\n  >\n    {children}\n  </div>\n));\n\nlayoutRegistry.register('row', ({ children, config }) => (\n  <div\n    style={{\n      display: 'flex',\n      flexDirection: 'row',\n      gap: config?.gap ?? 12,\n    }}\n  >\n    {children}\n  </div>\n));\n\nlayoutRegistry.register('grid', ({ children, config }) => (\n  <div\n    style={{\n      display: 'grid',\n      gridTemplateColumns: `repeat(${config?.columns ?? 2}, 1fr)`,\n      gap: config?.gap ?? 12,\n    }}\n  >\n    {children}\n  </div>\n));\n","import React from 'react';\nimport { LayoutConfig } from '../types/layout';\nimport { layoutRegistry } from './layoutRegistry';\n\nfunction resolve(layout: LayoutConfig) {\n  if (typeof layout === 'string') {\n    return { type: layout, config: {} };\n  }\n  return { type: layout.type, config: layout };\n}\n\nlayoutRegistry.register('responsive', ({ children, config }) => {\n  const isMobile = typeof window !== 'undefined' && window.innerWidth < 768;\n\n  const current = isMobile ? config.mobile : config.desktop;\n  if (!current) {\n    return <>{children} </>;\n  }\n\n  const { type, config: childConfig } = resolve(current);\n  const Renderer = layoutRegistry.get(type);\n\n  if (!Renderer) {\n    return <>{children} </>;\n  }\n\n  return <Renderer config={childConfig}>{children}</Renderer>;\n});\n","import { FieldTypeKey, Properties } from '@dynamic-field-kit/core';\nimport React, { ReactNode, useMemo } from 'react';\nimport { fieldRegistry } from '../fieldRegistry';\n\ninterface Props<T extends FieldTypeKey> {\n  type: T;\n  value?: any;\n  onChange?: (value: any) => void;\n  label?: string;\n  options?: Properties[];\n  className?: string;\n  description?: ReactNode;\n}\n\nconst DynamicInput = <T extends FieldTypeKey>({\n  type,\n  value,\n  onChange,\n  label,\n  options,\n  className,\n  description,\n}: Props<T>) => {\n  // Memoize renderer lookup to avoid unnecessary work on re-renders\n  const Renderer = useMemo(() => fieldRegistry.get(type), [type]) as any;\n\n  if (!Renderer) {\n    return <div>Unknown field type: {type}</div>;\n  }\n\n  // Use direct element creation to avoid TSX generic typing pitfalls\n  const RendererEl = Renderer as any;\n  return React.createElement(RendererEl, {\n    value,\n    onValueChange: onChange,\n    label,\n    options,\n    className,\n    description,\n  });\n};\n\nexport default DynamicInput;\n","import {\n  fieldRegistry as coreFieldRegistry,\n  type FieldRendererProps,\n  type FieldTypeMap,\n} from '@dynamic-field-kit/core';\nimport type { ComponentType } from 'react';\n\nexport type ReactFieldRenderer<T = any> = ComponentType<FieldRendererProps<T>>;\n\nexport interface ReactFieldRegistry {\n  register<K extends keyof FieldTypeMap>(\n    type: K,\n    renderer: ReactFieldRenderer<FieldTypeMap[K]>\n  ): void;\n  get<K extends keyof FieldTypeMap>(\n    type: K\n  ): ReactFieldRenderer<FieldTypeMap[K]> | undefined;\n}\n\nexport const fieldRegistry = coreFieldRegistry as ReactFieldRegistry;\n","import { FieldDescription, Properties } from '@dynamic-field-kit/core';\nimport DynamicInput from './DynamicInput';\n\ninterface Props {\n  fieldDescription: FieldDescription;\n  renderInfos: Properties;\n  onValueChangeField: (value: any, key: string) => void;\n}\n\nconst FieldInput = ({\n  fieldDescription,\n  renderInfos,\n  onValueChangeField,\n}: Props) => {\n  const { name, type, label, options, className, description } =\n    fieldDescription;\n\n  return (\n    <DynamicInput\n      type={type}\n      label={label}\n      value={renderInfos[name]}\n      options={options}\n      className={className}\n      description={description}\n      onChange={(v) => onValueChangeField(v, name)}\n    />\n  );\n};\n\nexport default FieldInput;\n","import { FieldDescription, Properties } from '@dynamic-field-kit/core';\r\nimport React, { useEffect, useMemo, useState } from 'react';\r\n\r\nimport { layoutRegistry } from '../layout';\r\nimport { LayoutConfig } from '../types/layout';\r\nimport FieldInput from './FieldInput';\r\n\r\ninterface Props {\r\n  fieldDescriptions: FieldDescription[];\r\n  properties?: Properties;\r\n  onChange?: (data: Properties) => void;\r\n  layout?: LayoutConfig;\r\n}\r\n\r\nfunction resolveLayout(layout?: LayoutConfig) {\r\n  if (!layout) {\r\n    return { type: 'column', config: {} };\r\n  }\r\n  if (typeof layout === 'string') {\r\n    return { type: layout, config: {} };\r\n  }\r\n  return { type: layout.type, config: layout };\r\n}\r\n\r\nconst MultiFieldInput = ({\r\n  fieldDescriptions,\r\n  properties,\r\n  onChange,\r\n  layout,\r\n}: Props) => {\r\n  const [data, setData] = useState<Properties>({});\r\n\r\n  useEffect(() => {\r\n    if (properties) {\r\n      setData(properties);\r\n    }\r\n  }, [properties]);\r\n\r\n  const visibleFields = useMemo(\r\n    () =>\r\n      fieldDescriptions.filter(\r\n        (f) => !f.appearCondition || f.appearCondition(data)\r\n      ),\r\n    [fieldDescriptions, data]\r\n  );\r\n\r\n  const { type, config } = resolveLayout(layout);\r\n\r\n  const Layout = layoutRegistry.get(type);\r\n\r\n  if (!Layout) {\r\n    throw new Error(`Unknown layout: ${type}`);\r\n  }\r\n\r\n  return (\r\n    <Layout config={config}>\r\n      {visibleFields.map((f) => (\r\n        <FieldInput\r\n          key={f.name}\r\n          fieldDescription={f}\r\n          renderInfos={data}\r\n          onValueChangeField={(value, key) => {\r\n            const next = { ...data, [key]: value };\r\n            setData(next);\r\n            onChange?.(next);\r\n          }}\r\n        />\r\n      ))}\r\n    </Layout>\r\n  );\r\n};\r\n\r\nexport default MultiFieldInput;\r\n"],"mappings":"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","names":["jsx","jsxs","jsx","useMemo","jsx","useMemo"]}

package/package.json

@@ -1,47 +1,53 @@
-{
-    "name": "@dynamic-field-kit/react",
-    "version": "1.1.1",
-    "description": "React renderer for dynamic-field-kit",
-    "license": "MIT",
-    "main": "dist/index.js",
-    "module": "dist/index.mjs",
-    "types": "dist/index.d.ts",
-    "sideEffects": [
-        "./src/index.ts",
-        "./src/layout/defaultLayouts.tsx",
-        "./src/layout/responsiveLayout.tsx",
-        "./dist/index.js",
-        "./dist/index.mjs",
-        "./dist/index.d.ts"
-    ],
-    "files": [
-        "dist"
-    ],
-    "dependencies": {
-        "@dynamic-field-kit/core": "^1.0.13"
-    },
-    "exports": {
-        ".": {
-            "types": "./dist/index.d.ts",
-            "import": "./dist/index.mjs",
-            "require": "./dist/index.js"
-        }
-    },
-    "scripts": {
-        "build": "tsup",
-        "clean": "rimraf dist",
-        "prepublishOnly": "npm run clean && npm run build",
-        "release:patch": "npm version patch && npm publish",
-        "release:minor": "npm version minor && npm publish",
-        "release:major": "npm version major && npm publish"
-    },
-    "repository": {
-        "type": "git",
-        "url": "git+https://github.com/vannt-dev/dynamic-field-kit.git"
-    },
-    "keywords": [
-        "dynamic-field",
-        "dynamic-field-kit",
-        "dynamic-field-kit/react"
-    ]
-}
+{
+  "name": "@dynamic-field-kit/react",
+  "version": "1.2.0",
+  "description": "React renderer for dynamic-field-kit",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "sideEffects": [
+    "./dist/index.js",
+    "./dist/index.mjs",
+    "./dist/index.d.ts",
+    "./src/layout/defaultLayouts.tsx",
+    "./src/layout/responsiveLayout.tsx"
+  ],
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "@dynamic-field-kit/core": "^1.1.0"
+  },
+  "dependencies": {
+    "@dynamic-field-kit/core": "^1.1.0",
+    "react": "^18.2.0"
+  },
+  "devDependencies": {
+    "tsup": "^8.0.1"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "build": "npx tsup",
+    "clean": "rimraf dist",
+    "prepublishOnly": "npm run clean && npm run build",
+    "release:patch": "npm version patch && npm publish",
+    "release:minor": "npm version minor && npm publish",
+    "release:major": "npm version major && npm publish"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vannt-dev/dynamic-field-kit.git"
+  },
+  "keywords": [
+    "dynamic-field",
+    "dynamic-field-kit",
+    "dynamic-field-kit/react"
+  ]
+}