@fast-form-designer/vue 0.1.0

package/dist/style.css

@@ -0,0 +1 @@
+:root{--ffd-primary: var(--el-color-primary, #409eff);--ffd-primary-hover: var(--el-color-primary-light-3, #66b1ff);--ffd-primary-light: var(--el-color-primary-light-9, #ecf5ff);--ffd-danger: var(--el-color-danger, #f56c6c);--ffd-danger-light: var(--el-color-danger-light-5, #f78989);--ffd-border: var(--el-border-color, #dcdfe6);--ffd-border-light: var(--el-border-color-lighter, #e4e7ed);--ffd-text: var(--el-text-color-primary, #303133);--ffd-text-secondary: var(--el-text-color-regular, #606266);--ffd-text-tertiary: var(--el-text-color-secondary, #909399);--ffd-bg: var(--el-bg-color, #ffffff);--ffd-panel-bg: var(--el-bg-color, #ffffff);--ffd-canvas-bg: var(--el-fill-color-lighter, #fafafa);--ffd-hover-bg: var(--el-fill-color-light, #f5f7fa);--ffd-muted-bg: var(--el-fill-color-light, #f4f6fc);--ffd-drag-bg: #c8ebfb;--ffd-empty-text: var(--el-text-color-placeholder, #c0c4cc)}.left-panel[data-v-9d6dfcb8]{padding:10px;height:100%;overflow-y:auto}.left-panel .panel-title[data-v-9d6dfcb8]{font-size:14px;font-weight:600;color:var(--ffd-text);margin-bottom:10px}.left-panel .component-group[data-v-9d6dfcb8]{margin-bottom:20px}.left-panel .component-group .group-title[data-v-9d6dfcb8]{font-weight:700;margin-bottom:10px;font-size:14px;color:var(--ffd-text)}.left-panel .component-group .component-list[data-v-9d6dfcb8]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.left-panel .component-group .component-item[data-v-9d6dfcb8]{background-color:var(--ffd-muted-bg);border:1px dashed var(--ffd-muted-bg);padding:8px 10px;cursor:move;font-size:12px;color:var(--ffd-text-secondary);border-radius:4px;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .3s}.left-panel .component-group .component-item[data-v-9d6dfcb8]:hover{color:var(--ffd-primary);border-color:var(--ffd-primary);background-color:var(--ffd-primary-light)}.left-panel .component-group .component-item .component-icon[data-v-9d6dfcb8]{font-size:16px}.form-item-wrapper[data-v-7667a53c]{position:relative;padding:10px;border:1px dashed transparent;margin-bottom:10px;cursor:pointer}.form-item-wrapper[data-v-7667a53c]:hover{background-color:var(--ffd-hover-bg);border-color:var(--ffd-border-light)}.form-item-wrapper.active[data-v-7667a53c]{border-color:var(--ffd-primary);background-color:var(--ffd-primary-light);border-width:2px}.form-item-wrapper .item-actions[data-v-7667a53c]{position:absolute;bottom:0;right:0;z-index:10;display:inline-flex;gap:6px}.form-item-wrapper .item-actions .copy-btn[data-v-7667a53c]{background:var(--ffd-primary);color:#fff;padding:5px;cursor:pointer;font-size:16px}.form-item-wrapper .item-actions .copy-btn[data-v-7667a53c]:hover{background:var(--ffd-primary-hover)}.form-item-wrapper .item-actions .delete-btn[data-v-7667a53c]{background:var(--ffd-danger);color:#fff;padding:5px;cursor:pointer;font-size:16px}.form-item-wrapper .item-actions .delete-btn[data-v-7667a53c]:hover{background:var(--ffd-danger-light)}.form-item-wrapper .question-icon[data-v-7667a53c]{display:inline-flex;align-items:center;line-height:1;cursor:help;color:var(--ffd-text-tertiary)}.form-item-wrapper .ff-label-inline[data-v-7667a53c]{display:inline-flex;align-items:center;gap:4px}.form-item-wrapper[data-v-7667a53c] .el-form-item__content{pointer-events:none;-webkit-user-select:none;user-select:none}.form-item-wrapper[data-v-7667a53c] .sub-form-layout-item .el-form-item__content{pointer-events:auto}.form-item-wrapper[data-v-7667a53c] .ff-label-wrap.el-form-item{flex-direction:column;align-items:flex-start}.form-item-wrapper[data-v-7667a53c] .ff-label-wrap .el-form-item__label-wrap{width:auto!important;margin:0 0 6px}.form-item-wrapper[data-v-7667a53c] .ff-label-wrap .el-form-item__label{width:auto!important;text-align:left!important;line-height:1.2}.form-item-wrapper[data-v-7667a53c] .ff-label-wrap .el-form-item__content{margin-left:0!important;width:100%}.form-item-wrapper .grid-layout-item[data-v-7667a53c]{padding:10px;border:1px dashed var(--ffd-border);background:var(--ffd-canvas-bg)}.form-item-wrapper .grid-layout-item .grid-col[data-v-7667a53c]{position:relative}.form-item-wrapper .grid-layout-item .grid-dropzone[data-v-7667a53c]{min-height:60px;padding:6px;border:1px dashed var(--ffd-border-light);background:var(--ffd-panel-bg);border-radius:4px}.form-item-wrapper .group-layout-item[data-v-7667a53c]{padding:10px;border:1px dashed var(--ffd-border);background:var(--ffd-canvas-bg);border-radius:6px}.form-item-wrapper .group-layout-item .group-header[data-v-7667a53c]{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;color:var(--ffd-text-secondary);font-weight:600;font-size:13px}.form-item-wrapper .group-layout-item .group-dropzone[data-v-7667a53c]{min-height:60px;padding:8px;border:1px dashed var(--ffd-border-light);background:var(--ffd-panel-bg);border-radius:4px}.form-item-wrapper .group-layout-item .group-empty[data-v-7667a53c]{min-height:40px;display:flex;align-items:center;justify-content:center;color:var(--ffd-text-tertiary);font-size:12px;-webkit-user-select:none;user-select:none;pointer-events:none}.form-item-wrapper .sub-form-layout-item[data-v-7667a53c]{padding:10px;border:1px dashed var(--ffd-border);background:var(--ffd-canvas-bg);overflow-x:auto}.form-item-wrapper .sub-form-layout-item .sub-form-table[data-v-7667a53c]{border:1px solid var(--ffd-border-light);border-radius:6px;overflow:auto;background:var(--ffd-panel-bg)}.form-item-wrapper .sub-form-layout-item .sub-form-header-row[data-v-7667a53c],.form-item-wrapper .sub-form-layout-item .sub-form-body-row[data-v-7667a53c]{display:flex;align-items:stretch;background:var(--ffd-panel-bg)}.form-item-wrapper .sub-form-layout-item .sub-form-body-row[data-v-7667a53c]{align-items:stretch}.form-item-wrapper .sub-form-layout-item .sub-form-columns[data-v-7667a53c]{display:flex;flex:0 0 auto;background:var(--ffd-hover-bg);border-bottom:1px solid var(--ffd-border-light)}.form-item-wrapper .sub-form-layout-item .sub-form-cell[data-v-7667a53c]{position:relative;padding:10px 14px;border-right:1px solid var(--ffd-border-light);display:flex;align-items:center;justify-content:flex-start;min-height:44px;width:360px;min-width:360px;box-sizing:border-box;-webkit-user-select:none;user-select:none;flex:0 0 auto}.form-item-wrapper .sub-form-layout-item .sub-form-cell[data-v-7667a53c]:last-child{border-right:none}.form-item-wrapper .sub-form-layout-item .sub-form-columns>.sub-form-cell[data-v-7667a53c]:last-child{border-right:none}.form-item-wrapper .sub-form-layout-item .cell-index[data-v-7667a53c]{min-width:50px;width:50px;flex:0 0 50px;justify-content:center}.form-item-wrapper .sub-form-layout-item .cell-action[data-v-7667a53c]{min-width:80px;width:80px;flex:0 0 80px;color:var(--ffd-text-tertiary);font-size:12px}.form-item-wrapper .sub-form-layout-item .cell-header[data-v-7667a53c]{cursor:pointer;font-weight:600;color:var(--ffd-text-secondary)}.form-item-wrapper .sub-form-layout-item .cell-body[data-v-7667a53c]{cursor:pointer;background:var(--ffd-panel-bg);color:var(--ffd-text-tertiary);font-size:12px;padding:12px 14px;min-height:54px}.form-item-wrapper .sub-form-layout-item .cell-control[data-v-7667a53c]{width:100%;pointer-events:none}.form-item-wrapper .sub-form-layout-item .cell-placeholder[data-v-7667a53c]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.form-item-wrapper .sub-form-layout-item .cell-title[data-v-7667a53c]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;padding-right:56px;box-sizing:border-box}.form-item-wrapper .sub-form-layout-item .cell-actions[data-v-7667a53c]{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:inline-flex;gap:6px;z-index:2}.form-item-wrapper .sub-form-layout-item .cell-actions .copy-btn[data-v-7667a53c],.form-item-wrapper .sub-form-layout-item .cell-actions .delete-btn[data-v-7667a53c]{padding:3px;border-radius:3px;font-size:14px;cursor:pointer;color:#fff}.form-item-wrapper .sub-form-layout-item .cell-actions .copy-btn[data-v-7667a53c]{background:var(--ffd-primary)}.form-item-wrapper .sub-form-layout-item .cell-actions .copy-btn[data-v-7667a53c]:hover{background:var(--ffd-primary-hover)}.form-item-wrapper .sub-form-layout-item .cell-actions .delete-btn[data-v-7667a53c]{background:var(--ffd-danger)}.form-item-wrapper .sub-form-layout-item .cell-actions .delete-btn[data-v-7667a53c]:hover{background:var(--ffd-danger-light)}.form-item-wrapper .sub-form-layout-item .sub-form-empty[data-v-7667a53c]{flex:0 0 auto;width:360px;min-width:360px;padding:10px 14px;min-height:44px;display:flex;align-items:center;justify-content:center;color:var(--ffd-text-tertiary);font-size:12px;border-right:1px solid var(--ffd-border-light);box-sizing:border-box}.form-item-wrapper .ghost[data-v-7667a53c]{opacity:.5;background:var(--ffd-drag-bg);border:1px dashed var(--ffd-primary)}.form-item-wrapper[data-v-7667a53c]:last-child{margin-bottom:0}.ff-signature-preview[data-v-7667a53c]{border:1px dashed var(--ffd-border);border-radius:4px;background:var(--ffd-canvas-bg);display:flex;align-items:center;justify-content:center;box-sizing:border-box;color:var(--ffd-text-tertiary);font-size:12px}.ff-signature-preview-text[data-v-7667a53c]{pointer-events:none}.ff-pca-preview[data-v-7667a53c]{border:1px dashed var(--ffd-border);border-radius:4px;background:var(--ffd-canvas-bg);height:32px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;color:var(--ffd-text-tertiary);font-size:12px}.ff-pca-preview-text[data-v-7667a53c]{pointer-events:none}.ff-text-preview[data-v-7667a53c]{min-height:32px;display:flex;align-items:center;box-sizing:border-box}.ff-text-preview-content[data-v-7667a53c]{white-space:pre-wrap;word-break:break-word;line-height:1.4}.ff-link-preview[data-v-7667a53c]{min-height:32px;display:flex;align-items:center;box-sizing:border-box}.center-canvas[data-v-f940c6e1]{height:100%;overflow-y:auto;overflow-x:hidden;padding:20px;background-color:var(--ffd-panel-bg);position:relative}.center-canvas .canvas-form[data-v-f940c6e1]{min-height:100%;height:100%}.center-canvas .draggable-area[data-v-f940c6e1]{min-height:100%;padding-bottom:50px}.center-canvas .empty-placeholder[data-v-f940c6e1]{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);color:var(--ffd-empty-text);font-size:16px;pointer-events:none}.center-canvas .ghost[data-v-f940c6e1]{opacity:.5;background:var(--ffd-drag-bg);border:1px dashed var(--ffd-primary)}.rules-toolbar[data-v-114881ed]{display:flex;gap:10px;margin-bottom:12px}.rule-title[data-v-114881ed]{width:100%;display:flex;align-items:center;justify-content:space-between;padding-right:6px}.rule-section[data-v-114881ed]{margin-bottom:14px}.rule-header-row[data-v-114881ed]{display:flex;align-items:center;margin-bottom:10px}.rule-header-label[data-v-114881ed]{font-size:14px;color:var(--ffd-text-secondary);margin-right:10px}.rule-header-label.required[data-v-114881ed]{color:var(--ffd-danger);margin-right:4px}.rule-table[data-v-114881ed]{width:100%}.right-panel[data-v-70cf260a]{height:100%;min-height:0;overflow:hidden;display:flex;flex-direction:column}.right-panel .config-tabs[data-v-70cf260a]{flex:1;min-height:0;display:flex;flex-direction:column}.right-panel .config-tabs[data-v-70cf260a] .el-tabs__header{margin-bottom:0;padding:0;flex-shrink:0}.right-panel .config-tabs[data-v-70cf260a] .el-tabs__content{flex:1;overflow:hidden;padding:0;min-height:0}.right-panel .config-tabs[data-v-70cf260a] .el-tabs__content .el-tab-pane{height:100%;overflow:hidden;padding:0}.right-panel .config-content[data-v-70cf260a]{height:100%;overflow-y:auto;padding:10px 15px 20px;box-sizing:border-box;overscroll-behavior:contain;-ms-scroll-chaining:contain}.right-panel .empty-selection[data-v-70cf260a]{text-align:center;color:var(--ffd-text-tertiary);margin-top:50px}.right-panel .rule-item[data-v-70cf260a]{background:var(--ffd-hover-bg);padding:10px;border-radius:4px;margin-bottom:10px;border:1px dashed var(--ffd-border)}.right-panel .rule-item .rule-header[data-v-70cf260a]{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-weight:700}.right-panel .grid-span-list[data-v-70cf260a]{display:flex;flex-direction:column;gap:10px;width:100%}.right-panel .grid-span-list .grid-span-item[data-v-70cf260a]{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;background:var(--ffd-hover-bg);border-radius:4px;border:1px dashed var(--ffd-border)}.right-panel .grid-span-list .grid-span-label[data-v-70cf260a]{color:var(--ffd-text-secondary);font-size:12px;min-width:60px}.ff-signature-pad[data-v-a1a825f6]{display:block}.ff-signature-canvas-wrap[data-v-a1a825f6]{width:100%;border:1px dashed var(--ffd-border);border-radius:4px;overflow:hidden}.ff-signature-canvas[data-v-a1a825f6]{width:100%;height:100%;display:block;touch-action:none;background:transparent}.ff-signature-canvas.disabled[data-v-a1a825f6]{pointer-events:none}.ff-signature-actions[data-v-a1a825f6]{margin-top:6px;display:flex;justify-content:flex-end}.ff-form-item[data-v-c71174a9]{width:100%}.ff-group[data-v-c71174a9]{width:100%;border:1px solid var(--ffd-border-light);border-radius:8px;margin-bottom:18px;overflow:hidden;background:var(--ffd-panel-bg)}.ff-group-header[data-v-c71174a9]{padding:10px 12px;background:var(--ffd-hover-bg);border-bottom:1px solid var(--ffd-border-light)}.ff-group-title[data-v-c71174a9]{font-weight:600;font-size:14px;color:var(--ffd-text)}.ff-group-body[data-v-c71174a9]{padding:12px 12px 0}.ff-label-inline[data-v-c71174a9]{display:inline-flex;align-items:center;gap:4px}.question-icon[data-v-c71174a9]{display:inline-flex;align-items:center;line-height:1;color:var(--ffd-text-tertiary)}.sub-form-container[data-v-c71174a9]{margin-bottom:18px}.sub-form-container .sub-form-content[data-v-c71174a9]{width:100%;display:flex;flex-direction:column;align-items:flex-start}.sub-form-container .sub-form-content[data-v-c71174a9] .el-table__empty-block{border-bottom:1px solid var(--el-table-border-color)}.sub-form-container .sub-form-table-wrap[data-v-c71174a9]{max-width:100%;overflow-x:auto}.sub-form-container .sub-form-table[data-v-c71174a9]{display:inline-block;width:max-content}.sub-form-container .sub-form-label[data-v-c71174a9]{display:flex;align-items:center;gap:4px;margin-bottom:8px;font-size:14px;color:var(--ffd-text-secondary)}.sub-form-container .sub-form-actions[data-v-c71174a9]{border-top:none;border-radius:0 0 4px 4px;width:100%;box-sizing:border-box}.sub-form-container .no-sub-form[data-v-c71174a9]{display:flex;align-items:center;justify-content:center;width:300px;height:80px;background-color:var(--ffd-hover-bg)}.ff-form-item[data-v-c71174a9] .ff-no-label.el-form-item{margin-bottom:0;width:100%}.ff-form-item[data-v-c71174a9] .ff-no-label .el-form-item__content{margin-left:0!important;width:100%;display:flex}.ff-form-item[data-v-c71174a9] .ff-no-label .el-select{min-width:180px}.ff-form-item[data-v-c71174a9] .ff-no-label .el-select,.ff-form-item[data-v-c71174a9] .ff-no-label .el-input-number{width:100%}.ff-form-item[data-v-c71174a9] .ff-label-wrap.el-form-item{flex-direction:column;align-items:flex-start}[data-v-c71174a9] .ff-label-wrap .el-form-item__label-wrap{width:auto!important;margin:0 0 6px}[data-v-c71174a9] .ff-label-wrap .el-form-item__label{width:auto!important;text-align:left!important;line-height:1.2}[data-v-c71174a9] .ff-label-wrap .el-form-item__content{margin-left:0!important;width:100%}.custom-upload-item[data-v-c71174a9]{width:100%;height:100%;position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;border-radius:6px;border:1px solid var(--ffd-border);box-sizing:border-box}.ff-signature-field[data-v-c71174a9]{display:block}.ff-signature-box[data-v-c71174a9]{width:100%;border:1px dashed var(--ffd-border);border-radius:4px;overflow:hidden;background:var(--ffd-panel-bg);cursor:pointer;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.ff-signature-box.disabled[data-v-c71174a9]{cursor:not-allowed;background:var(--ffd-hover-bg)}.ff-signature-placeholder[data-v-c71174a9]{color:var(--ffd-text-tertiary);font-size:14px}.ff-signature-image[data-v-c71174a9]{width:100%;height:100%;object-fit:contain;display:block}.ff-signature-actions[data-v-c71174a9]{margin-top:6px;display:flex;justify-content:flex-end}.mode-picture[data-v-c71174a9]{border:1px solid var(--ffd-border-light);padding:8px;justify-content:flex-start;background-color:var(--ffd-panel-bg);transition:all .3s}.mode-picture[data-v-c71174a9]:hover{background-color:var(--ffd-hover-bg)}.mode-picture .thumbnail-area[data-v-c71174a9]{width:60px;height:60px;flex-shrink:0;position:relative;border-radius:4px;overflow:hidden}.mode-picture .file-name-display[data-v-c71174a9]{position:static;margin-left:12px;background:none;color:var(--ffd-text-secondary);text-align:left;font-size:14px;padding:0;width:auto;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mode-picture-card .thumbnail-area[data-v-c71174a9]{width:100%;height:100%;position:relative}.mode-picture-card .file-name-display[data-v-c71174a9]{position:absolute;bottom:0;left:0;width:100%;padding:4px;background:#0009;color:#fff;font-size:12px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:5}.file-icon-thumbnail[data-v-c71174a9]{width:100%;height:100%;display:flex;justify-content:center;align-items:center;color:var(--ffd-text-tertiary);background-color:var(--ffd-hover-bg)}.el-upload-list__item-thumbnail[data-v-c71174a9]{width:100%;height:100%;object-fit:cover}.el-upload-list__item-actions[data-v-c71174a9]{position:absolute;width:100%;height:100%;left:0;top:0;cursor:default;text-align:center;color:#fff;opacity:0;font-size:20px;background-color:var(--el-overlay-color-lighter);transition:opacity var(--el-transition-duration);display:flex;justify-content:center;align-items:center;gap:12px;z-index:10}.el-upload-list__item-actions span[data-v-c71174a9]{cursor:pointer}.el-upload-list__item-actions span[data-v-c71174a9]:hover{color:var(--ffd-primary)}.thumbnail-area:hover .el-upload-list__item-actions[data-v-c71174a9]{opacity:1}.picture-mode-close[data-v-c71174a9]{display:none;position:absolute;top:5px;right:5px;cursor:pointer;opacity:.75;color:var(--ffd-text-secondary)}.picture-mode-close[data-v-c71174a9]:hover{opacity:1;color:var(--ffd-primary)}.mode-picture:hover .picture-mode-close[data-v-c71174a9]{display:block}.mode-text[data-v-c71174a9]{justify-content:space-between;padding:4px 8px;background-color:var(--ffd-panel-bg);transition:background-color .3s;border:none;border-radius:4px;margin-top:4px}.mode-text[data-v-c71174a9]:hover{background-color:var(--ffd-hover-bg)}.mode-text:hover .text-mode-close[data-v-c71174a9]{display:block}.mode-text .text-mode-content[data-v-c71174a9]{display:flex;align-items:center;flex:1;overflow:hidden;cursor:pointer;color:var(--ffd-text-secondary)}.mode-text .text-mode-content[data-v-c71174a9]:hover,.mode-text .text-mode-content:hover .file-icon[data-v-c71174a9]{color:var(--ffd-primary)}.mode-text .file-icon[data-v-c71174a9]{margin-right:6px;color:var(--ffd-text-tertiary);display:flex;align-items:center}.mode-text .file-name[data-v-c71174a9]{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mode-text .text-mode-close[data-v-c71174a9]{display:none;cursor:pointer;color:var(--ffd-text-tertiary);margin-left:8px;display:flex;align-items:center}.mode-text .text-mode-close[data-v-c71174a9]:hover{color:var(--ffd-danger)}.sub-form-content .el-table-fixed-column--left:hover .index-number[data-v-c71174a9]{display:none}.sub-form-content .el-table-fixed-column--left:hover .index-actions[data-v-c71174a9]{display:flex}.row-index-wrapper[data-v-c71174a9]{position:relative;min-height:24px;display:flex;align-items:center;justify-content:center}.row-index-wrapper .index-number[data-v-c71174a9]{display:block;font-variant-numeric:tabular-nums}.row-index-wrapper .index-actions[data-v-c71174a9]{display:none;align-items:center;justify-content:center;gap:8px}.row-index-wrapper .action-icon[data-v-c71174a9]{cursor:pointer;font-size:14px;color:var(--ffd-text-secondary)}.row-index-wrapper .action-icon[data-v-c71174a9]:hover{color:var(--ffd-primary)}.row-index-wrapper .action-icon.delete-icon[data-v-c71174a9]:hover{color:var(--ffd-danger)}.ff-text[data-v-c71174a9]{white-space:pre-wrap;word-break:break-word;line-height:1.4;color:var(--ffd-text)}.fast-form-designer[data-v-2da758c0]{min-width:1000px;height:100%;min-height:0;display:flex;flex-direction:column;border:1px solid var(--el-border-color-lighter);border-radius:4px}.fast-form-designer .designer-container[data-v-2da758c0]{flex:1;display:flex;overflow:hidden}.fast-form-designer .designer-container .left-container[data-v-2da758c0]{width:250px;border-right:1px solid var(--ffd-border);background:var(--ffd-panel-bg)}.fast-form-designer .designer-container .center-container[data-v-2da758c0]{flex:1;background:var(--ffd-canvas-bg);min-width:0;overflow:hidden}.fast-form-designer .designer-container .center-container .actions[data-v-2da758c0]{height:var(--el-tabs-header-height, 40px);display:flex;justify-content:right;padding:0 20px}.fast-form-designer .designer-container .right-container[data-v-2da758c0]{width:300px;border-left:1px solid var(--ffd-border);background:var(--ffd-panel-bg);display:flex;flex-direction:column;overflow:hidden}

package/dist/types/index.d.ts

@@ -0,0 +1,108 @@
+export type ComponentType = 'input' | 'textarea' | 'text' | 'link' | 'radio' | 'checkbox' | 'select' | 'pca' | 'date' | 'datetime' | 'time' | 'input-number' | 'rate' | 'switch' | 'cascader' | 'signature' | 'upload' | 'group' | 'grid' | 'grid-col' | 'sub-form';
+export interface ValidationRule {
+    type: 'required' | 'email' | 'phone' | 'url' | 'ip' | 'regexp';
+    message: string;
+    pattern?: string;
+    trigger: 'blur' | 'change';
+}
+export type OptionValue = string | number;
+export interface OptionItem {
+    label: string;
+    value: OptionValue;
+    children?: OptionItem[];
+}
+export interface RemoteOptionsConfig {
+    url: string;
+    method: 'GET' | 'POST';
+    paramsJson?: string;
+    headersJson?: string;
+    dataPath?: string;
+    labelKey: string;
+    valueKey: string;
+    childrenKey?: string;
+}
+export interface ComponentProps {
+    label: string;
+    field?: string;
+    defaultValue?: unknown;
+    placeholder?: string;
+    description?: string;
+    labelWidth?: number;
+    labelWrap?: boolean;
+    text?: string;
+    linkText?: string;
+    linkUrl?: string;
+    linkTarget?: '_blank' | '_self' | '_parent' | '_top';
+    linkUnderline?: boolean;
+    multiple?: boolean;
+    filterable?: boolean;
+    virtualized?: boolean;
+    checkStrictly?: boolean;
+    pcaType?: 'province' | 'province-city' | 'province-city-area';
+    width?: '25%' | '33.33%' | '50%' | '66.66%' | '75%' | '100%';
+    rows?: number;
+    max?: number;
+    allowHalf?: boolean;
+    gutter?: number;
+    span?: number;
+    showIndex?: boolean;
+    showAction?: boolean;
+    signatureHeight?: number;
+    signatureLineWidth?: number;
+    signaturePenColor?: string;
+    signatureBackgroundColor?: string;
+    clearable?: boolean;
+    disabled?: boolean;
+    optionsSource?: 'static' | 'remote';
+    options?: OptionItem[];
+    remoteOptions?: RemoteOptionsConfig;
+    action?: string;
+    name?: string;
+    accept?: string;
+    limit?: number;
+    listType?: 'text' | 'picture' | 'picture-card';
+    autoUpload?: boolean;
+    showFileList?: boolean;
+    withCredentials?: boolean;
+    uploadHeadersJson?: string;
+    uploadDataJson?: string;
+    required?: boolean;
+    rules?: ValidationRule[];
+}
+export type FieldVisibilityLogic = 'all' | 'any';
+export type FieldVisibilityOperator = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'contains' | 'not_contains' | 'in' | 'not_in' | 'is_empty' | 'not_empty';
+export type FieldVisibilityActionType = 'show' | 'hide';
+export type FieldVisibilityValue = string | number | boolean | null | Array<string | number>;
+export interface FieldVisibilityCondition {
+    id: string;
+    field: string;
+    operator: FieldVisibilityOperator;
+    value?: FieldVisibilityValue;
+}
+export interface FieldVisibilityAction {
+    id: string;
+    field: string;
+    action: FieldVisibilityActionType;
+}
+export interface FieldVisibilityRule {
+    id: string;
+    logic: FieldVisibilityLogic;
+    conditions: FieldVisibilityCondition[];
+    actions: FieldVisibilityAction[];
+}
+export interface FormElement {
+    id: string;
+    type: ComponentType;
+    props: ComponentProps;
+    children?: FormElement[];
+}
+export interface FormConfig {
+    labelPosition: 'left' | 'right' | 'top';
+    labelWidth: number;
+    size: 'large' | 'default' | 'small';
+    visibilityRules?: FieldVisibilityRule[];
+}
+export interface FormSchema {
+    config: FormConfig;
+    list: FormElement[];
+}

package/dist/utils/index.d.ts

@@ -0,0 +1,47 @@
+import type { FormElement, OptionItem, RemoteOptionsConfig, ComponentType } from '../types';
+export declare function generateId(type: ComponentType): string;
+export type RemoteParamsContext = {
+    formModel?: Record<string, unknown>;
+    globalObject?: Record<string, unknown>;
+};
+export declare function cloneComponent(origin: Partial<FormElement>): FormElement;
+export declare function duplicateElement(origin: FormElement): FormElement;
+/**
+ * 判断是否为普通对象（Record）。
+ */
+export declare const isRecord: (v: unknown) => v is Record<string, unknown>;
+export declare const getByPath: (obj: unknown, path: string | undefined) => unknown;
+export declare const resolveDynamicValue: (raw: unknown, ctx: RemoteParamsContext, depth?: number) => unknown;
+export declare const extractFormDepsFromTemplateJson: (text: string | undefined) => string[];
+export declare const hasFormTemplate: (text: string | undefined) => boolean;
+/**
+ * 根据配置把任意数据映射为 OptionItem[]（支持树形 children）。
+ */
+export declare const mapToOptions: (raw: unknown, config: Pick<RemoteOptionsConfig, "labelKey" | "valueKey" | "childrenKey">) => OptionItem[];
+/**
+ * 拉取远程选项数据，并按 remoteOptions 的映射规则转换为 OptionItem[]。
+ */
+export declare const fetchRemoteOptions: (remote: RemoteOptionsConfig, signal?: AbortSignal, ctx?: RemoteParamsContext) => Promise<OptionItem[]>;
+export type RemoteOptionsTestRequest = {
+    url: string;
+    method: RemoteOptionsConfig['method'];
+    headers?: Record<string, string>;
+    body?: string;
+    resolvedParams?: Record<string, unknown>;
+    resolvedParamsRaw?: unknown;
+    resolvedHeadersRaw?: unknown;
+};
+export type RemoteOptionsTestResponse = {
+    ok: boolean;
+    status: number;
+    statusText: string;
+    json?: unknown;
+    text?: string;
+};
+export type RemoteOptionsTestResult = {
+    request: RemoteOptionsTestRequest;
+    response: RemoteOptionsTestResponse;
+    extractedData?: unknown;
+    mappedOptions: OptionItem[];
+};
+export declare const testRemoteOptionsRequest: (remote: RemoteOptionsConfig, ctx?: RemoteParamsContext, signal?: AbortSignal) => Promise<RemoteOptionsTestResult>;

package/dist/utils/pca.d.ts

@@ -0,0 +1,2 @@
+import type { OptionItem } from '../types';
+export declare const getPcaOptions: (depth: 1 | 2 | 3) => OptionItem[];

package/package.json

@@ -0,0 +1,97 @@
+{
+  "name": "@fast-form-designer/vue",
+  "version": "0.1.0",
+  "author": {
+    "name": "lywuhan",
+    "email": "wu_han@aliyun.com"
+  },
+  "description": "A visual form designer based on Vue 3 and Element Plus.",
+  "keywords": [
+    "vue",
+    "vue3",
+    "element-plus",
+    "form",
+    "form-designer",
+    "low-code"
+  ],
+  "license": "MIT",
+  "homepage": "https://github.com/iamwuhan/fast-form-designer-vue",
+  "bugs": {
+    "url": "https://github.com/iamwuhan/fast-form-designer-vue/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/iamwuhan/fast-form-designer-vue.git"
+  },
+  "type": "module",
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./dist/index.umd.cjs",
+  "module": "./dist/index.es.js",
+  "types": "./dist/index.d.ts",
+  "style": "./dist/style.css",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.umd.cjs"
+    },
+    "./style.css": "./dist/style.css",
+    "./package.json": "./package.json",
+    "./dist/style.css": "./dist/style.css"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "run-p build:types build:bundles",
+    "preview": "vite preview",
+    "build:bundles": "vite build",
+    "build:types": "vue-tsc -p tsconfig.lib.json --declaration --emitDeclarationOnly",
+    "type-check": "vue-tsc --build",
+    "lint": "eslint . --fix --cache",
+    "format": "prettier --write --experimental-cli src/",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "vue-draggable-plus": "^0.6.1"
+  },
+  "peerDependencies": {
+    "@element-plus/icons-vue": "^2.3.2",
+    "element-plus": "^2.13.1",
+    "vue": "^3.5.26"
+  },
+  "devDependencies": {
+    "@tsconfig/node24": "^24.0.3",
+    "@types/node": "^24.10.4",
+    "@vitejs/plugin-vue": "^6.0.3",
+    "@vitejs/plugin-vue-jsx": "^5.1.3",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/eslint-config-typescript": "^14.6.0",
+    "@vue/tsconfig": "^0.8.1",
+    "eslint": "^9.39.2",
+    "eslint-plugin-vue": "~10.6.2",
+    "jiti": "^2.6.1",
+    "npm-run-all2": "^8.0.4",
+    "prettier": "3.7.4",
+    "sass": "^1.97.3",
+    "typescript": "~5.9.3",
+    "vite": "^7.3.0",
+    "vite-plugin-vue-devtools": "^8.0.5",
+    "vue": "^3.5.26",
+    "vue-router": "^4.6.4",
+    "@element-plus/icons-vue": "^2.3.2",
+    "element-plus": "^2.13.1",
+    "vue-tsc": "^3.2.2"
+  }
+}