@televet/kibble-ui 1.20.1-beta.cs1 → 1.20.2

package/build/components/Forms/Textarea/textarea.component.d.ts

@@ -6,5 +6,5 @@ export interface TextareaProps extends WithFormControlProps, CTextareaProps {
     textareaRef?: ForwardedRef<HTMLTextAreaElement>;
     size?: FormControlSize;
 }
-declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
-export default Textarea;
+declare const WrappedTextArea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+export { WrappedTextArea as Textarea };

package/build/components/Forms/TimePicker/index.d.ts

@@ -1 +1,3 @@
 export * from './timePicker.component';
+export * from './timePicker.types';
+export * from '../TimeRange/timeRange.component';

package/build/components/Forms/TimePicker/timePicker.component.d.ts

@@ -1,5 +1,5 @@
 import { PlacementWithLogical } from '@chakra-ui/react';
-import { TextInputProps } from '../TextInput/textInput.component';
+import { TextInputProps } from '../TextInput';
 export interface TimePickerProps {
     initialTime: Date;
     minuteInterval?: number;
@@ -7,5 +7,4 @@ export interface TimePickerProps {
     placement?: PlacementWithLogical;
     onTimeChange?: (time: Date) => void;
 }
-declare const TimePicker: ({ initialTime, minuteInterval, inputProps, placement, onTimeChange, }: TimePickerProps) => JSX.Element;
-export default TimePicker;
+export declare const TimePicker: ({ initialTime, minuteInterval, inputProps, placement, onTimeChange, }: TimePickerProps) => JSX.Element;

package/build/components/Forms/TimeRange/index.d.ts

@@ -1,2 +1 @@
-import TimeRange from './timeRange.component';
-export default TimeRange;
+export * from './timeRange.component';

package/build/components/Forms/TimeRange/timeRange.component.d.ts

@@ -5,5 +5,4 @@ export interface TimeRangeProps {
     endTimePickerProps: TimePickerProps;
     dashContainerProps?: BoxProps;
 }
-declare const TimeRange: ({ startTimePickerProps, endTimePickerProps, dashContainerProps }: TimeRangeProps) => JSX.Element;
-export default TimeRange;
+export declare const TimeRange: ({ startTimePickerProps, endTimePickerProps, dashContainerProps, }: TimeRangeProps) => JSX.Element;

package/build/components/Forms/index.d.ts

@@ -7,4 +7,5 @@ export * from './RatingDots';
 export * from './Select';
 export * from './Switch';
 export * from './DatePicker';
+export * from './FormControl';
 export * from './TimePicker';

package/build/components/MediaAndIcons/Avatar/avatar.argTypes.d.ts

@@ -1,8 +1,81 @@
+import { Placement } from '@chakra-ui/react';
+import React from 'react';
+import { AvatarSize, AvatarVariant } from './index';
+import { IconName } from '../Icon';
+import { AvatarBadgePosition, AvatarBadgeProps } from './components/AvatarBadge/avatarBadge.component';
+export interface AvatarArgTypeProps {
+    backgroundColor?: string;
+    badgeBackgroundColor?: string;
+    badgeBorderColor?: string;
+    badgeIconColor?: string;
+    badgeIconName?: IconName;
+    badgePosition?: AvatarBadgePosition;
+    badgeProps?: AvatarBadgeProps;
+    color?: string;
+    handleClick?: React.MouseEventHandler<HTMLSpanElement>;
+    handleRemoveButtonClick?: React.MouseEventHandler<HTMLDivElement>;
+    hideBorder?: boolean;
+    iconName?: IconName;
+    name?: string;
+    randomizeVariant?: boolean;
+    showBadge?: boolean;
+    showRemoveButton?: boolean;
+    showTooltip?: boolean;
+    size?: AvatarSize;
+    src?: string;
+    tooltipPlacement?: Placement;
+    tooltipText?: string;
+    variant?: AvatarVariant;
+}
 export declare const avatarArgTypes: {
+    backgroundColor: {
+        description: string;
+        control: string;
+    };
+    badgeBackgroundColor: any;
+    badgeBorderColor: any;
+    badgeIconColor: any;
+    badgeIconName: any;
+    badgePosition: any;
+    badgeProps: {
+        type: string;
+        description: string;
+    };
+    color: {
+        description: string;
+        control: string;
+    };
+    handleClick: {
+        type: string;
+        description: string;
+    };
+    handleRemoveButtonClick: {
+        type: string;
+        description: string;
+    };
+    hideBorder: {
+        type: string;
+        description: string;
+        defaultValue: boolean;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+    };
+    iconName: {
+        control: {
+            type: string;
+        };
+        options: string[];
+        description: string;
+    };
     name: {
         type: {
             name: string;
-            required: boolean;
         };
         control: string;
         description: string;
@@ -12,29 +85,22 @@ export declare const avatarArgTypes: {
             };
         };
     };
-    src: {
+    randomizeVariant: {
         type: string;
-        control: string;
         description: string;
+        defaultValue: boolean;
         table: {
             type: {
                 summary: string;
             };
+            defaultValue: {
+                summary: string;
+            };
         };
     };
-    iconName: {
-        control: {
-            type: string;
-        };
-        options: string[];
-        description: string;
-    };
-    size: {
+    showBadge: {
         type: string;
-        control: string;
         description: string;
-        defaultValue: string;
-        options: string[];
         table: {
             type: {
                 summary: string;
@@ -44,7 +110,7 @@ export declare const avatarArgTypes: {
             };
         };
     };
-    isClinic: {
+    showRemoveButton: {
         type: string;
         description: string;
         defaultValue: boolean;
@@ -70,11 +136,12 @@ export declare const avatarArgTypes: {
             };
         };
     };
-    tooltipPlacement: {
+    size: {
+        type: string;
         control: string;
-        options: import("@popperjs/core").Placement[];
-        defaultValue: string;
         description: string;
+        defaultValue: string;
+        options: string[];
         table: {
             type: {
                 summary: string;
@@ -84,8 +151,9 @@ export declare const avatarArgTypes: {
             };
         };
     };
-    tooltipText: {
+    src: {
         type: string;
+        control: string;
         description: string;
         table: {
             type: {
@@ -93,18 +161,21 @@ export declare const avatarArgTypes: {
             };
         };
     };
-    loading: {
-        type: string;
+    tooltipPlacement: {
         control: string;
+        options: Placement[];
+        defaultValue: string;
         description: string;
-        options: string[];
         table: {
             type: {
                 summary: string;
             };
+            defaultValue: {
+                summary: string;
+            };
         };
     };
-    handleClick: {
+    tooltipText: {
         type: string;
         description: string;
         table: {
@@ -113,30 +184,18 @@ export declare const avatarArgTypes: {
             };
         };
     };
-    backgroundColor: {
-        description: string;
-        control: string;
-    };
-    color: {
-        description: string;
+    variant: {
         control: string;
-    };
-    showBadge: {
-        type: string;
+        options: AvatarVariant[];
+        defaultValue: AvatarVariant;
         description: string;
         table: {
             type: {
                 summary: string;
             };
+            defaultValue: {
+                summary: AvatarVariant;
+            };
         };
     };
-    badgeProps: {
-        type: string;
-        description: string;
-    };
-    badgeIconName: any;
-    badgePosition: any;
-    badgeIconColor: any;
-    badgeBorderColor: any;
-    badgeBackgroundColor: any;
 };

package/build/components/MediaAndIcons/Avatar/avatar.component.d.ts

@@ -1,23 +1,23 @@
 import { AvatarProps as CAvatarProps, Placement } from '@chakra-ui/react';
-import React, { CSSProperties } from 'react';
+import { IconName } from 'components/MediaAndIcons/Icon';
+import React from 'react';
 import { AvatarSize, AvatarVariant } from './avatar.types';
 import { AvatarBadgeProps } from './components/AvatarBadge/avatarBadge.component';
-import { IconName } from '../Icon/icon.types';
 export interface AvatarProps extends CAvatarProps {
-    name: string;
-    size?: AvatarSize;
-    isClinic?: boolean;
-    showTooltip?: boolean;
-    tooltipPlacement?: Placement;
-    style?: CSSProperties;
+    badgeProps?: AvatarBadgeProps;
     handleClick?: React.MouseEventHandler<HTMLSpanElement>;
-    showRemoveButton?: boolean;
     handleRemoveButtonClick?: React.MouseEventHandler<HTMLDivElement>;
-    variant?: AvatarVariant;
+    hideBorder?: boolean;
     iconName?: IconName;
-    tooltipText?: string;
+    name?: string;
+    randomizeVariant?: boolean;
     showBadge?: boolean;
-    badgeProps?: AvatarBadgeProps;
+    showRemoveButton?: boolean;
+    showTooltip?: boolean;
+    size?: AvatarSize;
+    src?: string;
+    tooltipPlacement?: Placement;
+    tooltipText?: string;
+    variant?: AvatarVariant;
 }
-declare const Avatar: ({ name, src, isClinic, size, showTooltip, tooltipPlacement, style, handleClick, showRemoveButton, handleRemoveButtonClick, variant, iconName, tooltipText, showBadge, badgeProps, ...rest }: AvatarProps) => JSX.Element;
-export default Avatar;
+export declare const Avatar: ({ badgeProps, handleClick, handleRemoveButtonClick, hideBorder, iconName, name, randomizeVariant, showBadge, showRemoveButton, showTooltip, size, src, tooltipPlacement, tooltipText, variant, ...rest }: AvatarProps) => JSX.Element;

package/build/components/MediaAndIcons/Avatar/avatar.types.d.ts

@@ -4,8 +4,7 @@ export declare enum AvatarVariant {
     Red = "red",
     Blue = "blue",
     Comet = "comet",
-    Number = "number",
+    Dark = "dark",
     Dashed = "dashed",
-    Image = "image",
-    Icon = "icon"
+    Test = "test"
 }

package/build/components/MediaAndIcons/Avatar/components/AvatarBadge/avatarBadge.component.d.ts

@@ -1,6 +1,11 @@
+import { IconName } from 'components/MediaAndIcons/Icon';
 import { AvatarSize } from '../../avatar.types';
-import { IconName } from 'components/MediaAndIcons/Icon/icon.types';
-import { AvatarBadgePosition } from './avatarBadge.types';
+export declare enum AvatarBadgePosition {
+    TopLeft = "topLeft",
+    TopRight = "topRight",
+    BottomLeft = "bottomLeft",
+    BottomRight = "bottomRight"
+}
 export interface AvatarBadgeProps {
     badgeIconName?: IconName;
     badgeBackgroundColor?: string;

package/build/components/MediaAndIcons/Avatar/index.d.ts

@@ -1,2 +1,4 @@
-import Avatar from './avatar.component';
-export default Avatar;
+export * from './components/AvatarBadge/avatarBadge.component';
+export * from './avatar.component';
+export * from './avatar.types';
+export * from './avatar.config';

package/build/components/MediaAndIcons/AvatarGroup/avatarGroup.argTypes.d.ts

@@ -0,0 +1,94 @@
+export declare const avatarGroupArgTypes: {
+    addButtonTooltipText: {
+        type: string;
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    avatars: {
+        type: {
+            required: boolean;
+        };
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    handleAddButtonClick: {
+        type: string;
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    handleRemoveButtonClick: {
+        type: string;
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+        };
+    };
+    max: {
+        type: string;
+        description: string;
+        defaultValue: number;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: number;
+            };
+        };
+    };
+    showAddButton: {
+        type: string;
+        defaultValue: boolean;
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+    };
+    showRemoveAvatarButton: {
+        type: string;
+        defaultValue: boolean;
+        description: string;
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: boolean;
+            };
+        };
+    };
+    size: {
+        type: string;
+        control: string;
+        description: string;
+        defaultValue: string;
+        options: string[];
+        table: {
+            type: {
+                summary: string;
+            };
+            defaultValue: {
+                summary: string;
+            };
+        };
+    };
+};

package/build/components/MediaAndIcons/AvatarGroup/avatarGroup.component.d.ts

@@ -0,0 +1,13 @@
+import { AvatarProps } from '../Avatar/avatar.component';
+import { AvatarSize } from '../Avatar/avatar.types';
+export interface AvatarGroupProps {
+    addButtonTooltipText?: string;
+    avatars: AvatarProps[];
+    handleAddButtonClick?: () => void;
+    handleRemoveButtonClick?: () => void;
+    max?: number;
+    showAddButton?: boolean;
+    showRemoveAvatarButton?: boolean;
+    size?: AvatarSize;
+}
+export declare const AvatarGroup: ({ addButtonTooltipText, avatars, handleAddButtonClick, handleRemoveButtonClick, max, showAddButton, showRemoveAvatarButton, size, }: AvatarGroupProps) => JSX.Element;

package/build/components/MediaAndIcons/AvatarGroup/avatarGroup.storiesData.d.ts

@@ -0,0 +1,11 @@
+export declare const avatars: ({
+    name: string;
+    src: string;
+    handleClick: () => void;
+    randomizeVariant?: undefined;
+} | {
+    name: string;
+    randomizeVariant: boolean;
+    handleClick: () => void;
+    src?: undefined;
+})[];

package/build/components/MediaAndIcons/AvatarGroup/avatarGroup.utilities.d.ts

@@ -0,0 +1,6 @@
+export declare const avatarSizeMap: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+};

package/build/components/MediaAndIcons/AvatarGroup/index.d.ts

@@ -0,0 +1 @@
+export * from './avatarGroup.component';

package/build/components/MediaAndIcons/Icon/icon.component.d.ts

@@ -1,11 +1,10 @@
 import React from 'react';
 import { IconColorToken, IconsSize } from './icon.types';
-import { IconName } from 'components/MediaAndIcons/Icon/icon.types';
+import { IconName } from '@televet/kibble-icons';
 export interface IconProps {
     name: IconName;
     size?: IconsSize;
     color?: IconColorToken;
     colorToken?: IconColorToken;
 }
-declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<any>>;
-export default Icon;
+export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<any>>;

package/build/components/MediaAndIcons/Icon/icon.types.d.ts

@@ -1,5 +1,4 @@
-import { IconName as KIconName } from '@televet/kibble-icons';
-export declare type IconName = KIconName;
+export { IconName } from '@televet/kibble-icons';
 export declare type IconsSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
 export declare type IconColorToken = 'default' | 'subtle' | 'inactive' | 'active' | 'success' | 'warning' | 'error' | 'currentColor';
 export declare type IconColor = IconColorToken;

package/build/components/MediaAndIcons/Icon/index.d.ts

@@ -1,2 +1,2 @@
-import Icon from './icon.component';
-export default Icon;
+export * from './icon.component';
+export * from './icon.types';

package/build/components/MediaAndIcons/Logo/index.d.ts

@@ -1,2 +1,2 @@
-import Logo from './logo.component';
-export default Logo;
+export * from './logo.component';
+export * from './logo.types';

package/build/components/MediaAndIcons/Logo/logo.component.d.ts

@@ -6,8 +6,7 @@ export interface ILogoProps {
     width?: number;
     handleClick?: () => void;
 }
-declare const Logo: {
+export declare const Logo: {
     ({ type, color, height, width, handleClick }: ILogoProps): JSX.Element;
     displayName: string;
 };
-export default Logo;

package/build/components/Navigation/Link/components/linkIcon.component.d.ts

@@ -1,6 +1,5 @@
-import { IconProps } from 'components/MediaAndIcons/Icon/icon.component';
+import { IconProps } from '../../../MediaAndIcons/Icon';
 export interface LinkIconProps extends IconProps {
     position?: 'start' | 'end';
 }
-declare const LinkIcon: (iconProps: LinkIconProps) => JSX.Element;
-export default LinkIcon;
+export declare const LinkIcon: (iconProps: LinkIconProps) => JSX.Element;

package/build/components/Navigation/Link/index.d.ts

@@ -1,2 +1,2 @@
-import Link from './link.component';
-export default Link;
+export * from './link.component';
+export * from './link.config';

package/build/components/Navigation/Link/link.component.d.ts

@@ -1,8 +1,7 @@
 import React, { ReactNode } from 'react';
 import { LinkProps as CLinkProps } from '@chakra-ui/react';
 import { LinkIconProps } from './components/linkIcon.component';
-import { TextColor } from 'components/Typography/typography.types';
-import { TextSize } from 'components/Typography/Text/text.types';
+import { TextColor, TextSize } from 'components/Typography';
 export interface LinkProps extends CLinkProps {
     children: ReactNode;
     iconProps?: LinkIconProps;
@@ -11,5 +10,4 @@ export interface LinkProps extends CLinkProps {
     onDark?: boolean;
     to?: string;
 }
-declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
-export default Link;
+export declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;

package/build/components/Overlay/Menu/components/MenuButton/menuButton.component.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
+import { ButtonVariantType, ButtonSizeType } from 'components/Forms';
 import { MenuButtonProps as CMenuButtonProps } from '@chakra-ui/react';
-import { ButtonSizeType, ButtonVariantType } from 'components/Forms/Button/button.types';
-import { IconName } from 'components/MediaAndIcons/Icon/icon.types';
+import { IconName } from '@televet/kibble-icons';
 export interface MenuButtonProps extends CMenuButtonProps {
     leftElement?: ReactNode;
     leftIconName?: IconName;

package/build/components/Overlay/Menu/components/MenuItem/menuItem.component.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode, MutableRefObject, KeyboardEvent, ReactElement } from 'react';
-import { TextColor } from 'components/Typography/typography.types';
+import { TextColor } from 'components/Typography';
 export interface MenuItemProps {
     canSelectAll?: boolean;
     children?: ReactNode;

package/build/components/Overlay/Menu/index.d.ts

@@ -1,3 +1,9 @@
-import Menu from './menu.component';
-export default Menu;
+export * from './menu.component';
+export * from './menu.context';
+export * from './menu.config';
+export * from './components/MenuButton/menuButton.component';
+export * from './components/MenuContainer/menuContainer.component';
+export * from './components/MenuItem/menuItem.component';
+export * from './components/MenuList/menuList.component';
+export * from './components/MenuOptionGroup/menuOptionGroup.component';
 export { MenuItemOption, MenuDivider, MenuGroup } from '@chakra-ui/react';

package/build/components/Overlay/Menu/menu.component.d.ts

@@ -10,5 +10,4 @@ export interface MenuProps extends Omit<CMenuProps, 'children' | 'onClose'> {
     containerProps?: MenuContainerProps;
     children?: ReactNode;
 }
-declare const Menu: ({ buttonProps, CustomTriggerElement, listProps, containerProps, ...props }: MenuProps) => JSX.Element;
-export default Menu;
+export declare const Menu: ({ buttonProps, CustomTriggerElement, listProps, containerProps, ...props }: MenuProps) => JSX.Element;

package/build/components/Overlay/Modal/components/ModalBody/modalBody.component.d.ts

@@ -1,3 +1,2 @@
 import { ModalBodyProps } from '@chakra-ui/react';
-declare const ModalBody: ({ children, ...rest }: ModalBodyProps) => JSX.Element;
-export default ModalBody;
+export declare const ModalBody: ({ children, ...rest }: ModalBodyProps) => JSX.Element;

package/build/components/Overlay/Modal/components/ModalCloseButton/modalCloseButton.component.d.ts

@@ -1,3 +1,2 @@
-import { ButtonProps } from 'components/Forms/Button/button.component';
-declare const ModalCloseButton: ({ right, top, size, ...rest }: ButtonProps) => JSX.Element;
-export default ModalCloseButton;
+import { ButtonProps } from '../../../../Forms';
+export declare const ModalCloseButton: ({ right, top, size, ...rest }: ButtonProps) => JSX.Element;

package/build/components/Overlay/Modal/components/ModalFooter/modalFooter.component.d.ts

@@ -1,5 +1,4 @@
-import { ModalFooterProps as CModalFooterProps } from '@chakra-ui/react';
-export interface ModalFooterProps extends CModalFooterProps {
+import { ModalFooterProps as ChakraModalFooterProps } from '@chakra-ui/react';
+export interface ModalFooterProps extends ChakraModalFooterProps {
 }
-declare const ModalFooter: ({ children, ...rest }: ModalFooterProps) => JSX.Element;
-export default ModalFooter;
+export declare const ModalFooter: ({ children, ...rest }: ModalFooterProps) => JSX.Element;

package/build/components/Overlay/Modal/components/ModalFooterButtons/modalFooterButtons.component.d.ts

@@ -1,5 +1,5 @@
-import { ModalFooterProps as CModalFooterProps } from '@chakra-ui/react';
-export interface ModalFooterButtonProps extends CModalFooterProps {
+import { ModalFooterProps as ChakraModalFooterProps } from '@chakra-ui/react';
+export interface ModalFooterButtonProps extends ChakraModalFooterProps {
     mixpanelName?: string;
     submitText?: string;
     isLoading?: boolean;
@@ -10,5 +10,4 @@ export interface ModalFooterButtonProps extends CModalFooterProps {
     allowCancel?: boolean;
     onCancel?: () => void;
 }
-declare const ModalFooterButtons: ({ submitText, isLoading, loadingText, isDisabled, isDestructive, mixpanelName, children, onSubmit, allowCancel, onCancel, ...rest }: ModalFooterButtonProps) => JSX.Element;
-export default ModalFooterButtons;
+export declare const ModalFooterButtons: ({ submitText, isLoading, loadingText, isDisabled, isDestructive, mixpanelName, children, onSubmit, allowCancel, onCancel, ...rest }: ModalFooterButtonProps) => JSX.Element;

package/build/components/Overlay/Modal/components/ModalHeader/modalHeader.component.d.ts

@@ -1,7 +1,6 @@
-import { ModalHeaderProps as CModalHeaderProps } from '@chakra-ui/react';
-import { HeadingSize } from 'components/Typography/Heading/heading.types';
-export interface ModalHeaderProps extends CModalHeaderProps {
+import { ModalHeaderProps as ChakraModalHeaderProps } from '@chakra-ui/react';
+import { HeadingSize } from '../../../../Typography';
+export interface ModalHeaderProps extends ChakraModalHeaderProps {
     size?: HeadingSize;
 }
-declare const ModalHeader: ({ size, children, ...rest }: ModalHeaderProps) => JSX.Element;
-export default ModalHeader;
+export declare const ModalHeader: ({ size, children, ...rest }: ModalHeaderProps) => JSX.Element;

package/build/components/Overlay/Modal/index.d.ts

@@ -1,2 +1,7 @@
-import Modal from './modal.component';
-export default Modal;
+export * from './modal.types';
+export * from './modal.component';
+export * from './components/ModalHeader/modalHeader.component';
+export * from './components/ModalCloseButton/modalCloseButton.component';
+export * from './components/ModalBody/modalBody.component';
+export * from './components/ModalFooter/modalFooter.component';
+export * from './components/ModalFooterButtons/modalFooterButtons.component';