@datacrest/dcuikit 0.0.7 → 0.0.9
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/build/components/Atom/Button/Button.d.ts +2 -1
- package/build/components/Atom/Button/Button.types.d.ts +13 -7
- package/build/components/Atom/Button/index.d.ts +2 -1
- package/build/components/Atom/Checkbox/Checkbox.d.ts +2 -1
- package/build/components/Atom/Checkbox/index.d.ts +2 -1
- package/build/components/Atom/Icon/Icon.d.ts +2 -1
- package/build/components/Atom/Icon/index.d.ts +2 -1
- package/build/components/Atom/Input/Input.d.ts +3 -20
- package/build/components/Atom/Input/Input.stories.d.ts +1 -1
- package/build/components/Atom/Input/Input.types.d.ts +18 -0
- package/build/components/Atom/Input/index.d.ts +2 -2
- package/build/components/Atom/Radiogroup/RadioGroup.d.ts +11 -0
- package/build/components/Atom/Radiogroup/RadioGroup.stories.d.ts +5 -0
- package/build/components/Atom/Radiogroup/RadioGroup.test.d.ts +1 -0
- package/build/components/Atom/Radiogroup/index.d.ts +2 -0
- package/build/components/Atom/Radiogroup/types.d.ts +21 -0
- package/build/components/Atom/Radiogroup/variants.d.ts +56 -0
- package/build/components/Atom/Switch/Switch.d.ts +4 -0
- package/build/components/Atom/Switch/Switch.stories.d.ts +5 -0
- package/build/components/Atom/Switch/Switch.test.d.ts +1 -0
- package/build/components/Atom/Switch/const.d.ts +41 -0
- package/build/components/Atom/Switch/index.d.ts +5 -0
- package/build/components/Atom/Switch/types.d.ts +19 -0
- package/build/components/Atom/Typography/Typography.d.ts +5 -2
- package/build/components/Atom/Typography/index.d.ts +4 -1
- package/build/components/Molecule/AlertDialog/AlertDialog.d.ts +4 -0
- package/build/components/Molecule/AlertDialog/AlertDialog.stories.d.ts +54 -0
- package/build/components/Molecule/AlertDialog/AlertDialog.test.d.ts +1 -0
- package/build/components/Molecule/AlertDialog/const.d.ts +5 -0
- package/build/components/Molecule/AlertDialog/index.d.ts +2 -0
- package/build/components/Molecule/AlertDialog/types.d.ts +11 -0
- package/build/components/Molecule/BreadCrumb/BreadCrumb.d.ts +4 -0
- package/build/components/Molecule/BreadCrumb/BreadCrumb.stories.d.ts +5 -0
- package/build/components/Molecule/BreadCrumb/BreadCrumb.test.d.ts +1 -0
- package/build/components/Molecule/BreadCrumb/const.d.ts +22 -0
- package/build/components/Molecule/BreadCrumb/index.d.ts +3 -0
- package/build/components/Molecule/BreadCrumb/types.d.ts +17 -0
- package/build/components/Molecule/Calendar/Calendar.d.ts +10 -0
- package/build/components/Molecule/Calendar/Calendar.stories.d.ts +5 -0
- package/build/components/Molecule/Calendar/Calendar.test.d.ts +1 -0
- package/build/components/Molecule/Calendar/index.d.ts +2 -0
- package/build/components/Molecule/Card/Card.d.ts +7 -0
- package/build/components/Molecule/Card/Card.stories.d.ts +5 -0
- package/build/components/Molecule/Card/Card.test.d.ts +1 -0
- package/build/components/Molecule/Card/const.d.ts +22 -0
- package/build/components/Molecule/Card/index.d.ts +2 -0
- package/build/components/Molecule/Card/types.d.ts +23 -0
- package/build/components/Molecule/Carousel/Carousel.d.ts +6 -0
- package/build/components/Molecule/Carousel/Carousel.stories.d.ts +50 -0
- package/build/components/Molecule/Carousel/Carousel.test.d.ts +1 -0
- package/build/components/Molecule/Carousel/const.d.ts +15 -0
- package/build/components/Molecule/Carousel/index.d.ts +2 -0
- package/build/components/Molecule/Carousel/types.d.ts +22 -0
- package/build/components/Molecule/Chart/Chart.d.ts +4 -0
- package/build/components/Molecule/Chart/Chart.stories.d.ts +5 -0
- package/build/components/Molecule/Chart/Chart.test.d.ts +1 -0
- package/build/components/Molecule/Chart/const.d.ts +5 -0
- package/build/components/Molecule/Chart/index.d.ts +2 -0
- package/build/components/Molecule/Chart/types.d.ts +24 -0
- package/build/components/Molecule/Collapse/Collapse.d.ts +4 -0
- package/build/components/Molecule/Collapse/Collapse.stories.d.ts +9 -0
- package/build/components/Molecule/Collapse/Collapse.test.d.ts +1 -0
- package/build/components/Molecule/Collapse/CollapseData.d.ts +16 -0
- package/build/components/Molecule/Collapse/FAQCollapseGroup.d.ts +4 -0
- package/build/components/Molecule/Collapse/const.d.ts +10 -0
- package/build/components/Molecule/Collapse/index.d.ts +4 -0
- package/build/components/Molecule/Collapse/types.d.ts +17 -0
- package/build/components/Molecule/DatePicker/DatePicker.d.ts +4 -0
- package/build/components/Molecule/DatePicker/DatePicker.stories.d.ts +5 -0
- package/build/components/Molecule/DatePicker/DatePicker.test.d.ts +1 -0
- package/build/components/Molecule/DatePicker/const.d.ts +1 -0
- package/build/components/Molecule/DatePicker/index.d.ts +2 -0
- package/build/components/Molecule/DatePicker/types.d.ts +22 -0
- package/build/components/Molecule/Dialog/CustomDialogContent.d.ts +4 -0
- package/build/components/Molecule/Dialog/Dialog.d.ts +7 -0
- package/build/components/Molecule/Dialog/Dialog.stories.d.ts +5 -0
- package/build/components/Molecule/Dialog/Dialog.test.d.ts +1 -0
- package/build/components/Molecule/Dialog/const.d.ts +15 -0
- package/build/components/Molecule/Dialog/index.d.ts +2 -0
- package/build/components/Molecule/Dialog/types.d.ts +53 -0
- package/build/components/Molecule/Dialog/utils.d.ts +1 -0
- package/build/components/Molecule/Drawer/Drawer.d.ts +4 -0
- package/build/components/Molecule/Drawer/Drawer.stories.d.ts +43 -0
- package/build/components/Molecule/Drawer/Drawer.test.d.ts +1 -0
- package/build/components/Molecule/Drawer/const.d.ts +10 -0
- package/build/components/Molecule/Drawer/index.d.ts +2 -0
- package/build/components/Molecule/Drawer/types.d.ts +13 -0
- package/build/components/Molecule/Dropdown/Dropdown.d.ts +4 -0
- package/build/components/Molecule/Dropdown/Dropdown.stories.d.ts +5 -0
- package/build/components/Molecule/Dropdown/Dropdown.test.d.ts +1 -0
- package/build/components/Molecule/Dropdown/const.d.ts +3 -0
- package/build/components/Molecule/Dropdown/index.d.ts +2 -0
- package/build/components/Molecule/Dropdown/types.d.ts +45 -0
- package/build/components/Molecule/Loader/Loader.d.ts +4 -0
- package/build/components/Molecule/Loader/Loader.stories.d.ts +6 -0
- package/build/components/Molecule/Loader/Loader.test.d.ts +1 -0
- package/build/components/Molecule/Loader/const.d.ts +2 -0
- package/build/components/Molecule/Loader/index.d.ts +2 -0
- package/build/components/Molecule/Loader/types.d.ts +29 -0
- package/build/components/Molecule/Message/Message.d.ts +4 -13
- package/build/components/Molecule/Message/Message.stories.d.ts +58 -3
- package/build/components/Molecule/Message/Message.types.d.ts +21 -0
- package/build/components/Molecule/Message/MessageManager.d.ts +6 -4
- package/build/components/Molecule/Otp/Otp.d.ts +7 -0
- package/build/components/Molecule/Otp/Otp.stories.d.ts +46 -0
- package/build/components/Molecule/Otp/Otp.test.d.ts +1 -0
- package/build/components/Molecule/Otp/const.d.ts +7 -0
- package/build/components/Molecule/Otp/index.d.ts +2 -0
- package/build/components/Molecule/Otp/types.d.ts +10 -0
- package/build/components/Molecule/Pagination/Pagination.d.ts +4 -0
- package/build/components/Molecule/Pagination/Pagination.stories.d.ts +5 -0
- package/build/components/Molecule/Pagination/Pagination.test.d.ts +1 -0
- package/build/components/Molecule/Pagination/PaginationState.d.ts +4 -0
- package/build/components/Molecule/Pagination/const.d.ts +7 -0
- package/build/components/Molecule/Pagination/index.d.ts +2 -0
- package/build/components/Molecule/Pagination/types.d.ts +13 -0
- package/build/components/Molecule/Pagination/utils.d.ts +1 -0
- package/build/components/Molecule/Popover/Popover.d.ts +7 -0
- package/build/components/Molecule/Popover/Popover.stories.d.ts +40 -0
- package/build/components/Molecule/Popover/Popover.test.d.ts +1 -0
- package/build/components/Molecule/Popover/const.d.ts +10 -0
- package/build/components/Molecule/Popover/index.d.ts +2 -0
- package/build/components/Molecule/Popover/types.d.ts +21 -0
- package/build/components/Molecule/ProfileCard/ProfileCard.d.ts +4 -0
- package/build/components/Molecule/ProfileCard/ProfileCard.stories.d.ts +35 -0
- package/build/components/Molecule/ProfileCard/ProfileCard.test.d.ts +1 -0
- package/build/components/Molecule/ProfileCard/const.d.ts +18 -0
- package/build/components/Molecule/ProfileCard/index.d.ts +2 -0
- package/build/components/Molecule/ProfileCard/types.d.ts +16 -0
- package/build/components/Molecule/Sheet/Sheet.d.ts +16 -0
- package/build/components/Molecule/Sheet/Sheet.stories.d.ts +9 -0
- package/build/components/Molecule/Sheet/Sheet.test.d.ts +1 -0
- package/build/components/Molecule/Sheet/const.d.ts +8 -0
- package/build/components/Molecule/Sheet/index.d.ts +2 -0
- package/build/components/Molecule/Sheet/types.d.ts +33 -0
- package/build/components/Molecule/Skeleton/Skeleton.d.ts +4 -0
- package/build/components/Molecule/Skeleton/Skeleton.stories.d.ts +5 -0
- package/build/components/Molecule/Skeleton/Skeleton.test.d.ts +1 -0
- package/build/components/Molecule/Skeleton/const.d.ts +13 -0
- package/build/components/Molecule/Skeleton/index.d.ts +2 -0
- package/build/components/Molecule/Skeleton/types.d.ts +18 -0
- package/build/components/Molecule/Stepper/Stepper.d.ts +4 -0
- package/build/components/Molecule/Stepper/Stepper.stories.d.ts +5 -0
- package/build/components/Molecule/Stepper/Stepper.test.d.ts +1 -0
- package/build/components/Molecule/Stepper/const.d.ts +59 -0
- package/build/components/Molecule/Stepper/index.d.ts +2 -0
- package/build/components/Molecule/Stepper/types.d.ts +33 -0
- package/build/components/Molecule/Table/Table.d.ts +2 -1
- package/build/components/Molecule/Table/Table.types.d.ts +1 -0
- package/build/components/Molecule/Table/index.d.ts +2 -1
- package/build/components/Molecule/Tabs/Tabs.d.ts +4 -0
- package/build/components/Molecule/Tabs/Tabs.stories.d.ts +40 -0
- package/build/components/Molecule/Tabs/Tabs.test.d.ts +1 -0
- package/build/components/Molecule/Tabs/TabsData.d.ts +3 -0
- package/build/components/Molecule/Tabs/const.d.ts +10 -0
- package/build/components/Molecule/Tabs/index.d.ts +2 -0
- package/build/components/Molecule/Tabs/types.d.ts +16 -0
- package/build/components/Molecule/Tooltip/Tooltip.d.ts +3 -1
- package/build/components/Molecule/Tooltip/Tooltip.stories.d.ts +7 -3
- package/build/components/Molecule/Tooltip/index.d.ts +2 -1
- package/build/components/ui/alert-dialog.d.ts +20 -0
- package/build/components/ui/button.d.ts +11 -0
- package/build/components/ui/card.d.ts +8 -0
- package/build/components/ui/command.d.ts +80 -0
- package/build/components/ui/dialog.d.ts +19 -0
- package/build/components/ui/drawer.d.ts +22 -0
- package/build/components/ui/input-otp.d.ts +34 -0
- package/build/components/ui/pagination.d.ts +17 -0
- package/build/components/ui/popover.d.ts +7 -0
- package/build/components/ui/skeleton.d.ts +3 -0
- package/build/components/ui/tabs.d.ts +7 -0
- package/build/index.css +5 -0
- package/build/index.d.ts +22 -0
- package/build/index.esm.css +5 -0
- package/build/index.esm.js +29 -5
- package/build/index.esm.js.map +1 -1
- package/build/index.js +29 -5
- package/build/index.js.map +1 -1
- package/build/lib/utils.d.ts +2 -0
- package/build/tsconfig.prod.tsbuildinfo +1 -1
- package/build/tsconfig.tsbuildinfo +1 -1
- package/package.json +87 -60
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ButtonProps } from './Button.types';
|
|
3
|
-
|
|
3
|
+
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
4
|
+
export default Button;
|
|
@@ -1,12 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
export type
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
import { ButtonHTMLAttributes } from 'react';
|
|
2
|
+
export type ButtonVariants = 'primary' | 'secondary' | 'tertiary' | 'danger' | 'warning' | 'link';
|
|
3
|
+
export type ButtonDisplayType = 'default' | 'badge';
|
|
4
|
+
export type ButtonStatus = 'accepted' | 'pending';
|
|
5
|
+
export type ButtonSizes = 'small' | 'medium' | 'large';
|
|
6
|
+
export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
7
7
|
iconLeft?: React.ReactNode;
|
|
8
8
|
iconRight?: React.ReactNode;
|
|
9
|
-
|
|
9
|
+
variant?: ButtonVariants;
|
|
10
|
+
displayType?: ButtonDisplayType;
|
|
11
|
+
status?: ButtonStatus;
|
|
12
|
+
size?: ButtonSizes;
|
|
10
13
|
loading?: boolean;
|
|
14
|
+
disabled?: boolean;
|
|
11
15
|
dataTestId?: string;
|
|
16
|
+
fluid?: boolean;
|
|
17
|
+
className?: string;
|
|
12
18
|
}
|
|
@@ -9,4 +9,5 @@ export interface Props extends Omit<React.InputHTMLAttributes<HTMLInputElement>,
|
|
|
9
9
|
marginLeft?: 'small' | 'medium' | 'large';
|
|
10
10
|
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
11
11
|
}
|
|
12
|
-
|
|
12
|
+
declare const Checkbox: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLInputElement>>;
|
|
13
|
+
export default Checkbox;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { IconProps } from './Icon.types';
|
|
3
|
-
|
|
3
|
+
declare const Icon: ({ name, color, size, strokeWidth, className, ...iconProps }: IconProps) => React.JSX.Element;
|
|
4
|
+
export default Icon;
|
|
@@ -1,21 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
export
|
|
5
|
-
label: string;
|
|
6
|
-
fluid?: boolean;
|
|
7
|
-
inputSize?: InputSizes[number];
|
|
8
|
-
success?: StateProps;
|
|
9
|
-
error?: StateProps;
|
|
10
|
-
hint?: StateProps;
|
|
11
|
-
leftIcon?: React.ReactNode;
|
|
12
|
-
rightIcon?: React.ReactNode;
|
|
13
|
-
togglePassword?: boolean;
|
|
14
|
-
hintTextProps?: TextProps;
|
|
15
|
-
className?: string;
|
|
16
|
-
dataTestId?: string;
|
|
17
|
-
}
|
|
18
|
-
export interface StateProps {
|
|
19
|
-
message: string;
|
|
20
|
-
}
|
|
21
|
-
export declare const Input: ({ value, fluid, label, leftIcon, rightIcon, togglePassword, error, success, hint, disabled, type, hintTextProps, className, dataTestId, inputSize, ...props }: InputProps) => React.JSX.Element;
|
|
2
|
+
import { InputProps } from './Input.types';
|
|
3
|
+
declare const Input: ({ value, fluid, label, leftIcon, rightIcon, togglePassword, error, success, hint, disabled, type, hintTextProps, className, dataTestId, inputSize, ...props }: InputProps) => React.JSX.Element;
|
|
4
|
+
export default Input;
|
|
@@ -1,6 +1,24 @@
|
|
|
1
|
+
import { TextProps } from '@Atom/Typography';
|
|
1
2
|
export type InputSizes = ['small', 'normal'];
|
|
2
3
|
export type InputStates = ['default', 'hover', 'active', 'disabled'];
|
|
3
4
|
export type HintStates = ['hint', 'success', 'error'];
|
|
4
5
|
export type HintStateKeys = ['color', 'borderColor', 'placeholderColor'];
|
|
5
6
|
export type InputSizeKeys = ['fontSize', 'lineHeight', 'spacing'];
|
|
6
7
|
export type InputStateKeys = ['color', 'borderColor'];
|
|
8
|
+
export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, Record<string, any> {
|
|
9
|
+
label: string;
|
|
10
|
+
fluid?: boolean;
|
|
11
|
+
inputSize?: InputSizes[number];
|
|
12
|
+
success?: StateProps;
|
|
13
|
+
error?: StateProps;
|
|
14
|
+
hint?: StateProps;
|
|
15
|
+
leftIcon?: React.ReactNode;
|
|
16
|
+
rightIcon?: React.ReactNode;
|
|
17
|
+
togglePassword?: boolean;
|
|
18
|
+
hintTextProps?: TextProps;
|
|
19
|
+
className?: string;
|
|
20
|
+
dataTestId?: string;
|
|
21
|
+
}
|
|
22
|
+
export interface StateProps {
|
|
23
|
+
message: string;
|
|
24
|
+
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
export
|
|
1
|
+
import Input from './Input';
|
|
2
|
+
export { Input };
|
|
3
3
|
export type { InputStates, InputSizes } from './Input.types';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
|
|
3
|
+
import { RadioGroupClassNames, Option } from './types';
|
|
4
|
+
export type RadioGroupProps = React.ComponentProps<typeof RadioGroupPrimitive.Root> & {
|
|
5
|
+
options: Option[];
|
|
6
|
+
showIcons?: boolean;
|
|
7
|
+
withCard?: boolean;
|
|
8
|
+
classNames?: RadioGroupClassNames;
|
|
9
|
+
};
|
|
10
|
+
declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
11
|
+
export default RadioGroup;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
import { RadioGroupProps } from './RadioGroup';
|
|
3
|
+
declare const _default: Meta<RadioGroupProps>;
|
|
4
|
+
export default _default;
|
|
5
|
+
export declare const RadioGroup: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, RadioGroupProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export interface Option {
|
|
2
|
+
id: string;
|
|
3
|
+
label: string;
|
|
4
|
+
description?: string;
|
|
5
|
+
icon?: React.ReactNode;
|
|
6
|
+
}
|
|
7
|
+
export interface Option {
|
|
8
|
+
id: string;
|
|
9
|
+
label: string;
|
|
10
|
+
description?: string;
|
|
11
|
+
icon?: React.ReactNode;
|
|
12
|
+
}
|
|
13
|
+
export interface RadioGroupClassNames {
|
|
14
|
+
root?: string;
|
|
15
|
+
item?: string;
|
|
16
|
+
indicator?: string;
|
|
17
|
+
label?: string;
|
|
18
|
+
text?: string;
|
|
19
|
+
description?: string;
|
|
20
|
+
icon?: string;
|
|
21
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
export declare const sizeVariants: {
|
|
2
|
+
readonly small: {
|
|
3
|
+
readonly container: "p-2";
|
|
4
|
+
readonly radio: "h-4 w-4";
|
|
5
|
+
readonly dot: "h-2 w-2";
|
|
6
|
+
readonly labelText: "text-sm";
|
|
7
|
+
readonly descriptionText: "text-xs";
|
|
8
|
+
readonly icon: "w-4 h-4";
|
|
9
|
+
};
|
|
10
|
+
readonly medium: {
|
|
11
|
+
readonly container: "p-4";
|
|
12
|
+
readonly radio: "h-5 w-5";
|
|
13
|
+
readonly dot: "h-3 w-3";
|
|
14
|
+
readonly labelText: "text-base";
|
|
15
|
+
readonly descriptionText: "text-sm";
|
|
16
|
+
readonly icon: "w-6 h-6";
|
|
17
|
+
};
|
|
18
|
+
readonly large: {
|
|
19
|
+
readonly container: "p-5";
|
|
20
|
+
readonly radio: "h-6 w-6";
|
|
21
|
+
readonly dot: "h-3 w-3";
|
|
22
|
+
readonly labelText: "text-lg";
|
|
23
|
+
readonly descriptionText: "text-base";
|
|
24
|
+
readonly icon: "w-7 h-7";
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
export declare const colorVariants: {
|
|
28
|
+
readonly primary: {
|
|
29
|
+
readonly active: "border-primary bg-primary/5";
|
|
30
|
+
readonly radio: "border-primary bg-primary";
|
|
31
|
+
readonly hover: "hover:border-primary/60 hover:bg-primary/5";
|
|
32
|
+
readonly ring: "ring-primary";
|
|
33
|
+
};
|
|
34
|
+
readonly success: {
|
|
35
|
+
readonly active: "border-[rgb(var(--success))] bg-[rgb(var(--success))]/5";
|
|
36
|
+
readonly radio: "border-[rgb(var(--success))] bg-[rgb(var(--success))]";
|
|
37
|
+
readonly hover: "hover:border-[rgb(var(--success))]/60 hover:bg-[rgb(var(--success))]/5";
|
|
38
|
+
readonly ring: "ring-[rgb(var(--success))]";
|
|
39
|
+
};
|
|
40
|
+
readonly danger: {
|
|
41
|
+
readonly active: "border-destructive bg-destructive/5";
|
|
42
|
+
readonly radio: "border-destructive bg-destructive";
|
|
43
|
+
readonly hover: "hover:border-destructive/60 hover:bg-destructive/5";
|
|
44
|
+
readonly ring: "ring-destructive";
|
|
45
|
+
};
|
|
46
|
+
readonly warning: {
|
|
47
|
+
readonly active: "border-[rgb(var(--warning))] bg-[rgb(var(--warning))]/5";
|
|
48
|
+
readonly radio: "border-[rgb(var(--warning))] bg-[rgb(var(--warning))]";
|
|
49
|
+
readonly hover: "hover:border-[rgb(var(--warning))]/60 hover:bg-[rgb(var(--warning))]/5";
|
|
50
|
+
readonly ring: "ring-[rgb(var(--warning))]";
|
|
51
|
+
};
|
|
52
|
+
};
|
|
53
|
+
export declare const sizes: readonly ["small", "medium", "large"];
|
|
54
|
+
export declare const variants: readonly ["primary", "success", "danger", "warning"];
|
|
55
|
+
export type Size = (typeof sizes)[number];
|
|
56
|
+
export type Variant = (typeof variants)[number];
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
import { SwitchProps } from './types';
|
|
3
|
+
declare const _default: Meta<SwitchProps>;
|
|
4
|
+
export default _default;
|
|
5
|
+
export declare const Switch: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SwitchProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
export declare const DEFAULT_SIZE = "medium";
|
|
2
|
+
export declare const DEFAULT_VARIANT = "primary";
|
|
3
|
+
export declare const sizeVariants: {
|
|
4
|
+
readonly small: {
|
|
5
|
+
readonly switch: "w-8 h-4";
|
|
6
|
+
readonly thumb: "w-3 h-3";
|
|
7
|
+
readonly translate: "translate-x-4";
|
|
8
|
+
};
|
|
9
|
+
readonly medium: {
|
|
10
|
+
readonly switch: "w-11 h-6";
|
|
11
|
+
readonly thumb: "w-5 h-5";
|
|
12
|
+
readonly translate: "translate-x-5";
|
|
13
|
+
};
|
|
14
|
+
readonly large: {
|
|
15
|
+
readonly switch: "w-14 h-7";
|
|
16
|
+
readonly thumb: "w-6 h-6";
|
|
17
|
+
readonly translate: "translate-x-7";
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
export declare const colorVariants: {
|
|
21
|
+
readonly primary: {
|
|
22
|
+
readonly background: "bg-primary";
|
|
23
|
+
readonly foreground: "text-primary-foreground";
|
|
24
|
+
readonly hover: "hover:bg-primary/90";
|
|
25
|
+
};
|
|
26
|
+
readonly success: {
|
|
27
|
+
readonly background: "bg-[rgb(var(--success))]";
|
|
28
|
+
readonly foreground: "text-[rgb(var(--success-foreground))]";
|
|
29
|
+
readonly hover: "hover:bg-[rgb(var(--success))]/90";
|
|
30
|
+
};
|
|
31
|
+
readonly danger: {
|
|
32
|
+
readonly background: "bg-destructive";
|
|
33
|
+
readonly foreground: "text-destructive-foreground";
|
|
34
|
+
readonly hover: "hover:bg-destructive/90";
|
|
35
|
+
};
|
|
36
|
+
readonly warning: {
|
|
37
|
+
readonly background: "bg-[rgb(var(--warning))]";
|
|
38
|
+
readonly foreground: "text-foreground";
|
|
39
|
+
readonly hover: "hover:bg-[rgb(var(--warning))]/90";
|
|
40
|
+
};
|
|
41
|
+
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { sizeVariants, colorVariants } from './const';
|
|
2
|
+
export declare const sizes: readonly ["small", "medium", "large"];
|
|
3
|
+
export type SwitchSize = keyof typeof sizeVariants;
|
|
4
|
+
export declare const variants: readonly ["primary", "success", "danger", "warning"];
|
|
5
|
+
export type SwitchVariant = keyof typeof colorVariants;
|
|
6
|
+
export interface SwitchContentProps {
|
|
7
|
+
label?: string;
|
|
8
|
+
description?: string;
|
|
9
|
+
dataTestId?: string;
|
|
10
|
+
variant?: SwitchVariant;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
loading?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export interface SwitchProps extends Omit<React.ComponentPropsWithoutRef<typeof import('@radix-ui/react-switch').Root>, 'size' | 'onChange'>, Omit<SwitchContentProps, 'variant'> {
|
|
15
|
+
size?: SwitchSize;
|
|
16
|
+
variant?: SwitchVariant;
|
|
17
|
+
loading?: boolean;
|
|
18
|
+
onChange?: (checked: boolean) => void;
|
|
19
|
+
}
|
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { HeadingProps, TextProps } from './Typography.types';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
declare const Typography: {
|
|
4
|
+
Heading: React.FC<HeadingProps>;
|
|
5
|
+
Text: React.FC<TextProps>;
|
|
6
|
+
};
|
|
7
|
+
export default Typography;
|
|
@@ -1,2 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import Typography from './Typography';
|
|
2
|
+
export declare const Text: import("react").FC<import("./Typography.types").TextProps>;
|
|
3
|
+
export declare const Heading: import("react").FC<import("./Typography.types").HeadingProps>;
|
|
4
|
+
export default Typography;
|
|
2
5
|
export type { MarginSize, LetterSpacingSize, HeadingProps, TextProps, } from './Typography.types';
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { AlertDialogProps } from './types';
|
|
3
|
+
declare const AlertDialogComponent: ({ title, description, trigger, action, cancel, onAction, onCancel, variant, disabled, }: AlertDialogProps) => React.JSX.Element;
|
|
4
|
+
export default AlertDialogComponent;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { AlertDialogProps } from './types';
|
|
3
|
+
declare const _default: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ title, description, trigger, action, cancel, onAction, onCancel, variant, disabled, }: AlertDialogProps) => React.JSX.Element;
|
|
6
|
+
argTypes: {
|
|
7
|
+
title: {
|
|
8
|
+
control: "text";
|
|
9
|
+
description: string;
|
|
10
|
+
defaultValue: string;
|
|
11
|
+
};
|
|
12
|
+
description: {
|
|
13
|
+
control: "text";
|
|
14
|
+
description: string;
|
|
15
|
+
defaultValue: string;
|
|
16
|
+
};
|
|
17
|
+
trigger: {
|
|
18
|
+
control: "text";
|
|
19
|
+
description: string;
|
|
20
|
+
defaultValue: string;
|
|
21
|
+
};
|
|
22
|
+
action: {
|
|
23
|
+
control: "text";
|
|
24
|
+
description: string;
|
|
25
|
+
defaultValue: string;
|
|
26
|
+
};
|
|
27
|
+
cancel: {
|
|
28
|
+
control: "text";
|
|
29
|
+
description: string;
|
|
30
|
+
defaultValue: "Cancel";
|
|
31
|
+
};
|
|
32
|
+
variant: {
|
|
33
|
+
control: "radio";
|
|
34
|
+
options: string[];
|
|
35
|
+
description: string;
|
|
36
|
+
defaultValue: "default";
|
|
37
|
+
};
|
|
38
|
+
disabled: {
|
|
39
|
+
control: "boolean";
|
|
40
|
+
description: string;
|
|
41
|
+
defaultValue: false;
|
|
42
|
+
};
|
|
43
|
+
onAction: {
|
|
44
|
+
action: string;
|
|
45
|
+
description: string;
|
|
46
|
+
};
|
|
47
|
+
onCancel: {
|
|
48
|
+
action: string;
|
|
49
|
+
description: string;
|
|
50
|
+
};
|
|
51
|
+
};
|
|
52
|
+
};
|
|
53
|
+
export default _default;
|
|
54
|
+
export declare const AlertDialog: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, AlertDialogProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
import { BreadCrumbProps } from './types';
|
|
3
|
+
declare const _default: Meta<BreadCrumbProps>;
|
|
4
|
+
export default _default;
|
|
5
|
+
export declare const BreadCrumb: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, BreadCrumbProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export declare const breadCrumbVariants: {
|
|
2
|
+
readonly arrow: "arrow";
|
|
3
|
+
readonly slash: "slash";
|
|
4
|
+
readonly icon: "icon";
|
|
5
|
+
};
|
|
6
|
+
export declare const breadCrumbSizes: {
|
|
7
|
+
readonly small: {
|
|
8
|
+
readonly text: "text-xs";
|
|
9
|
+
readonly icon: "h-3 w-3";
|
|
10
|
+
readonly spacing: "py-0.5 px-1.5";
|
|
11
|
+
};
|
|
12
|
+
readonly medium: {
|
|
13
|
+
readonly text: "text-sm";
|
|
14
|
+
readonly icon: "h-4 w-4";
|
|
15
|
+
readonly spacing: "py-1 px-2";
|
|
16
|
+
};
|
|
17
|
+
readonly large: {
|
|
18
|
+
readonly text: "text-base";
|
|
19
|
+
readonly icon: "h-5 w-5";
|
|
20
|
+
readonly spacing: "py-1.5 px-2.5";
|
|
21
|
+
};
|
|
22
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { type ReactNode, type HTMLAttributes } from 'react';
|
|
2
|
+
import { breadCrumbVariants, breadCrumbSizes } from './const';
|
|
3
|
+
export interface BreadCrumbItem {
|
|
4
|
+
label: string;
|
|
5
|
+
href: string;
|
|
6
|
+
icon?: ReactNode;
|
|
7
|
+
}
|
|
8
|
+
export interface BreadCrumbProps extends HTMLAttributes<HTMLElement> {
|
|
9
|
+
items: BreadCrumbItem[];
|
|
10
|
+
variant?: keyof typeof breadCrumbVariants;
|
|
11
|
+
size?: keyof typeof breadCrumbSizes;
|
|
12
|
+
maxItems?: number;
|
|
13
|
+
}
|
|
14
|
+
export interface BreadCrumbSeparatorProps extends HTMLAttributes<HTMLSpanElement> {
|
|
15
|
+
variant: keyof typeof breadCrumbVariants;
|
|
16
|
+
size: keyof typeof breadCrumbSizes;
|
|
17
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DayPicker } from 'react-day-picker';
|
|
3
|
+
export type CalendarProps = React.ComponentProps<typeof DayPicker> & {
|
|
4
|
+
onSelect?: (date: Date | undefined) => void;
|
|
5
|
+
};
|
|
6
|
+
declare const Calendar: {
|
|
7
|
+
({ className, classNames, showOutsideDays, ...props }: CalendarProps): React.JSX.Element;
|
|
8
|
+
displayName: string;
|
|
9
|
+
};
|
|
10
|
+
export default Calendar;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
import { CalendarProps } from './Calendar';
|
|
3
|
+
declare const _default: Meta<CalendarProps>;
|
|
4
|
+
export default _default;
|
|
5
|
+
export declare const Calendar: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, CalendarProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
import { CardProps } from './types';
|
|
3
|
+
declare const _default: Meta<CardProps>;
|
|
4
|
+
export default _default;
|
|
5
|
+
export declare const Card: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, CardProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { CardVariant, VariantStyles } from './types';
|
|
2
|
+
export declare const CARD_SIZES: {
|
|
3
|
+
readonly small: {
|
|
4
|
+
readonly padding: "p-3 sm:p-4";
|
|
5
|
+
readonly titleSize: "text-base sm:text-lg";
|
|
6
|
+
readonly descSize: "text-sm sm:text-base";
|
|
7
|
+
readonly imageHeight: "h-24 sm:h-32 md:h-36";
|
|
8
|
+
};
|
|
9
|
+
readonly medium: {
|
|
10
|
+
readonly padding: "p-4 sm:p-5 md:p-6";
|
|
11
|
+
readonly titleSize: "text-lg sm:text-xl md:text-2xl";
|
|
12
|
+
readonly descSize: "text-sm sm:text-base md:text-lg";
|
|
13
|
+
readonly imageHeight: "h-32 sm:h-40 md:h-48 lg:h-56";
|
|
14
|
+
};
|
|
15
|
+
readonly large: {
|
|
16
|
+
readonly padding: "p-5 sm:p-6 md:p-7 lg:p-8";
|
|
17
|
+
readonly titleSize: "text-xl sm:text-2xl md:text-3xl";
|
|
18
|
+
readonly descSize: "text-base sm:text-lg md:text-xl";
|
|
19
|
+
readonly imageHeight: "h-40 sm:h-48 md:h-56 lg:h-64";
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
export declare const CARD_VARIANTS: Record<CardVariant, VariantStyles>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export type CardVariant = 'default' | 'gradiant';
|
|
3
|
+
export type CardSize = 'small' | 'medium' | 'large';
|
|
4
|
+
export interface CardProps {
|
|
5
|
+
title: string;
|
|
6
|
+
description?: string;
|
|
7
|
+
variant?: CardVariant;
|
|
8
|
+
size?: CardSize;
|
|
9
|
+
image?: string;
|
|
10
|
+
footer?: ReactNode;
|
|
11
|
+
className?: string;
|
|
12
|
+
children?: ReactNode;
|
|
13
|
+
badge?: string;
|
|
14
|
+
}
|
|
15
|
+
interface BaseVariantStyles {
|
|
16
|
+
kind: CardVariant;
|
|
17
|
+
wrapper: string;
|
|
18
|
+
inner?: string;
|
|
19
|
+
gradients: string[];
|
|
20
|
+
content?: string;
|
|
21
|
+
}
|
|
22
|
+
export type VariantStyles = BaseVariantStyles;
|
|
23
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type CarouselProps, type CarouselItemProps } from './types';
|
|
3
|
+
declare const Carousel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & CarouselProps & React.RefAttributes<HTMLDivElement>>;
|
|
4
|
+
declare const CarouselItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & CarouselItemProps & React.RefAttributes<HTMLDivElement>>;
|
|
5
|
+
export default Carousel;
|
|
6
|
+
export { CarouselItem };
|