{"_id":"@cardinal-odp/algo-params-vue","_rev":"2-afc3afba1633c40d0878ef92e5b2b10f","name":"@cardinal-odp/algo-params-vue","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@cardinal-odp/algo-params-vue","version":"1.0.0","_id":"@cardinal-odp/algo-params-vue@1.0.0","maintainers":[{"name":"yachen121","email":"yachen@shanshu.ai"}],"dist":{"shasum":"6a9a4e57f5e542da108d1d978c0bf83716dc5172","tarball":"https://registry.npmjs.org/@cardinal-odp/algo-params-vue/-/algo-params-vue-1.0.0.tgz","fileCount":13,"integrity":"sha512-AqcOwRGvUUhw2TT4S/sOSgUGg51hDhcQnWowUNtZRT6rbN8WbiFyBj1xGEmo6aTQP7WVYxzhatjPzn4/wXzGiQ==","signatures":[{"sig":"MEUCICTrF/bCtdmdkXVUh0Usdd/js7qZ8DAnjczo6iXxy4JXAiEAk2L+A/kJyfJJDnErrb68ECFlSD/vcLNhkkKbefyz/EE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":24822},"main":"./dist/index.mjs","type":"module","_from":"file:cardinal-odp-algo-params-vue-1.0.0.tgz","types":"./dist/index.d.ts","module":"./dist/index.mjs","exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.mjs"},"./style.css":{"default":"./dist/style.css"}},"scripts":{"test":"pnpm build && node --test ./__tests__/*.test.mjs","build":"pnpm exec unbuild"},"_npmUser":{"name":"yachen121","email":"yachen@shanshu.ai"},"_resolved":"/tmp/dd9b363aa39cc8a10a53138df36b7214/cardinal-odp-algo-params-vue-1.0.0.tgz","_integrity":"sha512-AqcOwRGvUUhw2TT4S/sOSgUGg51hDhcQnWowUNtZRT6rbN8WbiFyBj1xGEmo6aTQP7WVYxzhatjPzn4/wXzGiQ==","_npmVersion":"11.6.2","description":"Vue 3 renderer for the `FcCreateAlgo` schema used in this repo.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"24.12.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"vue":"^3.5.24","ant-design-vue":"^4.2.6","@form-create/ant-design-vue":"^3.2.33"},"_npmOperationalInternal":{"tmp":"tmp/algo-params-vue_1.0.0_1776835440529_0.4755259544100008","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@cardinal-odp/algo-params-vue","version":"1.0.1","type":"module","sideEffects":["**/*.css"],"types":"./dist/index.d.ts","main":"./dist/index.mjs","module":"./dist/index.mjs","exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.mjs"},"./style.css":{"default":"./dist/style.css"}},"publishConfig":{"access":"public"},"peerDependencies":{"@form-create/ant-design-vue":"^3.2.33","ant-design-vue":"^4.2.6","vue":"^3.5.24"},"scripts":{"build":"pnpm exec unbuild","test":"pnpm build && node --test ./__tests__/*.test.mjs"},"_id":"@cardinal-odp/algo-params-vue@1.0.1","description":"Vue 3 wrapper around `@form-create/ant-design-vue` for the `FcCreateAlgo` schema used in this repo.","_integrity":"sha512-A7J4Q30MJU2fhZKaE/sT3xKAnA7aYowB3RWQ3l8IJ/UqnJplH6K9+jRnTPHP14A5YvNPb0Pwa/s1IwJPEL8Z5A==","_resolved":"/tmp/89c561cebcac890392dd0a1a4faacb71/cardinal-odp-algo-params-vue-1.0.1.tgz","_from":"file:cardinal-odp-algo-params-vue-1.0.1.tgz","_nodeVersion":"24.12.0","_npmVersion":"11.6.2","dist":{"integrity":"sha512-A7J4Q30MJU2fhZKaE/sT3xKAnA7aYowB3RWQ3l8IJ/UqnJplH6K9+jRnTPHP14A5YvNPb0Pwa/s1IwJPEL8Z5A==","shasum":"07cf8ec5a1c0afd02a5becf2c285ddaa643516d8","tarball":"https://registry.npmjs.org/@cardinal-odp/algo-params-vue/-/algo-params-vue-1.0.1.tgz","fileCount":13,"unpackedSize":26795,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCxTqzPzD4PE8c1juD1zZAc4LDCckAHCP7tTR8NeNPrQQIhAIWmjpGJp4xtxyYrDqc7uDVtSAyj1ZBh6k1MkXhiSeSp"}]},"_npmUser":{"name":"yachen121","email":"yachen@shanshu.ai"},"directories":{},"maintainers":[{"name":"yachen121","email":"yachen@shanshu.ai"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/algo-params-vue_1.0.1_1776855707378_0.07013680243302889"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-22T05:24:00.417Z","modified":"2026-04-22T11:01:47.656Z","1.0.0":"2026-04-22T05:24:00.673Z","1.0.1":"2026-04-22T11:01:47.519Z"},"description":"Vue 3 wrapper around `@form-create/ant-design-vue` for the `FcCreateAlgo` schema used in this repo.","maintainers":[{"name":"yachen121","email":"yachen@shanshu.ai"}],"readme":"# `@cardinal-odp/algo-params-vue`\n\nVue 3 wrapper around `@form-create/ant-design-vue` for the `FcCreateAlgo` schema used in this repo.\n\nIt adds a stable wrapper API around:\n\n- rendering `rule + option`\n- edit / preview mode switching\n- field info tooltip injection\n- schema round-tripping through `option.formData`\n\n## Install\n\n```bash\nnpm install @cardinal-odp/algo-params-vue vue ant-design-vue @form-create/ant-design-vue\n```\n\n```ts\nimport '@cardinal-odp/algo-params-vue/style.css';\n```\n\n## Usage\n\n```vue\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\n\nimport { Button, Space } from 'ant-design-vue';\n\nimport FcCreateAlgo, {\n  type FcCreateAlgoExpose,\n} from '@cardinal-odp/algo-params-vue';\nimport '@cardinal-odp/algo-params-vue/style.css';\n\nconst fcRef = ref<FcCreateAlgoExpose>();\n\nconst rule = [\n  {\n    type: 'input',\n    field: 'name',\n    title: '名称',\n    props: {\n      placeholder: '请输入名称',\n    },\n    validate: [{ required: true, message: '请输入名称' }],\n  },\n  {\n    type: 'select',\n    field: 'status',\n    title: '状态',\n    options: [\n      { label: '启用', value: 'enabled' },\n      { label: '停用', value: 'disabled' },\n    ],\n  },\n];\n\nconst option = {\n  form: {\n    labelCol: { span: 6 },\n    wrapperCol: { span: 18 },\n  },\n  formData: {\n    status: 'enabled',\n  },\n};\n\nconst handleValidate = async () => {\n  const valid = await fcRef.value?.validate();\n  if (!valid) return;\n\n  console.log(fcRef.value?.getFormData());\n};\n\nconst handleSubmit = async () => {\n  const result = await fcRef.value?.submit();\n  console.log('submit result', result);\n};\n</script>\n\n<template>\n  <Space style=\"margin-bottom: 16px\">\n    <Button type=\"primary\" @click=\"handleSubmit\">Submit</Button>\n    <Button @click=\"handleValidate\">Validate + Inspect</Button>\n  </Space>\n\n  <FcCreateAlgo\n    ref=\"fcRef\"\n    :option=\"option\"\n    :rule=\"rule\"\n    mode=\"edit\"\n    @change=\"(formData) => console.log('change', formData)\"\n    @submit=\"(result) => console.log('submit event', result)\"\n  />\n</template>\n```\n\n`@submit` is emitted after calling `fcRef.value?.submit()` and the wrapper receives a submit result. It is not a click event for a built-in submit button.\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `rule` | `any[]` | `[]` | Schema rules |\n| `option` | `Record<string, any>` | `undefined` | Schema option object passed to `form-create` |\n| `mode` | `'edit' \\| 'preview'` | `'preview'` | Editable form or readonly preview |\n| `showInfo` | `boolean` | `true` | Inject tooltip info for fields and `div` title blocks |\n| `infoFormatter` | `(rule) => string` | `undefined` | Custom tooltip content |\n| `emptyText` | `string` | `'暂无表单配置'` | Empty state text |\n| `popupContainer` | `HTMLElement \\| ((triggerNode) => HTMLElement \\| null \\| undefined)` | `undefined` | Popup mount target for label tooltips and popup controls such as dropdowns |\n| `controlMaxWidth` | `number \\| string` | `'500px'` | Max width CSS variable for form controls |\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `ready` | `api` | Emitted when the underlying FormCreate API is ready |\n| `change` | `formData` | Emitted when form values change |\n| `submit` | `result` | Emitted after `submit()` resolves successfully |\n| `validate` | `boolean` | Emitted after `validate()` completes |\n\n## Exposed Methods\n\n```ts\nawait fcRef.value?.validate();\nawait fcRef.value?.submit();\nfcRef.value?.reset();\nfcRef.value?.setSchema(nextRule, nextOption);\n\nconst schema = fcRef.value?.getFormData();\nconst api = fcRef.value?.getApi();\n```\n\n| Method | Description |\n| --- | --- |\n| `validate()` | Runs validation and returns `Promise<boolean>` |\n| `submit()` | Calls the underlying FormCreate submit flow and returns `submitResult` when available |\n| `reset()` | Resets fields through the underlying FormCreate API |\n| `getFormData()` | Returns `{ rule, option }` with latest `option.formData` merged in |\n| `getApi()` | Returns the underlying FormCreate API |\n| `setSchema(rule, option)` | Replaces the current schema |\n\nIf the underlying submit flow does not produce `submitResult`, or validation fails, `submit()` returns `undefined`.\n\n## Exported Utilities\n\n```ts\nimport {\n  injectInfoToRules,\n  normalizePreviewRules,\n} from '@cardinal-odp/algo-params-vue';\n```\n\nThese helpers are pure functions and can be used outside the component.\n\n## Wrapper Behavior\n\nThis package keeps native rendering on top of `@form-create/ant-design-vue`, and adds:\n\n- `option.formData` backfill into `rule`\n- preview normalization for `select`, `cascader`, `switch`, `radio`, `checkbox`, `datePicker`, `timePicker`, and `slider`\n- info tooltip injection for fields and `type: 'div'` title blocks\n- serialized function restoration for schema values exported from `form-create`\n\n## Styling\n\nThe package ships a standalone stylesheet.\n\nCustom colors now follow the active Ant Design Vue theme token by default. You can still override them with CSS variables.\n\n```css\n--fc-create-control-max-width\n--fc-create-empty-color\n--fc-create-card-hover-shadow\n--fc-create-shadow-color\n```\n\n## Notes\n\n- This package renders an existing schema; it does not generate schema from business JSON.\n- Business-specific submit requests, dirty-state handling, and schema generation should stay outside the package.\n","readmeFilename":"README.md"}