@donotdev/crud 0.0.4 → 0.0.6

package/dist/components/form/internal/ImageViewerDialog.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,Fragment as Y,jsxs as a}from"react/jsx-runtime";import{ChevronLeft as Z,ChevronRight as q,RotateCw as J,Trash2 as K,Crop as Q,Eye as X,Save as ee,Undo2 as te}from"lucide-react";import{useCallback as O,useEffect as ae,useState as c}from"react";import ie from"react-easy-crop";import{Button as l,BUTTON_VARIANT as s,Dialog as oe,Stack as r,Text as T,Input as V,Label as f,Slider as F,Tabs as re}from"@donotdev/components";import{processImage as ne}from"../../../utils/imageProcessing";import{createPreviewURL as le,revokePreviewURL as se}from"../../../utils/imageUtils";function ce({images:n,selectedIndex:i,open:N,onClose:C,onUpdate:A,onDelete:U,onNavigate:p,multiple:d=!1}){const[R,m]=c("view"),[j,x]=c({x:0,y:0}),[P,b]=c(1),[u,h]=c(0),[k,z]=c(null),[L,$]=c(!1),[w,S]=c({alt:"",caption:""}),[B,v]=c(!1),o=n[i],H=d&&i>0,W=d&&i<n.length-1;ae(()=>{o&&(x({x:0,y:0}),b(1),h(o.rotation*90),S({alt:"",caption:""}),m("view"),v(!1))},[o]);const D=(t,g)=>{S(y=>({...y,[t]:g}))},G=O((t,g)=>{z(g)},[]),M=async()=>{if(!(!o||!k)){$(!0);try{const t=await ne(o.file,{crop:k,maxWidth:2048,maxHeight:2048,quality:.95}),g=new File([t.fullBlob],o.file.name,{type:"image/webp"}),y=le(g);A(i,{file:g,previewURL:y,uploaded:null,uploadProgress:null,error:null,rotation:0}),o.previewURL.startsWith("blob:")&&se(o.previewURL),m("view")}catch{}finally{$(!1)}}},_=O(()=>{U(i),v(!1),n.length===1?C():i>=n.length-1&&p(i-1)},[i,n.length,U,C,p]);if(!o)return null;const E=o.uploadProgress!==null&&o.uploadProgress<100,I=o.previewURL||o.uploaded?.fullUrl;return e(oe,{open:N,onOpenChange:t=>!t&&C(),title:d?`Image ${i+1} of ${n.length}`:"Image Details",description:d?`View, edit, and manage image ${i+1} of ${n.length}. Use the tabs to view metadata or edit the image with crop and rotation tools.`:"View, edit, and manage this image. Use the tabs to view metadata or edit the image with crop and rotation tools.",showClose:!0,children:a("div",{style:{display:"grid",gridTemplateColumns:"1fr 300px",gap:"var(--gap-lg)",height:"60vh",minHeight:"500px"},children:[e("div",{style:{position:"relative",backgroundColor:"var(--surface-muted)",borderRadius:"var(--radius-lg)",overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center"},children:R==="edit"?e("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0},children:e(ie,{image:I,crop:j,zoom:P,rotation:u,onCropChange:x,onCropComplete:G,onZoomChange:b,onRotationChange:h})}):a(Y,{children:[H&&e(l,{variant:s.GHOST,icon:Z,onClick:()=>p(i-1),"aria-label":"Previous image",style:{position:"absolute",left:"var(--gap-sm)",zIndex:10,backgroundColor:"rgba(0,0,0,0.3)",color:"white",border:"none"}}),e("img",{src:I,alt:w.alt||o.file.name||`Image ${i+1}${d?` of ${n.length}`:""}`,loading:"eager",decoding:"async",fetchPriority:"high",style:{maxWidth:"100%",maxHeight:"100%",objectFit:"contain",transform:`rotate(${u}deg)`},"aria-label":`Image ${i+1}${d?` of ${n.length}`:""}`}),W&&e(l,{variant:s.GHOST,icon:q,onClick:()=>p(i+1),"aria-label":"Next image",style:{position:"absolute",right:"var(--gap-sm)",zIndex:10,backgroundColor:"rgba(0,0,0,0.3)",color:"white",border:"none"}})]})}),e(r,{gap:"large",style:{overflowY:"auto",height:"100%"},children:e(re,{value:R,onValueChange:t=>m(t),items:[{value:"view",label:a(r,{direction:"row",align:"center",gap:"tight",children:[e(X,{className:"dndev-size-sm"}),e(T,{children:"View"})]}),content:a(r,{gap:"medium",style:{paddingTop:"var(--gap-md)"},children:[a(r,{gap:"tight",children:[e(f,{htmlFor:"img-alt",children:"Alt Text (Accessibility)"}),e(V,{id:"img-alt",value:w.alt,onChange:t=>D("alt",t.target.value),placeholder:"Describe the image..."})]}),a(r,{gap:"tight",children:[e(f,{htmlFor:"img-caption",children:"Caption"}),e(V,{id:"img-caption",value:w.caption,onChange:t=>D("caption",t.target.value),placeholder:"Image caption or credits"})]}),e("div",{style:{marginTop:"auto",paddingTop:"var(--gap-lg)"},children:B?a(r,{gap:"medium",style:{border:"1px solid var(--destructive)",padding:"var(--gap-md)",borderRadius:"var(--radius-md)"},children:[e(T,{variant:"destructive",level:"small",children:"Permanently delete this image?"}),a(r,{direction:"row",gap:"tight",children:[e(l,{variant:s.DESTRUCTIVE,onClick:_,fullWidth:!0,children:"Yes, Delete"}),e(l,{variant:s.OUTLINE,onClick:()=>v(!1),fullWidth:!0,children:"Cancel"})]})]}):e(l,{variant:s.OUTLINE,className:"text-destructive hover:bg-destructive/10",icon:K,onClick:()=>v(!0),fullWidth:!0,disabled:E,children:"Delete Image"})})]})},{value:"edit",label:a(r,{direction:"row",align:"center",gap:"tight",children:[e(Q,{className:"dndev-size-sm"}),e(T,{children:"Edit"})]}),disabled:E,content:a(r,{gap:"medium",style:{paddingTop:"var(--gap-md)"},children:[a(r,{gap:"tight",children:[e(f,{children:"Zoom"}),e(F,{value:[P],min:1,max:3,step:.1,onValueChange:t=>b(t[0]??1)})]}),a(r,{gap:"tight",children:[a(f,{children:["Rotation (",u,"\xB0)"]}),a(r,{direction:"row",gap:"tight",children:[e(l,{variant:s.OUTLINE,onClick:()=>h(t=>t-90),icon:te,title:"-90\xB0"}),e(F,{value:[u],min:0,max:360,step:90,onValueChange:t=>h(t[0]??0),style:{flex:1}}),e(l,{variant:s.OUTLINE,onClick:()=>h(t=>t+90),icon:J,title:"+90\xB0"})]})]}),a(r,{gap:"medium",style:{marginTop:"var(--gap-xl)"},children:[e(l,{variant:s.PRIMARY,onClick:M,disabled:L,icon:ee,children:L?"Processing...":"Save Changes"}),e(l,{variant:s.GHOST,onClick:()=>m("view"),children:"Cancel"})]})]})}]})})]})})}var fe=ce;export{ce as ImageViewerDialog,fe as default};

package/dist/components/index.d.ts

@@ -10,6 +10,8 @@ export { default as CrudButton } from './CrudButton';
 export type { CrudButtonProps } from './CrudButton';
 export { EntityFormRenderer } from './EntityFormRenderer';
 export { FormFieldRenderer } from './FormFieldRenderer';
+export { DisplayFieldRenderer } from './DisplayFieldRenderer';
+export type { DisplayFieldRendererProps } from './DisplayFieldRenderer';
 export { default as FormLayout } from './FormLayout';
 export * from './ControlledFields';
 export * from './form/fields';

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC"}

package/dist/components/index.js

@@ -1 +1 @@
-import{default as e}from"./CrudButton";import{EntityFormRenderer as m}from"./EntityFormRenderer";import{FormFieldRenderer as d}from"./FormFieldRenderer";import{default as x}from"./FormLayout";export*from"./ControlledFields";export*from"./form/fields";export{e as CrudButton,m as EntityFormRenderer,d as FormFieldRenderer,x as FormLayout};
+import{default as o}from"./CrudButton";import{EntityFormRenderer as m}from"./EntityFormRenderer";import{FormFieldRenderer as d}from"./FormFieldRenderer";import{DisplayFieldRenderer as x}from"./DisplayFieldRenderer";import{default as l}from"./FormLayout";export*from"./ControlledFields";export*from"./form/fields";export{o as CrudButton,x as DisplayFieldRenderer,m as EntityFormRenderer,d as FormFieldRenderer,l as FormLayout};

package/dist/context/FormUploadContext.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @fileoverview Form Upload Context
+ * @description Context for coordinating deferred uploads (images, files) before form submit.
+ * Components register their upload functions, EntityFormRenderer calls them before validation.
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+import { type ReactNode } from 'react';
+type UploadFunction = () => Promise<void>;
+interface FormUploadContextValue {
+    /** Register an upload function for a field */
+    registerUpload: (fieldName: string, uploadFn: UploadFunction) => void;
+    /** Unregister upload function when field unmounts */
+    unregisterUpload: (fieldName: string) => void;
+    /** Call all registered upload functions (before form submit) */
+    uploadAll: () => Promise<void>;
+    /** Check if any uploads are pending */
+    hasPendingUploads: () => boolean;
+}
+/**
+ * Hook to access form upload context
+ * Returns null if not within FormUploadProvider (for standalone usage)
+ */
+export declare function useFormUpload(): FormUploadContextValue | null;
+interface FormUploadProviderProps {
+    children: ReactNode;
+}
+/**
+ * Provider for form upload coordination
+ * Wrap forms that contain deferred upload fields (images, files)
+ */
+export declare function FormUploadProvider({ children }: FormUploadProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FormUploadContext.d.ts.map

package/dist/context/FormUploadContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormUploadContext.d.ts","sourceRoot":"","sources":["../../src/context/FormUploadContext.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,KAAK,cAAc,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;AAE1C,UAAU,sBAAsB;IAC9B,8CAA8C;IAC9C,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,cAAc,KAAK,IAAI,CAAC;IACtE,qDAAqD;IACrD,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,gEAAgE;IAChE,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,uCAAuC;IACvC,iBAAiB,EAAE,MAAM,OAAO,CAAC;CAClC;AAID;;;GAGG;AACH,wBAAgB,aAAa,IAAI,sBAAsB,GAAG,IAAI,CAE7D;AAED,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,EAAE,uBAAuB,2CAiCvE"}

package/dist/context/FormUploadContext.js

@@ -0,0 +1 @@
+"use client";import{jsx as i}from"react/jsx-runtime";import{createContext as p,useContext as d,useCallback as t,useRef as m}from"react";const n=p(null);function U(){return d(n)}function g({children:s}){const r=m(new Map),a=t((e,o)=>{r.current.set(e,o)},[]),l=t(e=>{r.current.delete(e)},[]),u=t(async()=>{const e=Array.from(r.current.values());e.length!==0&&await Promise.all(e.map(o=>o()))},[]),c=t(()=>r.current.size>0,[]);return i(n.Provider,{value:{registerUpload:a,unregisterUpload:l,uploadAll:u,hasPendingUploads:c},children:s})}export{g as FormUploadProvider,U as useFormUpload};

package/dist/context/index.d.ts

@@ -0,0 +1,2 @@
+export { FormUploadProvider, useFormUpload } from './FormUploadContext';
+//# sourceMappingURL=index.d.ts.map

package/dist/context/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/context/index.js

@@ -0,0 +1 @@
+import{FormUploadProvider as d,useFormUpload as e}from"./FormUploadContext";export{d as FormUploadProvider,e as useFormUpload};

package/dist/forms/hooks/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @fileoverview Form hooks barrel export
+ * @description Exports all form hooks for custom form building.
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export { useEntityForm } from './useEntityForm';
+export { useEntityField } from './useEntityField';
+//# sourceMappingURL=index.d.ts.map

package/dist/forms/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/hooks/index.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/forms/hooks/index.js

@@ -0,0 +1 @@
+import{useEntityForm as o}from"./useEntityForm";import{useEntityField as i}from"./useEntityField";export{i as useEntityField,o as useEntityForm};

package/dist/forms/hooks/useEntityField.d.ts

@@ -0,0 +1,67 @@
+import type { Entity } from '@donotdev/core';
+import type { EntityFormReturn, InferEntityData, EntityFieldReturn } from '../types';
+/**
+ * Granular hook for single field control within an entity form.
+ *
+ * Useful when you need fine-grained control over field rendering,
+ * such as custom components, conditional logic, or complex layouts.
+ *
+ * @template E - Entity type from defineEntity()
+ * @template K - Field key from entity
+ * @param form - Form instance from useEntityForm
+ * @param fieldName - Name of the field to control
+ * @returns Field state, config, and editability information
+ *
+ * @example
+ * ```tsx
+ * import { useEntityForm, useEntityField } from '@donotdev/crud/forms';
+ *
+ * function CustomEmailField({ form }) {
+ *   const { field, meta, config, isEditable } = useEntityField(form, 'email');
+ *
+ *   if (!isEditable) {
+ *     return <span>{field.value}</span>;
+ *   }
+ *
+ *   return (
+ *     <div>
+ *       <label>{config.label}</label>
+ *       <input
+ *         type="email"
+ *         value={field.value ?? ''}
+ *         onChange={field.onChange}
+ *         onBlur={field.onBlur}
+ *       />
+ *       {meta.error && <span className="error">{meta.error}</span>}
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With conditional rendering
+ * function ConditionalField({ form }) {
+ *   const typeField = useEntityField(form, 'type');
+ *   const lengthField = useEntityField(form, 'truckBedLength');
+ *
+ *   return (
+ *     <>
+ *       <Select {...typeField.field} options={typeField.config.validation?.options} />
+ *       {typeField.field.value === 'truck' && lengthField.isVisible && (
+ *         <Input {...lengthField.field} label={lengthField.config.label} />
+ *       )}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link useEntityForm} for creating the form instance
+ * @see {@link EntityFieldReturn} for return type
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export declare function useEntityField<E extends Entity, K extends keyof InferEntityData<E>>(form: EntityFormReturn<E>, fieldName: K): EntityFieldReturn<E, K>;
+//# sourceMappingURL=useEntityField.d.ts.map

package/dist/forms/hooks/useEntityField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEntityField.d.ts","sourceRoot":"","sources":["../../../src/forms/hooks/useEntityField.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,MAAM,EAA4B,MAAM,gBAAgB,CAAC;AAGvE,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EACf,iBAAiB,EAClB,MAAM,UAAU,CAAC;AAElB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8DG;AACH,wBAAgB,cAAc,CAC5B,CAAC,SAAS,MAAM,EAChB,CAAC,SAAS,MAAM,eAAe,CAAC,CAAC,CAAC,EAClC,IAAI,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,GAAG,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAqElE"}

package/dist/forms/hooks/useEntityField.js

@@ -0,0 +1 @@
+"use client";import{useMemo as r}from"react";import{useController as m}from"react-hook-form";import{normalizeToFieldConfig as p,isFieldEditable as g}from"../utils";function E(l,e){const{entity:d,operation:o,viewerRole:c,fields:u}=l,s=d.fields[e],i=r(()=>s?p(e,s):{name:e,type:"text",label:e,required:!1},[e,s]),n=r(()=>u.some(y=>y.name===e),[u,e]),a=r(()=>!n||o==="edit"&&i.visibility==="technical"&&i.editable===void 0?!1:g(i.editable,c,o),[n,o,i.visibility,i.editable,c]),{field:f,fieldState:t}=m({name:e,control:l.control}),b=r(()=>({error:t.error?.message,touched:t.isTouched,isDirty:t.isDirty}),[t.error?.message,t.isTouched,t.isDirty]);return{field:f,meta:b,config:i,isEditable:a,isVisible:n}}export{E as useEntityField};

package/dist/forms/hooks/useEntityForm.d.ts

@@ -0,0 +1,89 @@
+import type { Entity } from '@donotdev/core';
+import type { UseEntityFormOptions, EntityFormReturn } from '../types';
+/**
+ * Creates a type-safe form instance from an entity definition.
+ *
+ * Automatically configures React Hook Form with:
+ * - Pre-filtered fields based on operation and visibility
+ * - Editability computed per-field based on viewer role
+ * - Type-safe form values inferred from entity
+ *
+ * @template E - Entity type from defineEntity()
+ * @param entity - Entity definition from defineEntity()
+ * @param options - Form configuration options
+ * @returns Form instance with React Hook Form API plus entity-aware extensions
+ *
+ * @example
+ * ```tsx
+ * import { useEntityForm } from '@donotdev/crud/forms';
+ * import { productEntity } from './entities/product';
+ *
+ * function ProductForm({ existingProduct, onSuccess }) {
+ *   const form = useEntityForm(productEntity, {
+ *     operation: existingProduct ? 'edit' : 'create',
+ *     defaultValues: existingProduct,
+ *     viewerRole: 'admin'
+ *   });
+ *
+ *   const onSubmit = async (data) => {
+ *     await saveProduct(data);
+ *     onSuccess();
+ *   };
+ *
+ *   return (
+ *     <form onSubmit={form.handleSubmit(onSubmit)}>
+ *       {form.fields.map(({ name, config, editable }) => (
+ *         editable ? (
+ *           <input
+ *             key={name}
+ *             {...form.register(name)}
+ *             placeholder={config.label}
+ *           />
+ *         ) : (
+ *           <span key={name}>{form.getValues(name)}</span>
+ *         )
+ *       ))}
+ *       <button type="submit" disabled={form.formState.isSubmitting}>
+ *         {form.operation === 'create' ? 'Create' : 'Update'}
+ *       </button>
+ *     </form>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With custom UI components
+ * import { useEntityForm } from '@donotdev/crud/forms';
+ * import { Input, Select, DatePicker } from './ui';
+ *
+ * function CustomForm() {
+ *   const form = useEntityForm(orderEntity, { operation: 'create' });
+ *
+ *   // Custom 2-column layout
+ *   return (
+ *     <form onSubmit={form.handleSubmit(onSubmit)}>
+ *       <div className="grid grid-cols-2 gap-4">
+ *         <Input label="Customer" {...form.register('customer')} />
+ *         <DatePicker label="Date" {...form.register('orderDate')} />
+ *       </div>
+ *       <Select
+ *         label="Status"
+ *         options={form.fields.find(f => f.name === 'status')?.config.validation?.options}
+ *         {...form.register('status')}
+ *       />
+ *     </form>
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link Entity} for entity definition structure
+ * @see {@link EntityFormReturn} for return type
+ * @see {@link getFieldsForOperation} for field filtering logic
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export declare function useEntityForm<E extends Entity>(entity: E, options?: UseEntityFormOptions<E>): EntityFormReturn<E>;
+//# sourceMappingURL=useEntityForm.d.ts.map

package/dist/forms/hooks/useEntityForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEntityForm.d.ts","sourceRoot":"","sources":["../../../src/forms/hooks/useEntityForm.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAM7C,OAAO,KAAK,EACV,oBAAoB,EACpB,gBAAgB,EAEjB,MAAM,UAAU,CAAC;AAElB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,MAAM,EAC5C,MAAM,EAAE,CAAC,EACT,OAAO,GAAE,oBAAoB,CAAC,CAAC,CAAM,GACpC,gBAAgB,CAAC,CAAC,CAAC,CA4LrB"}

package/dist/forms/hooks/useEntityForm.js

@@ -0,0 +1 @@
+"use client";import{useMemo as o,useEffect as g,useRef as h}from"react";import{useForm as k}from"react-hook-form";import{useLocalStorage as x}from"@donotdev/core";import{useAuth as H}from"@donotdev/auth";import{valibotResolver as w}from"@hookform/resolvers/valibot";import{createEntitySchema as y,getFieldsForOperation as K}from"../utils";function U(t,E={}){let v;try{v=H("userRole")}catch{}const{operation:L,defaultValues:r,viewerRole:m=v||"admin",mode:O="onSubmit",t:j,autoSave:s=!1}=E,e=L??(r?"edit":"create"),S=o(()=>y(t,"create"),[t]),R=o(()=>y(t,"draft"),[t]),T=o(()=>w(S),[S]),V=o(()=>w(R),[R]),A=o(()=>async(a,n,i)=>(a?.status==="draft"||r?.status==="draft"?V:T)(a,n,i),[T,V,r]),u=k({defaultValues:r,mode:O,resolver:A}),C=o(()=>`${t.name.toLowerCase()}-form-draft`,[t.name]),{value:d,setValue:D,removeValue:F}=x(C,{defaultValue:null,syncAcrossTabs:!0}),f=h(!1);g(()=>{!s||e!=="create"||r||f.current||(d&&u.reset(d),f.current=!0)},[s,e,r,d,u]);const p=h(!1),l=h(null);g(()=>{if(!s||e!=="create")return;const a=u.watch(n=>{p.current||!f.current||(l.current&&clearTimeout(l.current),l.current=setTimeout(()=>{Object.values(n).some(c=>c!=null&&c!=="")&&D(n)},3e3))});return()=>{a.unsubscribe(),l.current&&clearTimeout(l.current)}},[s,e,u,D]);const b=u.handleSubmit,M=o(()=>!s||e!=="create"?b:((a,n)=>b(async(i,c)=>{p.current=!0;try{await a(i,c),F()}finally{p.current=!1}},n)),[b,s,e,F]),P=o(()=>K(t,{operation:e,viewerRole:m,availableFields:e==="edit"&&r?Object.keys(r):void 0}),[t,e,m,r]);return{...u,handleSubmit:M,fields:P,operation:e,entity:t,t:j??(a=>a),viewerRole:m}}export{U as useEntityForm};

package/dist/forms/index.d.ts

@@ -0,0 +1,37 @@
+/**
+ * @fileoverview Form building blocks for custom forms
+ * @description Exposes low-level form utilities from @donotdev/crud for building custom forms.
+ *
+ * Import from '@donotdev/crud/forms' to access form building blocks:
+ * - Hooks: useEntityForm, useEntityField
+ * - Utilities: getFieldsForOperation, createEntitySchema, validateEntity
+ * - Types: InferEntityData, EntityFormReturn, etc.
+ *
+ * @example
+ * ```tsx
+ * import { useEntityForm, getFieldsForOperation } from '@donotdev/crud/forms';
+ * import { productEntity } from './entities/product';
+ *
+ * function ProductForm() {
+ *   const form = useEntityForm(productEntity, { operation: 'create' });
+ *
+ *   return (
+ *     <form onSubmit={form.handleSubmit(onSubmit)}>
+ *       {form.fields.map(({ name, config, editable }) => (
+ *         <Input key={name} label={config.label} {...form.register(name)} />
+ *       ))}
+ *     </form>
+ *   );
+ * }
+ * ```
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export { useEntityForm } from './hooks/useEntityForm';
+export { useEntityField } from './hooks/useEntityField';
+export { isFieldEditable, normalizeToFieldConfig, getFieldsForOperation, createEntitySchema, validateEntity, } from './utils';
+export type { ViewerRole, RenderableField, GetFieldsForOperationOptions, EntityFieldsInput, SchemaOperation, ValidationIssue, ValidationResult, } from './utils';
+export type { InferEntityData, InferEntityInput, InferEntityOutput, UseEntityFormOptions, EntityFormReturn, EntityFieldReturn, Entity, EntityField, FieldConfig, FieldType, Visibility, Editable, ValidationRules, dndevSchema, } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/forms/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAGH,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxD,OAAO,EACL,eAAe,EACf,sBAAsB,EACtB,qBAAqB,EACrB,kBAAkB,EAClB,cAAc,GACf,MAAM,SAAS,CAAC;AAGjB,YAAY,EAEV,UAAU,EACV,eAAe,EACf,4BAA4B,EAC5B,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,gBAAgB,GACjB,MAAM,SAAS,CAAC;AAEjB,YAAY,EAEV,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,oBAAoB,EACpB,gBAAgB,EAChB,iBAAiB,EAEjB,MAAM,EACN,WAAW,EACX,WAAW,EACX,SAAS,EACT,UAAU,EACV,QAAQ,EACR,eAAe,EACf,WAAW,GACZ,MAAM,SAAS,CAAC"}

package/dist/forms/index.js

@@ -0,0 +1 @@
+import{useEntityForm as i}from"./hooks/useEntityForm";import{useEntityField as r}from"./hooks/useEntityField";import{isFieldEditable as l,normalizeToFieldConfig as n,getFieldsForOperation as d,createEntitySchema as m,validateEntity as F}from"./utils";export{m as createEntitySchema,d as getFieldsForOperation,l as isFieldEditable,n as normalizeToFieldConfig,r as useEntityField,i as useEntityForm,F as validateEntity};

package/dist/forms/types.d.ts

@@ -0,0 +1,185 @@
+/**
+ * @fileoverview Form type exports
+ * @description Type utilities for type-safe form building with entity definitions.
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+import type { UseFormReturn, ControllerRenderProps, FieldPath } from 'react-hook-form';
+import type { Entity, EntityField, FieldConfig, FieldType, FieldTypeToValue, Visibility, Editable, ValidationRules, dndevSchema } from '@donotdev/core';
+import type { RenderableField, ViewerRole } from './utils';
+export type { Entity, EntityField, FieldConfig, FieldType, Visibility, Editable, ValidationRules, dndevSchema, RenderableField, ViewerRole, };
+/**
+ * Infers the data type from an entity definition.
+ *
+ * Maps each field in the entity to its corresponding TypeScript type
+ * based on the field's `type` property.
+ *
+ * @template E - Entity type from defineEntity()
+ *
+ * @example
+ * ```typescript
+ * const productEntity = defineEntity({
+ *   name: 'Product',
+ *   collection: 'products',
+ *   fields: {
+ *     name: { type: 'text', visibility: 'guest' },
+ *     price: { type: 'number', visibility: 'guest' },
+ *     active: { type: 'boolean', visibility: 'user' }
+ *   }
+ * });
+ *
+ * type ProductData = InferEntityData<typeof productEntity>;
+ * // { name: string; price: number; active: boolean; id: string; ... }
+ * ```
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export type InferEntityData<E extends Entity> = {
+    [K in keyof E['fields']]: E['fields'][K] extends {
+        type: infer T;
+    } ? T extends FieldType ? FieldTypeToValue[T] : unknown : unknown;
+};
+/**
+ * Infers form input type (values before validation).
+ * All fields are optional/partial since form may be incomplete.
+ *
+ * @template E - Entity type from defineEntity()
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export type InferEntityInput<E extends Entity> = Partial<InferEntityData<E>>;
+/**
+ * Infers form output type (values after validation).
+ * Represents validated, complete data ready for submission.
+ *
+ * @template E - Entity type from defineEntity()
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export type InferEntityOutput<E extends Entity> = InferEntityData<E>;
+/**
+ * Options for useEntityForm hook.
+ *
+ * @template E - Entity type from defineEntity()
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export interface UseEntityFormOptions<E extends Entity> {
+    /**
+     * Form operation type.
+     * - 'create': Excludes technical fields, all other fields editable
+     * - 'edit': Shows all fields from defaultValues, technical fields read-only
+     * @default 'create' (or 'edit' if defaultValues provided)
+     */
+    operation?: 'create' | 'edit';
+    /**
+     * Initial form values.
+     * For edit mode, should come from backend (already visibility-filtered).
+     */
+    defaultValues?: Partial<InferEntityData<E>>;
+    /**
+     * Viewer role for editability checks.
+     * Determines which fields render as inputs vs read-only.
+     * @default 'admin'
+     */
+    viewerRole?: ViewerRole;
+    /**
+     * React Hook Form mode.
+     * @default 'onSubmit'
+     */
+    mode?: 'onBlur' | 'onChange' | 'onSubmit' | 'onTouched' | 'all';
+    /**
+     * Translation function for field labels.
+     * If not provided, uses entity labels or generates from field names.
+     */
+    t?: (key: string, options?: Record<string, unknown>) => string;
+    /**
+     * Enable auto-save to localStorage for crash recovery.
+     * Saves form state every 3 seconds (debounced) with multi-tab sync.
+     * Auto-generates key: `<entity-name>-form-draft`
+     * Auto-cleans up on successful submit.
+     * @default false
+     */
+    autoSave?: boolean;
+}
+/**
+ * Return type for useEntityForm hook.
+ *
+ * Extends React Hook Form's UseFormReturn with entity-aware additions.
+ *
+ * @template E - Entity type from defineEntity()
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export interface EntityFormReturn<E extends Entity> extends UseFormReturn<InferEntityData<E>> {
+    /**
+     * Pre-filtered fields ready for rendering.
+     * Already filtered by operation and visibility.
+     */
+    fields: RenderableField[];
+    /**
+     * Current operation type.
+     */
+    operation: 'create' | 'edit';
+    /**
+     * Original entity definition.
+     */
+    entity: E;
+    /**
+     * Translation function for labels.
+     */
+    t: (key: string, options?: Record<string, unknown>) => string;
+    /**
+     * Current viewer role.
+     */
+    viewerRole: ViewerRole;
+}
+/**
+ * Return type for useEntityField hook.
+ *
+ * @template E - Entity type from defineEntity()
+ * @template K - Field key from entity
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export interface EntityFieldReturn<E extends Entity, K extends keyof InferEntityData<E>> {
+    /**
+     * React Hook Form field props (value, onChange, onBlur, etc.)
+     */
+    field: ControllerRenderProps<InferEntityData<E>, FieldPath<InferEntityData<E>>>;
+    /**
+     * Field metadata (error, touched, dirty state).
+     */
+    meta: {
+        error: string | undefined;
+        touched: boolean;
+        isDirty: boolean;
+    };
+    /**
+     * Normalized field configuration.
+     */
+    config: FieldConfig;
+    /**
+     * Whether field is editable (based on role, operation, config).
+     */
+    isEditable: boolean;
+    /**
+     * Whether field is visible (based on filtering).
+     */
+    isVisible: boolean;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/forms/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/forms/types.ts"],"names":[],"mappings":"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"}

package/dist/forms/utils/createEntitySchema.d.ts

@@ -0,0 +1,53 @@
+import type { Entity, dndevSchema } from '@donotdev/core';
+/**
+ * Schema operation type
+ * - 'create': Makes technical fields optional (backend creates them automatically)
+ * - 'update': Makes all fields optional except id (for partial updates). Technical fields can be updated if provided.
+ * - 'full': Includes all fields as-is
+ * - 'draft': Like create, but all required fields become optional (for saving drafts)
+ */
+export type SchemaOperation = 'create' | 'update' | 'full' | 'draft';
+/**
+ * Creates a Valibot schema from an entity definition.
+ *
+ * Handles visibility and operation type to generate appropriate schemas:
+ * - 'create': Makes technical fields optional (backend creates them automatically: id, timestamps, status)
+ * - 'update': Makes all fields optional except id. Technical fields can be updated if provided.
+ * - 'full': Includes all fields as-is
+ * - 'draft': Like create, but all required fields become optional (for saving drafts)
+ *
+ * @param entity - Entity definition from defineEntity()
+ * @param operation - Schema operation type
+ * @returns Valibot schema with dndev metadata
+ *
+ * @example
+ * ```typescript
+ * import { createEntitySchema } from '@donotdev/crud/forms';
+ * import { productEntity } from './entities/product';
+ *
+ * // For create form validation (full required validation)
+ * const createSchema = createEntitySchema(productEntity, 'create');
+ *
+ * // For draft saves (all required fields optional)
+ * const draftSchema = createEntitySchema(productEntity, 'draft');
+ *
+ * // For update form validation
+ * const updateSchema = createEntitySchema(productEntity, 'update');
+ *
+ * // Use with React Hook Form
+ * import { valibotResolver } from '@hookform/resolvers/valibot';
+ *
+ * const form = useForm({
+ *   resolver: valibotResolver(createSchema)
+ * });
+ * ```
+ *
+ * @see {@link Entity} for entity definition structure
+ * @see {@link SchemaOperation} for operation types
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+export declare function createEntitySchema<E extends Entity>(entity: E, operation?: SchemaOperation): dndevSchema<Record<string, unknown>>;
+//# sourceMappingURL=createEntitySchema.d.ts.map

package/dist/forms/utils/createEntitySchema.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createEntitySchema.d.ts","sourceRoot":"","sources":["../../../src/forms/utils/createEntitySchema.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,MAAM,EAAe,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAyIvE;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAErE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,MAAM,EACjD,MAAM,EAAE,CAAC,EACT,SAAS,GAAE,eAA0B,GACpC,WAAW,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAkDtC"}

package/dist/forms/utils/createEntitySchema.js

@@ -0,0 +1 @@
+import*as e from"valibot";import{TECHNICAL_FIELD_NAMES as m}from"@donotdev/core";function f(n,t={}){const{type:l,validation:a}=n,{isDraft:s=!1}=t;let i;switch(l){case"number":case"range":i=e.number(),a?.min!==void 0&&(i=e.pipe(i,e.minValue(a.min))),a?.max!==void 0&&(i=e.pipe(i,e.maxValue(a.max)));break;case"boolean":case"checkbox":i=e.boolean();break;case"email":i=e.pipe(e.string(),e.email());break;case"url":i=e.pipe(e.string(),e.url());break;case"multiselect":case"array":i=e.array(e.string());break;case"select":case"radio":if(a?.options&&Array.isArray(a.options)){const c=a.options.map(o=>o.value);i=e.picklist(c)}else i=e.string();break;case"date":case"datetime-local":case"time":case"month":case"week":case"timestamp":i=e.string();break;case"image":i=e.object({fullUrl:e.string(),thumbUrl:e.optional(e.string())});break;case"images":i=e.array(e.object({fullUrl:e.string(),thumbUrl:e.optional(e.string())}));break;default:i=e.string(),a?.minLength!==void 0&&(i=e.pipe(i,e.minLength(a.minLength))),a?.maxLength!==void 0&&(i=e.pipe(i,e.maxLength(a.maxLength))),a?.pattern&&(i=e.pipe(i,e.regex(new RegExp(a.pattern))));break}return(!a?.required||s)&&(i=e.optional(i)),i}function d(n,t="create"){const l=t==="draft",a={};for(const[i,c]of Object.entries(n.fields)){if(c.visibility==="hidden")continue;const o=m.includes(i);let r=f(c,{isDraft:l});(t==="create"||t==="draft")&&o&&(r=e.optional(r)),t==="update"&&i!=="id"&&(r=e.optional(r)),a[i]=r}t==="update"&&(a.id=e.pipe(e.string(),e.minLength(1,"ID is required")));const s=e.object(a);return s.metadata={collection:n.collection,entity:n.name},s}export{d as createEntitySchema};