@tanishraj/ui-kit 2.3.0 → 2.4.0
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/index.cjs.js +2 -2
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +329 -0
- package/dist/index.es.js +120 -45
- package/dist/index.es.js.map +1 -1
- package/package.json +2 -1
- package/readme.md +102 -0
package/dist/index.d.ts
CHANGED
|
@@ -7,6 +7,8 @@ import { FC } from 'react';
|
|
|
7
7
|
import { FieldsetHTMLAttributes } from 'react';
|
|
8
8
|
import { ForwardRefExoticComponent } from 'react';
|
|
9
9
|
import { HTMLAttributes } from 'react';
|
|
10
|
+
import { KeyboardEvent as KeyboardEvent_2 } from 'react';
|
|
11
|
+
import { MouseEvent as MouseEvent_2 } from 'react';
|
|
10
12
|
import { Placement } from '@floating-ui/react';
|
|
11
13
|
import { ReactElement } from 'react';
|
|
12
14
|
import { ReactNode } from 'react';
|
|
@@ -15,6 +17,7 @@ import { RefAttributes } from 'react';
|
|
|
15
17
|
import { RefObject } from 'react';
|
|
16
18
|
import { RemoveNull as RemoveNull_2 } from '../../../utils';
|
|
17
19
|
import { SVGProps } from 'react';
|
|
20
|
+
import { ToasterProps } from 'sonner';
|
|
18
21
|
import { VariantProps } from 'class-variance-authority';
|
|
19
22
|
|
|
20
23
|
export declare const Accordion: FC<AccordionProps>;
|
|
@@ -215,12 +218,15 @@ export declare interface ButtonProps extends ComponentPropsWithRef<'button'>, Re
|
|
|
215
218
|
trailingIcon?: FC<SVGProps<SVGSVGElement>>;
|
|
216
219
|
}
|
|
217
220
|
|
|
221
|
+
export declare type ButtonShapes = RemoveNull_2<VariantProps<typeof buttonStyles>>['shape'];
|
|
222
|
+
|
|
218
223
|
export declare type ButtonSizes = RemoveNull_2<VariantProps<typeof buttonStyles>>['size'];
|
|
219
224
|
|
|
220
225
|
declare const buttonStyles: (props?: ({
|
|
221
226
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
222
227
|
variant?: "default" | "primary" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
223
228
|
appearance?: "filled" | "outline" | "dashed" | "ghost" | null | undefined;
|
|
229
|
+
shape?: "rounded" | "squared" | null | undefined;
|
|
224
230
|
disabled?: boolean | null | undefined;
|
|
225
231
|
loading?: boolean | null | undefined;
|
|
226
232
|
fullWidth?: boolean | null | undefined;
|
|
@@ -408,6 +414,38 @@ declare enum EThemeOptions {
|
|
|
408
414
|
DARK = "dark"
|
|
409
415
|
}
|
|
410
416
|
|
|
417
|
+
export declare const Feedback: FC<FeedbackProps>;
|
|
418
|
+
|
|
419
|
+
export declare type FeedbackGetLabelText = (option: FeedbackOption, index: number, total: number) => string;
|
|
420
|
+
|
|
421
|
+
export declare interface FeedbackOption {
|
|
422
|
+
emoji?: ReactNode;
|
|
423
|
+
label: string;
|
|
424
|
+
value: number;
|
|
425
|
+
}
|
|
426
|
+
|
|
427
|
+
declare const feedbackOptionStyles: (props?: ({
|
|
428
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
429
|
+
variant?: "emoji" | "face" | null | undefined;
|
|
430
|
+
} & ClassProp) | undefined) => string;
|
|
431
|
+
|
|
432
|
+
export declare interface FeedbackProps extends Omit<ComponentPropsWithRef<'div'>, 'defaultValue' | 'onChange'> {
|
|
433
|
+
defaultValue?: number;
|
|
434
|
+
disabled?: boolean;
|
|
435
|
+
getLabelText?: FeedbackGetLabelText;
|
|
436
|
+
name?: string;
|
|
437
|
+
onValueChange?: (value: number) => void;
|
|
438
|
+
options?: FeedbackOption[];
|
|
439
|
+
readOnly?: boolean;
|
|
440
|
+
size?: FeedbackSizes;
|
|
441
|
+
value?: number;
|
|
442
|
+
variant?: FeedbackVariant;
|
|
443
|
+
}
|
|
444
|
+
|
|
445
|
+
export declare type FeedbackSizes = RemoveNull_2<VariantProps<typeof feedbackOptionStyles>>['size'];
|
|
446
|
+
|
|
447
|
+
export declare type FeedbackVariant = 'face' | 'emoji';
|
|
448
|
+
|
|
411
449
|
export declare const Input: FC<InputProps>;
|
|
412
450
|
|
|
413
451
|
export declare type InputIcon = FC<SVGProps<SVGSVGElement>>;
|
|
@@ -433,6 +471,20 @@ export declare type InputSizes = ButtonSizes;
|
|
|
433
471
|
|
|
434
472
|
export declare type InputVariants = ButtonVariants;
|
|
435
473
|
|
|
474
|
+
export declare interface InternalTabListProps extends TabsListProps {
|
|
475
|
+
children: ReactElement<TabProps> | ReactElement<TabProps>[];
|
|
476
|
+
}
|
|
477
|
+
|
|
478
|
+
export declare interface InternalTabPanelProps extends TabPanelProps {
|
|
479
|
+
index?: number;
|
|
480
|
+
}
|
|
481
|
+
|
|
482
|
+
export declare interface InternalTabProps extends TabProps {
|
|
483
|
+
index?: number;
|
|
484
|
+
panelId?: string;
|
|
485
|
+
selected?: boolean;
|
|
486
|
+
}
|
|
487
|
+
|
|
436
488
|
export declare const Link: FC<LinkProps>;
|
|
437
489
|
|
|
438
490
|
export declare type LinkIcon = FC<SVGProps<SVGSVGElement>>;
|
|
@@ -546,6 +598,7 @@ export declare interface OrgChartApiNodeData {
|
|
|
546
598
|
export declare interface OrgChartComponentProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onClick'> {
|
|
547
599
|
data: Array<OrgChartNodeData | OrgChartApiNodeData>;
|
|
548
600
|
orientation?: OrgChartOrientation;
|
|
601
|
+
onOrientationChange?: (orientation: OrgChartOrientation) => void;
|
|
549
602
|
initialDepth?: number;
|
|
550
603
|
imageName?: string;
|
|
551
604
|
onNodeClick?: (nodeId: string) => void;
|
|
@@ -589,6 +642,7 @@ export declare interface OrgChartRef {
|
|
|
589
642
|
zoomOut: () => void;
|
|
590
643
|
resetZoom: () => void;
|
|
591
644
|
resetLevel: () => void;
|
|
645
|
+
resetOrientation: () => void;
|
|
592
646
|
exportImg: () => void;
|
|
593
647
|
exportSvg: () => void;
|
|
594
648
|
expandAll: () => void;
|
|
@@ -642,16 +696,291 @@ declare interface PresenceChildProps {
|
|
|
642
696
|
children: ReactElement;
|
|
643
697
|
}
|
|
644
698
|
|
|
699
|
+
export declare const ProgressBar: FC<ProgressBarProps>;
|
|
700
|
+
|
|
701
|
+
export declare type ProgressBarAppearances = NonNullable<RemoveNull_2<VariantProps<typeof progressBarRootStyles>>['appearance']>;
|
|
702
|
+
|
|
703
|
+
export declare interface ProgressBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
704
|
+
appearance?: ProgressBarAppearances;
|
|
705
|
+
caption?: ReactNode;
|
|
706
|
+
captionClassName?: string;
|
|
707
|
+
fullWidth?: boolean;
|
|
708
|
+
indicatorClassName?: string;
|
|
709
|
+
inverted?: boolean;
|
|
710
|
+
label?: ReactNode;
|
|
711
|
+
labelClassName?: string;
|
|
712
|
+
max?: number;
|
|
713
|
+
min?: number;
|
|
714
|
+
showDot?: boolean;
|
|
715
|
+
showValue?: boolean;
|
|
716
|
+
size?: ProgressBarSizes;
|
|
717
|
+
trackClassName?: string;
|
|
718
|
+
value?: number;
|
|
719
|
+
valueClassName?: string;
|
|
720
|
+
valueFormatter?: (args: ProgressBarValueFormatterArgs) => ReactNode;
|
|
721
|
+
variant?: ProgressBarVariants;
|
|
722
|
+
}
|
|
723
|
+
|
|
724
|
+
declare const progressBarRootStyles: (props?: ({
|
|
725
|
+
appearance?: "linear" | "circular" | null | undefined;
|
|
726
|
+
fullWidth?: boolean | null | undefined;
|
|
727
|
+
} & ClassProp) | undefined) => string;
|
|
728
|
+
|
|
729
|
+
export declare type ProgressBarSizes = NonNullable<RemoveNull_2<VariantProps<typeof progressBarTrackStyles>>['size']>;
|
|
730
|
+
|
|
731
|
+
declare const progressBarTrackStyles: (props?: ({
|
|
732
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
733
|
+
inverted?: boolean | null | undefined;
|
|
734
|
+
} & ClassProp) | undefined) => string;
|
|
735
|
+
|
|
736
|
+
export declare interface ProgressBarValueFormatterArgs {
|
|
737
|
+
max: number;
|
|
738
|
+
min: number;
|
|
739
|
+
percentage: number;
|
|
740
|
+
value: number;
|
|
741
|
+
}
|
|
742
|
+
|
|
743
|
+
export declare type ProgressBarVariants = ButtonVariants;
|
|
744
|
+
|
|
745
|
+
export declare const Radio: FC<RadioProps>;
|
|
746
|
+
|
|
747
|
+
declare const radioControlStyles: (props?: ({
|
|
748
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
749
|
+
invalid?: boolean | null | undefined;
|
|
750
|
+
} & ClassProp) | undefined) => string;
|
|
751
|
+
|
|
752
|
+
export declare const RadioGroup: FC<RadioGroupProps>;
|
|
753
|
+
|
|
754
|
+
export declare interface RadioGroupOption extends Omit<RadioProps, 'checked' | 'defaultChecked' | 'children' | 'error' | 'name' | 'ref' | 'required' | 'size' | 'type' | 'value'> {
|
|
755
|
+
value: string;
|
|
756
|
+
}
|
|
757
|
+
|
|
758
|
+
export declare type RadioGroupOrientation = 'horizontal' | 'vertical';
|
|
759
|
+
|
|
760
|
+
export declare interface RadioGroupProps extends Omit<FieldsetHTMLAttributes<HTMLFieldSetElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> {
|
|
761
|
+
defaultValue?: string;
|
|
762
|
+
description?: ReactNode;
|
|
763
|
+
error?: ReactNode;
|
|
764
|
+
label?: ReactNode;
|
|
765
|
+
name?: string;
|
|
766
|
+
onValueChange?: (value: string) => void;
|
|
767
|
+
options: RadioGroupOption[];
|
|
768
|
+
orientation?: RadioGroupOrientation;
|
|
769
|
+
required?: boolean;
|
|
770
|
+
size?: RadioGroupSizes;
|
|
771
|
+
value?: string;
|
|
772
|
+
}
|
|
773
|
+
|
|
774
|
+
export declare type RadioGroupSizes = RadioSizes;
|
|
775
|
+
|
|
776
|
+
export declare interface RadioProps extends Omit<ComponentPropsWithRef<'input'>, 'children' | 'size' | 'type'> {
|
|
777
|
+
description?: ReactNode;
|
|
778
|
+
error?: ReactNode;
|
|
779
|
+
label?: ReactNode;
|
|
780
|
+
size?: RadioSizes;
|
|
781
|
+
}
|
|
782
|
+
|
|
783
|
+
export declare type RadioSizes = RemoveNull_2<VariantProps<typeof radioControlStyles>>['size'];
|
|
784
|
+
|
|
785
|
+
export declare const Rating: FC<RatingProps>;
|
|
786
|
+
|
|
787
|
+
export declare type RatingPrecision = 0.5 | 1;
|
|
788
|
+
|
|
789
|
+
export declare interface RatingProps extends Omit<ComponentPropsWithRef<'div'>, 'defaultValue' | 'onChange'> {
|
|
790
|
+
defaultValue?: number;
|
|
791
|
+
disabled?: boolean;
|
|
792
|
+
getLabelText?: (value: number, max: number) => string;
|
|
793
|
+
max?: number;
|
|
794
|
+
name?: string;
|
|
795
|
+
onValueChange?: (value: number) => void;
|
|
796
|
+
precision?: RatingPrecision;
|
|
797
|
+
readOnly?: boolean;
|
|
798
|
+
size?: RatingSizes;
|
|
799
|
+
value?: number;
|
|
800
|
+
}
|
|
801
|
+
|
|
802
|
+
export declare type RatingSizes = RemoveNull_2<VariantProps<typeof ratingStarStyles>>['size'];
|
|
803
|
+
|
|
804
|
+
declare const ratingStarStyles: (props?: ({
|
|
805
|
+
size?: "sm" | "md" | "lg" | "xs" | null | undefined;
|
|
806
|
+
} & ClassProp) | undefined) => string;
|
|
807
|
+
|
|
645
808
|
export declare type RemoveNull<T> = {
|
|
646
809
|
[K in keyof T]: Exclude<T[K], null>;
|
|
647
810
|
};
|
|
648
811
|
|
|
812
|
+
export declare const Slider: FC<SliderProps>;
|
|
813
|
+
|
|
814
|
+
export declare type SliderLabelSizes = RemoveNull_2<VariantProps<typeof sliderLabelStyles>>['size'];
|
|
815
|
+
|
|
816
|
+
declare const sliderLabelStyles: (props?: ({
|
|
817
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
818
|
+
disabled?: boolean | null | undefined;
|
|
819
|
+
} & ClassProp) | undefined) => string;
|
|
820
|
+
|
|
821
|
+
export declare interface SliderProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue' | 'onChange'> {
|
|
822
|
+
caption?: ReactNode;
|
|
823
|
+
captionClassName?: string;
|
|
824
|
+
defaultValue?: SliderValue;
|
|
825
|
+
disabled?: boolean;
|
|
826
|
+
error?: ReactNode;
|
|
827
|
+
formatValue?: (value: number) => ReactNode;
|
|
828
|
+
label?: ReactNode;
|
|
829
|
+
labelClassName?: string;
|
|
830
|
+
max?: number;
|
|
831
|
+
min?: number;
|
|
832
|
+
onValueChange?: (value: SliderValue) => void;
|
|
833
|
+
range?: boolean;
|
|
834
|
+
showMaxLabel?: boolean;
|
|
835
|
+
showMinLabel?: boolean;
|
|
836
|
+
showValueLabel?: boolean;
|
|
837
|
+
size?: SliderSizes;
|
|
838
|
+
step?: number;
|
|
839
|
+
thumbClassName?: string;
|
|
840
|
+
trackClassName?: string;
|
|
841
|
+
value?: SliderValue;
|
|
842
|
+
valueClassName?: string;
|
|
843
|
+
}
|
|
844
|
+
|
|
845
|
+
export declare type SliderSizes = RemoveNull_2<VariantProps<typeof sliderTrackStyles>>['size'];
|
|
846
|
+
|
|
847
|
+
export declare interface SliderState {
|
|
848
|
+
max: number;
|
|
849
|
+
min: number;
|
|
850
|
+
values: [number, number?];
|
|
851
|
+
}
|
|
852
|
+
|
|
853
|
+
export declare type SliderThumbSizes = RemoveNull_2<VariantProps<typeof sliderThumbStyles>>['size'];
|
|
854
|
+
|
|
855
|
+
declare const sliderThumbStyles: (props?: ({
|
|
856
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
857
|
+
disabled?: boolean | null | undefined;
|
|
858
|
+
} & ClassProp) | undefined) => string;
|
|
859
|
+
|
|
860
|
+
declare const sliderTrackStyles: (props?: ({
|
|
861
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
862
|
+
disabled?: boolean | null | undefined;
|
|
863
|
+
} & ClassProp) | undefined) => string;
|
|
864
|
+
|
|
865
|
+
export declare type SliderValue = number | [number, number];
|
|
866
|
+
|
|
867
|
+
export declare const Tab: FC<InternalTabProps>;
|
|
868
|
+
|
|
869
|
+
export declare type TabKeyboardEvent = KeyboardEvent_2<HTMLDivElement>;
|
|
870
|
+
|
|
871
|
+
declare const tabListStyles: (props?: ({
|
|
872
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
873
|
+
variant?: "underline" | "pill" | null | undefined;
|
|
874
|
+
} & ClassProp) | undefined) => string;
|
|
875
|
+
|
|
876
|
+
export declare const TabPanel: FC<TabPanelProps>;
|
|
877
|
+
|
|
878
|
+
export declare type TabPanelOrientation = RemoveNull_2<VariantProps<typeof tabPanelStyles>>['orientation'];
|
|
879
|
+
|
|
880
|
+
export declare interface TabPanelProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
|
|
881
|
+
children: ReactNode;
|
|
882
|
+
}
|
|
883
|
+
|
|
884
|
+
declare const tabPanelStyles: (props?: ({
|
|
885
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
886
|
+
} & ClassProp) | undefined) => string;
|
|
887
|
+
|
|
888
|
+
export declare interface TabProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'id' | 'onClick' | 'onKeyDown' | 'role' | 'tabIndex'> {
|
|
889
|
+
children: ReactNode;
|
|
890
|
+
closeLabel?: string;
|
|
891
|
+
disabled?: boolean;
|
|
892
|
+
endAdornment?: ReactNode;
|
|
893
|
+
onClose?: (event: MouseEvent_2<HTMLButtonElement>) => void;
|
|
894
|
+
startAdornment?: ReactNode;
|
|
895
|
+
statusDot?: boolean;
|
|
896
|
+
}
|
|
897
|
+
|
|
898
|
+
declare const tabRootStyles: (props?: ({
|
|
899
|
+
variant?: "underline" | "pill" | null | undefined;
|
|
900
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
901
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
902
|
+
selected?: boolean | null | undefined;
|
|
903
|
+
disabled?: boolean | null | undefined;
|
|
904
|
+
} & ClassProp) | undefined) => string;
|
|
905
|
+
|
|
906
|
+
export declare const Tabs: FC<TabsProps>;
|
|
907
|
+
|
|
908
|
+
export declare interface TabsContextValue {
|
|
909
|
+
baseId: string;
|
|
910
|
+
disabled: boolean;
|
|
911
|
+
orientation: NonNullable<TabsProps['orientation']>;
|
|
912
|
+
selectedIndex: number;
|
|
913
|
+
setSelectedIndex: (index: number) => void;
|
|
914
|
+
size: NonNullable<TabsProps['size']>;
|
|
915
|
+
variant: NonNullable<TabsProps['variant']>;
|
|
916
|
+
}
|
|
917
|
+
|
|
918
|
+
export declare const TabsList: FC<TabsListProps>;
|
|
919
|
+
|
|
920
|
+
export declare interface TabsListContextValue extends TabsContextValue {
|
|
921
|
+
registerTab: (index: number, node: HTMLDivElement | null) => void;
|
|
922
|
+
focusTab: (index: number) => void;
|
|
923
|
+
getNextEnabledIndex: (currentIndex: number, direction: 1 | -1) => number;
|
|
924
|
+
getFirstEnabledIndex: () => number;
|
|
925
|
+
getLastEnabledIndex: () => number;
|
|
926
|
+
isTabDisabled: (index: number) => boolean;
|
|
927
|
+
tabCount: number;
|
|
928
|
+
}
|
|
929
|
+
|
|
930
|
+
export declare interface TabsListProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
|
|
931
|
+
children: ReactNode;
|
|
932
|
+
}
|
|
933
|
+
|
|
934
|
+
export declare type TabsOrientation = RemoveNull_2<VariantProps<typeof tabsRootStyles>>['orientation'];
|
|
935
|
+
|
|
936
|
+
export declare interface TabsProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'defaultValue' | 'onChange'> {
|
|
937
|
+
children: ReactNode;
|
|
938
|
+
defaultValue?: number;
|
|
939
|
+
disabled?: boolean;
|
|
940
|
+
id?: string;
|
|
941
|
+
onValueChange?: (value: number) => void;
|
|
942
|
+
orientation?: TabsOrientation;
|
|
943
|
+
size?: TabsSizes;
|
|
944
|
+
value?: number;
|
|
945
|
+
variant?: TabsVariant;
|
|
946
|
+
}
|
|
947
|
+
|
|
948
|
+
export declare type TabsRootOrientation = RemoveNull_2<VariantProps<typeof tabListStyles>>['orientation'];
|
|
949
|
+
|
|
950
|
+
declare const tabsRootStyles: (props?: ({
|
|
951
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
952
|
+
} & ClassProp) | undefined) => string;
|
|
953
|
+
|
|
954
|
+
export declare type TabsSizes = RemoveNull_2<VariantProps<typeof tabRootStyles>>['size'];
|
|
955
|
+
|
|
956
|
+
export declare type TabsVariant = RemoveNull_2<VariantProps<typeof tabRootStyles>>['variant'];
|
|
957
|
+
|
|
958
|
+
export declare const Toaster: FC<ToasterProps>;
|
|
959
|
+
|
|
960
|
+
export declare interface ToastProps extends AlertProps {
|
|
961
|
+
duration?: number;
|
|
962
|
+
position?: ToasterProps['position'];
|
|
963
|
+
dismissable?: boolean;
|
|
964
|
+
}
|
|
965
|
+
|
|
649
966
|
export declare const useTheme: () => {
|
|
650
967
|
theme: EThemeOptions;
|
|
651
968
|
isDark: boolean;
|
|
652
969
|
setTheme: (theme: EThemeOptions) => void;
|
|
653
970
|
};
|
|
654
971
|
|
|
972
|
+
export declare const useToast: () => {
|
|
973
|
+
toast: (props: ToastProps) => string | number;
|
|
974
|
+
default: (props: Omit<ToastProps, "variant">) => string | number;
|
|
975
|
+
primary: (props: Omit<ToastProps, "variant">) => string | number;
|
|
976
|
+
info: (props: Omit<ToastProps, "variant">) => string | number;
|
|
977
|
+
success: (props: Omit<ToastProps, "variant">) => string | number;
|
|
978
|
+
warning: (props: Omit<ToastProps, "variant">) => string | number;
|
|
979
|
+
danger: (props: Omit<ToastProps, "variant">) => string | number;
|
|
980
|
+
error: (props: Omit<ToastProps, "variant">) => string | number;
|
|
981
|
+
dismiss: (id?: number | string) => string | number;
|
|
982
|
+
};
|
|
983
|
+
|
|
655
984
|
export declare const useToggle: () => readonly [boolean, () => void];
|
|
656
985
|
|
|
657
986
|
export { }
|