mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 12:39:49 +08:00
1 line
36 KiB
JavaScript
1 line
36 KiB
JavaScript
(("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd=("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd||[]).push([["a95dcff2"],{a95dcff2:function(e,t,n){"use strict";var a=n("852bbaa9")._;n.d(t,"__esModule",{value:!0}),n.d(t,"demos",{enumerable:!0,get:function(){return u;}});var d=n("852bbaa9"),o=d._(n("5b220c3d"));n("22a6b235");var r=d._(n("a9d1a279")),s=d._(n("e22febe0")),i=d._(n("072ab8a9")),l=d._(n("3835a2b7")),m=d._(n("16cb2bc0"));let u={"form-demo-basic":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"961e3d0f"))))),asset:{type:"BLOCK",id:"form-demo-basic",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("0b688409").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Basic Usage",description:"Basic Form data control. Includes layout, initial values, validation and submit."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-control-hooks":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"4875973b"))))),asset:{type:"BLOCK",id:"form-demo-control-hooks",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("a8d3e582").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form methods",description:"Call form method with Form.useForm.\n\n> Note that useForm is a React Hooks [https://reactjs.org/docs/hooks-intro.html] that only works in functional component. You can also use ref to get the form instance in class component: https://codesandbox.io/p/sandbox-ngtjtm [https://codesandbox.io/p/sandbox-ngtjtm]"},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-layout":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"ca2a05ad"))))),asset:{type:"BLOCK",id:"form-demo-layout",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("4806efc2").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form Layout",description:"There are three layout for form: horizontal, vertical, inline."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-layout-multiple":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"b71181f2"))))),asset:{type:"BLOCK",id:"form-demo-layout-multiple",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("28a93f0f").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form mix layout",description:"Defining a separate layout on Form.Item can achieve multiple layouts for a single form."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-disabled":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"6bfc7484"))))),asset:{type:"BLOCK",id:"form-demo-disabled",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("2bb80b5e").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form disabled",description:"Set component to disabled, only works for antd components."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-variant":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"a03716b3"))))),asset:{type:"BLOCK",id:"form-demo-variant",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("52f39349").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form variants",description:"Change the variant of all components in the form, options include: outlined, filled and borderless"},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-required-mark":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"ea49f4e2"))))),asset:{type:"BLOCK",id:"form-demo-required-mark",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("97890791").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Required style",description:"Switch required or optional style with requiredMark."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-size":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"98a373ae"))))),asset:{type:"BLOCK",id:"form-demo-size",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("3a480c85").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form size",description:"Set component size, only works for antd components."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-layout-can-wrap":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"b0bd8e9e"))))),asset:{type:"BLOCK",id:"form-demo-layout-can-wrap",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("7fd2978e").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"label can wrap",description:"Turn on labelWrap to wrap label if text is long."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-warning-only":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"f7c51f5c"))))),asset:{type:"BLOCK",id:"form-demo-warning-only",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("c8cb757b").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"No block rule",description:"rule with warningOnly will not block form submit."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-usewatch":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"eed8fa9b"))))),asset:{type:"BLOCK",id:"form-demo-usewatch",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("0912217a").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Watch Hooks",description:"useWatch helps watch the field change and only re-render for the value change. API Ref."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-validate-trigger":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"6788b7e0"))))),asset:{type:"BLOCK",id:"form-demo-validate-trigger",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("b83529d0").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Validate Trigger",description:"For the async validation scenario, high frequency of verification will cause backend pressure. You can change the verification timing through validateTrigger, or change the verification frequency through validateDebounce, or set the verification short circuit through validateFirst."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-validate-only":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"90b8144d"))))),asset:{type:"BLOCK",id:"form-demo-validate-only",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("2a0ae940").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Validate Only",description:"Dynamic adjust submit button's disabled status by validateOnly of validateFields."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-form-item-path":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"4fae21d7"))))),asset:{type:"BLOCK",id:"form-demo-form-item-path",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("9a3afa00").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Path Prefix",description:"In some scenarios, you may want to set a prefix for some fields consistently. You can achieve this effect with HOC."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-dynamic-form-item":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"fc6cc44b"))))),asset:{type:"BLOCK",id:"form-demo-dynamic-form-item",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("9911d56e").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Dynamic Form Item",description:"Add or remove form items dynamically. add function support config initial value."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-dynamic-form-items":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"1b4c3264"))))),asset:{type:"BLOCK",id:"form-demo-dynamic-form-items",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("bea67a69").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Dynamic Form nest Items",description:"Nest dynamic field need extends field. Pass field.name to nest item."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-dynamic-form-items-no-style":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"47f5c134"))))),asset:{type:"BLOCK",id:"form-demo-dynamic-form-items-no-style",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("e463a93d").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Dynamic Form nest pure Items",description:"Nest with noStyle field dynamic form."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-dynamic-form-items-complex":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"69b980bc"))))),asset:{type:"BLOCK",id:"form-demo-dynamic-form-items-complex",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("81c39f47").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Complex Dynamic Form Item",description:"Multiple Form.List nested usage scenarios."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-nest-messages":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"65a4f691"))))),asset:{type:"BLOCK",id:"form-demo-nest-messages",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("6942931d").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Nest",description:"name prop support nest data structure. Customize validate message template with validateMessages or message. Ref here [https://github.com/react-component/field-form/blob/master/src/utils/messages.ts] about message template."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-complex-form-control":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"cc09b64f"))))),asset:{type:"BLOCK",id:"form-demo-complex-form-control",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("d1b1fadc").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"complex form control",description:'This demo shows how to use Form.Item with multiple controls. <Form.Item name="field" /> will only bind the control(Input/Select) which is the only children of it. Imagine this case: you added some text description after the Input, then you have to wrap the Input by an extra <Form.Item name="field">. style property of Form.Item could be useful to modify the nested form item layout, or use <Form.Item noStyle /> to turn it into a pure form-binded component(like getFieldDecorator in 3.x).\n\n- <Form.Item label="Field" name="field">\n- <Input />\n- </Form.Item>\n+ <Form.Item label="Field">\n+ <Form.Item name="field" noStyle><Input /></Form.Item> // that will bind input\n+ <span>description</span>\n+ </Form.Item>\n\n\nThis demo shows three typical usages:\n\n * Username: extra elements after control, using <Form.Item name="field" noStyle /> inside Form.Item to bind Input.\n * Address: two controls in one line, using two <Form.Item name="field" noStyle /> to bind each control.\n * BirthDate\uFF1Atwo controls in one line with independent error message, using two <Form.Item name="field" noStyle /> to bind each control, make layout inline by customizing style property.\n\n> Note that, in this case, no more name property should be left in Form.Item with label.\n\nSee the Customized Form Controls demo below for more advanced usage.'},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-customized-form-controls":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"6377d3f3"))))),asset:{type:"BLOCK",id:"form-demo-customized-form-controls",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("2523039b").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Customized Form Controls",description:"Customized or third-party form controls can be used in Form, too. Controls must follow these conventions:\n\n> * It has a controlled property value or other name which is equal to the value of valuePropName.\n> * It has event onChange or an event which name is equal to the value of trigger.\n> * Forward the ref or pass the id property to dom to support the scrollToField method."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-global-state":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"bd42b873"))))),asset:{type:"BLOCK",id:"form-demo-global-state",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("ca6fb7ce").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Store Form Data into Upper Component",description:"We can store form data into upper component or Redux [https://github.com/reactjs/redux] or dva [https://github.com/dvajs/dva] by using onFieldsChange and fields, see more at this rc-field-form demo [https://rc-field-form.react-component.now.sh/?selectedKind=rc-field-form&selectedStory=StateForm-redux&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Factions%2Factions-panel].\n\nNote: Save Form data globally is not a good practice [https://github.com/reduxjs/redux/issues/1287#issuecomment-175351978]. You should avoid this if not necessary."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-form-context":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"d385a937"))))),asset:{type:"BLOCK",id:"form-demo-form-context",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("4987b30f").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Control between forms",description:'Use Form.Provider to process data between forms. In this case, submit button is in the Modal which is out of Form. You can use form.submit to submit form. Besides, we recommend native <Button htmlType="submit" /> to submit a form.'},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-inline-login":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"b5049da1"))))),asset:{type:"BLOCK",id:"form-demo-inline-login",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("4b0e807c").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Inline Login Form",description:"Inline login form is often used in navigation bar."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-login":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"876123f4"))))),asset:{type:"BLOCK",id:"form-demo-login",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("3fcf7b48").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Login Form",description:"Normal login form which can contain more elements."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-register":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"7f970355"))))),asset:{type:"BLOCK",id:"form-demo-register",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("e35d0e3f").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Registration",description:"Fill in this form to create a new account for you."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-advanced-search":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"ed6de1c1"))))),asset:{type:"BLOCK",id:"form-demo-advanced-search",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("aa6f96b2").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Advanced search",description:"Three columns layout is often used for advanced searching of data table.\n\nBecause the width of label is not fixed, you may need to adjust it by customizing its style."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-form-in-modal":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"7dfb9606"))))),asset:{type:"BLOCK",id:"form-demo-form-in-modal",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("974a1a8c").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Form in Modal to Create",description:"When user visit a page with a list of items, and want to create a new item. The page can popup a form in Modal, then let user fill in the form to create an item."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-time-related-controls":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"5ba6697a"))))),asset:{type:"BLOCK",id:"form-demo-time-related-controls",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("4adbe695").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Time-related Controls",description:"The value of time-related components is a dayjs object, which we need to pre-process it before we submit to server."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-without-form-create":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"c260cfff"))))),asset:{type:"BLOCK",id:"form-demo-without-form-create",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("006c2401").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Handle Form Data Manually",description:"Form will collect and validate form data automatically. But if you don't need this feature or the default behavior cannot satisfy your business, you can handle form data manually."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-validate-static":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"9c9ca5a8"))))),asset:{type:"BLOCK",id:"form-demo-validate-static",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("5f437b44").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Customized Validation",description:"We provide properties like validateStatus help hasFeedback to customize your own validate status and message, without using Form.\n\n 1. validateStatus: validate status of form components which could be 'success', 'warning', 'error', 'validating'.\n 2. hasFeedback: display feed icon of input control\n 3. help: display validate message."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-dynamic-rule":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"ec4fd198"))))),asset:{type:"BLOCK",id:"form-demo-dynamic-rule",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("8a4b2bdd").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Dynamic Rules",description:"Perform different check rules according to different situations."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-form-dependencies":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"a55e1b4f"))))),asset:{type:"BLOCK",id:"form-demo-form-dependencies",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("bacab65a").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Dependencies",description:"Form.Item can set the associated field through the dependencies property. When the value of the associated field changes, the validation and update will be triggered."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-getvalueprops-normalize":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"503ab682"))))),asset:{type:"BLOCK",id:"form-demo-getvalueprops-normalize",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("4643e445").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"},dayjs:{type:"NPM",value:"1.11.13"}},entry:"index.tsx",title:"getValueProps + normalize",description:"By combining getValueProps and normalize, it is possible to convert the format of value, such as converting the timestamp into a dayjs object and then passing it to the DatePicker."},context:{react:o,antd:r,dayjs:i},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-validate-scroll-to-field":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"bced356d"))))),asset:{type:"BLOCK",id:"form-demo-validate-scroll-to-field",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("fd8cffb7").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Slide to error field",description:"When validation fails or manually scroll to the error field."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-validate-other":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"0a09b904"))))),asset:{type:"BLOCK",id:"form-demo-validate-other",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("33b91ee5").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Other Form Controls",description:"Demonstration of validation configuration for form controls which are not shown in the demos above."},context:{react:o,"@ant-design/icons":s,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-disabled-input-debug":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"2c7da363"))))),asset:{type:"BLOCK",id:"form-demo-disabled-input-debug",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("b4729640").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Disabled Input Debug",description:"Test disabled Input with validate state."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-label-debug":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"3db1ac08"))))),asset:{type:"BLOCK",id:"form-demo-label-debug",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("d566e942").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"label ellipsis",description:"Use <Typography.Text ellipsis> in label should show ...."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-col-24-debug":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"815a1629"))))),asset:{type:"BLOCK",id:"form-demo-col-24-debug",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("3756071d").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Test col 24 usage",description:"See issue #32980 [https://github.com/ant-design/ant-design/issues/32980]."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-ref-item":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"c47f4b77"))))),asset:{type:"BLOCK",id:"form-demo-ref-item",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("7a6a8e90").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Ref item",description:"Use ref first!"},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-custom-feedback-icons":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"4b6ab30d"))))),asset:{type:"BLOCK",id:"form-demo-custom-feedback-icons",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("03dc0a55").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},"@ant-design/icons":{type:"NPM",value:"5.5.1"},antd:{type:"NPM",value:"5.22.2"},"antd-style":{type:"NPM",value:"3.7.1"},lodash:{type:"NPM",value:"4.17.21"}},entry:"index.tsx",title:"Custom feedback icons",description:"Custom feedback icons can be passed by hasFeedback={{ icons: ... }} or <Form feedbackIcons={icons}> (Form.Item must has hasFeedback attribute)."},context:{react:o,"@ant-design/icons":s,antd:r,"antd-style":l,"lodash/uniqueId":m},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}},"form-demo-component-token":{component:o.default.memo(o.default.lazy(()=>Promise.all([n.ensure("vendors_1"),n.ensure("common"),n.ensure("73128d56")]).then(n.dr(a,n.bind(n,"37e24185"))))),asset:{type:"BLOCK",id:"form-demo-component-token",refAtomIds:["form"],dependencies:{"index.tsx":{type:"FILE",value:n("7062acac").default},react:{type:"NPM",value:"18.3.0-canary-c3048aab4-20240326"},antd:{type:"NPM",value:"5.22.2"}},entry:"index.tsx",title:"Component Token",description:"Component Token Debug."},context:{react:o,antd:r},renderOpts:{compile:async(...e)=>(await Promise.all([n.ensure("vendors_1"),n.ensure("vendors_0"),n.ensure("d2b37e0b")]).then(n.dr(a,n.bind(n,"d2b37e0b")))).default(...e)}}};}}]); |