mirror of
https://github.com/MetaFam/TheGame.git
synced 2026-04-24 03:00:09 -04:00
9e37df6207
* beginning ESM transition: Ceramic libraries, Next.js, & TypeScript configuration 🇭🇰 * updating Chakra, React, & Next image `import`s 👔 * upgrading `@types/react`, import extensions for Node, & b64 SVG to PNG ⛹🏿♀️ * fixing relative import names & upddating @types packages 📻 * removoing WYSIWYG editor, draft-js, & updating express ⛹🏿♀️ * updating OpenSea 🚲 * ¡@metafam/utils is building! 📰 * ¡Discord bot is building! 👘 * ¡backend is building! 🛩 * fixed everything but Ceramic DID update 🏍 * switching to DID:PKH 📦 * fixing "only one child allowed" error 🙇🏿♀️ * importing `React` as required by tsc's `isolatedModules` 🇲🇰 * disabling testing rather than taking the time to fix jest ⚜ * removing set `types` from `tsconfig` to fix compilation error 🥦 * printing tests disabled warning, hopefully 🙀 * setting file to be copied to the new resolver 👁️🗨️ * "paths-resolver" not "paths-resolve" 🦴 * switching back to relative paths rather than trying to fix `paths` ⏳ * `yarn backend:dev` not working, testing GitHub build 🎺 * removing design system build & fixing some images ✊🏿 * fixed "expected function got string" error & trying to address undefined HTMLElement 🐡 * fixing @emotion/react tree shaking by making external 🏏 * including eslint config in Dockerfile 🌾 * fixing more images 🎯 * updating DIDs & switching back to an updated DID:3 ❇ * switching to w3s.link gateway & fixing early termination of storage endpoint 🔭 * switching back to ipfs.io gateway b/c w3s.link serves SVGs as application/xml which are CORB blocked 🥾 * fixing node config name in eslint ignore & shortening some paths 🧰 * fixing ts-node not handling project references 🥁
37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import { Flex, Text } from '@metafam/ds';
|
|
import type { PropsWithChildren } from 'react';
|
|
import React from 'react';
|
|
import { FieldError } from 'react-hook-form';
|
|
|
|
type FieldProps = PropsWithChildren<{
|
|
label: string;
|
|
error?: FieldError;
|
|
}>;
|
|
|
|
export const Field: React.FC<FieldProps> = ({ children, error, label }) => (
|
|
<Flex pb={3} w="100%" direction="column">
|
|
<Flex justify="space-between" w="100%" mb={2}>
|
|
<Text textStyle="caption" textAlign="left" ml={4}>
|
|
{label}
|
|
</Text>
|
|
|
|
<Text textStyle="caption" textAlign="left" color="red.400" mr={4}>
|
|
{error?.type === 'required' && (error.message || 'Required')}
|
|
{error?.type === 'pattern' && (error.message || 'Invalid URL')}
|
|
{error?.type === 'minLength' && (error.message || 'Too short')}
|
|
{error?.type === 'maxLength' && (error.message || 'Too long')}
|
|
{error?.type === 'min' && (error.message || 'Too small')}
|
|
{error?.type === 'validate' && (error.message || 'Invalid')}
|
|
</Text>
|
|
</Flex>
|
|
|
|
{children}
|
|
</Flex>
|
|
);
|
|
|
|
export const FieldDescription: React.FC<PropsWithChildren> = ({ children }) => (
|
|
<Text ml={4} mt={1} fontSize="sm">
|
|
{children}
|
|
</Text>
|
|
);
|