devject-design 0.1.1 → 0.2.1

package/dist/ui/state/dragState.d.ts

@@ -1,15 +1,19 @@
 import { DragItem, DropTarget } from './types';
+declare function begin(item: DragItem, ev: PointerEvent): void;
+declare function move(ev: PointerEvent): void;
+declare function setHover(target: DropTarget | null): void;
+declare function end(): void;
 export declare function useDragState(): {
     dragging: import('vue').Ref<{
         kind: "palette";
-        nodeType: import('./types').NodeType;
+        nodeType: string;
         preset?: Record<string, unknown> | undefined;
     } | {
         kind: "node";
         nodeId: string;
     } | null, DragItem | {
         kind: "palette";
-        nodeType: import('./types').NodeType;
+        nodeType: string;
         preset?: Record<string, unknown> | undefined;
     } | {
         kind: "node";
@@ -57,8 +61,9 @@ export declare function useDragState(): {
         y: number;
     };
     isDragging: import('vue').ComputedRef<boolean>;
-    begin: (item: DragItem, ev: PointerEvent) => void;
-    move: (ev: PointerEvent) => void;
-    setHover: (target: DropTarget | null) => void;
-    end: () => void;
+    begin: typeof begin;
+    move: typeof move;
+    setHover: typeof setHover;
+    end: typeof end;
 };
+export {};

package/dist/ui/state/injectionKeys.d.ts

@@ -0,0 +1,4 @@
+import { InjectionKey, Ref } from 'vue';
+export declare const UPLOAD_URL_KEY: InjectionKey<Ref<string | undefined>>;
+export declare const DOWNLOAD_URL_KEY: InjectionKey<Ref<string | undefined>>;
+export declare const UPLOAD_PARSE_KEY: InjectionKey<Ref<string | undefined>>;

package/dist/ui/state/schemaOps.d.ts

@@ -1,6 +1,5 @@
-import { DropTarget, LayoutSchema, NodeMeta, NodeType, SchemaNode } from './types';
+import { DropTarget, LayoutSchema, NodeType, SchemaNode } from './types';
 export declare function createEmptySchema(): LayoutSchema;
-export declare function createNodeMeta(): NodeMeta;
 export declare function deepClone<T>(value: T): T;
 export declare function createNode(nodeType: NodeType): SchemaNode;
 export type NodeLocation = {
@@ -30,7 +29,6 @@ export declare function removeNode(schema: LayoutSchema, nodeId: string): Schema
 export declare function insertNode(schema: LayoutSchema, target: DropTarget, node: SchemaNode): void;
 export declare function moveNode(schema: LayoutSchema, nodeId: string, target: DropTarget): void;
 export declare function getListByDropTarget(schema: LayoutSchema, target: DropTarget): SchemaNode[];
-export declare function canDrop(schema: LayoutSchema, dragKind: "palette" | "node", nodeType: NodeType, target: DropTarget): boolean;
 export declare function normalizeSchema(input: unknown): LayoutSchema;
 export type ExportLayoutSchema = LayoutSchema;
 export declare function exportLayout(schema: LayoutSchema): ExportLayoutSchema;

package/dist/ui/state/types.d.ts

@@ -1,13 +1,8 @@
-export type NodeType = "flexRow" | "collapse" | "tabs" | "input" | "textarea" | "select" | "radio" | "checkbox" | "image-upload" | "file-upload" | "table" | "switch" | "title";
+export type NodeType = string;
 export type DeviceMode = "pc" | "mobile";
-export type NodeMeta = {
-    createdAt: string;
-    updatedAt: string;
-    style: Record<string, unknown>;
-};
 export type DragItem = {
     kind: "palette";
-    nodeType: NodeType;
+    nodeType: string;
     preset?: Record<string, unknown>;
 } | {
     kind: "node";
@@ -32,80 +27,6 @@ export type DropTarget = {
     tabId: string;
     insertIndex: number;
 };
-export type FieldNode = {
-    id: string;
-    type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
-    meta: NodeMeta;
-    props: {
-        label: string;
-        field: string;
-        placeholder?: string;
-        required?: boolean;
-        options?: Array<{
-            label: string;
-            value: string;
-        }>;
-        multiple?: boolean;
-        inputType?: "text" | "number" | "date" | "time" | "datetime";
-        accept?: string;
-        limit?: number;
-        activeText?: string;
-        inactiveText?: string;
-        activeValue?: any;
-        inactiveValue?: any;
-    };
-};
-export type TitleNode = {
-    id: string;
-    type: "title";
-    meta: NodeMeta;
-    props: {
-        label: string;
-        fontSize?: number;
-        bold?: boolean;
-        align?: "left" | "center" | "right";
-    };
-};
-export type FlexRowNode = {
-    id: string;
-    type: "flexRow";
-    meta: NodeMeta;
-    props: {
-        cols: 1 | 2 | 3 | 4;
-        gap?: number;
-    };
-    columns: Array<{
-        id: string;
-        children: SchemaNode[];
-    }>;
-};
-export type CollapseNode = {
-    id: string;
-    type: "collapse";
-    meta: NodeMeta;
-    props: {
-        accordion: boolean;
-    };
-    items: Array<{
-        id: string;
-        title: string;
-        name: string;
-        children: SchemaNode[];
-    }>;
-};
-export type TabsNode = {
-    id: string;
-    type: "tabs";
-    meta: NodeMeta;
-    props: {
-        type: "card" | "border-card";
-    };
-    tabs: Array<{
-        id: string;
-        label: string;
-        children: SchemaNode[];
-    }>;
-};
 export type TableColumn = {
     id: string;
     label: string;
@@ -124,20 +45,36 @@ export type TableColumn = {
     filterable?: boolean;
     sortable?: boolean;
 };
-export type TableNode = {
+export type SchemaNode = {
     id: string;
-    type: "table";
-    meta: NodeMeta;
-    props: {
+    type: string;
+    props: Record<string, any>;
+    children?: SchemaNode[];
+    columns?: Array<{
+        id: string;
+        width?: number;
+        widthType?: 'fr' | 'px';
+        children: SchemaNode[];
+    }>;
+    items?: Array<{
+        id: string;
+        title: string;
+        name: string;
+        children: SchemaNode[];
+    }>;
+    tabs?: Array<{
+        id: string;
         label: string;
-        field: string;
-        columns: TableColumn[];
-        pagination: boolean;
-        pageSize: number;
-        enableExcelImport: boolean;
-    };
+        children: SchemaNode[];
+    }>;
 };
-export type SchemaNode = FieldNode | FlexRowNode | CollapseNode | TabsNode | TableNode | TitleNode;
+export type FieldNode = SchemaNode;
+export type FlexRowNode = SchemaNode;
+export type CollapseNode = SchemaNode;
+export type TabsNode = SchemaNode;
+export type TableNode = SchemaNode;
+export type TitleNode = SchemaNode;
+export type CustomNode = SchemaNode;
 export type LayoutSchema = {
     version: 1;
     root: {

package/dist/ui/state/useDragLogic.d.ts

@@ -0,0 +1,10 @@
+import { Ref } from 'vue';
+import { DropTarget, LayoutSchema, SchemaNode, NodeType } from './types';
+export declare function useDragLogic(schemaState: Ref<LayoutSchema>, selection: {
+    selectedNodeId: Ref<string | null>;
+}, commit: (next: LayoutSchema) => void): {
+    beginPaletteDrag: (nodeType: NodeType, ev: PointerEvent) => void;
+    beginNodeDrag: (nodeId: string, ev: PointerEvent) => void;
+    setHover: (target: DropTarget | null) => void;
+    findTypeById: (schema: LayoutSchema, nodeId: string) => SchemaNode | null;
+};

package/dist/ui/state/useHotkeys.d.ts

@@ -0,0 +1,4 @@
+export declare function useHotkeys(undo: () => void, redo: () => void, removeSelected: () => void): {
+    bindHotkeys: () => void;
+    unbindHotkeys: () => void;
+};

package/dist/ui/state/validator.d.ts

@@ -0,0 +1,36 @@
+import { z } from 'zod';
+import { LayoutSchema, FormDataModel } from './types';
+declare const baseNodeSchema: z.ZodObject<{
+    id: z.ZodString;
+    type: z.ZodString;
+    props: z.ZodDefault<z.ZodRecord<z.ZodString, z.ZodUnknown>>;
+}, z.core.$strip>;
+export type ZodSchemaNode = z.infer<typeof baseNodeSchema> & {
+    children?: ZodSchemaNode[];
+    columns?: {
+        id: string;
+        children: ZodSchemaNode[];
+        width?: number;
+        widthType?: string;
+    }[];
+    items?: {
+        id: string;
+        title: string;
+        name: string;
+        children: ZodSchemaNode[];
+    }[];
+    tabs?: {
+        id: string;
+        label: string;
+        children: ZodSchemaNode[];
+    }[];
+};
+export declare const schemaNodeSchema: z.ZodType<ZodSchemaNode>;
+export declare const layoutSchemaValidator: z.ZodObject<{
+    version: z.ZodDefault<z.ZodNumber>;
+    root: z.ZodType<ZodSchemaNode, unknown, z.core.$ZodTypeInternals<ZodSchemaNode, unknown>>;
+}, z.core.$strip>;
+export declare const formDataValidator: z.ZodRecord<z.ZodString, z.ZodUnknown>;
+export declare function validateLayout(data: unknown): LayoutSchema;
+export declare function validateFormData(data: unknown): FormDataModel;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devject-design",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "type": "module",
   "files": [
     "dist"
@@ -14,7 +14,7 @@
       "import": "./dist/index.es.js",
       "require": "./dist/index.umd.js"
     },
-    "./style.css": "./dist/style.css"
+    "./dist/style.css": "./dist/style.css"
   },
   "scripts": {
     "dev": "vite",
@@ -37,5 +37,10 @@
     "vue": "^3.5.13",
     "vue-tsc": "^2.2.0",
     "xlsx": "^0.18.5"
+  },
+  "dependencies": {
+    "@element-plus/icons-vue": "^2.3.2",
+    "immer": "^11.1.3",
+    "zod": "^4.3.6"
   }
 }