@cerberus-design/react
Version:
The Cerberus Design React component library.
1 lines • 21.2 kB
Source Map (JSON)
{"version":3,"sources":["../../../../src/components/field/parts.ts","../../../../src/components/field/primitives.tsx","../../../../src/system/primitive-factory.tsx","../../../../src/system/index.ts","../../../../src/components/field/start-indicator.tsx","../../../../src/components/field/status-indicator.tsx","../../../../src/context/cerberus.tsx","../../../../src/components/field/error-text.tsx"],"sourcesContent":["import type { ElementType } from 'react'\nimport {\n FieldErrorText,\n FieldHelperText,\n FieldInput,\n FieldLabel,\n FieldRequiredIndicator,\n FieldRoot,\n FieldTextarea,\n} from './primitives'\nimport { FieldStatusIndicator } from './status-indicator'\nimport { FieldStartIndicator } from './start-indicator'\n\n/**\n * This module contains the parts of the Field component.\n * @module 'field/parts'\n */\n\ninterface FieldPartsValue {\n /**\n * The container of the field.\n */\n Root: ElementType\n /**\n * The label of the field.\n */\n Label: ElementType\n /**\n * The input of the field.\n */\n Input: ElementType\n /**\n * The textarea of the field.\n */\n Textarea: ElementType\n /**\n * The text that displays when the field is valid.\n */\n HelperText: ElementType\n /**\n * The text that displays when the field is invalid.\n */\n ErrorText: ElementType\n /**\n * The indicator that appears at the start of the field.\n */\n StartIndicator: ElementType\n /**\n * The status indicator of the field.\n */\n StatusIndicator: ElementType\n /**\n * The indicator that appears at the end of the field.\n */\n RequiredIndicator: ElementType\n}\n\n/**\n * An Object containing the parts of the Field component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the FieldParts object and\n * the entire family of components vs. only what you use.\n */\nexport const FieldParts: FieldPartsValue = {\n Root: FieldRoot,\n Label: FieldLabel,\n Input: FieldInput,\n Textarea: FieldTextarea,\n HelperText: FieldHelperText,\n ErrorText: FieldErrorText,\n StartIndicator: FieldStartIndicator,\n StatusIndicator: FieldStatusIndicator,\n RequiredIndicator: FieldRequiredIndicator,\n}\n","import {\n Field,\n type FieldHelperTextProps as ArkFieldHelperTextProps,\n type FieldInputProps as ArkFieldInputProps,\n type FieldLabelProps as ArkFieldLabelProps,\n type FieldRootProps as ArkFieldRootProps,\n type FieldTextareaProps as ArkFieldTextareaProps,\n type FieldRequiredIndicatorProps as ArkFieldRequiredIndicatorProps,\n} from '@ark-ui/react/field'\nimport { ark, type HTMLArkProps } from '@ark-ui/react'\nimport { field, type FieldVariantProps } from 'styled-system/recipes'\nimport {\n createCerberusPrimitive,\n type CerberusPrimitiveProps,\n} from '../../system/index'\nimport { CerberusFieldInput } from './input'\nimport { CerberusFieldErrorText } from './error-text'\n\n/**\n * This module contains all the primitives of the Field component.\n * @module 'field'\n */\n\nconst { withSlotRecipe, withNoRecipe } = createCerberusPrimitive(field)\n\n// Root\n\nexport type FieldRootProps = CerberusPrimitiveProps<\n ArkFieldRootProps & FieldVariantProps\n>\nexport const FieldRoot = withSlotRecipe<FieldRootProps>(Field.Root, 'root')\n\n// Label\n\nfunction FieldLabelEl(props: FieldLabelProps) {\n const { children, ...nativeProps } = props\n return (\n <Field.Label {...nativeProps}>\n {children}\n <Field.RequiredIndicator>(required)</Field.RequiredIndicator>\n </Field.Label>\n )\n}\n\nexport type FieldLabelProps = CerberusPrimitiveProps<ArkFieldLabelProps>\nexport const FieldLabel = withSlotRecipe<FieldLabelProps>(FieldLabelEl, 'label')\n\n// Required Indicator\n\nfunction FieldRequiredIndicatorEl(props: FieldRequiredIndicatorProps) {\n return (\n <Field.RequiredIndicator {...props}>(required)</Field.RequiredIndicator>\n )\n}\n\nexport type FieldRequiredIndicatorProps =\n CerberusPrimitiveProps<ArkFieldRequiredIndicatorProps>\nexport const FieldRequiredIndicator = withNoRecipe<FieldRequiredIndicatorProps>(\n FieldRequiredIndicatorEl,\n)\n\n// Input\n\nexport type FieldInputRootProps = CerberusPrimitiveProps<\n HTMLArkProps<'div'> & FieldVariantProps\n>\nexport const FieldInputRoot = withSlotRecipe<FieldInputRootProps>(\n ark.div,\n 'inputRoot',\n)\n\nexport type FieldInputProps = CerberusPrimitiveProps<\n ArkFieldInputProps & FieldVariantProps\n>\nexport const FieldInput = withSlotRecipe<FieldInputProps>(Field.Input, 'input')\n\n// Helper Text\n\nexport type FieldHelperTextProps =\n CerberusPrimitiveProps<ArkFieldHelperTextProps>\nexport const FieldHelperText = withSlotRecipe<FieldHelperTextProps>(\n Field.HelperText,\n 'helperText',\n)\n\n// Error Text\n\nexport type FieldErrorTextProps =\n CerberusPrimitiveProps<ArkFieldHelperTextProps>\nexport const FieldErrorText = withSlotRecipe<FieldErrorTextProps>(\n CerberusFieldErrorText,\n 'errorText',\n)\n\n// Textarea\n\nexport type FieldTextareaProps = CerberusPrimitiveProps<ArkFieldTextareaProps>\nexport const FieldTextarea = withSlotRecipe<FieldTextareaProps>(\n Field.Textarea,\n 'textarea',\n)\n\n/**\n * A named export for the FieldInput component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * import { Input } from '@cerberus/react'\n *\n * <Field\n * label=\"Enter your email\"\n * helperText=\"We'll never share your email with anyone else.\"\n * errorText=\"Email is required.\"\n * required\n * >\n * <Input type=\"email\" />\n * </Field>\n * ```\n */\nexport const Input = CerberusFieldInput\n\n/**\n * A named export for the FieldTextarea component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * import { Textarea } from '@cerberus/react'\n *\n * <Field\n * label=\"Comments\"\n * helperText=\"Your comments are valuable to us.\"\n * >\n * <Textarea />\n * </Field>\n * ```\n */\nexport const Textarea = FieldTextarea\n","import { css, cx } from 'styled-system/css'\nimport type { RecipeVariantRecord } from 'styled-system/types'\nimport {\n type ComponentType,\n type ElementType,\n type HTMLAttributes,\n type PropsWithChildren,\n} from 'react'\nimport type { WithCss } from '../types'\nimport type {\n CerberusPrimitiveEl,\n CerberusPrimitiveRecipe,\n CerberusRecipe,\n CerberusSlotRecipe,\n WithRecipeOptions,\n} from './types'\n\n/**\n * This module contains a factory for creating Cerberus primitives.\n * @module @cerberus/core/system/factory\n */\n\nexport class CerberusPrimitive {\n recipe: CerberusPrimitiveRecipe | null\n\n constructor(recipe?: CerberusPrimitiveRecipe) {\n this.recipe = recipe ?? null\n }\n\n private hasStyles(styles: string | undefined): Record<string, unknown> {\n if (styles) {\n return {\n className: styles,\n }\n }\n return {}\n }\n\n private validateComponent<P extends HTMLAttributes<unknown>>(\n Component: ComponentType<P> | string,\n ) {\n if (typeof Component !== 'function' && typeof Component !== 'object') {\n return false\n }\n return true\n }\n\n /**\n * Creates a Cerberus component with bare features and no recipe.\n * @param Component - The React component to enhance with Cerberus features.\n * Can be a string or a component reference.\n * @returns A new React component that applies Cerberus features to the\n * original component.\n *\n * @example\n * ```ts\n * const { withNoRecipe } = createCerberusPrimitive(buttonRecipe)\n * const Button = withNoRecipe('button')\n * ```\n */\n withNoRecipe = <P extends HTMLAttributes<unknown>>(\n Component: ComponentType<P> | string,\n options?: WithRecipeOptions,\n ): CerberusPrimitiveEl<P> => {\n const { defaultProps } = options || {}\n const El = Component as ComponentType<P> | ElementType\n\n const CerbComponent = (props: PropsWithChildren<P> & WithCss) => {\n const { css: customCss, className, ...nativeProps } = props\n const styles = this.hasStyles(cx(className, css(customCss)))\n return <El {...defaultProps} {...styles} {...(nativeProps as P)} />\n }\n\n if (this.validateComponent(El)) {\n const ElName = typeof El === 'string' ? El : El.displayName || El.name\n CerbComponent.displayName = ElName\n }\n\n return CerbComponent\n }\n\n /**\n * Creates a Cerberus component with the given recipe.\n * @param Component - The React component to enhance with the recipe.\n * @param options - Options for the recipe.\n * @returns A new React component that applies the recipe to the original\n * component.\n */\n withRecipe = <P extends HTMLAttributes<unknown>>(\n Component: ComponentType<P> | string,\n options?: WithRecipeOptions,\n ): CerberusPrimitiveEl<P & WithRecipeOptions['defaultProps']> => {\n const { defaultProps } = options || {}\n const El = Component as ComponentType<P> | ElementType\n\n const recipe = this.recipe as CerberusRecipe\n\n const CerbComponent = (internalProps: PropsWithChildren<P> & WithCss) => {\n const {\n css: customCss,\n className,\n ...restOfInternalProps\n } = internalProps\n\n const [variantOptions, nativeProps] =\n recipe.splitVariantProps(restOfInternalProps)\n const recipeStyles = recipe(variantOptions)\n\n return (\n <Component\n {...defaultProps}\n {...(nativeProps as P)}\n className={cx(className, recipeStyles, css(customCss))}\n />\n )\n }\n\n if (this.validateComponent(El)) {\n const ElName = typeof El === 'string' ? El : El.displayName || El.name\n CerbComponent.displayName = ElName\n }\n\n return CerbComponent\n }\n\n /**\n * Creates a Cerberus component with a slot recipe applied.\n * @param Component - The React component to enhance with Cerberus features.\n * @param recipe - The slot recipe to apply to the component.\n * @returns A new React component that applies Cerberus features and the\n * specified slot recipe to the original component.\n * @example\n * ```typescript\n * const { withSlotRecipe } = createCerberusPrimitive(field)\n * const Field = withSlotRecipe(RawField, field)\n * ```\n */\n withSlotRecipe = <P extends HTMLAttributes<unknown>>(\n Component: ComponentType<P> | string,\n slot: keyof RecipeVariantRecord,\n options?: WithRecipeOptions,\n ) => {\n const { defaultProps } = options || {}\n const El = Component as ComponentType<P> | ElementType\n\n const recipe = this.recipe as CerberusSlotRecipe<typeof slot>\n\n const CerbComponent = (internalProps: PropsWithChildren<P> & WithCss) => {\n const {\n css: customCss,\n className,\n ...restOfInternalProps\n } = internalProps\n\n const [variantOptions, nativeProps] =\n recipe.splitVariantProps(restOfInternalProps)\n const styles = recipe(variantOptions)\n const slotStyles = styles[slot as keyof typeof styles]\n\n return (\n <Component\n {...defaultProps}\n {...(nativeProps as P)}\n className={cx(className, slotStyles, css(customCss))}\n />\n )\n }\n\n if (this.validateComponent(El)) {\n const ElName = typeof El === 'string' ? El : El.displayName || El.name\n CerbComponent.displayName = ElName\n }\n\n return CerbComponent\n }\n}\n","import { CerberusPrimitive } from './primitive-factory'\nimport type { CerberusFactory, CerberusPrimitiveRecipe } from './types'\nimport { cerberusFactoryProxy } from './factory'\n\n/**\n * This module contains the user interface for creating Cerberus primitives.\n * @module @cerberus/core/system/create-cerb-primitive\n */\n\n/**\n * A factory function that creates a Cerberus primitive instance with the given\n * recipe.\n * @param recipe\n * @returns An object with three methods: `withNoRecipe`, `withRecipe`, and `withSlotRecipe` that\n * apply the recipes and special Cerberus helpers like `css`.\n *\n * @example\n * ```tsx\n * const { withRecipe } = createCerberusPrimitive(myCustomRecipe);\n * export const Button = withRecipe(MyCustomButton)\n * ```\n */\nexport function createCerberusPrimitive<T extends CerberusPrimitiveRecipe>(\n recipe?: T,\n) {\n return new CerberusPrimitive(recipe)\n}\n\n/**\n * A utility function to access Cerberus components by their name.\n * @param component - The name of the Cerberus component to access.\n * @returns The Cerberus component corresponding to the provided name.\n * @throws An error if the component name is not valid.\n *\n * @example\n * ```tsx\n * import { cerberus } from '@cerberus/react'\n * const Button = cerberus('button')\n *\n * <Button css={{ color: 'blue' }} asChild>\n * <Link href=\"/some-page\">Click me</Link>\n * </Button>\n * ```\n */\nexport const cerberus = cerberusFactoryProxy as CerberusFactory\n\nexport * from './types'\n","import { cx } from 'styled-system/css'\nimport { field } from 'styled-system/recipes'\nimport type { HTMLAttributes } from 'react'\n\nexport type FieldIndicatorProps = HTMLAttributes<HTMLSpanElement>\n\n/**\n * The start indicator displays an indicator at the start of the Input.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n */\nexport function FieldStartIndicator(props: FieldIndicatorProps) {\n const styles = field()\n\n if (!props.children) return null\n\n return (\n <span\n {...props}\n data-part=\"start-indicator\"\n className={cx(props.className, styles.startIndicator)}\n />\n )\n}\n","'use client'\n\nimport { useFieldContext } from '@ark-ui/react'\nimport { cx } from 'styled-system/css'\nimport { field } from 'styled-system/recipes'\nimport { useCerberusContext } from '../../context/cerberus'\nimport type { HTMLAttributes, ReactNode } from 'react'\n\nexport interface FieldStatusIndicatorProps\n extends HTMLAttributes<HTMLSpanElement> {\n /**\n * The fallback content to display when the field is valid.\n */\n fallback?: ReactNode\n}\n\n/**\n * The invalid status indicator for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldStatusIndicator />\n * </FieldRoot>\n * ```\n */\nexport function FieldStatusIndicator(props: FieldStatusIndicatorProps) {\n const { fallback, ...nativeProps } = props\n\n const fieldContext = useFieldContext()\n const styles = field()\n\n const { icons } = useCerberusContext()\n const { invalid: InvalidIcon } = icons\n\n if (!fieldContext) return null\n\n if (fieldContext.invalid) {\n return (\n <span\n {...nativeProps}\n aria-hidden=\"true\"\n data-invalid\n className={cx(nativeProps.className, styles.statusIndicator)}\n >\n <InvalidIcon />\n </span>\n )\n }\n\n return (\n <span\n {...nativeProps}\n aria-hidden=\"true\"\n data-part=\"end-indicator\"\n className={cx(nativeProps.className, styles.endIndicator)}\n >\n {fallback}\n </span>\n )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n","import { Field } from '@ark-ui/react/field'\nimport type { FieldErrorTextProps } from './primitives'\n\n/**\n * The error text for the Field component that is shown when the field is\n * invalid.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldInput />\n * <FieldErrorText>Error text</FieldErrorText>\n * </FieldRoot>\n * ```\n */\nexport function CerberusFieldErrorText(props: FieldErrorTextProps) {\n if (!props.children) return null\n return <Field.ErrorText {...props} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAQO;AACP,IAAAC,gBAAuC;AACvC,IAAAC,kBAA8C;;;ACV9C,iBAAwB;AAsEX;AAhDN,IAAM,oBAAN,MAAwB;AAAA,EAG7B,YAAY,QAAkC;AAF9C;AAqCA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wCAAe,CACb,WACA,YAC2B;AAC3B,YAAM,EAAE,aAAa,IAAI,WAAW,CAAC;AACrC,YAAM,KAAK;AAEX,YAAM,gBAAgB,CAAC,UAA0C;AAC/D,cAAM,EAAE,KAAK,WAAW,WAAW,GAAG,YAAY,IAAI;AACtD,cAAM,SAAS,KAAK,cAAU,eAAG,eAAW,gBAAI,SAAS,CAAC,CAAC;AAC3D,eAAO,4CAAC,MAAI,GAAG,cAAe,GAAG,QAAS,GAAI,aAAmB;AAAA,MACnE;AAEA,UAAI,KAAK,kBAAkB,EAAE,GAAG;AAC9B,cAAM,SAAS,OAAO,OAAO,WAAW,KAAK,GAAG,eAAe,GAAG;AAClE,sBAAc,cAAc;AAAA,MAC9B;AAEA,aAAO;AAAA,IACT;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sCAAa,CACX,WACA,YAC+D;AAC/D,YAAM,EAAE,aAAa,IAAI,WAAW,CAAC;AACrC,YAAM,KAAK;AAEX,YAAM,SAAS,KAAK;AAEpB,YAAM,gBAAgB,CAAC,kBAAkD;AACvE,cAAM;AAAA,UACJ,KAAK;AAAA,UACL;AAAA,UACA,GAAG;AAAA,QACL,IAAI;AAEJ,cAAM,CAAC,gBAAgB,WAAW,IAChC,OAAO,kBAAkB,mBAAmB;AAC9C,cAAM,eAAe,OAAO,cAAc;AAE1C,eACE;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,YACH,GAAI;AAAA,YACL,eAAW,eAAG,WAAW,kBAAc,gBAAI,SAAS,CAAC;AAAA;AAAA,QACvD;AAAA,MAEJ;AAEA,UAAI,KAAK,kBAAkB,EAAE,GAAG;AAC9B,cAAM,SAAS,OAAO,OAAO,WAAW,KAAK,GAAG,eAAe,GAAG;AAClE,sBAAc,cAAc;AAAA,MAC9B;AAEA,aAAO;AAAA,IACT;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0CAAiB,CACf,WACA,MACA,YACG;AACH,YAAM,EAAE,aAAa,IAAI,WAAW,CAAC;AACrC,YAAM,KAAK;AAEX,YAAM,SAAS,KAAK;AAEpB,YAAM,gBAAgB,CAAC,kBAAkD;AACvE,cAAM;AAAA,UACJ,KAAK;AAAA,UACL;AAAA,UACA,GAAG;AAAA,QACL,IAAI;AAEJ,cAAM,CAAC,gBAAgB,WAAW,IAChC,OAAO,kBAAkB,mBAAmB;AAC9C,cAAM,SAAS,OAAO,cAAc;AACpC,cAAM,aAAa,OAAO,IAA2B;AAErD,eACE;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,YACH,GAAI;AAAA,YACL,eAAW,eAAG,WAAW,gBAAY,gBAAI,SAAS,CAAC;AAAA;AAAA,QACrD;AAAA,MAEJ;AAEA,UAAI,KAAK,kBAAkB,EAAE,GAAG;AAC9B,cAAM,SAAS,OAAO,OAAO,WAAW,KAAK,GAAG,eAAe,GAAG;AAClE,sBAAc,cAAc;AAAA,MAC9B;AAEA,aAAO;AAAA,IACT;AApJE,SAAK,SAAS,UAAU;AAAA,EAC1B;AAAA,EAEQ,UAAU,QAAqD;AACrE,QAAI,QAAQ;AACV,aAAO;AAAA,QACL,WAAW;AAAA,MACb;AAAA,IACF;AACA,WAAO,CAAC;AAAA,EACV;AAAA,EAEQ,kBACN,WACA;AACA,QAAI,OAAO,cAAc,cAAc,OAAO,cAAc,UAAU;AACpE,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT;AAkIF;;;ACzJO,SAAS,wBACd,QACA;AACA,SAAO,IAAI,kBAAkB,MAAM;AACrC;;;AC1BA,IAAAC,cAAmB;AACnB,qBAAsB;AAelB,IAAAC,sBAAA;AANG,SAAS,oBAAoB,OAA4B;AAC9D,QAAM,aAAS,sBAAM;AAErB,MAAI,CAAC,MAAM,SAAU,QAAO;AAE5B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,aAAU;AAAA,MACV,eAAW,gBAAG,MAAM,WAAW,OAAO,cAAc;AAAA;AAAA,EACtD;AAEJ;;;ACpBA,IAAAC,gBAAgC;AAChC,IAAAC,cAAmB;AACnB,IAAAC,kBAAsB;;;ACFtB,mBAAkE;AAyB9D,IAAAC,sBAAA;AAfJ,IAAM,sBAAkB,4BAA2C,IAAI;AAyBhE,SAAS,qBAAqB;AACnC,QAAM,cAAU,yBAAW,eAAe;AAC1C,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACtE;AACA,SAAO;AACT;;;ADEQ,IAAAC,sBAAA;AAnBD,SAAS,qBAAqB,OAAkC;AACrE,QAAM,EAAE,UAAU,GAAG,YAAY,IAAI;AAErC,QAAM,mBAAe,+BAAgB;AACrC,QAAM,aAAS,uBAAM;AAErB,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,SAAS,YAAY,IAAI;AAEjC,MAAI,CAAC,aAAc,QAAO;AAE1B,MAAI,aAAa,SAAS;AACxB,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,eAAY;AAAA,QACZ,gBAAY;AAAA,QACZ,eAAW,gBAAG,YAAY,WAAW,OAAO,eAAe;AAAA,QAE3D,uDAAC,eAAY;AAAA;AAAA,IACf;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,aAAU;AAAA,MACV,eAAW,gBAAG,YAAY,WAAW,OAAO,YAAY;AAAA,MAEvD;AAAA;AAAA,EACH;AAEJ;;;AE5DA,mBAAsB;AAiBb,IAAAC,sBAAA;AAFF,SAAS,uBAAuB,OAA4B;AACjE,MAAI,CAAC,MAAM,SAAU,QAAO;AAC5B,SAAO,6CAAC,mBAAM,WAAN,EAAiB,GAAG,OAAO;AACrC;;;ANmBI,IAAAC,sBAAA;AAdJ,IAAM,EAAE,gBAAgB,aAAa,IAAI,wBAAwB,qBAAK;AAO/D,IAAM,YAAY,eAA+B,oBAAM,MAAM,MAAM;AAI1E,SAAS,aAAa,OAAwB;AAC5C,QAAM,EAAE,UAAU,GAAG,YAAY,IAAI;AACrC,SACE,8CAAC,oBAAM,OAAN,EAAa,GAAG,aACd;AAAA;AAAA,IACD,6CAAC,oBAAM,mBAAN,EAAwB,wBAAU;AAAA,KACrC;AAEJ;AAGO,IAAM,aAAa,eAAgC,cAAc,OAAO;AAI/E,SAAS,yBAAyB,OAAoC;AACpE,SACE,6CAAC,oBAAM,mBAAN,EAAyB,GAAG,OAAO,wBAAU;AAElD;AAIO,IAAM,yBAAyB;AAAA,EACpC;AACF;AAOO,IAAM,iBAAiB;AAAA,EAC5B,kBAAI;AAAA,EACJ;AACF;AAKO,IAAM,aAAa,eAAgC,oBAAM,OAAO,OAAO;AAMvE,IAAM,kBAAkB;AAAA,EAC7B,oBAAM;AAAA,EACN;AACF;AAMO,IAAM,iBAAiB;AAAA,EAC5B;AAAA,EACA;AACF;AAKO,IAAM,gBAAgB;AAAA,EAC3B,oBAAM;AAAA,EACN;AACF;;;ADlCO,IAAM,aAA8B;AAAA,EACzC,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,mBAAmB;AACrB;","names":["import_field","import_react","import_recipes","import_css","import_jsx_runtime","import_react","import_css","import_recipes","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}