@tipp/ui 2.0.5 → 2.1.0
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/app/index.cjs +505 -308
- package/dist/app/index.cjs.map +1 -1
- package/dist/app/index.js +65 -60
- package/dist/app/platform/coach-question-list.cjs +231 -34
- package/dist/app/platform/coach-question-list.cjs.map +1 -1
- package/dist/app/platform/coach-question-list.js +38 -33
- package/dist/app/platform/contents-card.cjs +259 -62
- package/dist/app/platform/contents-card.cjs.map +1 -1
- package/dist/app/platform/contents-card.js +38 -33
- package/dist/app/platform/curriculum-card.cjs +213 -16
- package/dist/app/platform/curriculum-card.cjs.map +1 -1
- package/dist/app/platform/curriculum-card.js +11 -6
- package/dist/app/platform/edit-coaching-time.cjs +275 -78
- package/dist/app/platform/edit-coaching-time.cjs.map +1 -1
- package/dist/app/platform/edit-coaching-time.js +48 -43
- package/dist/app/platform/edit-service-type.cjs +268 -71
- package/dist/app/platform/edit-service-type.cjs.map +1 -1
- package/dist/app/platform/edit-service-type.js +47 -42
- package/dist/app/platform/goal-manage-card-edit.cjs +277 -80
- package/dist/app/platform/goal-manage-card-edit.cjs.map +1 -1
- package/dist/app/platform/goal-manage-card-edit.js +48 -43
- package/dist/app/platform/goal-manage-card-read.cjs +261 -64
- package/dist/app/platform/goal-manage-card-read.cjs.map +1 -1
- package/dist/app/platform/goal-manage-card-read.js +38 -33
- package/dist/app/platform/on-offline-radio-card.cjs +261 -64
- package/dist/app/platform/on-offline-radio-card.cjs.map +1 -1
- package/dist/app/platform/on-offline-radio-card.js +47 -42
- package/dist/app/platform/report-card.cjs +234 -37
- package/dist/app/platform/report-card.cjs.map +1 -1
- package/dist/app/platform/report-card.js +38 -33
- package/dist/app/platform/reservation-card.cjs +303 -106
- package/dist/app/platform/reservation-card.cjs.map +1 -1
- package/dist/app/platform/reservation-card.js +48 -43
- package/dist/app/platform/session-card.cjs +320 -123
- package/dist/app/platform/session-card.cjs.map +1 -1
- package/dist/app/platform/session-card.js +49 -44
- package/dist/app/platform/session-review-simple-read.cjs +232 -35
- package/dist/app/platform/session-review-simple-read.cjs.map +1 -1
- package/dist/app/platform/session-review-simple-read.js +38 -33
- package/dist/app/platform/userInfos/coaching-customer-info/index.cjs +265 -68
- package/dist/app/platform/userInfos/coaching-customer-info/index.cjs.map +1 -1
- package/dist/app/platform/userInfos/coaching-customer-info/index.js +41 -36
- package/dist/app/platform/userInfos/coaching-customer-info/large.cjs +242 -45
- package/dist/app/platform/userInfos/coaching-customer-info/large.cjs.map +1 -1
- package/dist/app/platform/userInfos/coaching-customer-info/large.js +38 -33
- package/dist/app/platform/userInfos/coaching-customer-info/medium.cjs +245 -48
- package/dist/app/platform/userInfos/coaching-customer-info/medium.cjs.map +1 -1
- package/dist/app/platform/userInfos/coaching-customer-info/medium.js +38 -33
- package/dist/app/platform/userInfos/coaching-customer-info/small.cjs +231 -34
- package/dist/app/platform/userInfos/coaching-customer-info/small.cjs.map +1 -1
- package/dist/app/platform/userInfos/coaching-customer-info/small.js +37 -32
- package/dist/app/platform/userInfos/session-user-info-detail.cjs +241 -44
- package/dist/app/platform/userInfos/session-user-info-detail.cjs.map +1 -1
- package/dist/app/platform/userInfos/session-user-info-detail.js +37 -32
- package/dist/app/platform/userInfos/utils.cjs +233 -36
- package/dist/app/platform/userInfos/utils.cjs.map +1 -1
- package/dist/app/platform/userInfos/utils.js +37 -32
- package/dist/atoms/index.cjs +256 -59
- package/dist/atoms/index.cjs.map +1 -1
- package/dist/atoms/index.js +73 -68
- package/dist/atoms/pagination.cjs +210 -13
- package/dist/atoms/pagination.cjs.map +1 -1
- package/dist/atoms/pagination.js +9 -4
- package/dist/atoms/toast.cjs +1 -1
- package/dist/atoms/toast.cjs.map +1 -1
- package/dist/atoms/toast.js +1 -1
- package/dist/chunk-26ZU5KUR.js +39 -0
- package/dist/chunk-26ZU5KUR.js.map +1 -0
- package/dist/chunk-4LUNQ3CA.js +1 -0
- package/dist/{chunk-2NPJVXPG.js → chunk-5QDXJKPG.js} +7 -7
- package/dist/{chunk-5KZGH6FB.js → chunk-6BCKUMXK.js} +2 -2
- package/dist/chunk-BUR6IEYN.js +54 -0
- package/dist/chunk-BUR6IEYN.js.map +1 -0
- package/dist/chunk-D3T4W2PT.js +96 -0
- package/dist/chunk-D3T4W2PT.js.map +1 -0
- package/dist/chunk-D7EHLF4N.js +63 -0
- package/dist/chunk-D7EHLF4N.js.map +1 -0
- package/dist/chunk-D7EYDD4E.js +52 -0
- package/dist/chunk-D7EYDD4E.js.map +1 -0
- package/dist/chunk-ECVAWQXV.js +54 -0
- package/dist/chunk-ECVAWQXV.js.map +1 -0
- package/dist/chunk-EHNRZEFC.js +145 -0
- package/dist/{chunk-K3EDEQP6.js → chunk-ERRML4CH.js} +4 -4
- package/dist/chunk-IVB77FRN.js +52 -0
- package/dist/chunk-IVB77FRN.js.map +1 -0
- package/dist/{chunk-LI5NKNUK.js → chunk-JKJCI4MU.js} +2 -2
- package/dist/chunk-K25BYIJ7.js +42 -0
- package/dist/chunk-K25BYIJ7.js.map +1 -0
- package/dist/{chunk-TF3Q4TQM.js → chunk-QAHOUIRL.js} +2 -2
- package/dist/{chunk-ECLZ3IGO.js → chunk-QD5ZSFPG.js} +1 -1
- package/dist/chunk-QD5ZSFPG.js.map +1 -0
- package/dist/{chunk-JPZNEPCW.js → chunk-QJ5OFLUS.js} +2 -2
- package/dist/chunk-S57U6FZO.js +42 -0
- package/dist/chunk-S57U6FZO.js.map +1 -0
- package/dist/{chunk-KDEUSAQW.js → chunk-T2ORCMNM.js} +7 -7
- package/dist/chunk-T2ORCMNM.js.map +1 -0
- package/dist/chunk-TTBHLLMV.js +281 -0
- package/dist/chunk-UQN63IRS.js +54 -0
- package/dist/chunk-UQN63IRS.js.map +1 -0
- package/dist/chunk-VO7TWLMN.js +144 -0
- package/dist/chunk-VO7TWLMN.js.map +1 -0
- package/dist/{chunk-A2NYBAVH.js → chunk-VPSEKCUO.js} +2 -2
- package/dist/chunk-VPSEKCUO.js.map +1 -0
- package/dist/chunk-VY56ZADJ.js +1 -0
- package/dist/chunk-VY56ZADJ.js.map +1 -0
- package/dist/chunk-XSX6K7SK.js +45 -0
- package/dist/chunk-XSX6K7SK.js.map +1 -0
- package/dist/chunk-YAKBC4L7.js +45 -0
- package/dist/chunk-YAKBC4L7.js.map +1 -0
- package/dist/chunk-Z6DWN5OD.js +174 -0
- package/dist/chunk-Z6DWN5OD.js.map +1 -0
- package/dist/icon.cjs +207 -0
- package/dist/icon.cjs.map +1 -1
- package/dist/icon.d.cts +5 -0
- package/dist/icon.d.ts +5 -0
- package/dist/icon.js +29 -9
- package/dist/icons/circle-check.cjs +102 -0
- package/dist/icons/circle-check.cjs.map +1 -0
- package/dist/icons/circle-check.d.cts +6 -0
- package/dist/icons/circle-check.d.ts +6 -0
- package/dist/icons/circle-check.js +8 -0
- package/dist/icons/circle-check.js.map +1 -0
- package/dist/icons/circle-pencil.cjs +111 -0
- package/dist/icons/circle-pencil.cjs.map +1 -0
- package/dist/icons/circle-pencil.d.cts +6 -0
- package/dist/icons/circle-pencil.d.ts +6 -0
- package/dist/icons/circle-pencil.js +8 -0
- package/dist/icons/circle-pencil.js.map +1 -0
- package/dist/icons/circle-play.cjs +99 -0
- package/dist/icons/circle-play.cjs.map +1 -0
- package/dist/icons/circle-play.d.cts +6 -0
- package/dist/icons/circle-play.d.ts +6 -0
- package/dist/icons/circle-play.js +8 -0
- package/dist/icons/circle-play.js.map +1 -0
- package/dist/icons/circle-quote.cjs +111 -0
- package/dist/icons/circle-quote.cjs.map +1 -0
- package/dist/icons/circle-quote.d.cts +6 -0
- package/dist/icons/circle-quote.d.ts +6 -0
- package/dist/icons/circle-quote.js +8 -0
- package/dist/icons/circle-quote.js.map +1 -0
- package/dist/icons/circle-satisfaction.cjs +109 -0
- package/dist/icons/circle-satisfaction.cjs.map +1 -0
- package/dist/icons/circle-satisfaction.d.cts +6 -0
- package/dist/icons/circle-satisfaction.d.ts +6 -0
- package/dist/icons/circle-satisfaction.js +8 -0
- package/dist/icons/circle-satisfaction.js.map +1 -0
- package/dist/icons/circle_check.cjs +102 -0
- package/dist/icons/circle_check.cjs.map +1 -0
- package/dist/icons/circle_check.d.cts +6 -0
- package/dist/icons/circle_check.d.ts +6 -0
- package/dist/icons/circle_check.js +8 -0
- package/dist/icons/circle_check.js.map +1 -0
- package/dist/icons/circle_pencil.cjs +111 -0
- package/dist/icons/circle_pencil.cjs.map +1 -0
- package/dist/icons/circle_pencil.d.cts +6 -0
- package/dist/icons/circle_pencil.d.ts +6 -0
- package/dist/icons/circle_pencil.js +8 -0
- package/dist/icons/circle_pencil.js.map +1 -0
- package/dist/icons/circle_play.cjs +99 -0
- package/dist/icons/circle_play.cjs.map +1 -0
- package/dist/icons/circle_play.d.cts +6 -0
- package/dist/icons/circle_play.d.ts +6 -0
- package/dist/icons/circle_play.js +8 -0
- package/dist/icons/circle_play.js.map +1 -0
- package/dist/icons/circle_quote.cjs +111 -0
- package/dist/icons/circle_quote.cjs.map +1 -0
- package/dist/icons/circle_quote.d.cts +6 -0
- package/dist/icons/circle_quote.d.ts +6 -0
- package/dist/icons/circle_quote.js +53 -0
- package/dist/icons/circle_quote.js.map +1 -0
- package/dist/icons/circle_satisfaction.cjs +109 -0
- package/dist/icons/circle_satisfaction.cjs.map +1 -0
- package/dist/icons/circle_satisfaction.d.cts +6 -0
- package/dist/icons/circle_satisfaction.d.ts +6 -0
- package/dist/icons/circle_satisfaction.js +8 -0
- package/dist/icons/circle_satisfaction.js.map +1 -0
- package/dist/icons/index.cjs +207 -0
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.d.cts +5 -0
- package/dist/icons/index.d.ts +5 -0
- package/dist/icons/index.js +29 -9
- package/dist/index.cjs +654 -447
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +145 -125
- package/dist/molecules/date-picker/date-picker-button.cjs +239 -42
- package/dist/molecules/date-picker/date-picker-button.cjs.map +1 -1
- package/dist/molecules/date-picker/date-picker-button.js +39 -34
- package/dist/molecules/date-picker/index.cjs +209 -12
- package/dist/molecules/date-picker/index.cjs.map +1 -1
- package/dist/molecules/date-picker/index.js +10 -5
- package/dist/molecules/expand-table/index.cjs +255 -58
- package/dist/molecules/expand-table/index.cjs.map +1 -1
- package/dist/molecules/expand-table/index.js +38 -33
- package/dist/molecules/expand-table/row.cjs +231 -34
- package/dist/molecules/expand-table/row.cjs.map +1 -1
- package/dist/molecules/expand-table/row.js +37 -32
- package/dist/molecules/form/form.cjs.map +1 -1
- package/dist/molecules/form/form.d.cts +11 -11
- package/dist/molecules/form/form.d.ts +11 -11
- package/dist/molecules/form/form.js +1 -1
- package/dist/molecules/form/index.cjs.map +1 -1
- package/dist/molecules/form/index.d.cts +1 -1
- package/dist/molecules/form/index.d.ts +1 -1
- package/dist/molecules/form/index.js +1 -1
- package/dist/molecules/index.cjs +379 -182
- package/dist/molecules/index.cjs.map +1 -1
- package/dist/molecules/index.js +58 -53
- package/dist/molecules/learning-post.js +2 -2
- package/dist/molecules/navigation.cjs +231 -34
- package/dist/molecules/navigation.cjs.map +1 -1
- package/dist/molecules/navigation.js +37 -32
- package/dist/molecules/radio-button-card.cjs +229 -32
- package/dist/molecules/radio-button-card.cjs.map +1 -1
- package/dist/molecules/radio-button-card.js +37 -32
- package/dist/molecules/stepper.cjs +217 -20
- package/dist/molecules/stepper.cjs.map +1 -1
- package/dist/molecules/stepper.js +11 -6
- package/dist/molecules/tag-selector.cjs +271 -74
- package/dist/molecules/tag-selector.cjs.map +1 -1
- package/dist/molecules/tag-selector.js +38 -33
- package/dist/molecules/time-select.cjs +230 -33
- package/dist/molecules/time-select.cjs.map +1 -1
- package/dist/molecules/time-select.js +38 -33
- package/dist/utils/index.js +3 -3
- package/package.json +15 -6
- package/src/atoms/toast.tsx +1 -2
- package/src/icons/circle-check.tsx +29 -0
- package/src/icons/circle-pencil.tsx +35 -0
- package/src/icons/circle-play.tsx +26 -0
- package/src/icons/circle-quote.tsx +35 -0
- package/src/icons/circle-satisfaction.tsx +33 -0
- package/src/icons/index.ts +5 -0
- package/src/molecules/date-picker/index.tsx +0 -2
- package/src/molecules/form/form.tsx +1 -1
- package/dist/chunk-7WVKYXIG.js +0 -1
- package/dist/chunk-ECLZ3IGO.js.map +0 -1
- /package/dist/{chunk-7WVKYXIG.js.map → chunk-4LUNQ3CA.js.map} +0 -0
- /package/dist/{chunk-2NPJVXPG.js.map → chunk-5QDXJKPG.js.map} +0 -0
- /package/dist/{chunk-5KZGH6FB.js.map → chunk-6BCKUMXK.js.map} +0 -0
- /package/dist/{chunk-KDEUSAQW.js.map → chunk-EHNRZEFC.js.map} +0 -0
- /package/dist/{chunk-K3EDEQP6.js.map → chunk-ERRML4CH.js.map} +0 -0
- /package/dist/{chunk-JPZNEPCW.js.map → chunk-JKJCI4MU.js.map} +0 -0
- /package/dist/{chunk-TF3Q4TQM.js.map → chunk-QAHOUIRL.js.map} +0 -0
- /package/dist/{chunk-LI5NKNUK.js.map → chunk-QJ5OFLUS.js.map} +0 -0
- /package/dist/{chunk-A2NYBAVH.js.map → chunk-TTBHLLMV.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecules/form/form.tsx","../../../src/atoms/heading.tsx","../../../src/utils/map-with-responsive.ts","../../../src/atoms/typo.tsx"],"sourcesContent":["import * as RadixForm from '@radix-ui/react-form';\nimport { createContext, forwardRef, useContext, useMemo } from 'react';\nimport type { HeadingProps } from '@radix-ui/themes';\nimport { Heading } from '../../atoms/heading';\nimport type { TypoProps } from '../../atoms/typo';\nimport { Typo } from '../../atoms/typo';\n\nconst Root = forwardRef<HTMLFormElement, RadixForm.FormProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Root\n {...rest}\n className={`FormRoot ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Root>\n );\n }\n);\n\nRoot.displayName = 'FORM_ROOT';\n\nexport type FormFieldProps = RadixForm.FormFieldProps & { required?: boolean };\n\nconst FieldContext = createContext<FormFieldProps>({\n name: '',\n});\n\nconst Field = forwardRef<HTMLDivElement, FormFieldProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Field\n {...rest}\n className={`FormField ${className || ''}`}\n ref={ref}\n >\n <FieldContext.Provider value={rest}>{children}</FieldContext.Provider>\n </RadixForm.Field>\n );\n }\n);\nField.displayName = 'FORM_FIELD';\n\nexport type FormLabelProps = RadixForm.FormLabelProps & {\n /** label의 타입을 지정 */\n variant?: 'title' | 'body' | 'caption';\n};\n\nfunction HeadingLabel(props: HeadingProps): React.ReactNode {\n return (\n <Heading variant=\"heading5\" {...props}>\n {props.children}\n </Heading>\n );\n}\n\nfunction CaptionLabel(props: TypoProps): React.ReactNode {\n return (\n <Typo color=\"gray\" variant=\"caption\" {...props}>\n {props.children}\n </Typo>\n );\n}\n\nconst Label = forwardRef<HTMLLabelElement, FormLabelProps>(\n ({ children, className, variant, ...rest }, ref) => {\n const Comp = useMemo(() => {\n switch (variant) {\n case 'title':\n return HeadingLabel;\n case 'caption':\n return CaptionLabel;\n case 'body':\n default:\n return Typo;\n }\n }, [variant]);\n\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Label\n {...rest}\n asChild\n className={`FormLabel ${className || ''}`}\n ref={ref}\n >\n <Comp>\n {children}\n {fieldProps.required ? (\n <Typo as=\"span\" color=\"tomato\">\n {` *`}\n </Typo>\n ) : null}\n </Comp>\n </RadixForm.Label>\n );\n }\n);\nLabel.displayName = 'FORM_Label';\n\nconst Message = forwardRef<HTMLSpanElement, RadixForm.FormMessageProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Message\n {...rest}\n asChild\n className={`FormMessage ${className || ''}`}\n ref={ref}\n >\n <Typo color=\"red\">{children}</Typo>\n </RadixForm.Message>\n );\n }\n);\nMessage.displayName = 'FORM_Message';\n\ntype ControlProps = Omit<RadixForm.FormControlProps, 'required'>;\nconst Control = forwardRef<HTMLInputElement, ControlProps>(\n ({ className, ...rest }, ref) => {\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Control\n {...rest}\n className={`FormControl ${className || ''}`}\n ref={ref}\n required={fieldProps.required}\n />\n );\n }\n);\nControl.displayName = 'FORM_Control';\n\ninterface FormItemProps extends FormFieldProps {\n children: React.ReactNode;\n label: string;\n labelVariant?: FormLabelProps['variant'];\n errorMessage?: string;\n}\n\nexport function FormItem({\n label,\n labelVariant,\n children,\n errorMessage,\n ...fieldProps\n}: FormItemProps): React.ReactNode {\n return (\n <Form.Field {...fieldProps}>\n <Form.Label variant={labelVariant}>{label}</Form.Label>\n {children}\n <Form.Message forceMatch={Boolean(errorMessage)}>\n {errorMessage}\n </Form.Message>\n </Form.Field>\n );\n}\n\nexport const Form = {\n Root,\n Field,\n Label,\n Message,\n Control: RadixForm.Control,\n Submit: RadixForm.Submit,\n FormItem,\n};\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { useMemo } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\ntype HeadingVariant =\n | 'heading1'\n | 'heading2'\n | 'heading3'\n | 'heading4'\n | 'heading5';\nexport type HeadingProps = RadixHeadingProps & {\n variant?: Responsive<HeadingVariant>;\n};\n\ntype HeadingSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nconst mapVariant = (variant?: HeadingVariant): HeadingSize | undefined => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return undefined;\n }\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n return variant\n ? mapWithResponsive({\n value: variant,\n mapFn: mapVariant,\n })\n : size;\n\n // if (typeof variant === 'string') {\n // return mapVariant(variant);\n // }\n // if (typeof variant === 'object') {\n // const newObj: Partial<Record<Breakpoint, HeadingSize>> = {};\n // let key: Breakpoint;\n // for (key in variant) {\n // newObj[key] = mapVariant(variant[key]);\n // }\n // return newObj;\n // }\n // return size;\n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args: {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n const {value, mapFn} = args;\n if(typeof value === 'string'){\n return mapFn(value);\n };\n \n if(typeof value === 'object'){\n const newObj: Partial<Record<Breakpoint, K>> = {};\n let key: Breakpoint;\n for(key in value){\n newObj[key] = mapFn(value[key]);\n }\n return newObj;\n }\n return value;\n};\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\n\nexport type TypoProps = RadixTextProps & {\n variant?: 'body' | 'caption' | 'subtitle';\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n switch (variant) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n"],"mappings":"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","names":["import_react","import_themes","Heading","RadixHeading","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime","Root","Field","Heading","Label","Message","Control"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/molecules/form/form.tsx","../../../src/atoms/heading.tsx","../../../src/utils/map-with-responsive.ts","../../../src/atoms/typo.tsx"],"sourcesContent":["import * as RadixForm from '@radix-ui/react-form';\nimport React, { createContext, forwardRef, useContext, useMemo } from 'react';\nimport type { HeadingProps } from '@radix-ui/themes';\nimport { Heading } from '../../atoms/heading';\nimport type { TypoProps } from '../../atoms/typo';\nimport { Typo } from '../../atoms/typo';\n\nconst Root = forwardRef<HTMLFormElement, RadixForm.FormProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Root\n {...rest}\n className={`FormRoot ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Root>\n );\n }\n);\n\nRoot.displayName = 'FORM_ROOT';\n\nexport type FormFieldProps = RadixForm.FormFieldProps & { required?: boolean };\n\nconst FieldContext = createContext<FormFieldProps>({\n name: '',\n});\n\nconst Field = forwardRef<HTMLDivElement, FormFieldProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Field\n {...rest}\n className={`FormField ${className || ''}`}\n ref={ref}\n >\n <FieldContext.Provider value={rest}>{children}</FieldContext.Provider>\n </RadixForm.Field>\n );\n }\n);\nField.displayName = 'FORM_FIELD';\n\nexport type FormLabelProps = RadixForm.FormLabelProps & {\n /** label의 타입을 지정 */\n variant?: 'title' | 'body' | 'caption';\n};\n\nfunction HeadingLabel(props: HeadingProps): React.ReactNode {\n return (\n <Heading variant=\"heading5\" {...props}>\n {props.children}\n </Heading>\n );\n}\n\nfunction CaptionLabel(props: TypoProps): React.ReactNode {\n return (\n <Typo color=\"gray\" variant=\"caption\" {...props}>\n {props.children}\n </Typo>\n );\n}\n\nconst Label = forwardRef<HTMLLabelElement, FormLabelProps>(\n ({ children, className, variant, ...rest }, ref) => {\n const Comp = useMemo(() => {\n switch (variant) {\n case 'title':\n return HeadingLabel;\n case 'caption':\n return CaptionLabel;\n case 'body':\n default:\n return Typo;\n }\n }, [variant]);\n\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Label\n {...rest}\n asChild\n className={`FormLabel ${className || ''}`}\n ref={ref}\n >\n <Comp>\n {children}\n {fieldProps.required ? (\n <Typo as=\"span\" color=\"tomato\">\n {` *`}\n </Typo>\n ) : null}\n </Comp>\n </RadixForm.Label>\n );\n }\n);\nLabel.displayName = 'FORM_Label';\n\nconst Message = forwardRef<HTMLSpanElement, RadixForm.FormMessageProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Message\n {...rest}\n asChild\n className={`FormMessage ${className || ''}`}\n ref={ref}\n >\n <Typo color=\"red\">{children}</Typo>\n </RadixForm.Message>\n );\n }\n);\nMessage.displayName = 'FORM_Message';\n\ntype ControlProps = Omit<RadixForm.FormControlProps, 'required'>;\nconst Control = forwardRef<HTMLInputElement, ControlProps>(\n ({ className, ...rest }, ref) => {\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Control\n {...rest}\n className={`FormControl ${className || ''}`}\n ref={ref}\n required={fieldProps.required}\n />\n );\n }\n);\nControl.displayName = 'FORM_Control';\n\ninterface FormItemProps extends FormFieldProps {\n children: React.ReactNode;\n label: string;\n labelVariant?: FormLabelProps['variant'];\n errorMessage?: string;\n}\n\nexport function FormItem({\n label,\n labelVariant,\n children,\n errorMessage,\n ...fieldProps\n}: FormItemProps): React.ReactNode {\n return (\n <Form.Field {...fieldProps}>\n <Form.Label variant={labelVariant}>{label}</Form.Label>\n {children}\n <Form.Message forceMatch={Boolean(errorMessage)}>\n {errorMessage}\n </Form.Message>\n </Form.Field>\n );\n}\n\nexport const Form = {\n Root,\n Field,\n Label,\n Message,\n Control: RadixForm.Control,\n Submit: RadixForm.Submit,\n FormItem,\n};\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { useMemo } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\ntype HeadingVariant =\n | 'heading1'\n | 'heading2'\n | 'heading3'\n | 'heading4'\n | 'heading5';\nexport type HeadingProps = RadixHeadingProps & {\n variant?: Responsive<HeadingVariant>;\n};\n\ntype HeadingSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nconst mapVariant = (variant?: HeadingVariant): HeadingSize | undefined => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return undefined;\n }\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n return variant\n ? mapWithResponsive({\n value: variant,\n mapFn: mapVariant,\n })\n : size;\n\n // if (typeof variant === 'string') {\n // return mapVariant(variant);\n // }\n // if (typeof variant === 'object') {\n // const newObj: Partial<Record<Breakpoint, HeadingSize>> = {};\n // let key: Breakpoint;\n // for (key in variant) {\n // newObj[key] = mapVariant(variant[key]);\n // }\n // return newObj;\n // }\n // return size;\n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args: {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n const {value, mapFn} = args;\n if(typeof value === 'string'){\n return mapFn(value);\n };\n \n if(typeof value === 'object'){\n const newObj: Partial<Record<Breakpoint, K>> = {};\n let key: Breakpoint;\n for(key in value){\n newObj[key] = mapFn(value[key]);\n }\n return newObj;\n }\n return value;\n};\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\n\nexport type TypoProps = RadixTextProps & {\n variant?: 'body' | 'caption' | 'subtitle';\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n switch (variant) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n"],"mappings":"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","names":["import_react","import_themes","Heading","RadixHeading","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime","Root","Field","Heading","Label","Message","Control"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React$1 from 'react';
|
|
2
1
|
import * as RadixForm from '@radix-ui/react-form';
|
|
2
|
+
import React__default from 'react';
|
|
3
3
|
|
|
4
4
|
type FormFieldProps = RadixForm.FormFieldProps & {
|
|
5
5
|
required?: boolean;
|
|
@@ -9,24 +9,24 @@ type FormLabelProps = RadixForm.FormLabelProps & {
|
|
|
9
9
|
variant?: 'title' | 'body' | 'caption';
|
|
10
10
|
};
|
|
11
11
|
interface FormItemProps extends FormFieldProps {
|
|
12
|
-
children:
|
|
12
|
+
children: React__default.ReactNode;
|
|
13
13
|
label: string;
|
|
14
14
|
labelVariant?: FormLabelProps['variant'];
|
|
15
15
|
errorMessage?: string;
|
|
16
16
|
}
|
|
17
|
-
declare function FormItem({ label, labelVariant, children, errorMessage, ...fieldProps }: FormItemProps):
|
|
17
|
+
declare function FormItem({ label, labelVariant, children, errorMessage, ...fieldProps }: FormItemProps): React__default.ReactNode;
|
|
18
18
|
declare const Form: {
|
|
19
|
-
Root:
|
|
20
|
-
Field:
|
|
19
|
+
Root: React__default.ForwardRefExoticComponent<RadixForm.FormProps & React__default.RefAttributes<HTMLFormElement>>;
|
|
20
|
+
Field: React__default.ForwardRefExoticComponent<RadixForm.FormFieldProps & {
|
|
21
21
|
required?: boolean;
|
|
22
|
-
} &
|
|
23
|
-
Label:
|
|
22
|
+
} & React__default.RefAttributes<HTMLDivElement>>;
|
|
23
|
+
Label: React__default.ForwardRefExoticComponent<RadixForm.FormLabelProps & {
|
|
24
24
|
/** label의 타입을 지정 */
|
|
25
25
|
variant?: "title" | "body" | "caption";
|
|
26
|
-
} &
|
|
27
|
-
Message:
|
|
28
|
-
Control:
|
|
29
|
-
Submit:
|
|
26
|
+
} & React__default.RefAttributes<HTMLLabelElement>>;
|
|
27
|
+
Message: React__default.ForwardRefExoticComponent<RadixForm.FormMessageProps & React__default.RefAttributes<HTMLSpanElement>>;
|
|
28
|
+
Control: React__default.ForwardRefExoticComponent<RadixForm.FormControlProps & React__default.RefAttributes<HTMLInputElement>>;
|
|
29
|
+
Submit: React__default.ForwardRefExoticComponent<RadixForm.FormSubmitProps & React__default.RefAttributes<HTMLButtonElement>>;
|
|
30
30
|
FormItem: typeof FormItem;
|
|
31
31
|
};
|
|
32
32
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React$1 from 'react';
|
|
2
1
|
import * as RadixForm from '@radix-ui/react-form';
|
|
2
|
+
import React__default from 'react';
|
|
3
3
|
|
|
4
4
|
type FormFieldProps = RadixForm.FormFieldProps & {
|
|
5
5
|
required?: boolean;
|
|
@@ -9,24 +9,24 @@ type FormLabelProps = RadixForm.FormLabelProps & {
|
|
|
9
9
|
variant?: 'title' | 'body' | 'caption';
|
|
10
10
|
};
|
|
11
11
|
interface FormItemProps extends FormFieldProps {
|
|
12
|
-
children:
|
|
12
|
+
children: React__default.ReactNode;
|
|
13
13
|
label: string;
|
|
14
14
|
labelVariant?: FormLabelProps['variant'];
|
|
15
15
|
errorMessage?: string;
|
|
16
16
|
}
|
|
17
|
-
declare function FormItem({ label, labelVariant, children, errorMessage, ...fieldProps }: FormItemProps):
|
|
17
|
+
declare function FormItem({ label, labelVariant, children, errorMessage, ...fieldProps }: FormItemProps): React__default.ReactNode;
|
|
18
18
|
declare const Form: {
|
|
19
|
-
Root:
|
|
20
|
-
Field:
|
|
19
|
+
Root: React__default.ForwardRefExoticComponent<RadixForm.FormProps & React__default.RefAttributes<HTMLFormElement>>;
|
|
20
|
+
Field: React__default.ForwardRefExoticComponent<RadixForm.FormFieldProps & {
|
|
21
21
|
required?: boolean;
|
|
22
|
-
} &
|
|
23
|
-
Label:
|
|
22
|
+
} & React__default.RefAttributes<HTMLDivElement>>;
|
|
23
|
+
Label: React__default.ForwardRefExoticComponent<RadixForm.FormLabelProps & {
|
|
24
24
|
/** label의 타입을 지정 */
|
|
25
25
|
variant?: "title" | "body" | "caption";
|
|
26
|
-
} &
|
|
27
|
-
Message:
|
|
28
|
-
Control:
|
|
29
|
-
Submit:
|
|
26
|
+
} & React__default.RefAttributes<HTMLLabelElement>>;
|
|
27
|
+
Message: React__default.ForwardRefExoticComponent<RadixForm.FormMessageProps & React__default.RefAttributes<HTMLSpanElement>>;
|
|
28
|
+
Control: React__default.ForwardRefExoticComponent<RadixForm.FormControlProps & React__default.RefAttributes<HTMLInputElement>>;
|
|
29
|
+
Submit: React__default.ForwardRefExoticComponent<RadixForm.FormSubmitProps & React__default.RefAttributes<HTMLButtonElement>>;
|
|
30
30
|
FormItem: typeof FormItem;
|
|
31
31
|
};
|
|
32
32
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecules/form/index.ts","../../../src/molecules/form/form.tsx","../../../src/atoms/heading.tsx","../../../src/utils/map-with-responsive.ts","../../../src/atoms/typo.tsx"],"sourcesContent":["export * from './form';\n","import * as RadixForm from '@radix-ui/react-form';\nimport { createContext, forwardRef, useContext, useMemo } from 'react';\nimport type { HeadingProps } from '@radix-ui/themes';\nimport { Heading } from '../../atoms/heading';\nimport type { TypoProps } from '../../atoms/typo';\nimport { Typo } from '../../atoms/typo';\n\nconst Root = forwardRef<HTMLFormElement, RadixForm.FormProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Root\n {...rest}\n className={`FormRoot ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Root>\n );\n }\n);\n\nRoot.displayName = 'FORM_ROOT';\n\nexport type FormFieldProps = RadixForm.FormFieldProps & { required?: boolean };\n\nconst FieldContext = createContext<FormFieldProps>({\n name: '',\n});\n\nconst Field = forwardRef<HTMLDivElement, FormFieldProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Field\n {...rest}\n className={`FormField ${className || ''}`}\n ref={ref}\n >\n <FieldContext.Provider value={rest}>{children}</FieldContext.Provider>\n </RadixForm.Field>\n );\n }\n);\nField.displayName = 'FORM_FIELD';\n\nexport type FormLabelProps = RadixForm.FormLabelProps & {\n /** label의 타입을 지정 */\n variant?: 'title' | 'body' | 'caption';\n};\n\nfunction HeadingLabel(props: HeadingProps): React.ReactNode {\n return (\n <Heading variant=\"heading5\" {...props}>\n {props.children}\n </Heading>\n );\n}\n\nfunction CaptionLabel(props: TypoProps): React.ReactNode {\n return (\n <Typo color=\"gray\" variant=\"caption\" {...props}>\n {props.children}\n </Typo>\n );\n}\n\nconst Label = forwardRef<HTMLLabelElement, FormLabelProps>(\n ({ children, className, variant, ...rest }, ref) => {\n const Comp = useMemo(() => {\n switch (variant) {\n case 'title':\n return HeadingLabel;\n case 'caption':\n return CaptionLabel;\n case 'body':\n default:\n return Typo;\n }\n }, [variant]);\n\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Label\n {...rest}\n asChild\n className={`FormLabel ${className || ''}`}\n ref={ref}\n >\n <Comp>\n {children}\n {fieldProps.required ? (\n <Typo as=\"span\" color=\"tomato\">\n {` *`}\n </Typo>\n ) : null}\n </Comp>\n </RadixForm.Label>\n );\n }\n);\nLabel.displayName = 'FORM_Label';\n\nconst Message = forwardRef<HTMLSpanElement, RadixForm.FormMessageProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Message\n {...rest}\n asChild\n className={`FormMessage ${className || ''}`}\n ref={ref}\n >\n <Typo color=\"red\">{children}</Typo>\n </RadixForm.Message>\n );\n }\n);\nMessage.displayName = 'FORM_Message';\n\ntype ControlProps = Omit<RadixForm.FormControlProps, 'required'>;\nconst Control = forwardRef<HTMLInputElement, ControlProps>(\n ({ className, ...rest }, ref) => {\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Control\n {...rest}\n className={`FormControl ${className || ''}`}\n ref={ref}\n required={fieldProps.required}\n />\n );\n }\n);\nControl.displayName = 'FORM_Control';\n\ninterface FormItemProps extends FormFieldProps {\n children: React.ReactNode;\n label: string;\n labelVariant?: FormLabelProps['variant'];\n errorMessage?: string;\n}\n\nexport function FormItem({\n label,\n labelVariant,\n children,\n errorMessage,\n ...fieldProps\n}: FormItemProps): React.ReactNode {\n return (\n <Form.Field {...fieldProps}>\n <Form.Label variant={labelVariant}>{label}</Form.Label>\n {children}\n <Form.Message forceMatch={Boolean(errorMessage)}>\n {errorMessage}\n </Form.Message>\n </Form.Field>\n );\n}\n\nexport const Form = {\n Root,\n Field,\n Label,\n Message,\n Control: RadixForm.Control,\n Submit: RadixForm.Submit,\n FormItem,\n};\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { useMemo } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\ntype HeadingVariant =\n | 'heading1'\n | 'heading2'\n | 'heading3'\n | 'heading4'\n | 'heading5';\nexport type HeadingProps = RadixHeadingProps & {\n variant?: Responsive<HeadingVariant>;\n};\n\ntype HeadingSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nconst mapVariant = (variant?: HeadingVariant): HeadingSize | undefined => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return undefined;\n }\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n return variant\n ? mapWithResponsive({\n value: variant,\n mapFn: mapVariant,\n })\n : size;\n\n // if (typeof variant === 'string') {\n // return mapVariant(variant);\n // }\n // if (typeof variant === 'object') {\n // const newObj: Partial<Record<Breakpoint, HeadingSize>> = {};\n // let key: Breakpoint;\n // for (key in variant) {\n // newObj[key] = mapVariant(variant[key]);\n // }\n // return newObj;\n // }\n // return size;\n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args: {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n const {value, mapFn} = args;\n if(typeof value === 'string'){\n return mapFn(value);\n };\n \n if(typeof value === 'object'){\n const newObj: Partial<Record<Breakpoint, K>> = {};\n let key: Breakpoint;\n for(key in value){\n newObj[key] = mapFn(value[key]);\n }\n return newObj;\n }\n return value;\n};\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\n\nexport type TypoProps = RadixTextProps & {\n variant?: 'body' | 'caption' | 'subtitle';\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n switch (variant) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n"],"mappings":"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","names":["import_react","import_themes","Heading","RadixHeading","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime","Root","Field","Heading","Label","Message","Control"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/molecules/form/index.ts","../../../src/molecules/form/form.tsx","../../../src/atoms/heading.tsx","../../../src/utils/map-with-responsive.ts","../../../src/atoms/typo.tsx"],"sourcesContent":["export * from './form';\n","import * as RadixForm from '@radix-ui/react-form';\nimport React, { createContext, forwardRef, useContext, useMemo } from 'react';\nimport type { HeadingProps } from '@radix-ui/themes';\nimport { Heading } from '../../atoms/heading';\nimport type { TypoProps } from '../../atoms/typo';\nimport { Typo } from '../../atoms/typo';\n\nconst Root = forwardRef<HTMLFormElement, RadixForm.FormProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Root\n {...rest}\n className={`FormRoot ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Root>\n );\n }\n);\n\nRoot.displayName = 'FORM_ROOT';\n\nexport type FormFieldProps = RadixForm.FormFieldProps & { required?: boolean };\n\nconst FieldContext = createContext<FormFieldProps>({\n name: '',\n});\n\nconst Field = forwardRef<HTMLDivElement, FormFieldProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Field\n {...rest}\n className={`FormField ${className || ''}`}\n ref={ref}\n >\n <FieldContext.Provider value={rest}>{children}</FieldContext.Provider>\n </RadixForm.Field>\n );\n }\n);\nField.displayName = 'FORM_FIELD';\n\nexport type FormLabelProps = RadixForm.FormLabelProps & {\n /** label의 타입을 지정 */\n variant?: 'title' | 'body' | 'caption';\n};\n\nfunction HeadingLabel(props: HeadingProps): React.ReactNode {\n return (\n <Heading variant=\"heading5\" {...props}>\n {props.children}\n </Heading>\n );\n}\n\nfunction CaptionLabel(props: TypoProps): React.ReactNode {\n return (\n <Typo color=\"gray\" variant=\"caption\" {...props}>\n {props.children}\n </Typo>\n );\n}\n\nconst Label = forwardRef<HTMLLabelElement, FormLabelProps>(\n ({ children, className, variant, ...rest }, ref) => {\n const Comp = useMemo(() => {\n switch (variant) {\n case 'title':\n return HeadingLabel;\n case 'caption':\n return CaptionLabel;\n case 'body':\n default:\n return Typo;\n }\n }, [variant]);\n\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Label\n {...rest}\n asChild\n className={`FormLabel ${className || ''}`}\n ref={ref}\n >\n <Comp>\n {children}\n {fieldProps.required ? (\n <Typo as=\"span\" color=\"tomato\">\n {` *`}\n </Typo>\n ) : null}\n </Comp>\n </RadixForm.Label>\n );\n }\n);\nLabel.displayName = 'FORM_Label';\n\nconst Message = forwardRef<HTMLSpanElement, RadixForm.FormMessageProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Message\n {...rest}\n asChild\n className={`FormMessage ${className || ''}`}\n ref={ref}\n >\n <Typo color=\"red\">{children}</Typo>\n </RadixForm.Message>\n );\n }\n);\nMessage.displayName = 'FORM_Message';\n\ntype ControlProps = Omit<RadixForm.FormControlProps, 'required'>;\nconst Control = forwardRef<HTMLInputElement, ControlProps>(\n ({ className, ...rest }, ref) => {\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Control\n {...rest}\n className={`FormControl ${className || ''}`}\n ref={ref}\n required={fieldProps.required}\n />\n );\n }\n);\nControl.displayName = 'FORM_Control';\n\ninterface FormItemProps extends FormFieldProps {\n children: React.ReactNode;\n label: string;\n labelVariant?: FormLabelProps['variant'];\n errorMessage?: string;\n}\n\nexport function FormItem({\n label,\n labelVariant,\n children,\n errorMessage,\n ...fieldProps\n}: FormItemProps): React.ReactNode {\n return (\n <Form.Field {...fieldProps}>\n <Form.Label variant={labelVariant}>{label}</Form.Label>\n {children}\n <Form.Message forceMatch={Boolean(errorMessage)}>\n {errorMessage}\n </Form.Message>\n </Form.Field>\n );\n}\n\nexport const Form = {\n Root,\n Field,\n Label,\n Message,\n Control: RadixForm.Control,\n Submit: RadixForm.Submit,\n FormItem,\n};\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { useMemo } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\ntype HeadingVariant =\n | 'heading1'\n | 'heading2'\n | 'heading3'\n | 'heading4'\n | 'heading5';\nexport type HeadingProps = RadixHeadingProps & {\n variant?: Responsive<HeadingVariant>;\n};\n\ntype HeadingSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nconst mapVariant = (variant?: HeadingVariant): HeadingSize | undefined => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return undefined;\n }\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n return variant\n ? mapWithResponsive({\n value: variant,\n mapFn: mapVariant,\n })\n : size;\n\n // if (typeof variant === 'string') {\n // return mapVariant(variant);\n // }\n // if (typeof variant === 'object') {\n // const newObj: Partial<Record<Breakpoint, HeadingSize>> = {};\n // let key: Breakpoint;\n // for (key in variant) {\n // newObj[key] = mapVariant(variant[key]);\n // }\n // return newObj;\n // }\n // return size;\n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args: {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n const {value, mapFn} = args;\n if(typeof value === 'string'){\n return mapFn(value);\n };\n \n if(typeof value === 'object'){\n const newObj: Partial<Record<Breakpoint, K>> = {};\n let key: Breakpoint;\n for(key in value){\n newObj[key] = mapFn(value[key]);\n }\n return newObj;\n }\n return value;\n};\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\n\nexport type TypoProps = RadixTextProps & {\n variant?: 'body' | 'caption' | 'subtitle';\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n switch (variant) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,gBAA2B;AAC3B,IAAAA,gBAAsE;;;ACDtE,oBAGO;AAEP,mBAAwB;;;ACHjB,IAAM,oBAAoB,CAChC,SAC+B;AAC9B,QAAM,EAAC,OAAO,MAAK,IAAI;AACvB,MAAG,OAAO,UAAU,UAAS;AAC3B,WAAO,MAAM,KAAK;AAAA,EACpB;AAAC;AAED,MAAG,OAAO,UAAU,UAAS;AAC3B,UAAM,SAAyC,CAAC;AAChD,QAAI;AACJ,SAAI,OAAO,OAAM;AACf,aAAO,GAAG,IAAI,MAAM,MAAM,GAAG,CAAC;AAAA,IAChC;AACA,WAAO;AAAA,EACT;AACA,SAAO;AACT;;;ADXA,IAAAC,iBAAwC;AAuDpC;AA1CJ,IAAM,aAAa,CAAC,YAAsD;AACxE,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAEO,SAASC,SAAQ,OAAsC;AAC5D,QAA6C,YAArC,QAAM,UAAU,QAvC1B,IAuC+C,IAAT,iBAAS,IAAT,CAA5B,QAAM,YAAU;AACxB,QAAM,gBAAY,sBAAmC,MAAM;AACzD,WAAO,UACH,kBAAkB;AAAA,MAChB,OAAO;AAAA,MACP,OAAO;AAAA,IACT,CAAC,IACD;AAAA,EAcN,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,SACE,4CAAC,cAAAC,SAAA,iCAAiB,OAAjB,EAAuB,MAAM,WAC3B,WACH;AAEJ;;;AElEA,IAAAC,iBAAkC;AAClC,IAAAC,gBAA2C;AAwBrC,IAAAC,sBAAA;AAlBC,IAAM,WAAO;AAAA,EAClB,CAAC,OAAkB,QAAyB;AAC1C,UAA6C,YAArC,QAAM,SAAS,SAV3B,IAUiD,IAAT,iBAAS,IAAT,CAA5B,QAAM,WAAS;AAEvB,UAAM,gBAAY,uBAAgC,MAAM;AACtD,UAAI,SAAS,OAAW,QAAO;AAC/B,cAAQ,SAAS;AAAA,QACf,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AAAA,QACL;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,WACE,6CAAC,eAAAC,MAAA,iCAAc,OAAd,EAAoB,KAAU,MAAM,WAClC,WACH;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;;;AHvBb,IAAAC,sBAAA;AAHN,IAAMC,YAAO;AAAA,EACX,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UARf,IAQG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,YAAY,aAAa,EAAE;AAAA,QACtC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEAA,MAAK,cAAc;AAInB,IAAM,mBAAe,6BAA8B;AAAA,EACjD,MAAM;AACR,CAAC;AAED,IAAMC,aAAQ;AAAA,EACZ,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UA9Bf,IA8BG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,aAAa,aAAa,EAAE;AAAA,QACvC;AAAA,QAEA,uDAAC,aAAa,UAAb,EAAsB,OAAO,MAAO,UAAS;AAAA;AAAA,IAChD;AAAA,EAEJ;AACF;AACAA,OAAM,cAAc;AAOpB,SAAS,aAAa,OAAsC;AAC1D,SACE,6CAACC,UAAA,+BAAQ,SAAQ,cAAe,QAA/B,EACE,gBAAM,WACT;AAEJ;AAEA,SAAS,aAAa,OAAmC;AACvD,SACE,6CAAC,qCAAK,OAAM,QAAO,SAAQ,aAAc,QAAxC,EACE,gBAAM,WACT;AAEJ;AAEA,IAAMC,aAAQ;AAAA,EACZ,CAAC,IAA2C,QAAQ;AAAnD,iBAAE,YAAU,WAAW,QAlE1B,IAkEG,IAAmC,iBAAnC,IAAmC,CAAjC,YAAU,aAAW;AACtB,UAAM,WAAO,uBAAQ,MAAM;AACzB,cAAQ,SAAS;AAAA,QACf,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AAAA,QACL;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,OAAO,CAAC;AAEZ,UAAM,iBAAa,0BAAW,YAAY;AAC1C,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,SAAO;AAAA,QACP,WAAW,aAAa,aAAa,EAAE;AAAA,QACvC;AAAA,QAEA,wDAAC,QACE;AAAA;AAAA,UACA,WAAW,WACV,6CAAC,QAAK,IAAG,QAAO,OAAM,UACnB,gBACH,IACE;AAAA,WACN;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACAA,OAAM,cAAc;AAEpB,IAAMC,eAAU;AAAA,EACd,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UAtGf,IAsGG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,SAAO;AAAA,QACP,WAAW,eAAe,aAAa,EAAE;AAAA,QACzC;AAAA,QAEA,uDAAC,QAAK,OAAM,OAAO,UAAS;AAAA;AAAA,IAC9B;AAAA,EAEJ;AACF;AACAA,SAAQ,cAAc;AAGtB,IAAMC,eAAU;AAAA,EACd,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAvHL,IAuHG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,UAAM,iBAAa,0BAAW,YAAY;AAC1C,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,eAAe,aAAa,EAAE;AAAA,QACzC;AAAA,QACA,UAAU,WAAW;AAAA;AAAA,IACvB;AAAA,EAEJ;AACF;AACAA,SAAQ,cAAc;AASf,SAAS,SAAS,IAMU;AANV,eACvB;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAhJF,IA4IyB,IAKpB,uBALoB,IAKpB;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACE,8CAAC,KAAK,OAAL,iCAAe,aAAf,EACC;AAAA,iDAAC,KAAK,OAAL,EAAW,SAAS,cAAe,iBAAM;AAAA,IACzC;AAAA,IACD,6CAAC,KAAK,SAAL,EAAa,YAAY,QAAQ,YAAY,GAC3C,wBACH;AAAA,MACF;AAEJ;AAEO,IAAM,OAAO;AAAA,EAClB,MAAAL;AAAA,EACA,OAAAC;AAAA,EACA,OAAAE;AAAA,EACA,SAAAC;AAAA,EACA,SAAmB;AAAA,EACnB,QAAkB;AAAA,EAClB;AACF;","names":["import_react","import_themes","Heading","RadixHeading","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime","Root","Field","Heading","Label","Message","Control"]}
|