@xbeeant/form-engine-designer 0.0.3 → 0.0.4

package/src/catalog.ts

@@ -1,527 +0,0 @@
-// ============================================================================
-// @xbeeant/form-engine-designer — 组件目录
-// ============================================================================
-
-import type { CatalogItem } from './types';
-
-/**
- * 表单组件目录
- * 每个项创建一个 DataFieldSchema 节点
- * widget 名对齐 @xbeeant/form-engine-ui 中 antdWidgets 实际注册的 key
- */
-export const widgetCatalog: CatalogItem[] = [
-  {
-    label: '输入框',
-    icon: '📝',
-    category: 'widget',
-    widget: 'input',
-    createNode: () => ({ type: 'string', widget: 'input', title: '输入框' }),
-  },
-  {
-    label: '密码框',
-    icon: '🔑',
-    category: 'widget',
-    widget: 'password',
-    createNode: () => ({ type: 'string', widget: 'password', title: '密码框' }),
-  },
-  {
-    label: '数字输入',
-    icon: '🔢',
-    category: 'widget',
-    widget: 'number',
-    createNode: () => ({ type: 'number', widget: 'number', title: '数字输入' }),
-  },
-  {
-    label: '文本域',
-    icon: '📄',
-    category: 'widget',
-    widget: 'textarea',
-    createNode: () => ({ type: 'string', widget: 'textarea', title: '文本域' }),
-  },
-  {
-    label: '下拉选择',
-    icon: '📋',
-    category: 'widget',
-    widget: 'select',
-    createNode: () => ({
-      type: 'string',
-      widget: 'select',
-      title: '下拉选择',
-      enum: ['option1', 'option2'],
-      enumNames: ['选项1', '选项2'],
-    }),
-  },
-  {
-    label: '下拉选择（远程）',
-    icon: '📡',
-    category: 'widget',
-    widget: 'selectWithRemote',
-    createNode: () => ({
-      type: 'string',
-      widget: 'selectWithRemote',
-      title: '下拉选择（远程）',
-      remoteData: {
-        url: '/api/options',
-        method: 'GET',
-        responseField: { data: 'data.list', value: 'id', label: 'name' },
-        params: { page: 1, pageSize: 50 },
-      },
-    }),
-  },
-  {
-    label: '单选',
-    icon: '🔘',
-    category: 'widget',
-    widget: 'radio',
-    createNode: () => ({
-      type: 'string',
-      widget: 'radio',
-      title: '单选',
-      enum: ['a', 'b'],
-      enumNames: ['选项A', '选项B'],
-    }),
-  },
-  {
-    label: '复选框',
-    icon: '☑️',
-    category: 'widget',
-    widget: 'checkbox',
-    createNode: () => ({
-      type: 'boolean',
-      widget: 'checkbox',
-      title: '复选框',
-    }),
-  },
-  {
-    label: '多选',
-    icon: '☒',
-    category: 'widget',
-    widget: 'checkboxes',
-    createNode: () => ({
-      type: 'array',
-      widget: 'checkboxes',
-      title: '多选',
-      enum: ['a', 'b'],
-      enumNames: ['选项A', '选项B'],
-    }),
-  },
-  {
-    label: '多选下拉',
-    icon: '📊',
-    category: 'widget',
-    widget: 'multiSelect',
-    createNode: () => ({
-      type: 'array',
-      widget: 'multiSelect',
-      title: '多选下拉',
-      enum: ['a', 'b'],
-      enumNames: ['选项A', '选项B'],
-    }),
-  },
-  {
-    label: '多选下拉（远程）',
-    icon: '📡',
-    category: 'widget',
-    widget: 'multiSelectWithRemote',
-    createNode: () => ({
-      type: 'array',
-      widget: 'multiSelectWithRemote',
-      title: '多选下拉（远程）',
-      remoteData: {
-        url: '/api/multi-options',
-        method: 'GET',
-        responseField: { data: 'data.list', value: 'id', label: 'name' },
-        params: { page: 1, pageSize: 50 },
-      },
-    }),
-  },
-  {
-    label: '开关',
-    icon: '🔀',
-    category: 'widget',
-    widget: 'switch',
-    createNode: () => ({ type: 'boolean', widget: 'switch', title: '开关' }),
-  },
-  {
-    label: '日期选择',
-    icon: '📅',
-    category: 'widget',
-    widget: 'date',
-    createNode: () => ({ type: 'string', widget: 'date', title: '日期选择' }),
-  },
-  {
-    label: '日期范围',
-    icon: '📅',
-    category: 'widget',
-    widget: 'dateRange',
-    createNode: () => ({
-      type: 'string',
-      widget: 'dateRange',
-      title: '日期范围',
-    }),
-  },
-  {
-    label: '时间选择',
-    icon: '⏰',
-    category: 'widget',
-    widget: 'time',
-    createNode: () => ({ type: 'string', widget: 'time', title: '时间选择' }),
-  },
-  {
-    label: '时间范围',
-    icon: '⏰',
-    category: 'widget',
-    widget: 'timeRange',
-    createNode: () => ({
-      type: 'string',
-      widget: 'timeRange',
-      title: '时间范围',
-    }),
-  },
-  {
-    label: '滑块',
-    icon: '🎚️',
-    category: 'widget',
-    widget: 'slider',
-    createNode: () => ({ type: 'number', widget: 'slider', title: '滑块' }),
-  },
-  {
-    label: '颜色选择',
-    icon: '🎨',
-    category: 'widget',
-    widget: 'color',
-    createNode: () => ({ type: 'string', widget: 'color', title: '颜色选择' }),
-  },
-  {
-    label: 'URL输入',
-    icon: '🔗',
-    category: 'widget',
-    widget: 'urlInput',
-    createNode: () => ({
-      type: 'string',
-      widget: 'urlInput',
-      title: 'URL输入',
-    }),
-  },
-  {
-    label: '图片上传',
-    icon: '🖼️',
-    category: 'widget',
-    widget: 'image',
-    createNode: () => ({ type: 'string', widget: 'image', title: '图片上传' }),
-  },
-  {
-    label: 'HTML展示',
-    icon: '📄',
-    category: 'widget',
-    widget: 'html',
-    createNode: () => ({ type: 'string', widget: 'html', title: 'HTML展示' }),
-  },
-  {
-    label: '标题文字',
-    icon: '🏷️',
-    category: 'widget',
-    widget: 'voidTitle',
-    createNode: () => ({
-      type: 'string',
-      widget: 'voidTitle',
-      title: '标题文字',
-      label: false,
-    }),
-  },
-  {
-    label: '树选择',
-    icon: '🌲',
-    category: 'widget',
-    widget: 'treeSelect',
-    createNode: () => ({
-      type: 'string',
-      widget: 'treeSelect',
-      title: '树选择',
-    }),
-  },
-  {
-    label: '自动完成',
-    icon: '🔎',
-    category: 'widget',
-    widget: 'autoComplete',
-    createNode: () => ({
-      type: 'string',
-      widget: 'autoComplete',
-      title: '自动完成',
-      enum: ['option1', 'option2'],
-      enumNames: ['选项1', '选项2'],
-    }),
-  },
-  {
-    label: '自动完成（远程）',
-    icon: '📡',
-    category: 'widget',
-    widget: 'autoCompleteWithRemote',
-    createNode: () => ({
-      type: 'string',
-      widget: 'autoCompleteWithRemote',
-      title: '自动完成（远程）',
-      remoteData: {
-        url: '/api/suggestions',
-        method: 'GET',
-        responseField: { data: 'data.suggestions', value: 'id', label: 'name' },
-        params: { keyword: '' },
-      },
-    }),
-  },
-  {
-    label: '级联选择',
-    icon: '🌳',
-    category: 'widget',
-    widget: 'cascader',
-    createNode: () => ({
-      type: 'array',
-      widget: 'cascader',
-      title: '级联选择',
-      enum: ['a', 'b'],
-      enumNames: ['选项A', '选项B'],
-    }),
-  },
-  {
-    label: '级联选择（远程）',
-    icon: '📡',
-    category: 'widget',
-    widget: 'cascaderWithRemote',
-    createNode: () => ({
-      type: 'array',
-      widget: 'cascaderWithRemote',
-      title: '级联选择（远程）',
-      remoteData: {
-        url: '/api/cascader/nodes',
-        method: 'GET',
-        responseField: {
-          data: 'data.children',
-          value: 'id',
-          label: 'name',
-          parentIdKey: 'parentId',
-        },
-        params: { parentId: null },
-      },
-    }),
-  },
-  {
-    label: '提及',
-    icon: '💬',
-    category: 'widget',
-    widget: 'mentions',
-    createNode: () => ({
-      type: 'string',
-      widget: 'mentions',
-      title: '提及',
-      enum: ['alice', 'bob'],
-      enumNames: ['Alice', 'Bob'],
-    }),
-  },
-  {
-    label: '提及（远程）',
-    icon: '📡',
-    category: 'widget',
-    widget: 'mentionsWithRemote',
-    createNode: () => ({
-      type: 'string',
-      widget: 'mentionsWithRemote',
-      title: '提及（远程）',
-      remoteData: {
-        url: '/api/users/suggestions',
-        method: 'GET',
-        responseField: { data: 'data.users', value: 'id', label: 'name' },
-        params: { keyword: '' },
-      },
-    }),
-  },
-  {
-    label: '分段控制器',
-    icon: '🎚️',
-    category: 'widget',
-    widget: 'segmented',
-    createNode: () => ({
-      type: 'string',
-      widget: 'segmented',
-      title: '分段控制器',
-      enum: ['a', 'b'],
-      enumNames: ['选项A', '选项B'],
-    }),
-  },
-  {
-    label: '穿梭框',
-    icon: '⇄',
-    category: 'widget',
-    widget: 'transfer',
-    createNode: () => ({
-      type: 'array',
-      widget: 'transfer',
-      title: '穿梭框',
-    }),
-  },
-  {
-    label: '文件上传',
-    icon: '📎',
-    category: 'widget',
-    widget: 'file',
-    createNode: () => ({ type: 'array', widget: 'file', title: '文件上传' }),
-  },
-  {
-    label: '数据对象',
-    icon: '🗂️',
-    category: 'widget',
-    widget: 'object',
-    createNode: () => ({ type: 'object', title: '数据对象', properties: {} }),
-  },
-  {
-    label: '常规列表',
-    icon: '📋',
-    category: 'widget',
-    widget: 'list',
-    createNode: () => ({
-      type: 'array',
-      widget: 'list',
-      title: '常规列表',
-      items: {
-        type: 'object',
-        properties: {},
-      },
-    }),
-  },
-  {
-    label: '简单列表',
-    icon: '📃',
-    category: 'widget',
-    widget: 'simpleList',
-    createNode: () => ({
-      type: 'array',
-      widget: 'simpleList',
-      title: '简单列表',
-      items: {
-        type: 'object',
-        properties: {},
-      },
-    }),
-  },
-  {
-    label: '表格列表',
-    icon: '📊',
-    category: 'widget',
-    widget: 'tableList',
-    createNode: () => ({
-      type: 'array',
-      widget: 'tableList',
-      title: '表格列表',
-      items: {
-        type: 'object',
-        properties: {},
-      },
-    }),
-  },
-];
-
-/**
- * 布局组件目录
- * 每个项创建一个 LayoutContainerSchema 节点
- */
-export const layoutCatalog: CatalogItem[] = [
-  {
-    label: '卡片',
-    icon: '📦',
-    category: 'layout',
-    layoutType: 'card',
-    createNode: () => ({ type: 'card', title: '卡片', properties: {} }),
-  },
-  {
-    label: '栅格',
-    icon: '🔲',
-    category: 'layout',
-    layoutType: 'grid',
-    createNode: () => ({ type: 'grid', column: 2, properties: {} }),
-  },
-  {
-    label: '标签页',
-    icon: '📑',
-    category: 'layout',
-    layoutType: 'tabs',
-    createNode: () => ({
-      type: 'tabs',
-      title: '标签页',
-      properties: {
-        pane1: { type: 'tabPane', title: '标签页签 1', properties: {} },
-      },
-    }),
-  },
-  {
-    label: '标签页签',
-    icon: '📑',
-    category: 'layout',
-    layoutType: 'tabPane',
-    createNode: () => ({ type: 'tabPane', title: '标签页签', properties: {} }),
-  },
-  {
-    label: '折叠面板',
-    icon: '📂',
-    category: 'layout',
-    layoutType: 'collapse',
-    createNode: () => ({
-      type: 'collapse',
-      title: '折叠面板',
-      properties: {
-        panel1: { type: 'collapsePanel', title: '折叠面板 1', properties: {} },
-      },
-    }),
-  },
-  {
-    label: '折叠面板项',
-    icon: '📂',
-    category: 'layout',
-    layoutType: 'collapsePanel',
-    createNode: () => ({
-      type: 'collapsePanel',
-      title: '折叠面板项',
-      properties: {},
-    }),
-  },
-  {
-    label: '步骤条',
-    icon: '📝',
-    category: 'layout',
-    layoutType: 'steps',
-    createNode: () => ({
-      type: 'steps',
-      title: '步骤条',
-      properties: {
-        step1: { type: 'step', title: '步骤 1', properties: {} },
-      },
-    }),
-  },
-  {
-    label: '步骤项',
-    icon: '📝',
-    category: 'layout',
-    layoutType: 'step',
-    createNode: () => ({ type: 'step', title: '步骤项', properties: {} }),
-  },
-  {
-    label: '分割线',
-    icon: '➖',
-    category: 'layout',
-    layoutType: 'divider',
-    createNode: () => ({ type: 'divider', properties: {} }),
-  },
-  {
-    label: '弹性布局',
-    icon: '📐',
-    category: 'layout',
-    layoutType: 'flex',
-    createNode: () => ({ type: 'flex', properties: {} }),
-  },
-  {
-    label: '间距布局',
-    icon: '↔️',
-    category: 'layout',
-    layoutType: 'space',
-    createNode: () => ({ type: 'space', properties: {} }),
-  },
-];

package/src/index.ts

@@ -1,25 +0,0 @@
-// ============================================================================
-// @xbeeant/form-engine-designer — 公共 API
-// ============================================================================
-
-export { layoutCatalog, widgetCatalog } from './catalog';
-export type { DesignerProps } from './Designer';
-export { Designer } from './Designer';
-export type { DesignerContextValue } from './DesignerContext';
-export { DesignerProvider, useDesigner } from './DesignerContext';
-export {
-  addChildToSchema,
-  collectDataFieldOptions,
-  collectDataFieldPaths,
-  flattenNodeForPropertyEditor,
-  getNodeAtProperties,
-  removeNodeFromSchema,
-  updateNodeInSchema,
-  updateNodeWithNesting,
-} from './schemaUtils';
-export type {
-  CatalogItem,
-  DesignerMode,
-  FieldDef,
-  SchemaPath,
-} from './types';

package/src/property/basic-property.ts

@@ -1,126 +0,0 @@
-import type { SchemaNode } from '@xbeeant/form-engine';
-
-// ============================================================================
-// 属性面板各分组的字段定义（扁平结构，由 PropertyPanel 包裹进 collapse 分组）
-// ============================================================================
-
-// ── 通用属性 ──────────────────────────────────────────────────────────────
-export const commonPropertyFields: Record<string, SchemaNode> = {
-  title: {
-    widget: 'input',
-    type: 'string',
-    title: '标题（title）',
-  },
-  description: {
-    widget: 'textarea',
-    type: 'string',
-    title: '描述（description）',
-  },
-  placeholder: {
-    widget: 'input',
-    type: 'string',
-    title: '占位提示（placeholder）',
-  },
-  default: {
-    widget: 'input',
-    type: 'string',
-    title: '默认值（default）',
-  },
-  extra: {
-    widget: 'input',
-    type: 'string',
-    title: '额外说明（extra）',
-  },
-  // ── 状态控制 ────────────────────────────────────────────────────────────
-  disabled: {
-    widget: 'propertyExpr',
-    type: 'string',
-    title: '禁用（disabled）',
-  },
-  readOnly: {
-    widget: 'propertyExpr',
-    type: 'string',
-    title: '只读（readOnly）',
-  },
-  readOnlyWidget: {
-    widget: 'input',
-    type: 'string',
-    title: '只读渲染组件（readOnlyWidget）',
-    placeholder: '如 html，未配置时沿用只读文本渲染',
-  },
-  hidden: {
-    widget: 'propertyExpr',
-    type: 'string',
-    title: '隐藏（hidden）',
-  },
-  // ── 布局尺寸（x-render 对齐）──────────────────────────────────────────
-  width: {
-    widget: 'input',
-    type: 'string',
-    title: '单元素宽度（width）',
-    placeholder: '如 20%',
-  },
-  colSpan: {
-    widget: 'number',
-    type: 'number',
-    title: '栅格跨度（colSpan）',
-    placeholder: 'grid 列数的整数倍',
-  },
-};
-
-// ── 校验配置 ──────────────────────────────────────────────────────────────
-// 字段级约束（pattern/min/max）由 SchemaParser 自动转换为 ValidationRule；
-// 完整的 rules 数组可通过「Schema」标签页直接编辑 JSON。
-export const validationPropertyFields: Record<string, SchemaNode> = {
-  required: {
-    widget: 'propertyExpr',
-    type: 'string',
-    title: '必填（required）',
-  },
-  pattern: {
-    widget: 'input',
-    type: 'string',
-    title: '正则校验（pattern）',
-    placeholder: '如 ^1[3-9]\\d{9}$',
-  },
-  min: {
-    widget: 'number',
-    type: 'number',
-    title: '最小值/最小长度（min）',
-    placeholder: 'number→数值 / string→长度 / array→项数',
-  },
-  max: {
-    widget: 'number',
-    type: 'number',
-    title: '最大值/最大长度（max）',
-    placeholder: 'number→数值 / string→长度 / array→项数',
-  },
-  validate: {
-    widget: 'propertyValidate',
-    type: 'string',
-    title: '跨字段校验（validate）',
-  },
-};
-
-// ── 依赖配置 ──────────────────────────────────────────────────────────────
-export const dependencyPropertyFields: Record<string, SchemaNode> = {
-  bind: {
-    widget: 'propertyBind',
-    type: 'string',
-    title: '数据绑定（bind）',
-  },
-  dependencies: {
-    widget: 'propertyDependencies',
-    type: 'string',
-    title: '依赖字段（dependencies）',
-  },
-};
-
-// ── 联动配置 ──────────────────────────────────────────────────────────────
-export const reactionPropertyFields: Record<string, SchemaNode> = {
-  reactions: {
-    widget: 'propertyReactions',
-    type: 'string',
-    title: '联动规则（reactions）',
-  },
-};