@tanishraj/ui-kit 1.0.3
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/.storybook/StorybookThemeProvider.d.ts +6 -0
- package/dist/.storybook/main.d.ts +3 -0
- package/dist/.storybook/preview.d.ts +3 -0
- package/dist/eslint.config.d.mts +2 -0
- package/dist/index.cjs.js +3 -0
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.es.js +14 -0
- package/dist/index.es.js.map +1 -0
- package/dist/setupTests.d.ts +0 -0
- package/dist/src/components/Alert/Alert.d.ts +11 -0
- package/dist/src/components/Alert/Alert.stories.d.ts +10 -0
- package/dist/src/components/Alert/Alert.styles.d.ts +35 -0
- package/dist/src/components/Alert/Alert.test.d.ts +1 -0
- package/dist/src/components/Alert/index.d.ts +2 -0
- package/dist/src/components/Alert/types.d.ts +6 -0
- package/dist/src/components/Avatar/Avatar.d.ts +17 -0
- package/dist/src/components/Avatar/Avatar.stories.d.ts +11 -0
- package/dist/src/components/Avatar/Avatar.styles.d.ts +23 -0
- package/dist/src/components/Avatar/Avatar.test.d.ts +1 -0
- package/dist/src/components/Avatar/index.d.ts +2 -0
- package/dist/src/components/Avatar/types.d.ts +14 -0
- package/dist/src/components/AvatarGroup/AvatarGroup.d.ts +3 -0
- package/dist/src/components/AvatarGroup/AvatarGroup.stories.d.ts +9 -0
- package/dist/src/components/AvatarGroup/AvatarGroup.styles.d.ts +8 -0
- package/dist/src/components/AvatarGroup/AvatarGroup.test.d.ts +1 -0
- package/dist/src/components/AvatarGroup/index.d.ts +2 -0
- package/dist/src/components/AvatarGroup/types.d.ts +17 -0
- package/dist/src/components/Badge/Badge.d.ts +7 -0
- package/dist/src/components/Badge/Badge.stories.d.ts +10 -0
- package/dist/src/components/Badge/Badge.styles.d.ts +14 -0
- package/dist/src/components/Badge/Badge.test.d.ts +1 -0
- package/dist/src/components/Badge/index.d.ts +2 -0
- package/dist/src/components/Badge/types.d.ts +7 -0
- package/dist/src/components/Button/Button.d.ts +10 -0
- package/dist/src/components/Button/Button.stories.d.ts +12 -0
- package/dist/src/components/Button/Button.styles.d.ts +15 -0
- package/dist/src/components/Button/Button.test.d.ts +1 -0
- package/dist/src/components/Button/index.d.ts +2 -0
- package/dist/src/components/Button/types.d.ts +6 -0
- package/dist/src/components/ButtonGroup/ButtonGroup.d.ts +3 -0
- package/dist/src/components/ButtonGroup/ButtonGroup.stories.d.ts +12 -0
- package/dist/src/components/ButtonGroup/ButtonGroup.styles.d.ts +11 -0
- package/dist/src/components/ButtonGroup/ButtonGroup.test.d.ts +1 -0
- package/dist/src/components/ButtonGroup/index.d.ts +2 -0
- package/dist/src/components/ButtonGroup/types.d.ts +15 -0
- package/dist/src/components/OrganizationChart/OrganizationChart.d.ts +2 -0
- package/dist/src/components/OrganizationChart/OrganizationChart.stories.d.ts +7 -0
- package/dist/src/components/OrganizationChart/OrganizationChart.styles.d.ts +5 -0
- package/dist/src/components/OrganizationChart/OrganizationChart.test.d.ts +1 -0
- package/dist/src/components/OrganizationChart/index.d.ts +2 -0
- package/dist/src/components/OrganizationChart/mockData.d.ts +4 -0
- package/dist/src/components/OrganizationChart/types.d.ts +62 -0
- package/dist/src/components/OrganizationChart/utils.d.ts +10 -0
- package/dist/src/components/OrganizationChart/utils.test.d.ts +1 -0
- package/dist/src/components/index.d.ts +7 -0
- package/dist/src/hooks/index.d.ts +2 -0
- package/dist/src/hooks/useTheme.d.ts +5 -0
- package/dist/src/hooks/useToggle.d.ts +1 -0
- package/dist/src/index.d.ts +3 -0
- package/dist/src/providers/index.d.ts +1 -0
- package/dist/src/providers/theme/ThemeProvider.d.ts +11 -0
- package/dist/src/providers/theme/context.d.ts +6 -0
- package/dist/src/providers/theme/index.d.ts +3 -0
- package/dist/src/providers/theme/types.d.ts +4 -0
- package/dist/src/utils/classNames.d.ts +2 -0
- package/dist/src/utils/index.d.ts +2 -0
- package/dist/src/utils/types.d.ts +3 -0
- package/dist/themes/primary.css +558 -0
- package/dist/themes/secondary.css +555 -0
- package/dist/vite.config.d.mts +2 -0
- package/package.json +118 -0
- package/readme.md +238 -0
|
File without changes
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FC, ReactNode, SVGProps } from 'react';
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
import { RemoveNull } from '../../utils';
|
|
4
|
+
import { alertWrapperStyles } from './Alert.styles';
|
|
5
|
+
export interface AlertProps extends RemoveNull<VariantProps<typeof alertWrapperStyles>> {
|
|
6
|
+
title?: string;
|
|
7
|
+
icon?: FC<SVGProps<SVGSVGElement>>;
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
onClose?: () => void;
|
|
10
|
+
}
|
|
11
|
+
export declare const Alert: FC<AlertProps>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { AlertProps } from './Alert';
|
|
3
|
+
declare const meta: Meta<AlertProps>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<AlertProps>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const AlertSize: Story;
|
|
8
|
+
export declare const AlertVariant: Story;
|
|
9
|
+
export declare const AlertApperance: Story;
|
|
10
|
+
export declare const AlertFilledInverted: Story;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
export declare const alertWrapperStyles: (props?: ({
|
|
2
|
+
appearance?: "filled" | "outline" | "dashed" | null | undefined;
|
|
3
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
4
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
5
|
+
inverted?: boolean | null | undefined;
|
|
6
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
7
|
+
export declare const alertContentWrapperStyles: (props?: ({
|
|
8
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
9
|
+
appearance?: "filled" | "outline" | "dashed" | null | undefined;
|
|
10
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
11
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
12
|
+
export declare const alertTitleStyles: (props?: ({
|
|
13
|
+
appearance?: "filled" | "outline" | "dashed" | null | undefined;
|
|
14
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
15
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
16
|
+
inverted?: boolean | null | undefined;
|
|
17
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
18
|
+
export declare const alertDescriptionStyles: (props?: ({
|
|
19
|
+
appearance?: "filled" | "outline" | "dashed" | null | undefined;
|
|
20
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
21
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
22
|
+
inverted?: boolean | null | undefined;
|
|
23
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
24
|
+
export declare const alertIconStyles: (props?: ({
|
|
25
|
+
appearance?: "filled" | "outline" | "dashed" | null | undefined;
|
|
26
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
27
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
28
|
+
inverted?: boolean | null | undefined;
|
|
29
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
30
|
+
export declare const alertCloseButtonStyles: (props?: ({
|
|
31
|
+
appearance?: "filled" | "outline" | "dashed" | null | undefined;
|
|
32
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
33
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
34
|
+
inverted?: boolean | null | undefined;
|
|
35
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
import { RemoveNull } from '../../utils';
|
|
3
|
+
import { alertWrapperStyles } from './Alert.styles';
|
|
4
|
+
export type AlertVariants = RemoveNull<VariantProps<typeof alertWrapperStyles>>['variant'];
|
|
5
|
+
export type AlertAppearances = RemoveNull<VariantProps<typeof alertWrapperStyles>>['appearance'];
|
|
6
|
+
export type AlertSizes = RemoveNull<VariantProps<typeof alertWrapperStyles>>['size'];
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { FC, HTMLAttributes } from 'react';
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
import { avatarContainerStyles } from './Avatar.styles';
|
|
4
|
+
import { AvatarIcon, AvatarImage, AvatarSizes, AvatarShapes, AvatarVariants, AvatarStatus, AvatarStatusPosition } from './types';
|
|
5
|
+
export interface AvatarProps extends HTMLAttributes<HTMLSpanElement>, Omit<VariantProps<typeof avatarContainerStyles>, 'stroke'> {
|
|
6
|
+
icon?: AvatarIcon;
|
|
7
|
+
img?: AvatarImage;
|
|
8
|
+
initials?: string;
|
|
9
|
+
status?: AvatarStatus;
|
|
10
|
+
statusPosition?: AvatarStatusPosition;
|
|
11
|
+
size?: AvatarSizes;
|
|
12
|
+
shape?: AvatarShapes;
|
|
13
|
+
variant?: AvatarVariants;
|
|
14
|
+
inverted?: boolean;
|
|
15
|
+
stroke?: boolean;
|
|
16
|
+
}
|
|
17
|
+
export declare const Avatar: FC<AvatarProps>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { AvatarProps } from './Avatar';
|
|
3
|
+
declare const meta: Meta<AvatarProps>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<AvatarProps>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Variants: Story;
|
|
8
|
+
export declare const Sizes: Story;
|
|
9
|
+
export declare const Shapes: Story;
|
|
10
|
+
export declare const WithStroke: Story;
|
|
11
|
+
export declare const Status: Story;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export declare const avatarContainerStyles: (props?: ({
|
|
2
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
3
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
4
|
+
shape?: "circle" | "square" | null | undefined;
|
|
5
|
+
inverted?: boolean | null | undefined;
|
|
6
|
+
stroke?: boolean | null | undefined;
|
|
7
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
|
+
export declare const avatarImageStyles: (props?: ({
|
|
9
|
+
shape?: "circle" | "square" | null | undefined;
|
|
10
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
11
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
12
|
+
export declare const avatarTextStyles: (props?: ({
|
|
13
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
14
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
15
|
+
export declare const avatarIconStyles: (props?: ({
|
|
16
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
17
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
18
|
+
export declare const avatarStatusStyles: (props?: ({
|
|
19
|
+
status?: "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
20
|
+
shape?: "circle" | "square" | null | undefined;
|
|
21
|
+
position?: "top-right" | "top-left" | "bottom-right" | "bottom-left" | null | undefined;
|
|
22
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
23
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { FC, SVGProps } from 'react';
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
import { RemoveNull } from '../../utils';
|
|
4
|
+
import { avatarContainerStyles, avatarStatusStyles } from './Avatar.styles';
|
|
5
|
+
export type AvatarSizes = RemoveNull<VariantProps<typeof avatarContainerStyles>>['size'];
|
|
6
|
+
export type AvatarShapes = RemoveNull<VariantProps<typeof avatarContainerStyles>>['shape'];
|
|
7
|
+
export type AvatarVariants = RemoveNull<VariantProps<typeof avatarContainerStyles>>['variant'];
|
|
8
|
+
export type AvatarStatus = RemoveNull<VariantProps<typeof avatarStatusStyles>['status']>;
|
|
9
|
+
export type AvatarStatusPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
|
10
|
+
export type AvatarIcon = FC<SVGProps<SVGSVGElement>>;
|
|
11
|
+
export type AvatarImage = {
|
|
12
|
+
src: string;
|
|
13
|
+
alt: string;
|
|
14
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { AvatarGroupProps } from './types';
|
|
3
|
+
declare const meta: Meta<AvatarGroupProps>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<AvatarGroupProps>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Variants: Story;
|
|
8
|
+
export declare const Sizes: Story;
|
|
9
|
+
export declare const Shapes: Story;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare const avatarGroupStyles: (props?: ({
|
|
2
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
3
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
4
|
+
export declare const avatarGroupCounterStyles: (props?: ({
|
|
5
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
6
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
7
|
+
shape?: "circle" | "square" | null | undefined;
|
|
8
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { HTMLAttributes } from 'react';
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
import { RemoveNull } from '../../utils';
|
|
4
|
+
import { AvatarProps, AvatarVariants } from '../Avatar';
|
|
5
|
+
import { avatarContainerStyles } from '../Avatar/Avatar.styles';
|
|
6
|
+
export type AvatarGroupSizes = RemoveNull<VariantProps<typeof avatarContainerStyles>>['size'];
|
|
7
|
+
export type AvatarGroupShapes = RemoveNull<VariantProps<typeof avatarContainerStyles>>['shape'];
|
|
8
|
+
export type AvatarGroupItem = Omit<AvatarProps, 'size' | 'shape' | 'inverted' | 'stroke' | 'className'>;
|
|
9
|
+
export interface AvatarGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
10
|
+
items?: AvatarGroupItem[];
|
|
11
|
+
size?: AvatarGroupSizes;
|
|
12
|
+
variant?: AvatarVariants;
|
|
13
|
+
shape?: AvatarGroupShapes;
|
|
14
|
+
max?: number;
|
|
15
|
+
inverted?: boolean;
|
|
16
|
+
stroke?: boolean;
|
|
17
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { FC, HTMLAttributes, SVGProps } from 'react';
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
import { badgeVariants } from './Badge.styles';
|
|
4
|
+
export interface BadgeProps extends HTMLAttributes<HTMLSpanElement>, Omit<VariantProps<typeof badgeVariants>, 'appearance'> {
|
|
5
|
+
icon?: FC<SVGProps<SVGSVGElement>>;
|
|
6
|
+
}
|
|
7
|
+
export declare const Badge: FC<BadgeProps>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { BadgeProps } from './Badge';
|
|
3
|
+
declare const meta: Meta<BadgeProps>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<BadgeProps>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Variant: Story;
|
|
8
|
+
export declare const Size: Story;
|
|
9
|
+
export declare const Shape: Story;
|
|
10
|
+
export declare const Appearance: Story;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export declare const badgeVariants: (props?: ({
|
|
2
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
3
|
+
appearance?: "icon" | "dots" | "text" | null | undefined;
|
|
4
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
5
|
+
shape?: "circle" | "square" | null | undefined;
|
|
6
|
+
inverted?: boolean | null | undefined;
|
|
7
|
+
hasIcon?: boolean | null | undefined;
|
|
8
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
9
|
+
export declare const badgeIconStyles: (props?: ({
|
|
10
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
11
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
12
|
+
export declare const badgeTextStyles: (props?: ({
|
|
13
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
14
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
import { RemoveNull } from '../../utils';
|
|
3
|
+
import { badgeVariants } from './Badge.styles';
|
|
4
|
+
export type BadgeVariants = RemoveNull<VariantProps<typeof badgeVariants>>['variant'];
|
|
5
|
+
export type BadgeAppearances = RemoveNull<VariantProps<typeof badgeVariants>>['appearance'];
|
|
6
|
+
export type BadgeSizes = RemoveNull<VariantProps<typeof badgeVariants>>['size'];
|
|
7
|
+
export type BadgeShapes = RemoveNull<VariantProps<typeof badgeVariants>>['shape'];
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { ComponentPropsWithRef, FC, ReactNode, SVGProps } from 'react';
|
|
2
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
|
+
import { RemoveNull } from '../../utils';
|
|
4
|
+
import { buttonStyles } from './Button.styles';
|
|
5
|
+
export interface ButtonProps extends ComponentPropsWithRef<'button'>, RemoveNull<Omit<VariantProps<typeof buttonStyles>, 'disabled'>> {
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
leadingIcon?: FC<SVGProps<SVGSVGElement>>;
|
|
8
|
+
trailingIcon?: FC<SVGProps<SVGSVGElement>>;
|
|
9
|
+
}
|
|
10
|
+
export declare const Button: FC<ButtonProps>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ButtonProps } from './Button';
|
|
3
|
+
declare const meta: Meta<ButtonProps>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<ButtonProps>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const ButtonSizes: Story;
|
|
8
|
+
export declare const ButtonStates: Story;
|
|
9
|
+
export declare const ButtonLoading: Story;
|
|
10
|
+
export declare const ButtonDisabled: Story;
|
|
11
|
+
export declare const ButtonInverted: Story;
|
|
12
|
+
export declare const ButtonIcon: Story;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export declare const buttonStyles: (props?: ({
|
|
2
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
3
|
+
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
4
|
+
appearance?: "filled" | "outline" | "dashed" | "ghost" | null | undefined;
|
|
5
|
+
disabled?: boolean | null | undefined;
|
|
6
|
+
loading?: boolean | null | undefined;
|
|
7
|
+
fullWidth?: boolean | null | undefined;
|
|
8
|
+
inverted?: boolean | null | undefined;
|
|
9
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
10
|
+
export declare const buttonSpinnerStyles: (props?: ({
|
|
11
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
12
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
13
|
+
export declare const buttonIconStyle: (props?: ({
|
|
14
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
15
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { VariantProps } from 'class-variance-authority';
|
|
2
|
+
import { RemoveNull } from '../../utils';
|
|
3
|
+
import { buttonStyles } from './Button.styles';
|
|
4
|
+
export type ButtonVariants = RemoveNull<VariantProps<typeof buttonStyles>>['variant'];
|
|
5
|
+
export type ButtonAppearances = RemoveNull<VariantProps<typeof buttonStyles>>['appearance'];
|
|
6
|
+
export type ButtonSizes = RemoveNull<VariantProps<typeof buttonStyles>>['size'];
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ButtonGroupProps } from './types';
|
|
3
|
+
declare const meta: Meta<ButtonGroupProps>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<ButtonGroupProps>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Variants: Story;
|
|
8
|
+
export declare const Appearances: Story;
|
|
9
|
+
export declare const Sizes: Story;
|
|
10
|
+
export declare const Orientations: Story;
|
|
11
|
+
export declare const Loading: Story;
|
|
12
|
+
export declare const Inverted: Story;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const buttonGroupStyles: (props?: ({
|
|
2
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
3
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
4
|
+
export declare const buttonGroupItemStyles: (props?: ({
|
|
5
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
6
|
+
position?: "single" | "first" | "middle" | "last" | null | undefined;
|
|
7
|
+
fullWidth?: boolean | null | undefined;
|
|
8
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
9
|
+
export declare const buttonGroupItemInnerStyles: (props?: ({
|
|
10
|
+
fullWidth?: boolean | null | undefined;
|
|
11
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { ButtonProps, ButtonSizes } from '../Button';
|
|
3
|
+
export type ButtonGroupOrientation = 'horizontal' | 'vertical';
|
|
4
|
+
export type ButtonGroupSizes = ButtonSizes;
|
|
5
|
+
export interface ButtonGroupItem extends Omit<ButtonProps, 'children' | 'ref' | 'className'> {
|
|
6
|
+
children?: ReactNode;
|
|
7
|
+
id?: string;
|
|
8
|
+
}
|
|
9
|
+
export interface ButtonGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'className'> {
|
|
10
|
+
buttons?: ButtonGroupItem[];
|
|
11
|
+
orientation?: ButtonGroupOrientation;
|
|
12
|
+
size?: ButtonGroupSizes;
|
|
13
|
+
inverted?: boolean;
|
|
14
|
+
role?: 'group' | string;
|
|
15
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { OrganizationChart } from './OrganizationChart';
|
|
3
|
+
declare const meta: Meta<typeof OrganizationChart>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof OrganizationChart>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const FiftyNodesFiveLevels: Story;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export declare const ORGANIZATION_CHART_NODE_WIDTH = 445;
|
|
2
|
+
export declare const ORGANIZATION_CHART_NODE_HEIGHT = 215;
|
|
3
|
+
export declare const organizationChartWrapperClassName = "relative h-full w-full min-h-0 min-w-0 overflow-hidden rounded-md bg-default";
|
|
4
|
+
export declare const organizationChartEmptyStateClassName = "flex h-full min-h-60 w-full min-w-0 items-center justify-center rounded-md border border-default bg-default p-6 text-base text-caption";
|
|
5
|
+
export declare const organizationChartZoomIndicatorClassName = "pointer-events-none absolute bottom-6 right-6 z-10 rounded-full bg-black/85 px-3.5 py-2 text-sm font-semibold tracking-[0.5px] text-white shadow-lg backdrop-blur-sm";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef } from 'react';
|
|
2
|
+
export type OrgChartOrientation = 'top' | 'left' | 'bottom' | 'right';
|
|
3
|
+
export type OrgChartNodeAccent = 'default' | 'primary' | 'info' | 'success' | 'warning' | 'danger';
|
|
4
|
+
export interface OrgChartCountryData {
|
|
5
|
+
id?: string | null;
|
|
6
|
+
name?: string | null;
|
|
7
|
+
country_code?: string | null;
|
|
8
|
+
__typename?: string;
|
|
9
|
+
}
|
|
10
|
+
export interface OrgChartApiNodeData {
|
|
11
|
+
id: string;
|
|
12
|
+
companyId?: string;
|
|
13
|
+
securityPosition?: string | null;
|
|
14
|
+
entityName: string;
|
|
15
|
+
country?: OrgChartCountryData | null;
|
|
16
|
+
entityType?: string | null;
|
|
17
|
+
parent?: {
|
|
18
|
+
id: string;
|
|
19
|
+
} | null;
|
|
20
|
+
role?: string | null;
|
|
21
|
+
revenue?: number | null;
|
|
22
|
+
revenueAllocPct?: number | null;
|
|
23
|
+
__typename?: string;
|
|
24
|
+
}
|
|
25
|
+
export interface OrgChartNodeData {
|
|
26
|
+
id: string;
|
|
27
|
+
parentId: string | null;
|
|
28
|
+
name: string;
|
|
29
|
+
position: string;
|
|
30
|
+
countryCode?: string | null;
|
|
31
|
+
countryName?: string | null;
|
|
32
|
+
entityType?: string | null;
|
|
33
|
+
role?: string | null;
|
|
34
|
+
revenue?: number | null;
|
|
35
|
+
revenueShare?: number | null;
|
|
36
|
+
securityPosition?: string | null;
|
|
37
|
+
companyCode?: string;
|
|
38
|
+
location?: string;
|
|
39
|
+
headcount?: string;
|
|
40
|
+
accent?: OrgChartNodeAccent;
|
|
41
|
+
}
|
|
42
|
+
export interface OrgChartRef {
|
|
43
|
+
zoomIn: () => void;
|
|
44
|
+
zoomOut: () => void;
|
|
45
|
+
resetZoom: () => void;
|
|
46
|
+
resetLevel: () => void;
|
|
47
|
+
exportImg: () => void;
|
|
48
|
+
exportSvg: () => void;
|
|
49
|
+
expandAll: () => void;
|
|
50
|
+
collapseAll: () => void;
|
|
51
|
+
}
|
|
52
|
+
export interface OrgChartComponentProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onClick'> {
|
|
53
|
+
data: Array<OrgChartNodeData | OrgChartApiNodeData>;
|
|
54
|
+
orientation?: OrgChartOrientation;
|
|
55
|
+
initialDepth?: number;
|
|
56
|
+
imageName?: string;
|
|
57
|
+
onNodeClick?: (nodeId: string) => void;
|
|
58
|
+
onZoomChange?: (zoomPercent: number) => void;
|
|
59
|
+
emptyMessage?: string;
|
|
60
|
+
showZoomBadge?: boolean;
|
|
61
|
+
dataTestId?: string;
|
|
62
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { OrgChartApiNodeData, OrgChartNodeData } from './types';
|
|
2
|
+
export declare const formatEnumLabel: (value?: string | null) => string;
|
|
3
|
+
export declare const formatRoleLabel: (value?: string | null) => string | null;
|
|
4
|
+
export declare const formatRevenue: (value?: number | null) => string;
|
|
5
|
+
export declare const formatRevenueShare: (value?: number | null) => string | null;
|
|
6
|
+
export declare const escapeHtml: (value: string) => string;
|
|
7
|
+
export declare const isOrgChartApiNodeData: (node: OrgChartNodeData | OrgChartApiNodeData) => node is OrgChartApiNodeData;
|
|
8
|
+
export declare const normalizeOrgChartNode: (node: OrgChartNodeData | OrgChartApiNodeData) => OrgChartNodeData;
|
|
9
|
+
export declare const buildNodeContent: (node: OrgChartNodeData, width: number, height: number) => string;
|
|
10
|
+
export declare const buildButtonContent: (childCount: number) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useToggle: () => readonly [boolean, () => void];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './theme';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
|
+
import { EThemeOptions } from './types';
|
|
3
|
+
interface IThemeProviderProps {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
name: string;
|
|
6
|
+
onThemeChange?: (theme: EThemeOptions) => void;
|
|
7
|
+
persist?: boolean;
|
|
8
|
+
theme?: EThemeOptions;
|
|
9
|
+
}
|
|
10
|
+
export declare const ThemeProvider: FC<IThemeProviderProps>;
|
|
11
|
+
export {};
|