@atom-learning/components 6.0.0-beta.0 → 6.0.0-beta.10

package/dist/components/empty-state/EmptyState.d.ts

@@ -0,0 +1,61 @@
+import * as React from 'react';
+declare const EmptyStateContainer: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+}, "direction" | "align" | "wrap" | "justify" | "gap"> & {
+    direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
+    wrap?: ("wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse">>) | undefined;
+    justify?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch">>) | undefined;
+    align?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline">>) | undefined;
+    gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "size"> & {
+    size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type EmptyStateProps = React.ComponentProps<typeof EmptyStateContainer>;
+export declare const EmptyState: {
+    ({ size, ...rest }: EmptyStateProps): React.JSX.Element;
+    displayName: string;
+} & {
+    Image: (props: Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+        ref?: ((instance: HTMLImageElement | null) => void) | React.RefObject<HTMLImageElement> | null | undefined;
+    }, "fluid"> & {
+        fluid?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    } & {
+        as?: React.ElementType;
+    }, "ref"> & React.RefAttributes<HTMLImageElement>, "ref">, "as"> & {
+        as?: never;
+    }, "size"> & {
+        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+    } & {
+        as?: React.ElementType;
+    } & React.RefAttributes<never>) => React.JSX.Element;
+    Title: (props: Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
+        ref?: ((instance: HTMLHeadingElement | null) => void) | React.RefObject<HTMLHeadingElement> | null | undefined;
+    }, "size"> & {
+        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+    } & {
+        as?: React.ElementType;
+    }, "ref"> & React.RefAttributes<HTMLHeadingElement> & {
+        as?: React.ComponentType | React.ElementType;
+    }) => React.JSX.Element;
+    Body: (props: Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+        ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
+    }, "size" | "weight" | "family" | "noCapsize"> & {
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "body" | "display" | "mono">>) | undefined;
+        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    } & {
+        as?: React.ElementType;
+    }, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+        as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
+    }, "ref"> & React.RefAttributes<HTMLParagraphElement>, "size"> & {
+        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+    } & {
+        as?: React.ElementType;
+    }, "ref"> & React.RefAttributes<HTMLParagraphElement>) => React.JSX.Element;
+};
+export {};

package/dist/components/empty-state/EmptyStateBody.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+declare const StyledEmptyStateBody: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+    ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
+}, "size" | "weight" | "family" | "noCapsize"> & {
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "body" | "display" | "mono">>) | undefined;
+    size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+    as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "size"> & {
+    size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+type EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody>;
+export declare const EmptyStateBody: (props: EmptyStateBodyProps) => React.JSX.Element;
+export {};

package/dist/components/empty-state/EmptyStateBody.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Text as o}from"../text/Text.js";import{styled as s}from"../../styled.js";import{EmptyStateContext as r}from"./EmptyState.context.js";const x=s(o,{base:["text-grey-800","font-normal"],variants:{size:{xs:["mb-4","text-sm"],sm:["mb-4","text-sm"],md:["mb-4","text-sm"],lg:["mb-6","text-md"],xl:["mb-6","text-md"]}}}),n=e=>{const{size:m}=t.useContext(r);return t.createElement(x,{size:m,...e})};export{n as EmptyStateBody};
+import*as t from"react";import{Text as o}from"../text/Text.js";import{styled as r}from"../../styled.js";import{EmptyStateContext as s}from"./EmptyState.context.js";const x=r(o,{base:["text-grey-800","font-normal"],variants:{size:{xs:["mb-4","text-sm"],sm:["mb-4","text-sm"],md:["mb-4","text-sm"],lg:["mb-6","text-md"],xl:["mb-6","text-md"]}}}),n=e=>{const{size:m}=t.useContext(s);return t.createElement(x,{...e,size:m})};export{n as EmptyStateBody};
 //# sourceMappingURL=EmptyStateBody.js.map

package/dist/components/empty-state/EmptyStateBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateBody.js","sources":["../../../src/components/empty-state/EmptyStateBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '~/components/text'\nimport { styled } from '~/styled'\n\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateBody = styled(Text, {\n  base: ['text-grey-800', 'font-normal'],\n  variants: {\n    size: {\n      xs: ['mb-4', 'text-sm'],\n      sm: ['mb-4', 'text-sm'],\n      md: ['mb-4', 'text-sm'],\n      lg: ['mb-6', 'text-md'],\n      xl: ['mb-6', 'text-md']\n    }\n  }\n})\n\ntype EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody> & {\n  as?: React.ComponentType | React.ElementType\n}\n\nexport const EmptyStateBody = (props: EmptyStateBodyProps) => {\n  const { size } = React.useContext(EmptyStateContext)\n  return <StyledEmptyStateBody size={size} {...props} />\n}\n"],"names":["StyledEmptyStateBody","styled","Text","EmptyStateBody","props","size","React","EmptyStateContext"],"mappings":"oKAOA,MAAMA,EAAuBC,EAAOC,EAAM,CACxC,KAAM,CAAC,gBAAiB,aAAa,EACrC,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,CACxB,CACF,CACF,CAAC,EAMYC,EAAkBC,GAA+B,CAC5D,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAiB,EACnD,OAAOD,EAAA,cAACN,EAAA,CAAqB,KAAMK,EAAO,GAAGD,EAAO,CACtD"}
+{"version":3,"file":"EmptyStateBody.js","sources":["../../../src/components/empty-state/EmptyStateBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '~/components/text'\nimport { styled } from '~/styled'\n\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateBody = styled(Text, {\n  base: ['text-grey-800', 'font-normal'],\n  variants: {\n    size: {\n      xs: ['mb-4', 'text-sm'],\n      sm: ['mb-4', 'text-sm'],\n      md: ['mb-4', 'text-sm'],\n      lg: ['mb-6', 'text-md'],\n      xl: ['mb-6', 'text-md']\n    }\n  }\n})\n\ntype EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody>\n\nexport const EmptyStateBody = (props: EmptyStateBodyProps) => {\n  const { size } = React.useContext(EmptyStateContext)\n  return <StyledEmptyStateBody {...props} size={size} />\n}\n"],"names":["StyledEmptyStateBody","styled","Text","EmptyStateBody","props","size","React","EmptyStateContext"],"mappings":"oKAOA,MAAMA,EAAuBC,EAAOC,EAAM,CACxC,KAAM,CAAC,gBAAiB,aAAa,EACrC,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,EACtB,GAAI,CAAC,OAAQ,SAAS,CACxB,CACF,CACF,CAAC,EAIYC,EAAkBC,GAA+B,CAC5D,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAiB,EACnD,OAAOD,EAAA,cAACN,EAAA,CAAsB,GAAGI,EAAO,KAAMC,EAAM,CACtD"}

package/dist/components/empty-state/EmptyStateImage.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+declare const StyledEmptyStateImage: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void) | React.RefObject<HTMLImageElement> | null | undefined;
+}, "fluid"> & {
+    fluid?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLImageElement>, "ref">, "as"> & {
+    as?: never;
+}, "size"> & {
+    size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+} & {
+    as?: React.ElementType;
+} & React.RefAttributes<never>>;
+type EmptyStateImageProps = React.ComponentProps<typeof StyledEmptyStateImage>;
+export declare const EmptyStateImage: (props: EmptyStateImageProps) => React.JSX.Element;
+export {};

package/dist/components/empty-state/EmptyStateTitle.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+declare const StyledEmptyStateTitle: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
+    ref?: ((instance: HTMLHeadingElement | null) => void) | React.RefObject<HTMLHeadingElement> | null | undefined;
+}, "size"> & {
+    size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+type EmptyStateTitleProps = React.ComponentProps<typeof StyledEmptyStateTitle> & {
+    as?: React.ComponentType | React.ElementType;
+};
+export declare const EmptyStateTitle: (props: EmptyStateTitleProps) => React.JSX.Element;
+export {};

package/dist/components/empty-state/index.d.ts

@@ -0,0 +1 @@
+export { EmptyState } from './EmptyState';

package/dist/components/field-wrapper/FieldDescription.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const Description: ({ children, className }: React.PropsWithChildren<{
+    className?: string;
+}>) => React.JSX.Element;

package/dist/components/field-wrapper/FieldWrapper.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { ValidationOptions } from '../../components/form';
+import { type LabelProps } from '../label/Label';
+export type FieldWrapperProps = {
+    className?: string;
+    error?: string;
+    fieldId: string;
+    label: string;
+    prompt?: {
+        link?: string;
+        label: string;
+        onClick?: () => void;
+    };
+    description?: string;
+    required?: boolean;
+    hideLabel?: boolean;
+    appearance?: LabelProps['appearance'];
+};
+export type FieldElementWrapperProps = Omit<FieldWrapperProps, 'fieldId'> & {
+    name: string;
+    validation?: ValidationOptions;
+};
+export declare const FieldWrapper: {
+    ({ children, error, fieldId, label, prompt, description, required, hideLabel, appearance, ...rest }: React.PropsWithChildren<FieldWrapperProps>): React.JSX.Element;
+    displayName: string;
+};

package/dist/components/field-wrapper/InlineFieldWrapper.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+type InlineFieldWrapperProps = {
+    className?: string;
+    error?: string;
+    label: string;
+    required?: boolean;
+    align?: 'start' | 'center';
+    direction?: 'row' | 'reverse';
+    description?: string;
+};
+export declare const InlineFieldWrapper: {
+    ({ align, children, className, description, direction, error, label, required }: React.PropsWithChildren<InlineFieldWrapperProps>): React.JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/field-wrapper/index.d.ts

@@ -0,0 +1,3 @@
+export type { FieldWrapperProps, FieldElementWrapperProps } from './FieldWrapper';
+export { FieldWrapper } from './FieldWrapper';
+export { InlineFieldWrapper } from './InlineFieldWrapper';

package/dist/components/file-drop/FileDrop.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { Flex } from '../flex';
+import { type FileDropContextValue } from './types';
+interface FileDropProps extends Omit<React.ComponentProps<typeof Flex>, 'onDrop'> {
+    onDrop: (files: File[]) => void;
+    children?: React.ReactNode | ((value: FileDropContextValue) => React.ReactNode);
+    accept?: React.InputHTMLAttributes<HTMLInputElement>['accept'];
+    multiple?: React.InputHTMLAttributes<HTMLInputElement>['multiple'];
+    className?: string;
+}
+export declare const FileDrop: {
+    ({ className, children, accept, multiple, onDrop, ...props }: FileDropProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/file-drop/FileDropContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { FileDropContextValue } from './types';
+export declare const FileDropContext: React.Context<FileDropContextValue>;

package/dist/components/file-drop/index.d.ts

@@ -0,0 +1,2 @@
+export { FileDrop } from './FileDrop';
+export { useFileDrop } from './useFileDrop';

package/dist/components/file-drop/types.d.ts

@@ -0,0 +1,4 @@
+export interface FileDropContextValue {
+    isDragging: boolean;
+    files: File[];
+}

package/dist/components/file-drop/useFileDrop.d.ts

@@ -0,0 +1,2 @@
+import { FileDropContextValue } from './types';
+export declare const useFileDrop: () => FileDropContextValue;

package/dist/components/file-input/FileInput.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { Button } from '../button';
+export type FileInputProps = React.ComponentProps<typeof Button> & {
+    onFileSelect: (selection: FileList | null) => void;
+    accept?: string;
+    multiple?: boolean;
+};
+export declare const FileInput: {
+    ({ accept, children, multiple, onFileSelect, ...rest }: FileInputProps): React.JSX.Element;
+    displayName: string;
+};

package/dist/components/file-input/index.d.ts

@@ -0,0 +1 @@
+export { FileInput } from './FileInput';

package/dist/components/flex/Flex.d.ts

@@ -0,0 +1,11 @@
+export declare const Flex: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "direction" | "align" | "wrap" | "justify" | "gap"> & {
+    direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
+    wrap?: ("wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "wrap" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "nowrap" | "wrap-reverse">>) | undefined;
+    justify?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "left" | "right" | "space-between" | "space-around" | "space-evenly" | "stretch">>) | undefined;
+    align?: ("end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "end" | "start" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "unsafe" | "safe" | "center" | "flex-start" | "flex-end" | "stretch" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline">>) | undefined;
+    gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+} & {
+    as?: import("react").ElementType;
+}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/flex/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../src/components/flex/Flex.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const Flex = styled('div', {\n  base: ['flex'],\n  variants: {\n    direction: {\n      row: ['flex-row'],\n      'row-reverse': ['flex-row-reverse'],\n      column: ['flex-col'],\n      'column-reverse': ['flex-col-reverse'],\n      inherit: ['direction-[inherit]'],\n      initial: ['direction-[initial]'],\n      revert: ['direction-[revert]'],\n      'revert-layer': ['direction-[revert-layer]'],\n      unset: ['direction-[unset]']\n    },\n    wrap: {\n      nowrap: ['flex-no-wrap'],\n      wrap: ['flex-wrap'],\n      'wrap-reverse': ['flex-wrap-reverse'],\n      inherit: ['[flex-wrap:inherit]'],\n      initial: ['[flex-wrap:initial]'],\n      revert: ['[flex-wrap:revert]'],\n      'revert-layer': ['[flex-wrap:revert-layer]'],\n      unset: ['[flex-wrap:unset]']\n    },\n    justify: {\n      normal: ['justify-normal'],\n      unsafe: ['[justify-content:unsafe]'],\n      safe: ['[justify-content:safe]'],\n      start: ['justify-start'],\n      center: ['justify-center'],\n      end: ['justify-end'],\n      'flex-start': ['justify-start'],\n      'flex-end': ['justify-end'],\n      left: ['[justify-content:left]'],\n      right: ['[justify-content:right]'],\n      'space-between': ['justify-between'],\n      'space-around': ['justify-around'],\n      'space-evenly': ['justify-evenly'],\n      stretch: ['justify-stretch'],\n      inherit: ['[justify-content:inherit]'],\n      initial: ['[justify-content:initial]'],\n      revert: ['[justify-content:revert]'],\n      'revert-layer': ['[justify-content:revert-layer]'],\n      unset: ['[justify-content:unset]']\n    },\n    align: {\n      normal: ['[align-items:normal]'],\n      unsafe: ['[align-items:unsafe]'],\n      safe: ['[align-items:safe]'],\n      center: ['items-center'],\n      start: ['items-start'],\n      end: ['items-end'],\n      'self-start': ['[align-items:self-start]'],\n      'self-end': ['[align-items:self-end]'],\n      'flex-start': ['items-start'],\n      'flex-end': ['items-end'],\n      baseline: ['items-baseline'],\n      'first baseline': ['[align-items:first baseline]'],\n      'last baseline': ['[align-items:last baseline]'],\n      stretch: ['items-stretch'],\n      inherit: ['[align-items:inherit]'],\n      initial: ['[align-items:initial]'],\n      revert: ['[align-items:revert]'],\n      'revert-layer': ['[align-items:revert-layer]'],\n      unset: ['[align-items:unset]']\n    },\n    gap: {\n      '0': ['gap-0.5'],\n      '1': ['gap-1'],\n      '2': ['gap-2'],\n      '3': ['gap-3'],\n      '4': ['gap-4'],\n      '24': ['gap-6'],\n      '5': ['gap-8'],\n      '6': ['gap-10'],\n      '7': ['gap-12'],\n      '8': ['gap-16'],\n      '9': ['gap-20']\n    }\n  }\n})\n\nFlex.displayName = 'Flex'\n"],"names":["Flex","styled"],"mappings":"yCAEO,MAAMA,EAAOC,EAAO,MAAO,CAChC,KAAM,CAAC,MAAM,EACb,SAAU,CACR,UAAW,CACT,IAAK,CAAC,UAAU,EAChB,cAAe,CAAC,kBAAkB,EAClC,OAAQ,CAAC,UAAU,EACnB,iBAAkB,CAAC,kBAAkB,EACrC,QAAS,CAAC,qBAAqB,EAC/B,QAAS,CAAC,qBAAqB,EAC/B,OAAQ,CAAC,oBAAoB,EAC7B,eAAgB,CAAC,0BAA0B,EAC3C,MAAO,CAAC,mBAAmB,CAC7B,EACA,KAAM,CACJ,OAAQ,CAAC,cAAc,EACvB,KAAM,CAAC,WAAW,EAClB,eAAgB,CAAC,mBAAmB,EACpC,QAAS,CAAC,qBAAqB,EAC/B,QAAS,CAAC,qBAAqB,EAC/B,OAAQ,CAAC,oBAAoB,EAC7B,eAAgB,CAAC,0BAA0B,EAC3C,MAAO,CAAC,mBAAmB,CAC7B,EACA,QAAS,CACP,OAAQ,CAAC,gBAAgB,EACzB,OAAQ,CAAC,0BAA0B,EACnC,KAAM,CAAC,wBAAwB,EAC/B,MAAO,CAAC,eAAe,EACvB,OAAQ,CAAC,gBAAgB,EACzB,IAAK,CAAC,aAAa,EACnB,aAAc,CAAC,eAAe,EAC9B,WAAY,CAAC,aAAa,EAC1B,KAAM,CAAC,wBAAwB,EAC/B,MAAO,CAAC,yBAAyB,EACjC,gBAAiB,CAAC,iBAAiB,EACnC,eAAgB,CAAC,gBAAgB,EACjC,eAAgB,CAAC,gBAAgB,EACjC,QAAS,CAAC,iBAAiB,EAC3B,QAAS,CAAC,2BAA2B,EACrC,QAAS,CAAC,2BAA2B,EACrC,OAAQ,CAAC,0BAA0B,EACnC,eAAgB,CAAC,gCAAgC,EACjD,MAAO,CAAC,yBAAyB,CACnC,EACA,MAAO,CACL,OAAQ,CAAC,sBAAsB,EAC/B,OAAQ,CAAC,sBAAsB,EAC/B,KAAM,CAAC,oBAAoB,EAC3B,OAAQ,CAAC,cAAc,EACvB,MAAO,CAAC,aAAa,EACrB,IAAK,CAAC,WAAW,EACjB,aAAc,CAAC,0BAA0B,EACzC,WAAY,CAAC,wBAAwB,EACrC,aAAc,CAAC,aAAa,EAC5B,WAAY,CAAC,WAAW,EACxB,SAAU,CAAC,gBAAgB,EAC3B,iBAAkB,CAAC,8BAA8B,EACjD,gBAAiB,CAAC,6BAA6B,EAC/C,QAAS,CAAC,eAAe,EACzB,QAAS,CAAC,uBAAuB,EACjC,QAAS,CAAC,uBAAuB,EACjC,OAAQ,CAAC,sBAAsB,EAC/B,eAAgB,CAAC,4BAA4B,EAC7C,MAAO,CAAC,qBAAqB,CAC/B,EACA,IAAK,CACH,EAAK,CAAC,SAAS,EACf,EAAK,CAAC,OAAO,EACb,EAAK,CAAC,OAAO,EACb,EAAK,CAAC,OAAO,EACb,EAAK,CAAC,OAAO,EACb,GAAM,CAAC,OAAO,EACd,EAAK,CAAC,OAAO,EACb,EAAK,CAAC,QAAQ,EACd,EAAK,CAAC,QAAQ,EACd,EAAK,CAAC,QAAQ,EACd,EAAK,CAAC,QAAQ,CAChB,CACF,CACF,CAAC,EAEDD,EAAK,YAAc"}
+{"version":3,"file":"Flex.js","sources":["../../../src/components/flex/Flex.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const Flex = styled('div', {\n  base: ['flex'],\n  variants: {\n    direction: {\n      row: ['flex-row'],\n      'row-reverse': ['flex-row-reverse'],\n      column: ['flex-col'],\n      'column-reverse': ['flex-col-reverse'],\n      inherit: ['direction-[inherit]'],\n      initial: ['direction-[initial]'],\n      revert: ['direction-[revert]'],\n      'revert-layer': ['direction-[revert-layer]'],\n      unset: ['direction-[unset]']\n    },\n    wrap: {\n      nowrap: ['flex-no-wrap'],\n      wrap: ['flex-wrap'],\n      'wrap-reverse': ['flex-wrap-reverse'],\n      inherit: ['[flex-wrap:inherit]'],\n      initial: ['[flex-wrap:initial]'],\n      revert: ['[flex-wrap:revert]'],\n      'revert-layer': ['[flex-wrap:revert-layer]'],\n      unset: ['[flex-wrap:unset]']\n    },\n    justify: {\n      normal: ['justify-normal'],\n      unsafe: ['[justify-content:unsafe]'],\n      safe: ['[justify-content:safe]'],\n      start: ['justify-start'],\n      center: ['justify-center'],\n      end: ['justify-end'],\n      'flex-start': ['justify-start'],\n      'flex-end': ['justify-end'],\n      left: ['[justify-content:left]'],\n      right: ['[justify-content:right]'],\n      'space-between': ['justify-between'],\n      'space-around': ['justify-around'],\n      'space-evenly': ['justify-evenly'],\n      stretch: ['justify-stretch'],\n      inherit: ['[justify-content:inherit]'],\n      initial: ['[justify-content:initial]'],\n      revert: ['[justify-content:revert]'],\n      'revert-layer': ['[justify-content:revert-layer]'],\n      unset: ['[justify-content:unset]']\n    },\n    align: {\n      normal: ['[align-items:normal]'],\n      unsafe: ['[align-items:unsafe]'],\n      safe: ['[align-items:safe]'],\n      center: ['items-center'],\n      start: ['items-start'],\n      end: ['items-end'],\n      'self-start': ['[align-items:self-start]'],\n      'self-end': ['[align-items:self-end]'],\n      'flex-start': ['items-start'],\n      'flex-end': ['items-end'],\n      baseline: ['items-baseline'],\n      'first baseline': ['[align-items:first baseline]'],\n      'last baseline': ['[align-items:last baseline]'],\n      stretch: ['items-stretch'],\n      inherit: ['[align-items:inherit]'],\n      initial: ['[align-items:initial]'],\n      revert: ['[align-items:revert]'],\n      'revert-layer': ['[align-items:revert-layer]'],\n      unset: ['[align-items:unset]']\n    },\n    gap: {\n      0: ['gap-0.5'],\n      1: ['gap-1'],\n      2: ['gap-2'],\n      3: ['gap-3'],\n      4: ['gap-4'],\n      24: ['gap-6'],\n      5: ['gap-8'],\n      6: ['gap-10'],\n      7: ['gap-12'],\n      8: ['gap-16'],\n      9: ['gap-20']\n    }\n  }\n})\n\nFlex.displayName = 'Flex'\n"],"names":["Flex","styled"],"mappings":"yCAEO,MAAMA,EAAOC,EAAO,MAAO,CAChC,KAAM,CAAC,MAAM,EACb,SAAU,CACR,UAAW,CACT,IAAK,CAAC,UAAU,EAChB,cAAe,CAAC,kBAAkB,EAClC,OAAQ,CAAC,UAAU,EACnB,iBAAkB,CAAC,kBAAkB,EACrC,QAAS,CAAC,qBAAqB,EAC/B,QAAS,CAAC,qBAAqB,EAC/B,OAAQ,CAAC,oBAAoB,EAC7B,eAAgB,CAAC,0BAA0B,EAC3C,MAAO,CAAC,mBAAmB,CAC7B,EACA,KAAM,CACJ,OAAQ,CAAC,cAAc,EACvB,KAAM,CAAC,WAAW,EAClB,eAAgB,CAAC,mBAAmB,EACpC,QAAS,CAAC,qBAAqB,EAC/B,QAAS,CAAC,qBAAqB,EAC/B,OAAQ,CAAC,oBAAoB,EAC7B,eAAgB,CAAC,0BAA0B,EAC3C,MAAO,CAAC,mBAAmB,CAC7B,EACA,QAAS,CACP,OAAQ,CAAC,gBAAgB,EACzB,OAAQ,CAAC,0BAA0B,EACnC,KAAM,CAAC,wBAAwB,EAC/B,MAAO,CAAC,eAAe,EACvB,OAAQ,CAAC,gBAAgB,EACzB,IAAK,CAAC,aAAa,EACnB,aAAc,CAAC,eAAe,EAC9B,WAAY,CAAC,aAAa,EAC1B,KAAM,CAAC,wBAAwB,EAC/B,MAAO,CAAC,yBAAyB,EACjC,gBAAiB,CAAC,iBAAiB,EACnC,eAAgB,CAAC,gBAAgB,EACjC,eAAgB,CAAC,gBAAgB,EACjC,QAAS,CAAC,iBAAiB,EAC3B,QAAS,CAAC,2BAA2B,EACrC,QAAS,CAAC,2BAA2B,EACrC,OAAQ,CAAC,0BAA0B,EACnC,eAAgB,CAAC,gCAAgC,EACjD,MAAO,CAAC,yBAAyB,CACnC,EACA,MAAO,CACL,OAAQ,CAAC,sBAAsB,EAC/B,OAAQ,CAAC,sBAAsB,EAC/B,KAAM,CAAC,oBAAoB,EAC3B,OAAQ,CAAC,cAAc,EACvB,MAAO,CAAC,aAAa,EACrB,IAAK,CAAC,WAAW,EACjB,aAAc,CAAC,0BAA0B,EACzC,WAAY,CAAC,wBAAwB,EACrC,aAAc,CAAC,aAAa,EAC5B,WAAY,CAAC,WAAW,EACxB,SAAU,CAAC,gBAAgB,EAC3B,iBAAkB,CAAC,8BAA8B,EACjD,gBAAiB,CAAC,6BAA6B,EAC/C,QAAS,CAAC,eAAe,EACzB,QAAS,CAAC,uBAAuB,EACjC,QAAS,CAAC,uBAAuB,EACjC,OAAQ,CAAC,sBAAsB,EAC/B,eAAgB,CAAC,4BAA4B,EAC7C,MAAO,CAAC,qBAAqB,CAC/B,EACA,IAAK,CACH,EAAG,CAAC,SAAS,EACb,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,GAAI,CAAC,OAAO,EACZ,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,CACd,CACF,CACF,CAAC,EAEDD,EAAK,YAAc"}

package/dist/components/flex/index.d.ts

@@ -0,0 +1 @@
+export { Flex } from './Flex';

package/dist/components/form/Form.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { DefaultValues, FieldValues, Mode, SubmitErrorHandler, SubmitHandler, UseFormMethods } from 'react-hook-form';
+import { type FormCustomContextType } from './useFormCustomContext';
+type StyledFormProps = Omit<React.HTMLAttributes<HTMLFormElement>, 'onSubmit' | 'onError'>;
+interface FormProps<TFormData extends FieldValues> extends StyledFormProps {
+    defaultValues?: DefaultValues<TFormData>;
+    validationMode?: Mode;
+    onSubmit: SubmitHandler<TFormData>;
+    onError?: SubmitErrorHandler<TFormData>;
+    children: React.ReactNode | ((methods: UseFormMethods<TFormData>) => React.ReactNode);
+}
+export declare const Form: {
+    <TFormData extends FieldValues>(props: FormProps<TFormData> & FormCustomContextType): React.JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/form/index.d.ts

@@ -0,0 +1,4 @@
+export { Form } from './Form';
+export type { ValidationOptions } from './validation';
+export { useFieldError } from './useFieldError';
+export { useFormCustomContext } from './useFormCustomContext';

package/dist/components/form/useFieldError.d.ts

@@ -0,0 +1,3 @@
+export declare const useFieldError: (fieldName: string) => {
+    error: any;
+};

package/dist/components/form/useFormCustomContext.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { InputField } from '../input-field';
+export type FormCustomContextType = {
+    appearance?: React.ComponentProps<typeof InputField>['appearance'];
+} | undefined;
+export declare const FormCustomContext: React.Context<FormCustomContextType>;
+export declare const useFormCustomContext: () => FormCustomContextType;

package/dist/components/form/validation.d.ts

@@ -0,0 +1,25 @@
+export type ValidationOptions = {
+    required?: Option<boolean> | string;
+    min?: Option<number>;
+    max?: Option<number>;
+    minLength?: Option<number>;
+    maxLength?: Option<number>;
+    pattern?: Option<RegExp>;
+    validate?: Validator | {
+        [key: string]: Validator;
+    };
+    valueAsNumber?: boolean;
+    valueAsDate?: boolean;
+    process?: Processor;
+};
+export type ValidationError = {
+    message: string;
+    type: 'required' | 'min' | 'max' | 'minLength' | 'maxLength' | 'pattern' | 'validate';
+};
+type Validator = (value: any) => boolean | string | Promise<boolean | string>;
+type Processor = (value: any) => any;
+type Option<T> = {
+    value: T;
+    message: string;
+};
+export {};

package/dist/components/grid/Grid.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+declare const GridContainer: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+}, "gap"> & {
+    gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+type GridProps = React.ComponentProps<typeof GridContainer> & {
+    minItemSize?: string;
+    maxItemSize?: string;
+} & {
+    as?: any;
+};
+export declare const Grid: {
+    ({ className, style, gap, minItemSize, maxItemSize, ...remainingProps }: GridProps): React.JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/grid/Grid.js

@@ -1,2 +1,2 @@
-import g from"clsx";import*as r from"react";import{styled as o}from"../../styled.js";const l=o("div",{base:["grid"],variants:{gap:{0:["gap-0.5"],1:["gap-1"],2:["gap-2"],3:["gap-3"],4:["gap-4"],24:["gap-6"],5:["gap-8"],6:["gap-10"],7:["gap-12"],8:["gap-16"],9:["gap-20"]}}}),e=({className:i,style:m,gap:t="2",minItemSize:a,maxItemSize:p="1fr",...s})=>r.createElement(l,{...s,style:{...m,"--min-item-size":a,"--max-item-size":p},gap:t,className:g(a&&["grid-cols-[repeat(auto-fit,minmax(var(--min-item-size,0),var(--max-item-size,0)))]"],i)});e.displayName="Grid";export{e as Grid};
+import r from"clsx";import*as g from"react";import{styled as o}from"../../styled.js";const l=o("div",{base:["grid"],variants:{gap:{0:["gap-0.5"],1:["gap-1"],2:["gap-2"],3:["gap-3"],4:["gap-4"],24:["gap-6"],5:["gap-8"],6:["gap-10"],7:["gap-12"],8:["gap-16"],9:["gap-20"]}}}),m=({className:i,style:t,gap:p="2",minItemSize:a,maxItemSize:e="1fr",...s})=>g.createElement(l,{...s,style:{...t,...a&&{"--min-item-size":a},...e&&{"--max-item-size":e}},gap:p,className:r(a&&["grid-cols-[repeat(auto-fit,minmax(var(--min-item-size,0),var(--max-item-size,0)))]"],i)});m.displayName="Grid";export{m as Grid};
 //# sourceMappingURL=Grid.js.map

package/dist/components/grid/Grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.js","sources":["../../../src/components/grid/Grid.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst GridContainer = styled('div', {\n  base: ['grid'],\n  variants: {\n    gap: {\n      0: ['gap-0.5'],\n      1: ['gap-1'],\n      2: ['gap-2'],\n      3: ['gap-3'],\n      4: ['gap-4'],\n      24: ['gap-6'],\n      5: ['gap-8'],\n      6: ['gap-10'],\n      7: ['gap-12'],\n      8: ['gap-16'],\n      9: ['gap-20']\n    }\n  }\n})\n\ntype GridProps = React.ComponentProps<typeof GridContainer> & {\n  minItemSize?: string\n  maxItemSize?: string\n} & {\n  as?: any\n} // (!) `css` and `as` are both props that come from `stitches`. It would be better to figure out and export the appropriate type for them in stitches!\n\nexport const Grid = ({\n  className,\n  style,\n  gap = '2',\n  minItemSize,\n  maxItemSize = '1fr',\n  ...remainingProps\n}: GridProps) => (\n  <GridContainer\n    {...remainingProps}\n    style={{\n      ...style,\n      '--min-item-size': minItemSize,\n      '--max-item-size': maxItemSize\n    }}\n    gap={gap}\n    className={clsx(\n      minItemSize && [\n        'grid-cols-[repeat(auto-fit,minmax(var(--min-item-size,0),var(--max-item-size,0)))]'\n      ],\n      className\n    )}\n  />\n)\n\nGrid.displayName = 'Grid'\n"],"names":["GridContainer","styled","Grid","className","style","gap","minItemSize","maxItemSize","remainingProps","React","clsx"],"mappings":"qFAKA,MAAMA,EAAgBC,EAAO,MAAO,CAClC,KAAM,CAAC,MAAM,EACb,SAAU,CACR,IAAK,CACH,EAAG,CAAC,SAAS,EACb,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,GAAI,CAAC,OAAO,EACZ,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,CACd,CACF,CACF,CAAC,EASYC,EAAO,CAAC,CACnB,UAAAC,EACA,MAAAC,EACA,IAAAC,EAAM,IACN,YAAAC,EACA,YAAAC,EAAc,MACd,GAAGC,CACL,IACEC,EAAA,cAACT,EAAA,CACE,GAAGQ,EACJ,MAAO,CACL,GAAGJ,EACH,kBAAmBE,EACnB,kBAAmBC,CACrB,EACA,IAAKF,EACL,UAAWK,EACTJ,GAAe,CACb,oFACF,EACAH,CACF,CAAA,CACF,EAGFD,EAAK,YAAc"}
+{"version":3,"file":"Grid.js","sources":["../../../src/components/grid/Grid.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst GridContainer = styled('div', {\n  base: ['grid'],\n  variants: {\n    gap: {\n      0: ['gap-0.5'],\n      1: ['gap-1'],\n      2: ['gap-2'],\n      3: ['gap-3'],\n      4: ['gap-4'],\n      24: ['gap-6'],\n      5: ['gap-8'],\n      6: ['gap-10'],\n      7: ['gap-12'],\n      8: ['gap-16'],\n      9: ['gap-20']\n    }\n  }\n})\n\ntype GridProps = React.ComponentProps<typeof GridContainer> & {\n  minItemSize?: string\n  maxItemSize?: string\n} & {\n  as?: any\n} // (!) `css` and `as` are both props that come from `stitches`. It would be better to figure out and export the appropriate type for them in stitches!\n\nexport const Grid = ({\n  className,\n  style,\n  gap = '2',\n  minItemSize,\n  maxItemSize = '1fr',\n  ...remainingProps\n}: GridProps) => (\n  <GridContainer\n    {...remainingProps}\n    style={{\n      ...style,\n      ...(minItemSize && { '--min-item-size': minItemSize }),\n      ...(maxItemSize && { '--max-item-size': maxItemSize })\n    }}\n    gap={gap}\n    className={clsx(\n      minItemSize && [\n        'grid-cols-[repeat(auto-fit,minmax(var(--min-item-size,0),var(--max-item-size,0)))]'\n      ],\n      className\n    )}\n  />\n)\n\nGrid.displayName = 'Grid'\n"],"names":["GridContainer","styled","Grid","className","style","gap","minItemSize","maxItemSize","remainingProps","React","clsx"],"mappings":"qFAKA,MAAMA,EAAgBC,EAAO,MAAO,CAClC,KAAM,CAAC,MAAM,EACb,SAAU,CACR,IAAK,CACH,EAAG,CAAC,SAAS,EACb,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,OAAO,EACX,GAAI,CAAC,OAAO,EACZ,EAAG,CAAC,OAAO,EACX,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,EACZ,EAAG,CAAC,QAAQ,CACd,CACF,CACF,CAAC,EASYC,EAAO,CAAC,CACnB,UAAAC,EACA,MAAAC,EACA,IAAAC,EAAM,IACN,YAAAC,EACA,YAAAC,EAAc,MACd,GAAGC,CACL,IACEC,EAAA,cAACT,EAAA,CACE,GAAGQ,EACJ,MAAO,CACL,GAAGJ,EACH,GAAIE,GAAe,CAAE,kBAAmBA,CAAY,EACpD,GAAIC,GAAe,CAAE,kBAAmBA,CAAY,CACtD,EACA,IAAKF,EACL,UAAWK,EACTJ,GAAe,CACb,oFACF,EACAH,CACF,CAAA,CACF,EAGFD,EAAK,YAAc"}

package/dist/components/grid/index.d.ts

@@ -0,0 +1 @@
+export { Grid } from './Grid';

package/dist/components/heading/Heading.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { Override } from '../../utilities';
+export declare const StyledHeading: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
+    ref?: ((instance: HTMLHeadingElement | null) => void) | React.RefObject<HTMLHeadingElement> | null | undefined;
+}, "size" | "weight" | "noCapsize"> & {
+    size?: ("sm" | "md" | "lg" | "xs" | "xl" | "xxl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl" | "xxl">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "medium" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "medium">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+export type HeadingProps = Override<React.ComponentProps<typeof StyledHeading>, {
+    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | React.ComponentType | React.ElementType;
+}>;
+export declare const Heading: React.ForwardRefExoticComponent<Omit<HeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;

package/dist/components/heading/Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.js","sources":["../../../src/components/heading/Heading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities'\n\nexport const StyledHeading = styled('h2', {\n  base: ['m-0'],\n  variants: {\n    size: {\n      xs: ['font-body', 'text-md', 'leading-normal', 'capsize-[0.3864]'],\n      sm: ['font-body', 'text-lg', 'leading-[1.14]', 'capsize-[0.2078]'],\n      md: [\n        'font-display',\n        'text-xl',\n        'leading-[1.14]',\n        'tracking-[0.01em]',\n        'capsize-before-[0.2114]',\n        'capsize-after-[0.2634]'\n      ],\n      lg: [\n        'font-display',\n        'text-2xl',\n        'leading-[1.08]',\n        'tracking-[0.01em]',\n        'capsize-before-[0.1405]',\n        'capsize-after-[0.2405]'\n      ],\n      xl: [\n        'font-display',\n        'text-3xl',\n        'leading-[1.12]',\n        'capsize-before-[0.16]',\n        'capsize-after-[0.26]'\n      ],\n      xxl: [\n        'font-display',\n        'text-4xl',\n        'leading-[1]',\n        'capsize-before-[0.1]',\n        'capsize-after-[0.2]'\n      ]\n    },\n    noCapsize: {\n      true: ['before:hidden!', 'after:hidden!']\n    },\n    weight: {\n      medium: ['font-medium'],\n      bold: ['font-bold']\n    }\n  }\n})\n\nexport type HeadingProps = Override<\n  React.ComponentProps<typeof StyledHeading>,\n  {\n    as?:\n      | 'h1'\n      | 'h2'\n      | 'h3'\n      | 'h4'\n      | 'h5'\n      | 'h6'\n      | React.ComponentType\n      | React.ElementType\n  }\n>\n\nexport const Heading: React.ForwardRefExoticComponent<HeadingProps> =\n  React.forwardRef(\n    ({ size = 'md', weight = 'bold', ...remainingProps }, ref) => (\n      <StyledHeading\n        ref={ref}\n        size={size}\n        weight={weight}\n        {...remainingProps}\n      />\n    )\n  )\n\nHeading.displayName = 'Heading'\n"],"names":["StyledHeading","styled","Heading","React","size","weight","remainingProps","ref"],"mappings":"iEAKO,MAAMA,EAAgBC,EAAO,KAAM,CACxC,KAAM,CAAC,KAAK,EACZ,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,YAAa,UAAW,iBAAkB,kBAAkB,EACjE,GAAI,CAAC,YAAa,UAAW,iBAAkB,kBAAkB,EACjE,GAAI,CACF,eACA,UACA,iBACA,oBACA,0BACA,wBACF,EACA,GAAI,CACF,eACA,WACA,iBACA,oBACA,0BACA,wBACF,EACA,GAAI,CACF,eACA,WACA,iBACA,wBACA,sBACF,EACA,IAAK,CACH,eACA,WACA,cACA,uBACA,qBACF,CACF,EACA,UAAW,CACT,KAAM,CAAC,iBAAkB,eAAe,CAC1C,EACA,OAAQ,CACN,OAAQ,CAAC,aAAa,EACtB,KAAM,CAAC,WAAW,CACpB,CACF,CACF,CAAC,EAiBYC,EACXC,EAAM,WACJ,CAAC,CAAE,KAAAC,EAAO,KAAM,OAAAC,EAAS,OAAQ,GAAGC,CAAe,EAAGC,IACpDJ,EAAA,cAACH,EACC,CAAA,IAAKO,EACL,KAAMH,EACN,OAAQC,EACP,GAAGC,CACN,CAAA,CAEJ,EAEFJ,EAAQ,YAAc"}
+{"version":3,"file":"Heading.js","sources":["../../../src/components/heading/Heading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities'\n\nexport const StyledHeading = styled('h2', {\n  base: ['m-0'],\n  variants: {\n    size: {\n      xs: ['font-body', 'text-md', 'leading-normal', 'capsize-[0.3864]'],\n      sm: ['font-body', 'text-lg', 'leading-[1.14]', 'capsize-[0.2078]'],\n      md: [\n        'font-display',\n        'text-xl',\n        'leading-[1.14]',\n        'tracking-[0.01em]',\n        'capsize-before-[0.2114]',\n        'capsize-after-[0.2634]'\n      ],\n      lg: [\n        'font-display',\n        'text-2xl',\n        'leading-[1.08]',\n        'tracking-[0.01em]',\n        'capsize-before-[0.1405]',\n        'capsize-after-[0.2405]'\n      ],\n      xl: [\n        'font-display',\n        'text-3xl',\n        'leading-[1.12]',\n        'capsize-before-[0.16]',\n        'capsize-after-[0.26]'\n      ],\n      xxl: [\n        'font-display',\n        'text-4xl',\n        'leading-[1]',\n        'capsize-before-[0.1]',\n        'capsize-after-[0.2]'\n      ]\n    },\n    noCapsize: {\n      true: ['before:hidden!', 'after:hidden!']\n    },\n    weight: {\n      medium: ['font-medium'],\n      bold: ['font-bold']\n    }\n  }\n})\n\nexport type HeadingProps = Override<\n  React.ComponentProps<typeof StyledHeading>,\n  {\n    as?:\n      | 'h1'\n      | 'h2'\n      | 'h3'\n      | 'h4'\n      | 'h5'\n      | 'h6'\n      | React.ComponentType\n      | React.ElementType\n  }\n>\n\nexport const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(\n  ({ size = 'md', weight = 'bold', ...remainingProps }, ref) => (\n    <StyledHeading ref={ref} size={size} weight={weight} {...remainingProps} />\n  )\n)\n\nHeading.displayName = 'Heading'\n"],"names":["StyledHeading","styled","Heading","React","size","weight","remainingProps","ref"],"mappings":"iEAKO,MAAMA,EAAgBC,EAAO,KAAM,CACxC,KAAM,CAAC,KAAK,EACZ,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,YAAa,UAAW,iBAAkB,kBAAkB,EACjE,GAAI,CAAC,YAAa,UAAW,iBAAkB,kBAAkB,EACjE,GAAI,CACF,eACA,UACA,iBACA,oBACA,0BACA,wBACF,EACA,GAAI,CACF,eACA,WACA,iBACA,oBACA,0BACA,wBACF,EACA,GAAI,CACF,eACA,WACA,iBACA,wBACA,sBACF,EACA,IAAK,CACH,eACA,WACA,cACA,uBACA,qBACF,CACF,EACA,UAAW,CACT,KAAM,CAAC,iBAAkB,eAAe,CAC1C,EACA,OAAQ,CACN,OAAQ,CAAC,aAAa,EACtB,KAAM,CAAC,WAAW,CACpB,CACF,CACF,CAAC,EAiBYC,EAAUC,EAAM,WAC3B,CAAC,CAAE,KAAAC,EAAO,KAAM,OAAAC,EAAS,OAAQ,GAAGC,CAAe,EAAGC,IACpDJ,EAAA,cAACH,EAAc,CAAA,IAAKO,EAAK,KAAMH,EAAM,OAAQC,EAAS,GAAGC,CAAgB,CAAA,CAE7E,EAEAJ,EAAQ,YAAc"}

package/dist/components/heading/index.d.ts

@@ -0,0 +1 @@
+export { Heading } from './Heading';

package/dist/components/icon/Icon.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { Override } from '../../utilities/types';
+export declare const StyledIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | React.RefObject<SVGSVGElement> | null | undefined;
+}, "size"> & {
+    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<SVGSVGElement>>;
+type IconProps = Override<React.ComponentProps<typeof StyledIcon>, {
+    is: React.FC<React.SVGProps<SVGSVGElement>>;
+    as?: never;
+}>;
+export declare const Icon: React.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
+export {};

package/dist/components/icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { Override } from '~/utilities/types'\n\nexport const StyledIcon = styled('svg', {\n  base: [\n    'inline-block',\n    'fill-none',\n    'shrink-0',\n    'stroke-current',\n    '[stroke-linecap:round]',\n    '[stroke-linejoin:round]',\n    'align-middle'\n  ],\n  variants: {\n    size: {\n      sm: ['size-4', 'stroke-[1.5]'],\n      md: ['size-6', 'stroke-[1.75]'],\n      lg: ['size-8', 'stroke-2']\n    }\n  }\n})\n\ntype IconProps = Override<\n  React.ComponentProps<typeof StyledIcon>,\n  {\n    is: React.FC<React.SVGProps<SVGSVGElement>>\n    as?: never\n  }\n>\n\nexport const Icon: React.ForwardRefExoticComponent<IconProps> =\n  React.forwardRef(({ is: SVG, size = 'md', ...remainingProps }, ref) => (\n    <StyledIcon\n      size={size}\n      aria-hidden=\"true\"\n      {...remainingProps}\n      as={SVG}\n      ref={ref}\n    />\n  ))\n"],"names":["StyledIcon","styled","Icon","React","SVG","size","remainingProps","ref"],"mappings":"iEAKO,MAAMA,EAAaC,EAAO,MAAO,CACtC,KAAM,CACJ,eACA,YACA,WACA,iBACA,yBACA,0BACA,cACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,SAAU,cAAc,EAC7B,GAAI,CAAC,SAAU,eAAe,EAC9B,GAAI,CAAC,SAAU,UAAU,CAC3B,CACF,CACF,CAAC,EAUYC,EACXC,EAAM,WAAW,CAAC,CAAE,GAAIC,EAAK,KAAAC,EAAO,KAAM,GAAGC,CAAe,EAAGC,IAC7DJ,EAAA,cAACH,GACC,KAAMK,EACN,cAAY,OACX,GAAGC,EACJ,GAAIF,EACJ,IAAKG,EACP,CACD"}
+{"version":3,"file":"Icon.js","sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { Override } from '~/utilities/types'\n\nexport const StyledIcon = styled('svg', {\n  base: [\n    'inline-block',\n    'fill-none',\n    'shrink-0',\n    'stroke-current',\n    '[stroke-linecap:round]',\n    '[stroke-linejoin:round]',\n    'align-middle'\n  ],\n  variants: {\n    size: {\n      sm: ['size-4', 'stroke-[1.5]'],\n      md: ['size-6', 'stroke-[1.75]'],\n      lg: ['size-8', 'stroke-2']\n    }\n  }\n})\n\ntype IconProps = Override<\n  React.ComponentProps<typeof StyledIcon>,\n  {\n    is: React.FC<React.SVGProps<SVGSVGElement>>\n    as?: never\n  }\n>\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ is: SVG, size = 'md', ...remainingProps }, ref) => (\n    <StyledIcon\n      size={size}\n      aria-hidden=\"true\"\n      {...remainingProps}\n      as={SVG}\n      ref={ref}\n    />\n  )\n)\n"],"names":["StyledIcon","styled","Icon","React","SVG","size","remainingProps","ref"],"mappings":"iEAKO,MAAMA,EAAaC,EAAO,MAAO,CACtC,KAAM,CACJ,eACA,YACA,WACA,iBACA,yBACA,0BACA,cACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,SAAU,cAAc,EAC7B,GAAI,CAAC,SAAU,eAAe,EAC9B,GAAI,CAAC,SAAU,UAAU,CAC3B,CACF,CACF,CAAC,EAUYC,EAAOC,EAAM,WACxB,CAAC,CAAE,GAAIC,EAAK,KAAAC,EAAO,KAAM,GAAGC,CAAe,EAAGC,IAC5CJ,EAAA,cAACH,GACC,KAAMK,EACN,cAAY,OACX,GAAGC,EACJ,GAAIF,EACJ,IAAKG,EACP,CAEJ"}

package/dist/components/icon/index.d.ts

@@ -0,0 +1 @@
+export { Icon, StyledIcon } from './Icon';

package/dist/components/image/Image.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { Override } from '../../utilities/types';
+export declare const StyledImage: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void) | React.RefObject<HTMLImageElement> | null | undefined;
+}, "fluid"> & {
+    fluid?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+} & {
+    as?: React.ElementType;
+}, "ref"> & React.RefAttributes<HTMLImageElement>>;
+type ImageProps = Override<React.ComponentPropsWithoutRef<typeof StyledImage>, {
+    as?: never;
+}>;
+export declare const Image: {
+    (props: ImageProps): React.JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/components/image/index.d.ts

@@ -0,0 +1 @@
+export { Image } from './Image';

package/dist/components/index.d.ts

@@ -0,0 +1,87 @@
+export type { ValidationOptions } from './form';
+export { Accordion } from './accordion';
+export { ActionIcon } from './action-icon';
+export { AlertDialog, useAlert, AlertProvider } from './alert-dialog';
+export { Avatar } from './avatar';
+export { Badge } from './badge';
+export { BannerRegular, BannerSlim } from './banner';
+export { Box } from './box';
+export { Button, StyledButton } from './button';
+export { Carousel, useCarousel } from './carousel';
+export { Checkbox } from './checkbox';
+export { CheckboxGroup } from './checkbox-group';
+export { CheckboxTree } from './checkbox-tree';
+export { CheckboxField } from './checkbox-field';
+export { Chip, ChipGroup } from './chip';
+export { ChipDismissibleGroup } from './chip-dismissible-group';
+export { ChipToggleGroup } from './chip-toggle-group';
+export { Combobox } from './combobox';
+export { CreatePasswordField } from './create-password-field';
+export { DataTable, useDataTable } from './data-table';
+export { DateField } from './date-field';
+export { DateInput } from './date-input';
+export { Dialog } from './dialog';
+export { Dismissible } from './dismissible';
+export { DismissibleGroup } from './dismissible-group';
+export { Divider } from './divider';
+export { Drawer } from './drawer';
+export { DropdownMenu } from './dropdown-menu';
+export { EmptyState } from './empty-state';
+export { FieldWrapper, InlineFieldWrapper } from './field-wrapper';
+export { FileInput } from './file-input';
+export { Flex } from './flex';
+export { Form } from './form';
+export { Grid } from './grid';
+export { Heading } from './heading';
+export { Icon } from './icon';
+export { Image } from './image';
+export { InlineMessage } from './inline-message';
+export { Input, InputBackground, InputText } from './input';
+export { InputField } from './input-field';
+export { Label } from './label';
+export { Link, StyledLink } from './link';
+export { List } from './list';
+export { Loader } from './loader';
+export { MarkdownContent } from './markdown-content';
+export { NavigationMenu } from './navigation';
+export { NavigationMenuVertical } from './navigation-menu-vertical';
+export { NotificationBadge } from './notification-badge';
+export { NumberInput } from './number-input';
+export { NumberInputField } from './number-input-field';
+export { Pagination } from './pagination';
+export { PasswordField } from './password-field';
+export { PasswordInput } from './password-input';
+export { Popover } from './popover';
+export { ProgressBar } from './progress-bar';
+export { RadioButton, RadioButtonGroup } from './radio-button';
+export { RadioButtonField } from './radio-button-field';
+export { RadioCard, RadioCardGroup } from './radio-card';
+export { SearchField } from './search-field';
+export { SearchInput } from './search-input';
+export { SectionMessage } from './section-message';
+export { Select } from './select';
+export { SelectField } from './select-field';
+export { SideBar, useSidebarState } from './side-bar';
+export { Slider } from './slider';
+export { SliderField } from './slider-field';
+export { Sortable } from './sortable';
+export { Spacer } from './spacer';
+export { Stepper } from './stepper';
+export { Switch } from './switch';
+export { Table } from './table';
+export { Tabs } from './tabs';
+export { Text } from './text';
+export { Textarea } from './textarea';
+export { TextareaField } from './textarea-field';
+export { Tile, TileGroup } from './tile';
+export { TileInteractive } from './tile-interactive';
+export { TileToggleGroup } from './tile-toggle-group';
+export { ToastProvider, Toast, toast } from './toast';
+export { ToggleGroup } from './toggle-group';
+export { Tooltip } from './tooltip';
+export { TopBar } from './top-bar';
+export { Tree } from './tree';
+export { Video } from './video';
+export { KeyboardShortcut } from './keyboard-shortcut';
+export { SegmentedControl } from './segmented-control';
+export { FileDrop, useFileDrop } from './file-drop';