@mage-ui/components 1.0.173 → 1.0.175
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/forms/multi-step/MultiForm.d.mts +1 -0
- package/dist/components/forms/multi-step/MultiForm.d.mts.map +1 -1
- package/dist/components/forms/multi-step/MultiForm.mjs.map +1 -1
- package/dist/components/forms/multi-step/Step.d.mts +1 -0
- package/dist/components/forms/multi-step/Step.d.mts.map +1 -1
- package/dist/components/forms/multi-step/Step.mjs +1 -1
- package/dist/components/forms/multi-step/Step.mjs.map +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiForm.d.mts","names":[],"sources":["../../../../src/components/forms/multi-step/MultiForm.tsx"],"mappings":";;;;;;KAiBY,kBAAA;EACV,IAAA;EACA,KAAA,EAAO,WAAA;EACP,KAAA;EACA,WAAA;EACA,QAAA,EAAU,WAAA;AAAA;AAAA,cAGC,aAAA;EAAA,SAAyB,kBAAA;;;KAG1B,cAAA;EACV,IAAA;EACA,QAAA,EAAU,SAAA;EACV,OAAA,EAAS,aAAA;IAAgB,MAAA,EAAQ,OAAA;EAAA;EACjC,OAAA,EAAS,aAAA;EACT,UAAA;IAAe,IAAA;EAAA;
|
|
1
|
+
{"version":3,"file":"MultiForm.d.mts","names":[],"sources":["../../../../src/components/forms/multi-step/MultiForm.tsx"],"mappings":";;;;;;KAiBY,kBAAA;EACV,IAAA;EACA,KAAA,EAAO,WAAA;EACP,KAAA;EACA,WAAA;EACA,QAAA,EAAU,WAAA;AAAA;AAAA,cAGC,aAAA;EAAA,SAAyB,kBAAA;;;KAG1B,cAAA;EACV,IAAA;EACA,QAAA,EAAU,SAAA;EACV,OAAA,EAAS,aAAA;IAAgB,MAAA,EAAQ,OAAA;EAAA;EACjC,OAAA,EAAS,aAAA;EACT,UAAA;IAAe,IAAA;IAAe,SAAA;EAAA;EAC9B,YAAA,GAAe,IAAA,CAAK,YAAA;AAAA;AAAA,cAkET,SAAA;EAAS,IAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,UAAA;EAAA;AAAA,GAxDnB,cAAA,KAAc,kBAAA,CAAA,GAAA,CAAA,OAAA;;aAnBqB,kBAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiForm.mjs","names":[],"sources":["../../../../src/components/forms/multi-step/MultiForm.tsx"],"sourcesContent":["import {\n Children,\n type ComponentType,\n isValidElement,\n type ReactNode,\n useCallback,\n useState,\n} from 'react';\n\nimport { Formity } from '@formity/react';\n\nimport { NoSsr } from '../../misc/no-ssr/NoSsr';\nimport type { StepperProps } from '../../navigations/stepper/Stepper';\nimport type { SchemaProps } from './parser/Schema';\nimport { Schemas } from './parser/Schemas';\nimport { storage } from './parser/utils/use-local-storage';\n\nexport type MultiFormStepProps = {\n name: string;\n rules: SchemaProps['rules'];\n label?: string;\n description?: string;\n children: SchemaProps['form'];\n};\n\nexport const MultiFormStep = (_props: MultiFormStepProps) => null;\nMultiFormStep.displayName = 'MultiForm.Step';\n\nexport type MultiFormProps = {\n name: string;\n children: ReactNode;\n Success: ComponentType<{ values: Partial<unknown> }>;\n Loading: ComponentType;\n classNames?: { root?: string };\n stepperProps?: Omit<StepperProps, 'children' | 'active'>;\n};\n\nconst MultiFormBase = ({\n name,\n children,\n Success,\n Loading,\n classNames,\n stepperProps,\n}: MultiFormProps) => {\n const [submitted, setSubmitted] = useState(false);\n const [fields, setFields] = useState({});\n\n const onChange = useCallback(\n (values: Partial<unknown>) => {\n setFields({ ...fields, ...values });\n },\n [fields],\n );\n\n const onSubmit = useCallback(() => {\n setSubmitted(true);\n }, []);\n\n if (submitted) {\n storage.set(name, {});\n return <Success values={fields} />;\n }\n\n const schema: SchemaProps[] = Children.toArray(children)\n .filter(isValidElement)\n .map((element) => {\n if (element.type !== MultiFormStep) {\n throw new Error('MultiForm children must be MultiForm.Step elements');\n }\n const props = element.props as MultiFormStepProps;\n return {\n name: props.name,\n rules: props.rules,\n label: props.label,\n description: props.description,\n form: props.children,\n };\n });\n\n const schemaObj = new Schemas(\n name,\n schema,\n storage.get(name, {}),\n classNames,\n stepperProps,\n );\n\n return (\n <NoSsr fallback={<Loading />}>\n <Formity\n schema={schemaObj.toRender()}\n params={{ fields, onChange, onSubmit }}\n initialState={schemaObj.currentState()}\n onReturn={onSubmit}\n />\n </NoSsr>\n );\n};\n\nexport const MultiForm = Object.assign(MultiFormBase, { Step: MultiFormStep });\n"],"mappings":"uUAyBA,MAAa,EAAiB,GAA+B,KAC7D,EAAc,YAAc,iBA0E5B,MAAa,EAAY,OAAO,QA/DT,CACrB,OACA,WACA,UACA,UACA,aACA,kBACoB,CACpB,GAAM,CAAC,EAAW,GAAgB,EAAS,GAAM,CAC3C,CAAC,EAAQ,GAAa,EAAS,EAAE,CAAC,CAElC,EAAW,EACd,GAA6B,CAC5B,EAAU,CAAE,GAAG,EAAQ,GAAG,EAAQ,CAAC,EAErC,CAAC,EAAO,CACT,CAEK,EAAW,MAAkB,CACjC,EAAa,GAAK,EACjB,EAAE,CAAC,CAEN,GAAI,EAEF,OADA,EAAQ,IAAI,EAAM,EAAE,CAAC,CACd,EAAC,EAAD,CAAS,OAAQ,EAAU,CAAA,CAmBpC,IAAM,EAAY,IAAI,EACpB,EAjB4B,EAAS,QAAQ,EAAS,CACrD,OAAO,EAAe,CACtB,IAAK,GAAY,CAChB,GAAI,EAAQ,OAAS,EACnB,MAAU,MAAM,qDAAqD,CAEvE,IAAM,EAAQ,EAAQ,MACtB,MAAO,CACL,KAAM,EAAM,KACZ,MAAO,EAAM,MACb,MAAO,EAAM,MACb,YAAa,EAAM,YACnB,KAAM,EAAM,SACb,EACD,CAKF,EAAQ,IAAI,EAAM,EAAE,CAAC,CACrB,EACA,EACD,CAED,OACE,EAAC,EAAD,CAAO,SAAU,EAAC,EAAD,EAAW,CAAA,UAC1B,EAAC,EAAD,CACE,OAAQ,EAAU,UAAU,CAC5B,OAAQ,CAAE,SAAQ,WAAU,WAAU,CACtC,aAAc,EAAU,cAAc,CACtC,SAAU,EACV,CAAA,CACI,CAAA,EAI0C,CAAE,KAAM,EAAe,CAAC"}
|
|
1
|
+
{"version":3,"file":"MultiForm.mjs","names":[],"sources":["../../../../src/components/forms/multi-step/MultiForm.tsx"],"sourcesContent":["import {\n Children,\n type ComponentType,\n isValidElement,\n type ReactNode,\n useCallback,\n useState,\n} from 'react';\n\nimport { Formity } from '@formity/react';\n\nimport { NoSsr } from '../../misc/no-ssr/NoSsr';\nimport type { StepperProps } from '../../navigations/stepper/Stepper';\nimport type { SchemaProps } from './parser/Schema';\nimport { Schemas } from './parser/Schemas';\nimport { storage } from './parser/utils/use-local-storage';\n\nexport type MultiFormStepProps = {\n name: string;\n rules: SchemaProps['rules'];\n label?: string;\n description?: string;\n children: SchemaProps['form'];\n};\n\nexport const MultiFormStep = (_props: MultiFormStepProps) => null;\nMultiFormStep.displayName = 'MultiForm.Step';\n\nexport type MultiFormProps = {\n name: string;\n children: ReactNode;\n Success: ComponentType<{ values: Partial<unknown> }>;\n Loading: ComponentType;\n classNames?: { root?: string; multiForm?: string };\n stepperProps?: Omit<StepperProps, 'children' | 'active'>;\n};\n\nconst MultiFormBase = ({\n name,\n children,\n Success,\n Loading,\n classNames,\n stepperProps,\n}: MultiFormProps) => {\n const [submitted, setSubmitted] = useState(false);\n const [fields, setFields] = useState({});\n\n const onChange = useCallback(\n (values: Partial<unknown>) => {\n setFields({ ...fields, ...values });\n },\n [fields],\n );\n\n const onSubmit = useCallback(() => {\n setSubmitted(true);\n }, []);\n\n if (submitted) {\n storage.set(name, {});\n return <Success values={fields} />;\n }\n\n const schema: SchemaProps[] = Children.toArray(children)\n .filter(isValidElement)\n .map((element) => {\n if (element.type !== MultiFormStep) {\n throw new Error('MultiForm children must be MultiForm.Step elements');\n }\n const props = element.props as MultiFormStepProps;\n return {\n name: props.name,\n rules: props.rules,\n label: props.label,\n description: props.description,\n form: props.children,\n };\n });\n\n const schemaObj = new Schemas(\n name,\n schema,\n storage.get(name, {}),\n classNames,\n stepperProps,\n );\n\n return (\n <NoSsr fallback={<Loading />}>\n <Formity\n schema={schemaObj.toRender()}\n params={{ fields, onChange, onSubmit }}\n initialState={schemaObj.currentState()}\n onReturn={onSubmit}\n />\n </NoSsr>\n );\n};\n\nexport const MultiForm = Object.assign(MultiFormBase, { Step: MultiFormStep });\n"],"mappings":"uUAyBA,MAAa,EAAiB,GAA+B,KAC7D,EAAc,YAAc,iBA0E5B,MAAa,EAAY,OAAO,QA/DT,CACrB,OACA,WACA,UACA,UACA,aACA,kBACoB,CACpB,GAAM,CAAC,EAAW,GAAgB,EAAS,GAAM,CAC3C,CAAC,EAAQ,GAAa,EAAS,EAAE,CAAC,CAElC,EAAW,EACd,GAA6B,CAC5B,EAAU,CAAE,GAAG,EAAQ,GAAG,EAAQ,CAAC,EAErC,CAAC,EAAO,CACT,CAEK,EAAW,MAAkB,CACjC,EAAa,GAAK,EACjB,EAAE,CAAC,CAEN,GAAI,EAEF,OADA,EAAQ,IAAI,EAAM,EAAE,CAAC,CACd,EAAC,EAAD,CAAS,OAAQ,EAAU,CAAA,CAmBpC,IAAM,EAAY,IAAI,EACpB,EAjB4B,EAAS,QAAQ,EAAS,CACrD,OAAO,EAAe,CACtB,IAAK,GAAY,CAChB,GAAI,EAAQ,OAAS,EACnB,MAAU,MAAM,qDAAqD,CAEvE,IAAM,EAAQ,EAAQ,MACtB,MAAO,CACL,KAAM,EAAM,KACZ,MAAO,EAAM,MACb,MAAO,EAAM,MACb,YAAa,EAAM,YACnB,KAAM,EAAM,SACb,EACD,CAKF,EAAQ,IAAI,EAAM,EAAE,CAAC,CACrB,EACA,EACD,CAED,OACE,EAAC,EAAD,CAAO,SAAU,EAAC,EAAD,EAAW,CAAA,UAC1B,EAAC,EAAD,CACE,OAAQ,EAAU,UAAU,CAC5B,OAAQ,CAAE,SAAQ,WAAU,WAAU,CACtC,aAAc,EAAU,cAAc,CACtC,SAAU,EACV,CAAA,CACI,CAAA,EAI0C,CAAE,KAAM,EAAe,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Step.d.mts","names":[],"sources":["../../../../src/components/forms/multi-step/Step.tsx"],"mappings":";;;;;;KAUY,KAAA;EACV,MAAA;EACA,KAAA,EAAO,CAAA,CAAE,OAAA;EACT,IAAA;IAAQ,OAAA;IAAiB,KAAA;EAAA;EACzB,KAAA;IAAS,KAAA;IAAe,WAAA;EAAA;EACxB,MAAA,EAAQ,MAAA;EACR,MAAA,EAAQ,MAAA;EACR,QAAA,EAAU,QAAA;EACV,QAAA,EAAU,QAAA;EACV,OAAA,GAAU,MAAA,EAAQ,MAAA;EAClB,IAAA,GAAO,IAAA;EACP,OAAA;EACA,UAAA;IAAe,IAAA;EAAA;
|
|
1
|
+
{"version":3,"file":"Step.d.mts","names":[],"sources":["../../../../src/components/forms/multi-step/Step.tsx"],"mappings":";;;;;;KAUY,KAAA;EACV,MAAA;EACA,KAAA,EAAO,CAAA,CAAE,OAAA;EACT,IAAA;IAAQ,OAAA;IAAiB,KAAA;EAAA;EACzB,KAAA;IAAS,KAAA;IAAe,WAAA;EAAA;EACxB,MAAA,EAAQ,MAAA;EACR,MAAA,EAAQ,MAAA;EACR,QAAA,EAAU,QAAA;EACV,QAAA,EAAU,QAAA;EACV,OAAA,GAAU,MAAA,EAAQ,MAAA;EAClB,IAAA,GAAO,IAAA;EACP,OAAA;EACA,UAAA;IAAe,IAAA;IAAe,SAAA;EAAA;EAC9B,YAAA,GAAe,IAAA,CAAK,YAAA;EACpB,SAAA,EAAW,aAAA;IACT,aAAA;IACA,KAAA,EAAO,CAAA,CAAE,OAAA;IACT,IAAA;MAAQ,OAAA;MAAiB,KAAA;IAAA;IACzB,MAAA,EAAQ,MAAA;IACR,MAAA,EAAQ,MAAA;IACR,QAAA,EAAU,QAAA;IACV,QAAA,EAAU,QAAA;IACV,OAAA,GAAU,MAAA,EAAQ,MAAA;IAClB,IAAA,GAAO,IAAA;EAAA;AAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Stepper as e}from"../../navigations/stepper/Stepper.mjs";import{MultiFormContext as t}from"./MultiFormContext.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{multiForm as r,multiFormRoot as i}from"@mage-ui/styled-system/recipes";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{useMemo as s}from"react";const c=({values:c,rules:l,step:u,steps:d,onBack:f,onNext:p,getState:m,setState:h,onWatch:g,goTo:_,onEnter:v,classNames:y,stepperProps:b,Component:x,...S})=>{let C=s(()=>({onNext:p,onBack:f,getState:m,setState:h,onWatch:g,onEnter:v,goTo:_,step:u}),[p,f,m,h,g,v,_,u]);return v(),a(t.Provider,{value:C,children:o(`div`,{className:n(r(),y?.root??i()),children:[a(e,{allowNextStepsSelect:!1,...b,onStepClick:b?.onStepClick??(e=>_(e+1)),active:u.current-1,children:d.map(t=>a(e.Step,{label:t.label,description:t.description},t.label))}),a(x,{defaultValues:c,rules:l,...C,...S})]})})};export{c as Step};
|
|
1
|
+
import{Stepper as e}from"../../navigations/stepper/Stepper.mjs";import{MultiFormContext as t}from"./MultiFormContext.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{multiForm as r,multiFormRoot as i}from"@mage-ui/styled-system/recipes";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{useMemo as s}from"react";const c=({values:c,rules:l,step:u,steps:d,onBack:f,onNext:p,getState:m,setState:h,onWatch:g,goTo:_,onEnter:v,classNames:y,stepperProps:b,Component:x,...S})=>{let C=s(()=>({onNext:p,onBack:f,getState:m,setState:h,onWatch:g,onEnter:v,goTo:_,step:u}),[p,f,m,h,g,v,_,u]);return v(),a(t.Provider,{value:C,children:o(`div`,{className:n(y?.multiForm??r(),y?.root??i()),children:[a(e,{allowNextStepsSelect:!1,...b,onStepClick:b?.onStepClick??(e=>_(e+1)),active:u.current-1,children:d.map(t=>a(e.Step,{label:t.label,description:t.description},t.label))}),a(x,{defaultValues:c,rules:l,...C,...S})]})})};export{c as Step};
|
|
2
2
|
//# sourceMappingURL=Step.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Step.mjs","names":[],"sources":["../../../../src/components/forms/multi-step/Step.tsx"],"sourcesContent":["import { type ComponentType, useMemo } from 'react';\nimport type { z } from 'zod';\n\nimport type { GetState, OnBack, OnNext, SetState } from '@formity/react';\nimport { cx } from '@mage-ui/styled-system/css';\nimport { multiForm, multiFormRoot } from '@mage-ui/styled-system/recipes';\n\nimport { Stepper, type StepperProps } from '../../navigations/stepper/Stepper';\nimport { MultiFormContext } from './MultiFormContext';\n\nexport type Props = {\n values: object;\n rules: z.ZodType;\n step: { current: number; total: number };\n steps: { label: string; description?: string }[];\n onBack: OnBack;\n onNext: OnNext;\n getState: GetState;\n setState: SetState;\n onWatch: (values: Record<string, unknown>) => void;\n goTo: (step: number) => void;\n onEnter: () => void;\n classNames?: { root?: string };\n stepperProps?: Omit<StepperProps, 'children' | 'active'>;\n Component: ComponentType<{\n defaultValues: object;\n rules: z.ZodType;\n step: { current: number; total: number };\n onBack: OnBack;\n onNext: OnNext;\n getState: GetState;\n setState: SetState;\n onWatch: (values: Record<string, unknown>) => void;\n goTo: (step: number) => void;\n }>;\n};\n\nexport const Step = ({\n values,\n rules,\n step,\n steps,\n onBack,\n onNext,\n getState,\n setState,\n onWatch,\n goTo,\n onEnter,\n classNames,\n stepperProps,\n Component,\n ...props\n}: Props) => {\n const value = useMemo(\n () => ({\n onNext,\n onBack,\n getState,\n setState,\n onWatch,\n onEnter,\n goTo,\n step,\n }),\n [onNext, onBack, getState, setState, onWatch, onEnter, goTo, step],\n );\n onEnter();\n return (\n <MultiFormContext.Provider value={value}>\n <div
|
|
1
|
+
{"version":3,"file":"Step.mjs","names":[],"sources":["../../../../src/components/forms/multi-step/Step.tsx"],"sourcesContent":["import { type ComponentType, useMemo } from 'react';\nimport type { z } from 'zod';\n\nimport type { GetState, OnBack, OnNext, SetState } from '@formity/react';\nimport { cx } from '@mage-ui/styled-system/css';\nimport { multiForm, multiFormRoot } from '@mage-ui/styled-system/recipes';\n\nimport { Stepper, type StepperProps } from '../../navigations/stepper/Stepper';\nimport { MultiFormContext } from './MultiFormContext';\n\nexport type Props = {\n values: object;\n rules: z.ZodType;\n step: { current: number; total: number };\n steps: { label: string; description?: string }[];\n onBack: OnBack;\n onNext: OnNext;\n getState: GetState;\n setState: SetState;\n onWatch: (values: Record<string, unknown>) => void;\n goTo: (step: number) => void;\n onEnter: () => void;\n classNames?: { root?: string; multiForm?: string };\n stepperProps?: Omit<StepperProps, 'children' | 'active'>;\n Component: ComponentType<{\n defaultValues: object;\n rules: z.ZodType;\n step: { current: number; total: number };\n onBack: OnBack;\n onNext: OnNext;\n getState: GetState;\n setState: SetState;\n onWatch: (values: Record<string, unknown>) => void;\n goTo: (step: number) => void;\n }>;\n};\n\nexport const Step = ({\n values,\n rules,\n step,\n steps,\n onBack,\n onNext,\n getState,\n setState,\n onWatch,\n goTo,\n onEnter,\n classNames,\n stepperProps,\n Component,\n ...props\n}: Props) => {\n const value = useMemo(\n () => ({\n onNext,\n onBack,\n getState,\n setState,\n onWatch,\n onEnter,\n goTo,\n step,\n }),\n [onNext, onBack, getState, setState, onWatch, onEnter, goTo, step],\n );\n onEnter();\n return (\n <MultiFormContext.Provider value={value}>\n <div\n className={cx(\n classNames?.multiForm ?? multiForm(),\n classNames?.root ?? multiFormRoot(),\n )}\n >\n <Stepper\n allowNextStepsSelect={false}\n {...stepperProps}\n onStepClick={\n stepperProps?.onStepClick ?? ((index: number) => goTo(index + 1))\n }\n active={step.current - 1}\n >\n {steps.map((s) => (\n <Stepper.Step\n key={s.label}\n label={s.label}\n description={s.description}\n />\n ))}\n </Stepper>\n <Component defaultValues={values} rules={rules} {...value} {...props} />\n </div>\n </MultiFormContext.Provider>\n );\n};\n"],"mappings":"0UAqCA,MAAa,GAAQ,CACnB,SACA,QACA,OACA,QACA,SACA,SACA,WACA,WACA,UACA,OACA,UACA,aACA,eACA,YACA,GAAG,KACQ,CACX,IAAM,EAAQ,OACL,CACL,SACA,SACA,WACA,WACA,UACA,UACA,OACA,OACD,EACD,CAAC,EAAQ,EAAQ,EAAU,EAAU,EAAS,EAAS,EAAM,EAAK,CACnE,CAED,OADA,GAAS,CAEP,EAAC,EAAiB,SAAlB,CAAkC,iBAChC,EAAC,MAAD,CACE,UAAW,EACT,GAAY,WAAa,GAAW,CACpC,GAAY,MAAQ,GAAe,CACpC,UAJH,CAME,EAAC,EAAD,CACE,qBAAsB,GACtB,GAAI,EACJ,YACE,GAAc,cAAiB,GAAkB,EAAK,EAAQ,EAAE,EAElE,OAAQ,EAAK,QAAU,WAEtB,EAAM,IAAK,GACV,EAAC,EAAQ,KAAT,CAEE,MAAO,EAAE,MACT,YAAa,EAAE,YACf,CAHK,EAAE,MAGP,CACF,CACM,CAAA,CACV,EAAC,EAAD,CAAW,cAAe,EAAe,QAAO,GAAI,EAAO,GAAI,EAAS,CAAA,CACpE,GACoB,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mage-ui/components",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.175",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [],
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"rimraf": "^6.1.3",
|
|
26
26
|
"tsdown": "^0.21.4",
|
|
27
27
|
"typescript": "^5.9.3",
|
|
28
|
-
"@mage-ui/
|
|
29
|
-
"@mage-ui/
|
|
28
|
+
"@mage-ui/styled-system": "1.0.8",
|
|
29
|
+
"@mage-ui/preset": "1.0.175"
|
|
30
30
|
},
|
|
31
31
|
"peerDependencies": {
|
|
32
32
|
"@dnd-kit/core": "^6.3.1",
|