@kroo-web/design-system 1.1.104 → 1.1.107
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/cjs/examples/form/index.d.ts +16 -16
- package/dist/cjs/index.js +16 -16
- package/dist/cjs/src/__tests__/setup.d.ts +5 -0
- package/dist/cjs/src/components/Accordion/config.d.ts +1 -1
- package/dist/cjs/src/components/Accordion/index.d.ts +12 -12
- package/dist/cjs/src/components/Button/index.d.ts +6 -6
- package/dist/cjs/src/components/Callout/index.d.ts +2 -2
- package/dist/cjs/src/components/Card/index.d.ts +7 -7
- package/dist/cjs/src/components/Cards/index.d.ts +2 -2
- package/dist/cjs/src/components/Checkbox/index.d.ts +4 -4
- package/dist/cjs/src/components/Columns/index.d.ts +2 -2
- package/dist/cjs/src/components/ComboBox/index.d.ts +5 -5
- package/dist/cjs/src/components/DatePicker/index.d.ts +5 -5
- package/dist/cjs/src/components/Disclosure/index.d.ts +2 -2
- package/dist/cjs/src/components/Form/index.d.ts +4 -4
- package/dist/cjs/src/components/Icon/index.d.ts +2 -2
- package/dist/cjs/src/components/Link/index.d.ts +3 -3
- package/dist/cjs/src/components/Loading/index.d.ts +3 -3
- package/dist/cjs/src/components/Modal/index.d.ts +8 -8
- package/dist/cjs/src/components/NumberField/index.d.ts +5 -5
- package/dist/cjs/src/components/PhoneField/index.d.ts +3 -3
- package/dist/cjs/src/components/PinInput/index.d.ts +5 -4
- package/dist/cjs/src/components/Popover/index.d.ts +2 -2
- package/dist/cjs/src/components/ProgressIndicator/index.d.ts +3 -3
- package/dist/cjs/src/components/RadioGroup/index.d.ts +7 -7
- package/dist/cjs/src/components/Range/index.d.ts +6 -6
- package/dist/cjs/src/components/Select/index.d.ts +8 -8
- package/dist/cjs/src/components/Skeleton/index.d.ts +2 -2
- package/dist/cjs/src/components/Table/index.d.ts +4 -4
- package/dist/cjs/src/components/Tabs/index.d.ts +3 -3
- package/dist/cjs/src/components/Tag/index.d.ts +4 -4
- package/dist/cjs/src/components/TextField/index.d.ts +9 -9
- package/dist/cjs/src/components/Toast/index.d.ts +3 -3
- package/dist/cjs/src/components/Tooltip/index.d.ts +7 -7
- package/dist/cjs/src/components/Typography/index.d.ts +5 -5
- package/dist/cjs/src/components/Wrapper/index.d.ts +7 -7
- package/dist/cjs/src/components/shared/FormField/index.d.ts +4 -4
- package/dist/cjs/src/hooks/useWindowSize.d.ts +1 -1
- package/dist/cjs/src/types/PolymorphicWithoutRef.d.ts +2 -2
- package/dist/cjs/src/utils/decorators/Grid/index.d.ts +1 -1
- package/dist/esm/examples/form/index.d.ts +16 -16
- package/dist/esm/index.js +16 -16
- package/dist/esm/src/__tests__/setup.d.ts +5 -0
- package/dist/esm/src/components/Accordion/config.d.ts +1 -1
- package/dist/esm/src/components/Accordion/index.d.ts +12 -12
- package/dist/esm/src/components/Button/index.d.ts +6 -6
- package/dist/esm/src/components/Callout/index.d.ts +2 -2
- package/dist/esm/src/components/Card/index.d.ts +7 -7
- package/dist/esm/src/components/Cards/index.d.ts +2 -2
- package/dist/esm/src/components/Checkbox/index.d.ts +4 -4
- package/dist/esm/src/components/Columns/index.d.ts +2 -2
- package/dist/esm/src/components/ComboBox/index.d.ts +5 -5
- package/dist/esm/src/components/DatePicker/index.d.ts +5 -5
- package/dist/esm/src/components/Disclosure/index.d.ts +2 -2
- package/dist/esm/src/components/Form/index.d.ts +4 -4
- package/dist/esm/src/components/Icon/index.d.ts +2 -2
- package/dist/esm/src/components/Link/index.d.ts +3 -3
- package/dist/esm/src/components/Loading/index.d.ts +3 -3
- package/dist/esm/src/components/Modal/index.d.ts +8 -8
- package/dist/esm/src/components/NumberField/index.d.ts +5 -5
- package/dist/esm/src/components/PhoneField/index.d.ts +3 -3
- package/dist/esm/src/components/PinInput/index.d.ts +5 -4
- package/dist/esm/src/components/Popover/index.d.ts +2 -2
- package/dist/esm/src/components/ProgressIndicator/index.d.ts +3 -3
- package/dist/esm/src/components/RadioGroup/index.d.ts +7 -7
- package/dist/esm/src/components/Range/index.d.ts +6 -6
- package/dist/esm/src/components/Select/index.d.ts +8 -8
- package/dist/esm/src/components/Skeleton/index.d.ts +2 -2
- package/dist/esm/src/components/Table/index.d.ts +4 -4
- package/dist/esm/src/components/Tabs/index.d.ts +3 -3
- package/dist/esm/src/components/Tag/index.d.ts +4 -4
- package/dist/esm/src/components/TextField/index.d.ts +9 -9
- package/dist/esm/src/components/Toast/index.d.ts +3 -3
- package/dist/esm/src/components/Tooltip/index.d.ts +7 -7
- package/dist/esm/src/components/Typography/index.d.ts +5 -5
- package/dist/esm/src/components/Wrapper/index.d.ts +7 -7
- package/dist/esm/src/components/shared/FormField/index.d.ts +4 -4
- package/dist/esm/src/hooks/useWindowSize.d.ts +1 -1
- package/dist/esm/src/types/PolymorphicWithoutRef.d.ts +2 -2
- package/dist/esm/src/utils/decorators/Grid/index.d.ts +1 -1
- package/dist/types.d.ts +148 -147
- package/package.json +19 -11
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { render, RenderOptions } from '@testing-library/react';
|
|
2
|
+
import { ReactElement } from 'react';
|
|
3
|
+
declare const customRender: (ui: ReactElement, options?: Omit<RenderOptions, "wrapper">) => ReturnType<typeof render>;
|
|
4
|
+
export * from '@testing-library/react';
|
|
5
|
+
export { customRender as render };
|
|
@@ -5,7 +5,7 @@ export declare const AccordionContext: React.Context<{
|
|
|
5
5
|
}>;
|
|
6
6
|
export declare const AccordionContextProvider: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
7
7
|
export declare const AccordionItemContext: React.Context<{
|
|
8
|
-
value: string;
|
|
9
8
|
setValue: (value: string) => void;
|
|
9
|
+
value: string;
|
|
10
10
|
}>;
|
|
11
11
|
export declare const AccordionItemContextProvider: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export type TAccordionRootProps = {
|
|
5
4
|
children: React.ReactNode;
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
grouping?: 'attached' | 'detached';
|
|
6
|
+
} & React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Root>;
|
|
7
|
+
export type TAccordionTriggerProps<C extends React.ElementType = 'p'> = {
|
|
8
8
|
as?: C;
|
|
9
|
-
size?: 'regular' | 'large';
|
|
10
9
|
controls?: React.ReactNode;
|
|
11
|
-
|
|
10
|
+
size?: 'large' | 'regular';
|
|
11
|
+
} & React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>;
|
|
12
12
|
export declare const Accordion: {
|
|
13
|
-
|
|
13
|
+
Content: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
14
14
|
Item: (props: React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>) => React.JSX.Element;
|
|
15
|
-
|
|
15
|
+
Root: (props: TAccordionRootProps) => React.JSX.Element;
|
|
16
|
+
Trigger: React.ForwardRefExoticComponent<{
|
|
16
17
|
as?: "p" | undefined;
|
|
17
|
-
size?: "regular" | "large";
|
|
18
18
|
controls?: React.ReactNode;
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
size?: "large" | "regular";
|
|
20
|
+
} & Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
21
21
|
};
|
|
@@ -2,23 +2,23 @@ import React, { PropsWithChildren } from 'react';
|
|
|
2
2
|
import { PolymorphicPropsWithoutRef } from '../../types/PolymorphicWithoutRef';
|
|
3
3
|
declare const defaultElement = "button";
|
|
4
4
|
type TButtonVisualTypes = {
|
|
5
|
+
variant?: 'danger' | 'ghost' | 'primary' | 'secondary' | 'tertiary';
|
|
5
6
|
visualType?: 'button';
|
|
6
|
-
variant?: 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'danger';
|
|
7
7
|
} | {
|
|
8
|
+
variant?: 'danger' | 'ghost' | 'standard';
|
|
8
9
|
visualType?: 'action';
|
|
9
|
-
variant?: 'standard' | 'ghost' | 'danger';
|
|
10
10
|
} | {
|
|
11
|
+
variant?: 'outline' | 'primary' | 'secondary';
|
|
11
12
|
visualType?: 'nav';
|
|
12
|
-
variant?: 'primary' | 'outline' | 'secondary';
|
|
13
13
|
} | {
|
|
14
|
-
visualType?: 'text';
|
|
15
14
|
variant?: 'primary' | 'secondary';
|
|
15
|
+
visualType?: 'text';
|
|
16
16
|
};
|
|
17
17
|
type TButtonOwnProps = {
|
|
18
18
|
as?: 'button' | 'span';
|
|
19
19
|
className?: string;
|
|
20
20
|
onlyIcon?: boolean;
|
|
21
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement> &
|
|
21
|
+
} & PropsWithChildren & React.ButtonHTMLAttributes<HTMLButtonElement> & TButtonVisualTypes;
|
|
22
22
|
export type TButtonProps<T extends React.ElementType = typeof defaultElement> = PolymorphicPropsWithoutRef<TButtonOwnProps, T>;
|
|
23
|
-
export declare function Button<T extends React.ElementType = typeof defaultElement>({ as, children,
|
|
23
|
+
export declare function Button<T extends React.ElementType = typeof defaultElement>({ as, children, className, onlyIcon, variant, visualType, ...rest }: TButtonProps<T>): React.JSX.Element;
|
|
24
24
|
export {};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React, { PropsWithChildren } from 'react';
|
|
2
2
|
import { TTypographyProps } from '../Typography';
|
|
3
3
|
export type TCalloutRootProps = {
|
|
4
|
-
type?: '
|
|
4
|
+
type?: 'error' | 'positive' | 'primary' | 'secondary' | 'warning';
|
|
5
5
|
};
|
|
6
6
|
export type TCalloutTextProps = TTypographyProps<'p'>;
|
|
7
7
|
export declare const Callout: {
|
|
8
|
-
Root: ({ type, children }: PropsWithChildren<TCalloutRootProps>) => React.JSX.Element;
|
|
9
8
|
Icon: ({ size, weight, ...rest }: import("../Icon").TIconProps) => React.JSX.Element;
|
|
9
|
+
Root: ({ children, type }: PropsWithChildren<TCalloutRootProps>) => React.JSX.Element;
|
|
10
10
|
Text: ({ children, ...props }: PropsWithChildren<TCalloutTextProps>) => React.JSX.Element;
|
|
11
11
|
};
|
|
@@ -2,20 +2,20 @@ import React, { PropsWithChildren } from 'react';
|
|
|
2
2
|
import { PolymorphicPropsWithoutRef } from '../../types/PolymorphicWithoutRef';
|
|
3
3
|
declare const defaultElement = "div";
|
|
4
4
|
export type TCardVariants = {
|
|
5
|
-
|
|
5
|
+
elementType?: 'div';
|
|
6
|
+
radius?: 'large' | 'medium' | 'none' | 'small';
|
|
6
7
|
size?: {
|
|
7
|
-
|
|
8
|
-
|
|
8
|
+
horizontal: 'extra-small' | 'large' | 'medium' | 'none' | 'small';
|
|
9
|
+
vertical: 'extra-small' | 'large' | 'medium' | 'none' | 'small';
|
|
9
10
|
};
|
|
10
|
-
|
|
11
|
-
elementType?: 'div';
|
|
11
|
+
visual?: 'primary' | 'secondary' | 'tertiary';
|
|
12
12
|
};
|
|
13
13
|
export interface ICardOwnProps extends React.HTMLAttributes<HTMLDivElement>, PropsWithChildren {
|
|
14
14
|
as?: 'div';
|
|
15
|
-
variants?: TCardVariants;
|
|
16
15
|
className?: string;
|
|
17
16
|
isSquare?: boolean;
|
|
17
|
+
variants?: TCardVariants;
|
|
18
18
|
}
|
|
19
19
|
export type ICardProps<T extends React.ElementType = typeof defaultElement> = PolymorphicPropsWithoutRef<ICardOwnProps, T>;
|
|
20
|
-
export declare function Card<T extends React.ElementType = typeof defaultElement>({ as, children,
|
|
20
|
+
export declare function Card<T extends React.ElementType = typeof defaultElement>({ as, children, className, isSquare, variants, ...rest }: ICardProps<T>): React.JSX.Element;
|
|
21
21
|
export {};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React, { PropsWithChildren } from 'react';
|
|
2
2
|
export type CardsVariants = {
|
|
3
|
-
layout?: 'bento-
|
|
3
|
+
layout?: 'bento-five' | 'bento-four' | 'bento-three';
|
|
4
4
|
};
|
|
5
5
|
export interface ICardsProps extends PropsWithChildren {
|
|
6
|
-
as: 'div' | 'ol' | '
|
|
6
|
+
as: 'div' | 'ol' | 'section' | 'ul';
|
|
7
7
|
variants: CardsVariants;
|
|
8
8
|
}
|
|
9
9
|
export declare const Cards: ({ as, children, variants }: ICardsProps) => React.JSX.Element;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export type TCheckboxProps<T extends FieldValues> = {
|
|
4
|
+
className?: string;
|
|
5
|
+
disabled?: boolean;
|
|
4
6
|
id: string;
|
|
7
|
+
label: ReactNode | string;
|
|
5
8
|
name: Path<T>;
|
|
6
|
-
|
|
7
|
-
disabled?: boolean;
|
|
8
|
-
className?: string;
|
|
9
|
-
variant?: 'radio' | 'checkbox';
|
|
9
|
+
variant?: 'checkbox' | 'radio';
|
|
10
10
|
};
|
|
11
11
|
export declare const Checkbox: <T extends FieldValues>(props: TCheckboxProps<T>) => React.JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export type TColumnsProps = {
|
|
3
|
-
cols: number;
|
|
4
3
|
children: React.ReactNode;
|
|
4
|
+
cols: number;
|
|
5
5
|
};
|
|
6
|
-
export declare const Columns: ({
|
|
6
|
+
export declare const Columns: ({ children, cols }: TColumnsProps) => React.JSX.Element;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
import { ControllerRenderProps, FieldValues } from 'react-hook-form';
|
|
3
3
|
export type TComboBoxItem = {
|
|
4
|
-
text: string;
|
|
5
4
|
img?: string;
|
|
6
5
|
render?: ReactNode;
|
|
6
|
+
text: string;
|
|
7
7
|
};
|
|
8
8
|
export type TComboBoxProps = {
|
|
9
|
+
alwaysOpen?: boolean;
|
|
10
|
+
field: ControllerRenderProps<FieldValues>;
|
|
9
11
|
label: string;
|
|
10
12
|
name: string;
|
|
11
|
-
options: TComboBoxItem[];
|
|
12
13
|
onSelect?: (item: TComboBoxItem) => void;
|
|
13
|
-
|
|
14
|
-
field: ControllerRenderProps<FieldValues>;
|
|
14
|
+
options: TComboBoxItem[];
|
|
15
15
|
};
|
|
16
16
|
export declare const ComboBox: (props: Omit<TComboBoxProps, "field">) => React.JSX.Element;
|
|
17
|
-
export declare const Field: ({
|
|
17
|
+
export declare const Field: ({ alwaysOpen, field: { onBlur, ...restField }, label, onSelect, options }: TComboBoxProps) => React.JSX.Element;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export type TDatePicker<T extends FieldValues> = {
|
|
4
|
-
|
|
5
|
-
name: Path<T>;
|
|
6
|
-
label: string;
|
|
4
|
+
disabled?: boolean;
|
|
7
5
|
helper?: {
|
|
8
6
|
message: string;
|
|
9
7
|
};
|
|
10
|
-
|
|
8
|
+
id: string;
|
|
9
|
+
label: string;
|
|
11
10
|
max?: string;
|
|
12
|
-
|
|
11
|
+
min?: string;
|
|
12
|
+
name: Path<T>;
|
|
13
13
|
};
|
|
14
14
|
export declare const DatePicker: <T extends FieldValues>(props: TDatePicker<T>) => React.JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export type TDisclosureProps = {
|
|
3
|
-
condition: boolean;
|
|
4
3
|
children: React.ReactNode;
|
|
4
|
+
condition: boolean;
|
|
5
5
|
};
|
|
6
|
-
export declare const Disclosure: ({
|
|
6
|
+
export declare const Disclosure: ({ children, condition }: TDisclosureProps) => React.JSX.Element;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { HTMLProps, PropsWithChildren } from 'react';
|
|
2
2
|
import { FieldValues, UseFormReturn } from 'react-hook-form';
|
|
3
|
-
type TFormProps<T extends FieldValues> =
|
|
3
|
+
type TFormProps<T extends FieldValues> = {
|
|
4
4
|
methods: UseFormReturn<T>;
|
|
5
5
|
onSubmit: (values: T) => void;
|
|
6
|
-
}
|
|
7
|
-
export declare const Form: <T extends FieldValues>({
|
|
6
|
+
} & PropsWithChildren<HTMLProps<HTMLFormElement>>;
|
|
7
|
+
export declare const Form: <T extends FieldValues>({ children, methods, onSubmit, ...rest }: TFormProps<T>) => React.JSX.Element;
|
|
8
8
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { MaterialSymbolProps } from 'react-material-symbols';
|
|
3
3
|
export type TIconProps = {
|
|
4
|
-
size?: '
|
|
5
|
-
weight?: 'light' | '
|
|
4
|
+
size?: 'large' | 'regular' | 'xlarge';
|
|
5
|
+
weight?: 'light' | 'medium' | 'normal';
|
|
6
6
|
} & Omit<MaterialSymbolProps, 'size' | 'weight'>;
|
|
7
7
|
export declare const Icon: ({ size, weight, ...rest }: TIconProps) => React.JSX.Element;
|
|
@@ -3,9 +3,9 @@ type PolymorphicLink<T extends ElementType> = {
|
|
|
3
3
|
as?: T;
|
|
4
4
|
className?: string;
|
|
5
5
|
} & PropsWithChildren;
|
|
6
|
-
type AnchorProps =
|
|
6
|
+
type AnchorProps = {
|
|
7
7
|
as?: undefined;
|
|
8
|
-
}
|
|
9
|
-
export type TLink<T extends ElementType> = PolymorphicLink<T
|
|
8
|
+
} & React.AnchorHTMLAttributes<HTMLAnchorElement>;
|
|
9
|
+
export type TLink<T extends ElementType> = AnchorProps | PolymorphicLink<T>;
|
|
10
10
|
export declare const Link: <T extends ElementType = "a">({ as, children, className, ...rest }: TLink<T>) => React.JSX.Element;
|
|
11
11
|
export {};
|
|
@@ -2,32 +2,32 @@ import React, { ButtonHTMLAttributes, PropsWithChildren } from 'react';
|
|
|
2
2
|
import { TButtonProps } from '../Button';
|
|
3
3
|
export type TUseModalProps = {
|
|
4
4
|
activeModal: string;
|
|
5
|
+
close: () => void;
|
|
5
6
|
isOpen: boolean;
|
|
6
7
|
open: (value: string) => void;
|
|
7
|
-
close: () => void;
|
|
8
8
|
};
|
|
9
9
|
export declare const useModal: import("zustand").UseBoundStore<import("zustand").StoreApi<TUseModalProps>>;
|
|
10
10
|
export type TModalContentProps = {
|
|
11
11
|
children: React.ReactNode;
|
|
12
|
-
value: string;
|
|
13
|
-
focusTrap?: boolean;
|
|
14
12
|
closeOnBackdropClick?: boolean;
|
|
13
|
+
focusTrap?: boolean;
|
|
14
|
+
value: string;
|
|
15
15
|
};
|
|
16
16
|
export type TModalControlProps = {
|
|
17
17
|
children: React.ReactNode;
|
|
18
18
|
value: string;
|
|
19
19
|
} & TButtonProps;
|
|
20
20
|
export type TModalHeaderProps = {
|
|
21
|
+
actionButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
|
|
22
|
+
onClick?: () => void;
|
|
21
23
|
title: string;
|
|
22
24
|
variant?: 'action';
|
|
23
|
-
onClick?: () => void;
|
|
24
|
-
actionButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
|
|
25
25
|
};
|
|
26
26
|
export type TModalButtonProps = PropsWithChildren;
|
|
27
27
|
export declare const Buttons: ({ children }: TModalButtonProps) => React.JSX.Element;
|
|
28
28
|
export declare const Modal: {
|
|
29
|
-
Content: ({ value, children, focusTrap, closeOnBackdropClick }: TModalContentProps) => React.JSX.Element;
|
|
30
|
-
Control: ({ value, children, ...rest }: TModalControlProps) => React.JSX.Element;
|
|
31
|
-
Header: ({ title, variant, onClick, actionButtonProps }: TModalHeaderProps) => React.JSX.Element;
|
|
32
29
|
Buttons: ({ children }: TModalButtonProps) => React.JSX.Element;
|
|
30
|
+
Content: ({ children, closeOnBackdropClick, focusTrap, value }: TModalContentProps) => React.JSX.Element;
|
|
31
|
+
Control: ({ children, value, ...rest }: TModalControlProps) => React.JSX.Element;
|
|
32
|
+
Header: ({ actionButtonProps, onClick, title, variant }: TModalHeaderProps) => React.JSX.Element;
|
|
33
33
|
};
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export type TNumberFieldProps<T extends FieldValues> = {
|
|
4
|
-
label: string;
|
|
5
|
-
name: Path<T>;
|
|
6
|
-
min?: number;
|
|
7
|
-
max?: number;
|
|
8
|
-
width?: number;
|
|
9
4
|
helper?: {
|
|
10
5
|
message: string;
|
|
11
6
|
};
|
|
7
|
+
label: string;
|
|
8
|
+
max?: number;
|
|
9
|
+
min?: number;
|
|
10
|
+
name: Path<T>;
|
|
11
|
+
width?: number;
|
|
12
12
|
};
|
|
13
13
|
export declare const NumberField: <T extends FieldValues>(props: TNumberFieldProps<T>) => React.JSX.Element;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export type TPhoneFieldProps<T extends FieldValues> = {
|
|
4
|
-
|
|
5
|
-
name: Path<T>;
|
|
4
|
+
className?: string;
|
|
6
5
|
disabled?: boolean;
|
|
7
6
|
helper?: {
|
|
8
7
|
message: ReactNode | string;
|
|
9
8
|
};
|
|
10
|
-
|
|
9
|
+
id: string;
|
|
10
|
+
name: Path<T>;
|
|
11
11
|
placeholder?: string;
|
|
12
12
|
};
|
|
13
13
|
export declare const PhoneField: <T extends FieldValues>(props: TPhoneFieldProps<T>) => React.JSX.Element;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export interface TPinInputProps<T extends FieldValues> {
|
|
4
|
-
|
|
5
|
-
length: number;
|
|
6
|
-
label: string;
|
|
4
|
+
isNumeric?: boolean;
|
|
7
5
|
isOTP?: boolean;
|
|
8
6
|
isPassword?: boolean;
|
|
9
|
-
|
|
7
|
+
label: string;
|
|
8
|
+
length: number;
|
|
9
|
+
name: Path<T>;
|
|
10
10
|
}
|
|
11
11
|
export declare const PinInput: <T extends FieldValues>(props: TPinInputProps<T>) => React.JSX.Element;
|
|
12
|
+
export declare const OTPInput: () => React.JSX.Element;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import * as RadixPopover from '@radix-ui/react-popover';
|
|
2
|
+
import React from 'react';
|
|
3
3
|
export type TPopoverRootProps = React.ComponentPropsWithoutRef<typeof RadixPopover.Root>;
|
|
4
4
|
export type TPopoverTriggerProps = React.ComponentPropsWithoutRef<typeof RadixPopover.Trigger>;
|
|
5
5
|
export type TPopoverContentProps = React.ComponentPropsWithoutRef<typeof RadixPopover.Content>;
|
|
6
6
|
export declare const Popover: {
|
|
7
|
+
Content: ({ children, ...rest }: TPopoverContentProps) => React.JSX.Element;
|
|
7
8
|
Root: (props: TPopoverRootProps) => React.JSX.Element;
|
|
8
9
|
Trigger: ({ children, ...rest }: TPopoverTriggerProps) => React.JSX.Element;
|
|
9
|
-
Content: ({ children, ...rest }: TPopoverContentProps) => React.JSX.Element;
|
|
10
10
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export type TProgressIndicatorProps = {
|
|
3
|
-
label?: string;
|
|
4
|
-
size?: 'small' | 'medium' | 'full-width';
|
|
5
3
|
current?: number;
|
|
4
|
+
label?: string;
|
|
6
5
|
max?: number;
|
|
6
|
+
size?: 'full-width' | 'medium' | 'small';
|
|
7
7
|
};
|
|
8
|
-
export declare const ProgressIndicator: ({
|
|
8
|
+
export declare const ProgressIndicator: ({ current, label, max, size }: TProgressIndicatorProps) => React.JSX.Element;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import * as RadixRadioGroup from '@radix-ui/react-radio-group';
|
|
2
|
+
import React from 'react';
|
|
3
3
|
import { FieldError, FieldValues, Path } from 'react-hook-form';
|
|
4
4
|
export type TRadioGroupProps<T extends FieldValues> = {
|
|
5
|
-
|
|
5
|
+
error?: FieldError;
|
|
6
6
|
label: string;
|
|
7
|
+
name: Path<T>;
|
|
7
8
|
variant?: 'cards' | 'circle';
|
|
8
|
-
error?: FieldError;
|
|
9
9
|
} & Omit<RadixRadioGroup.RadioGroupProps, 'name'>;
|
|
10
10
|
export declare const RadioGroup: {
|
|
11
|
-
Root: <T extends FieldValues>({ children, className, name, label, variant, disabled, ...props }: TRadioGroupProps<T>) => React.JSX.Element;
|
|
12
|
-
Item: ({ children, className, variant, ...props }: RadixRadioGroup.RadioGroupItemProps & {
|
|
13
|
-
variant?: "circle" | "cards";
|
|
14
|
-
}) => React.JSX.Element;
|
|
15
11
|
Indicator: ({ className, ...props }: RadixRadioGroup.RadioGroupIndicatorProps) => React.JSX.Element;
|
|
12
|
+
Item: ({ children, className, variant, ...props }: {
|
|
13
|
+
variant?: "cards" | "circle";
|
|
14
|
+
} & RadixRadioGroup.RadioGroupItemProps) => React.JSX.Element;
|
|
15
|
+
Root: <T extends FieldValues>({ children, className, disabled, label, name, variant, ...props }: TRadioGroupProps<T>) => React.JSX.Element;
|
|
16
16
|
};
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export type TRangeProps<T extends FieldValues> = {
|
|
4
|
+
helper?: {
|
|
5
|
+
message: string;
|
|
6
|
+
};
|
|
4
7
|
id: string;
|
|
5
8
|
label: string;
|
|
6
|
-
name: Path<T>;
|
|
7
|
-
min?: number;
|
|
8
9
|
max?: number;
|
|
9
|
-
|
|
10
|
+
min?: number;
|
|
11
|
+
name: Path<T>;
|
|
10
12
|
showValue?: boolean;
|
|
11
|
-
|
|
12
|
-
message: string;
|
|
13
|
-
};
|
|
13
|
+
step?: number;
|
|
14
14
|
};
|
|
15
15
|
export declare const Range: <T extends FieldValues>(props: TRangeProps<T>) => React.JSX.Element;
|
|
@@ -5,21 +5,21 @@ export type TItem = {
|
|
|
5
5
|
title: string;
|
|
6
6
|
};
|
|
7
7
|
export type TSelectProps<T extends FieldValues> = {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
defaultValue?: string;
|
|
10
|
+
disabled?: boolean;
|
|
11
11
|
helper?: {
|
|
12
12
|
message: string;
|
|
13
13
|
};
|
|
14
|
+
id: string;
|
|
14
15
|
items?: {
|
|
15
16
|
id: string;
|
|
16
|
-
title: string;
|
|
17
17
|
props?: OptionHTMLAttributes<HTMLOptionElement>;
|
|
18
|
+
title: string;
|
|
18
19
|
}[];
|
|
19
|
-
|
|
20
|
-
disabled?: boolean;
|
|
21
|
-
defaultValue?: string;
|
|
20
|
+
label: string;
|
|
22
21
|
missing?: boolean;
|
|
23
|
-
|
|
22
|
+
name: Path<T>;
|
|
23
|
+
placeholder?: string;
|
|
24
24
|
};
|
|
25
25
|
export declare const Select: <T extends FieldValues>(props: TSelectProps<T>) => React.JSX.Element;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export type TSkeletonProps = {
|
|
3
|
-
width?: string;
|
|
4
3
|
height?: string;
|
|
5
4
|
rounded?: boolean;
|
|
5
|
+
width?: string;
|
|
6
6
|
};
|
|
7
|
-
export declare const Skeleton: ({
|
|
7
|
+
export declare const Skeleton: ({ height, rounded, width }: TSkeletonProps) => React.JSX.Element;
|
|
@@ -7,11 +7,11 @@ export declare const TableRow: ({ children }: PropsWithChildren) => React.JSX.El
|
|
|
7
7
|
export declare const TableData: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
8
8
|
export declare const TableFooter: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
9
9
|
export declare const Table: {
|
|
10
|
-
Root: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
11
|
-
Head: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
12
|
-
Header: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
13
10
|
Body: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
14
|
-
Row: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
15
11
|
Data: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
16
12
|
Footer: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
13
|
+
Head: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
14
|
+
Header: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
15
|
+
Root: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
16
|
+
Row: ({ children }: PropsWithChildren) => React.JSX.Element;
|
|
17
17
|
};
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import * as RadixTabs from '@radix-ui/react-tabs';
|
|
2
|
+
import React from 'react';
|
|
3
3
|
export type TTabsRoot = React.ComponentProps<typeof RadixTabs.Root>;
|
|
4
4
|
export type TTabsList = React.ComponentProps<typeof RadixTabs.List>;
|
|
5
5
|
export type TTabsTrigger = React.ComponentProps<typeof RadixTabs.Trigger>;
|
|
6
6
|
export type TTabsContent = React.ComponentProps<typeof RadixTabs.Content>;
|
|
7
7
|
export declare const Tabs: {
|
|
8
|
-
|
|
8
|
+
Content: ({ children, ...rest }: TTabsContent) => React.JSX.Element;
|
|
9
9
|
List: ({ children, ...rest }: TTabsList) => React.JSX.Element;
|
|
10
|
+
Root: ({ children, ...rest }: TTabsRoot) => React.JSX.Element;
|
|
10
11
|
Trigger: ({ children, ...rest }: TTabsTrigger) => React.JSX.Element;
|
|
11
|
-
Content: ({ children, ...rest }: TTabsContent) => React.JSX.Element;
|
|
12
12
|
};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
import { TTypographyProps } from '../Typography';
|
|
3
3
|
export type TTagProps = {
|
|
4
|
-
|
|
4
|
+
children: ReactNode | ReactNode[];
|
|
5
5
|
circularIcon?: boolean;
|
|
6
6
|
className?: string;
|
|
7
7
|
icon: boolean;
|
|
8
|
-
|
|
8
|
+
variant?: 'danger' | 'night' | 'positive' | 'primary' | 'secondary' | 'tertiary' | 'warning';
|
|
9
9
|
};
|
|
10
10
|
export declare const Tag: {
|
|
11
|
-
Root: ({ variant, children, className, icon, circularIcon, ...rest }: TTagProps) => React.JSX.Element;
|
|
12
|
-
Icon: ({ size, weight, ...rest }: import("../Icon").TIconProps) => React.JSX.Element;
|
|
13
11
|
Content: ({ children, ...rest }: TTypographyProps) => React.JSX.Element;
|
|
12
|
+
Icon: ({ size, weight, ...rest }: import("../Icon").TIconProps) => React.JSX.Element;
|
|
13
|
+
Root: ({ children, circularIcon, className, icon, variant, ...rest }: TTagProps) => React.JSX.Element;
|
|
14
14
|
};
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import React, { DetailedHTMLProps, InputHTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
import { FieldValues, Path } from 'react-hook-form';
|
|
3
3
|
export type TTextFieldProps<T extends FieldValues> = {
|
|
4
|
-
|
|
5
|
-
label: string;
|
|
6
|
-
name: Path<T>;
|
|
4
|
+
className?: string;
|
|
7
5
|
disabled?: boolean;
|
|
6
|
+
disableError?: boolean;
|
|
8
7
|
helper?: {
|
|
9
8
|
message: ReactNode | string;
|
|
10
9
|
};
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
suffix?: string | ReactNode;
|
|
14
|
-
className?: string;
|
|
15
|
-
rightContent?: ReactNode | string;
|
|
10
|
+
id: string;
|
|
11
|
+
label: string;
|
|
16
12
|
leftContent?: ReactNode | string;
|
|
17
13
|
missing?: boolean;
|
|
18
|
-
|
|
14
|
+
name: Path<T>;
|
|
15
|
+
prefix?: ReactNode | string;
|
|
16
|
+
rightContent?: ReactNode | string;
|
|
17
|
+
suffix?: ReactNode | string;
|
|
18
|
+
type?: DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>['type'];
|
|
19
19
|
} & DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
|
|
20
20
|
export declare const TextField: React.ForwardRefExoticComponent<Omit<TTextFieldProps<FieldValues>, "ref"> & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -4,16 +4,16 @@ export type TToastRootProps = {
|
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
};
|
|
6
6
|
export type TToastTitleProps = {
|
|
7
|
-
className?: string;
|
|
8
7
|
children: React.ReactNode;
|
|
8
|
+
className?: string;
|
|
9
9
|
};
|
|
10
10
|
export type TToastDescriptionProps = {
|
|
11
11
|
children: React.ReactNode;
|
|
12
12
|
};
|
|
13
13
|
export type TToastIconProps = TIconProps;
|
|
14
14
|
export declare const Toast: {
|
|
15
|
-
Root: ({ children }: TToastRootProps) => React.JSX.Element;
|
|
16
|
-
Title: ({ className, children }: TToastTitleProps) => React.JSX.Element;
|
|
17
15
|
Description: ({ children }: TToastDescriptionProps) => React.JSX.Element;
|
|
18
16
|
Icon: (props: TToastIconProps) => React.JSX.Element;
|
|
17
|
+
Root: ({ children }: TToastRootProps) => React.JSX.Element;
|
|
18
|
+
Title: ({ children, className }: TToastTitleProps) => React.JSX.Element;
|
|
19
19
|
};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import * as RadixTooltip from '@radix-ui/react-tooltip';
|
|
2
|
+
import React from 'react';
|
|
3
3
|
export type TTooltipRootProps = React.ComponentProps<typeof RadixTooltip.Root>;
|
|
4
|
-
export type TTooltipTriggerProps =
|
|
4
|
+
export type TTooltipTriggerProps = {
|
|
5
5
|
className?: string;
|
|
6
|
-
}
|
|
7
|
-
export type TTooltipContentProps =
|
|
6
|
+
} & React.ComponentProps<typeof RadixTooltip.Trigger>;
|
|
7
|
+
export type TTooltipContentProps = {
|
|
8
8
|
className?: string;
|
|
9
|
-
}
|
|
9
|
+
} & React.ComponentProps<typeof RadixTooltip.Content>;
|
|
10
10
|
export declare const Tooltip: {
|
|
11
|
+
Content: ({ children, className, ...rest }: TTooltipContentProps) => React.JSX.Element;
|
|
11
12
|
Root: ({ children, ...rest }: TTooltipRootProps) => React.JSX.Element;
|
|
12
|
-
Trigger: ({
|
|
13
|
-
Content: ({ className, children, ...rest }: TTooltipContentProps) => React.JSX.Element;
|
|
13
|
+
Trigger: ({ children, className, ...rest }: TTooltipTriggerProps) => React.JSX.Element;
|
|
14
14
|
};
|