@televet/kibble-ui 1.9.0 → 1.9.1-beta.2f7t8wk.1

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

@@ -0,0 +1,26 @@
+import { AvatarProps as CAvatarProps, Placement } from '@chakra-ui/react';
+import { CSSProperties } from 'react';
+import { AvatarSize } from './avatar.types';
+export declare enum AvatarVariant {
+    Green = "green",
+    Red = "red",
+    Blue = "blue",
+    Comet = "comet",
+    Number = "number",
+    Dashed = "dashed",
+    Image = "image"
+}
+export interface AvatarProps extends CAvatarProps {
+    name: string;
+    size?: AvatarSize;
+    isClinic?: boolean;
+    showTooltip?: boolean;
+    tooltipPlacement?: Placement;
+    style?: CSSProperties;
+    handleClick?: () => void;
+    showRemoveButton?: boolean;
+    handleRemoveButtonClick?: () => void;
+    variant?: AvatarVariant;
+    tooltipText?: string;
+}
+export declare const Avatar: ({ name, src, isClinic, size, showTooltip, tooltipPlacement, style, handleClick, showRemoveButton, handleRemoveButtonClick, variant, tooltipText, ...rest }: AvatarProps) => JSX.Element;

package/build/components/Avatar/avatar.config.d.ts

@@ -0,0 +1,2 @@
+import { ComponentStyleConfig } from '@chakra-ui/react';
+export declare const AvatarConfig: ComponentStyleConfig;

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

@@ -0,0 +1 @@
+export declare type AvatarSize = 'xs' | 'sm' | 'md' | 'lg';

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

@@ -0,0 +1,3 @@
+export * from './avatar.component';
+export * from './avatar.types';
+export * from './avatar.config';

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

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

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

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

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

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

package/build/components/Button/button.component.d.ts

@@ -0,0 +1,13 @@
+import React, { ReactNode } from 'react';
+import { ButtonProps as ChakraButtonProps } from '@chakra-ui/react';
+import { IconName } from '../Icon';
+import { ButtonSizeType, ButtonVariantType } from './button.types';
+export interface ButtonProps extends ChakraButtonProps {
+    children?: ReactNode;
+    variant?: ButtonVariantType;
+    size?: ButtonSizeType;
+    iconName?: IconName;
+    iconPosition?: 'left' | 'right';
+    darkMode?: boolean;
+}
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/build/components/Button/button.config.d.ts

@@ -0,0 +1,16 @@
+import { ButtonStyleType } from './button.types';
+export declare const ButtonVariantConfig: ButtonStyleType;
+export declare const ButtonSizeConfig: {
+    lg: {
+        p: string;
+    };
+    md: {
+        p: string;
+    };
+    sm: {
+        p: string;
+    };
+    xs: {
+        p: string;
+    };
+};

package/build/components/Button/button.model.d.ts

@@ -0,0 +1,5 @@
+import { ButtonColorOptions } from './button.types';
+import { AdaptiveColorMap } from '../../theme/tokens';
+export interface ButtonVariantConfig extends AdaptiveColorMap<ButtonColorOptions> {
+    variant: 'solid' | 'outline' | 'ghost';
+}

package/build/components/Button/button.records.d.ts

@@ -0,0 +1,2 @@
+import { ButtonStyleConfig } from './button.types';
+export declare const ButtonConfig: ButtonStyleConfig;

package/build/components/Button/button.types.d.ts

@@ -0,0 +1,8 @@
+import { AdaptiveColorMap } from '../../theme/tokens';
+export interface ButtonVariantConfigType extends AdaptiveColorMap<ButtonColorOptionsType> {
+    variant: 'solid' | 'outline' | 'ghost';
+}
+export declare type ButtonVariantType = 'primary' | 'primaryDestructive' | 'secondary' | 'secondaryDestructive' | 'secondarySubtle' | 'secondarySubtleDestructive' | 'tertiary' | 'tertiaryDestructive' | 'ghost' | 'ghostNeutral' | 'ghostDestructive';
+export declare type ButtonColorOptionsType = 'content' | 'default' | 'hover' | 'active' | 'border';
+export declare type ButtonSizeType = 'xs' | 'sm' | 'md' | 'lg';
+export declare type ButtonStyleType = Record<ButtonVariantType, ButtonVariantConfigType>;

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

@@ -0,0 +1,3 @@
+export * from './button.component';
+export * from './button.types';
+export * from './button.config';

package/build/components/Drawer/drawer.config.d.ts

@@ -0,0 +1,13 @@
+export declare const DrawerConfig: {
+    variants: {
+        alwaysOpen: {
+            parts: string[];
+            dialog: {
+                pointerEvents: string;
+            };
+            dialogContainer: {
+                pointerEvents: string;
+            };
+        };
+    };
+};

package/build/components/Drawer/drawer.records.d.ts

@@ -0,0 +1,13 @@
+export declare const DrawerConfig: {
+    variants: {
+        alwaysOpen: {
+            parts: string[];
+            dialog: {
+                pointerEvents: string;
+            };
+            dialogContainer: {
+                pointerEvents: string;
+            };
+        };
+    };
+};

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

@@ -0,0 +1 @@
+export * from './drawer.config';

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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { IconColor, IconName, IconsSize } from './icon.types';
+export interface IconProps {
+    name: IconName;
+    size?: IconsSize;
+    color?: IconColor;
+}
+export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<any>>;

package/build/components/Icon/icon.records.d.ts

@@ -0,0 +1,3 @@
+import { IconName, IconsSize } from './icon.types';
+export declare const IconMap: Record<IconName, any>;
+export declare const IconSizeMap: Record<IconsSize, number>;

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

@@ -0,0 +1,3 @@
+export declare type IconName = 'alertCircle' | 'animalBird' | 'animalCat' | 'animalCow' | 'animalDog' | 'animalHorse' | 'arrowCircle' | 'arrowDown' | 'arrowDownRight' | 'arrowLeft' | 'arrowRight' | 'arrowUp' | 'arrowsIn' | 'arrowsOut' | 'article' | 'asterisk' | 'bell' | 'bellRinging' | 'bookmarkFilled' | 'bookmarkOutlined' | 'brush' | 'bulkSelect' | 'caduceus' | 'calendarDate' | 'calendarCheck' | 'calendarInfo' | 'calendarPen' | 'calendarOutlined' | 'camera' | 'cameraFlip' | 'cameraOff' | 'cancel' | 'cellphone' | 'cellphoneAlert' | 'chainLink' | 'chatBubbleFilled' | 'chatBubbleOutlined' | 'checkmark' | 'checkmarkBox' | 'checkmarkCircle' | 'checkmarkList' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUp' | 'chevronUpDown' | 'circleDotted' | 'clock' | 'close' | 'closeCircle' | 'code' | 'conversation' | 'creditCardHand' | 'crossClipboard' | 'crossPaw' | 'crossHatPerson' | 'dogHouse' | 'dogHouseOutlined' | 'dollar' | 'dollarCircle' | 'dotsCircle' | 'dotsHorizontal' | 'dotsVertical' | 'doubleArrowCircle' | 'download' | 'dragDrop' | 'emailSend' | 'envelopeFilled' | 'envelopeOutlined' | 'eyedropper' | 'eyeOpen' | 'eyeSlash' | 'externalLink' | 'faceScreen' | 'formsFilled' | 'formsOutlined' | 'funnelFilled' | 'funnelOutlined' | 'gear' | 'grid' | 'horizontalLines' | 'house' | 'infoCircleFilled' | 'infoCircleOutlined' | 'input' | 'invoice' | 'invoiceOutlined' | 'kanbanBoard' | 'largeTextInput' | 'list' | 'locationMarker' | 'locationMarkerGround' | 'lockRectangle' | 'lockRound' | 'loudspeaker' | 'magnifyingGlass' | 'mailbox' | 'manHeadset' | 'message' | 'messages' | 'messageClipboard' | 'messageEllipses' | 'messageGear' | 'messageLink' | 'microphone' | 'microphoneMute' | 'minus' | 'moveLeft' | 'moveRight' | 'multipleChoice' | 'notification' | 'paperAirplane' | 'paperAirplane2' | 'paperAirplaneRight' | 'paperclip' | 'paperPen' | 'paw' | 'paw2' | 'pawMagnifyingGlass' | 'pawOutlined' | 'pdfLogo' | 'pen' | 'penSquare' | 'person' | 'personAdd' | 'phone' | 'phoneButtons' | 'phoneDown' | 'phoneRing' | 'pill' | 'pillHand' | 'playingCards' | 'plus' | 'questionMark' | 'questionMarkCircle' | 'quilInk' | 'reactLogo' | 'record' | 'report' | 'robot' | 'smileyFace' | 'smileyFacePlus' | 'star' | 'star2' | 'star2Outlined' | 'starCircle' | 'team' | 'textEdit' | 'thumbsUp' | 'trashcan' | 'twoSquares' | 'upload' | 'videoCamera' | 'warningSign' | 'website';
+export declare type IconsSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+export declare type IconColor = 'default' | 'subtle' | 'inactive' | 'active' | 'success' | 'warning' | 'error' | 'currentColor';

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

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

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

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

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

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { LogoHoliday, LogoType, LogoColor } from './logo.types';
+export interface ILogoProps {
+    type?: LogoType;
+    color?: LogoColor;
+    holiday?: LogoHoliday;
+    height?: number;
+    width?: number;
+    handleClick?: () => void;
+}
+export declare const Logo: {
+    ({ type, color, holiday, height, width, handleClick, }: ILogoProps): JSX.Element;
+    displayName: string;
+};

package/build/components/Logo/logo.config.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { Props } from 'framer-motion/types/types';
+import { LogoColor, LogoHoliday } from './logo.types';
+export declare const holidaysLogoIconMap: Record<LogoHoliday, React.FC<Props>>;
+export declare const logoIconMap: Record<LogoColor, React.FC<Props>>;
+export declare const fullLogoMap: Record<LogoColor, React.FC<Props>>;

package/build/components/Logo/logo.types.d.ts

@@ -0,0 +1,3 @@
+export declare type LogoHoliday = 'newYears' | 'valentines' | 'stPatricks' | 'easter1' | 'easter2' | 'easter3' | 'easter4' | 'easter5' | 'easter6' | 'mothersDay' | 'memorialDay' | 'fathersDay' | 'halloween' | 'thanksgiving' | 'christmas';
+export declare type LogoType = 'full' | 'icon';
+export declare type LogoColor = 'teal' | 'black' | 'white';

package/build/components/Logo/logos.d.ts

@@ -0,0 +1,22 @@
+import { ReactComponent as TealLogo } from '../../assets/logos/teal.svg';
+import { ReactComponent as TealLogoIcon } from '../../assets/logos/tealIcon.svg';
+import { ReactComponent as BlackLogo } from '../../assets/logos/black.svg';
+import { ReactComponent as BlackLogoIcon } from '../../assets/logos/blackIcon.svg';
+import { ReactComponent as WhiteLogo } from '../../assets/logos/white.svg';
+import { ReactComponent as WhiteLogoIcon } from '../../assets/logos/whiteIcon.svg';
+import { ReactComponent as NewYearsLogoIcon } from '../../assets/logos/holidays/newYears.svg';
+import { ReactComponent as ValentinesLogoIcon } from '../../assets/logos/holidays/valentines.svg';
+import { ReactComponent as StPatricksLogoIcon } from '../../assets/logos/holidays/stPatricks.svg';
+import { ReactComponent as Easter1LogoIcon } from '../../assets/logos/holidays/easter1.svg';
+import { ReactComponent as Easter2LogoIcon } from '../../assets/logos/holidays/easter2.svg';
+import { ReactComponent as Easter3LogoIcon } from '../../assets/logos/holidays/easter3.svg';
+import { ReactComponent as Easter4LogoIcon } from '../../assets/logos/holidays/easter4.svg';
+import { ReactComponent as Easter5LogoIcon } from '../../assets/logos/holidays/easter5.svg';
+import { ReactComponent as Easter6LogoIcon } from '../../assets/logos/holidays/easter6.svg';
+import { ReactComponent as MothersDayLogoIcon } from '../../assets/logos/holidays/mothersDay.svg';
+import { ReactComponent as MemorialDayLogoIcon } from '../../assets/logos/holidays/memorialDay.svg';
+import { ReactComponent as FathersDayLogoIcon } from '../../assets/logos/holidays/fathersDay.svg';
+import { ReactComponent as HalloweenLogoIcon } from '../../assets/logos/holidays/halloween.svg';
+import { ReactComponent as ThanksgivingLogoIcon } from '../../assets/logos/holidays/thanksgiving.svg';
+import { ReactComponent as ChristmasLogoIcon } from '../../assets/logos/holidays/christmas.svg';
+export { TealLogo, TealLogoIcon, BlackLogo, BlackLogoIcon, WhiteLogo, WhiteLogoIcon, NewYearsLogoIcon, ValentinesLogoIcon, StPatricksLogoIcon, Easter1LogoIcon, Easter2LogoIcon, Easter3LogoIcon, Easter4LogoIcon, Easter5LogoIcon, Easter6LogoIcon, MothersDayLogoIcon, MemorialDayLogoIcon, FathersDayLogoIcon, HalloweenLogoIcon, ThanksgivingLogoIcon, ChristmasLogoIcon, };

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

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

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/Modal/index.d.ts

@@ -0,0 +1,2 @@
+export * from './modal.component';
+export * from './modal.types';

package/build/components/Modal/modal-section.component.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+interface props {
+    children: ReactNode;
+    alignContent?: 'left' | 'right';
+}
+export declare const ModalSection: ({ children, alignContent }: props) => JSX.Element;
+export {};

package/build/components/Modal/modal.component.d.ts

@@ -0,0 +1,24 @@
+import React, { ReactNode } from 'react';
+import { ModalProps as ChakraModalProps } from '@chakra-ui/react';
+import { BlurAmount } from '../../theme/tokens';
+import { FocusableElement } from '@chakra-ui/utils';
+import { ModalSize } from './modal.types';
+declare type ResponsiveBreakpoints = 'base' | 'md';
+export interface ModalProps extends ChakraModalProps {
+    title?: string;
+    children: ReactNode;
+    footer?: ReactNode;
+    isOpen: boolean;
+    onClose: () => void;
+    modalSize?: Partial<Record<ResponsiveBreakpoints, ModalSize>>;
+    allowEscape?: boolean;
+    useDefaultCloseButton?: boolean;
+    overlayBlur?: BlurAmount;
+    overlayHueShift?: number;
+    overlayBase?: 'whiteAlpha' | 'blackAlpha';
+    darkMode?: boolean;
+    initialFocusRef: React.RefObject<FocusableElement>;
+    scrollBehavior?: 'inside' | 'outside';
+}
+export declare const Modal: ({ title, children, footer, isOpen, onClose, modalSize, overlayBlur, allowEscape, useDefaultCloseButton, initialFocusRef, scrollBehavior, overlayHueShift, overlayBase, darkMode, ...rest }: ModalProps) => JSX.Element;
+export {};

package/build/components/Modal/modal.types.d.ts

@@ -0,0 +1 @@
+export declare type ModalSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full';

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

@@ -0,0 +1,7 @@
+export * from './modal.types';
+export * as BetaModal from './modal.component';
+export * from './modalHeader.component';
+export * from './modalCloseButton.component';
+export * from './modalBody.component';
+export * from './modalFooter.component';
+export * from './modalFooterButtons.component';

package/build/components/Overlay/Modal/modal.component.d.ts

@@ -0,0 +1,18 @@
+import React, { ReactNode } from 'react';
+import { ModalProps as ChakraModalProps } from '@chakra-ui/react';
+import { FocusableElement } from '@chakra-ui/utils';
+import { ModalSize } from './modal.types';
+declare type ResponsiveBreakpoints = 'base' | 'md';
+export interface ModalProps extends ChakraModalProps {
+    children: ReactNode;
+    isCentered?: boolean;
+    responsiveModalSizes?: Partial<Record<ResponsiveBreakpoints, ModalSize>>;
+    allowEscape?: boolean;
+    useFullScreenMobile?: boolean;
+    darkMode?: boolean;
+    initialFocusRef?: React.RefObject<FocusableElement>;
+    scrollBehavior?: 'inside' | 'outside';
+    size?: string;
+}
+export declare const Modal: ({ children, isOpen, onClose, isCentered, responsiveModalSizes, allowEscape, useFullScreenMobile, initialFocusRef, scrollBehavior, darkMode, size, ...rest }: ModalProps) => JSX.Element;
+export {};

package/build/components/Overlay/Modal/modal.types.d.ts

@@ -0,0 +1 @@
+export declare type ModalSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full';

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

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

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

@@ -0,0 +1,2 @@
+import { ButtonProps } from '../../Forms';
+export declare const ModalCloseButton: ({ right, left, size, ...rest }: ButtonProps) => JSX.Element;

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

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

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

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

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

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

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

@@ -1,3 +1,4 @@
 export * from './Drawer';
 export * from './Tooltip';
 export * from './Menu';
+export * from './Modal';

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

@@ -0,0 +1,3 @@
+export * from './textarea.component';
+export * from './textarea.types';
+export * from './textarea.config';

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

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TextareaProps as CTextareaProps } from '@chakra-ui/react';
+export interface TextareaProps extends CTextareaProps {
+}
+export declare const Textarea: (props: TextareaProps) => JSX.Element;

package/build/components/Textarea/textarea.config.d.ts

@@ -0,0 +1,2 @@
+import { ComponentStyleConfig } from '@chakra-ui/react';
+export declare const TextareaConfig: ComponentStyleConfig;

package/build/components/Textarea/textarea.types.d.ts

@@ -0,0 +1,2 @@
+export declare type TextareaSize = 'sm' | 'md' | 'lg';
+export declare type TextareaResizeOrientation = 'horizontal' | 'vertical' | 'none';

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

@@ -0,0 +1,3 @@
+export * from './tooltip.component';
+export * from './tooltip.types';
+export * from './tooltip.config';

package/build/components/Tooltip/tooltip.component.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { PlacementWithLogical, TooltipProps as ChakraTooltipProps } from '@chakra-ui/react';
+export interface TooltipProps extends ChakraTooltipProps {
+    label: string;
+    placement?: PlacementWithLogical;
+    titleCaseLabel?: boolean;
+}
+export declare const Tooltip: ({ children, label, openDelay, placement, titleCaseLabel, ...rest }: TooltipProps) => JSX.Element;

package/build/components/Tooltip/tooltip.config.d.ts

@@ -0,0 +1,8 @@
+import { TooltipStyleConfig } from './tooltip.types';
+export declare const TooltipGlobalStyle: {
+    '[id^=tooltip]': {
+        padding: string;
+        borderRadius: string;
+    };
+};
+export declare const TooltipConfig: TooltipStyleConfig;

package/build/components/Tooltip/tooltip.model.d.ts

@@ -0,0 +1,4 @@
+import { AdaptiveColor } from '../../theme/tokens';
+export interface TooltipStyleConfig {
+    color: AdaptiveColor;
+}

package/build/components/Tooltip/tooltip.records.d.ts

@@ -0,0 +1,9 @@
+import { TooltipStyleConfig } from './tooltip.model';
+export declare const TooltipGlobalStyle: {
+    '[id^=tooltip]': {
+        padding: string;
+        borderRadius: string;
+        textTransform: string;
+    };
+};
+export declare const TooltipConfig: TooltipStyleConfig;

package/build/components/Tooltip/tooltip.types.d.ts

@@ -0,0 +1,4 @@
+import { AdaptiveColor } from '../../theme/tokens';
+export interface TooltipStyleConfig {
+    color: AdaptiveColor;
+}

package/build/components/Typography/Heading/heading.records.d.ts

@@ -0,0 +1,2 @@
+import { HeadingStyleConfig } from './heading.types';
+export declare const HeadingConfig: HeadingStyleConfig;

package/build/components/Typography/Text/text.records.d.ts

@@ -0,0 +1,2 @@
+import { ComponentStyleConfig } from '@chakra-ui/theme';
+export declare const TextConfig: ComponentStyleConfig;

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

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

package/build/components/hocs/withDarkMode.d.ts

@@ -0,0 +1,2 @@
+import { ReactNode } from 'react';
+export declare const withDarkMode: (children: ReactNode, darkMode: boolean) => JSX.Element;

package/build/hooks/index.d.ts

@@ -1 +1,2 @@
 export * from './useTheme';
+export * from './useDisclosure';

package/build/hooks/useDisclosure.d.ts

@@ -0,0 +1 @@
+export { useDisclosure } from '@chakra-ui/react';

package/build/index.js

@@ -115,7 +115,7 @@ var Tag = function (_a) {
 };
 
 var blur = {
-    none: 0,
+    none: '0',
     sm: '4px',
     base: '8px',
     md: '12px',
@@ -6582,6 +6582,68 @@ var BetaMenu = function (_a) {
             React__default["default"].createElement(MenuList, __assign({}, listConfig, { menuItems: menuItems })))));
 };
 
+var withDarkMode$1 = function (children, darkMode) {
+    return darkMode ? React__default["default"].createElement(react.DarkMode, null, children) : React__default["default"].createElement(React__default["default"].Fragment, null, children);
+};
+
+var Modal = function (_a) {
+    var children = _a.children, isOpen = _a.isOpen, onClose = _a.onClose, _b = _a.isCentered, isCentered = _b === void 0 ? true : _b; _a.responsiveModalSizes; var _c = _a.allowEscape, allowEscape = _c === void 0 ? true : _c, _d = _a.useFullScreenMobile, useFullScreenMobile = _d === void 0 ? true : _d, initialFocusRef = _a.initialFocusRef, scrollBehavior = _a.scrollBehavior, darkMode = _a.darkMode, _e = _a.size, size = _e === void 0 ? 'xl' : _e, rest = __rest(_a, ["children", "isOpen", "onClose", "isCentered", "responsiveModalSizes", "allowEscape", "useFullScreenMobile", "initialFocusRef", "scrollBehavior", "darkMode", "size"]);
+    var _f = useTheme(), colors = _f.colors, radii = _f.radii;
+    var adaptiveBackgroundColor = useAdaptiveColor(colors.background);
+    var backgroundColor = !darkMode ? adaptiveBackgroundColor : colors.background.dark;
+    // Responsive values for full screen modals on phones.
+    var fullScreenMobileSize = react.useBreakpointValue({ base: 'full', md: size });
+    var fullScreenMobileBorderRadius = react.useBreakpointValue({ base: 0, md: radii.xl });
+    var fullScreenMobileContentMargin = react.useBreakpointValue({ base: 0, md: 16 });
+    var Modal = (React__default["default"].createElement(react.Modal, __assign({ closeOnEsc: allowEscape, closeOnOverlayClick: allowEscape, autoFocus: !!initialFocusRef, isOpen: isOpen, onClose: onClose, scrollBehavior: scrollBehavior, isCentered: isCentered, size: useFullScreenMobile ? fullScreenMobileSize : size, motionPreset: "slideInBottom" }, rest),
+        React__default["default"].createElement(react.ModalOverlay, null),
+        React__default["default"].createElement(react.ModalContent, { backgroundColor: backgroundColor, m: useFullScreenMobile ? fullScreenMobileContentMargin : 16, borderRadius: useFullScreenMobile ? fullScreenMobileBorderRadius : radii.xl }, children)));
+    return withDarkMode$1(Modal, !!darkMode);
+};
+
+var modal_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    Modal: Modal
+});
+
+var ModalHeader = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? 'md' : _b, children = _a.children, rest = __rest(_a, ["size", "children"]);
+    return (React__default["default"].createElement(react.ModalHeader, __assign({ px: 6, pt: 6, pb: 2 }, rest),
+        React__default["default"].createElement(Heading, { size: size }, children)));
+};
+
+var ModalCloseButton = function (_a) {
+    var _b = _a.right, right = _b === void 0 ? 2 : _b, _c = _a.left, left = _c === void 0 ? 2 : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, rest = __rest(_a, ["right", "left", "size"]);
+    var onClose = react.useModalContext().onClose;
+    return (React__default["default"].createElement(Button, __assign({ variant: "ghostNeutral", onClick: onClose, iconName: "close", position: "absolute", right: right, top: left, size: size }, rest)));
+};
+
+var ModalBody = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return (React__default["default"].createElement(react.ModalBody, __assign({ py: 1 }, rest), children));
+};
+
+var ModalFooter = function (_a) {
+    var children = _a.children, rest = __rest(_a, ["children"]);
+    return (React__default["default"].createElement(react.ModalFooter, __assign({ pb: 6 }, rest), children));
+};
+
+var ModalFooterButtons = function (_a) {
+    var _b = _a.submitText, submitText = _b === void 0 ? 'Submit' : _b, isLoading = _a.isLoading, isDestructive = _a.isDestructive; _a.children; var onSubmit = _a.onSubmit, _c = _a.allowCancel, allowCancel = _c === void 0 ? true : _c, onCancel = _a.onCancel, rest = __rest(_a, ["submitText", "isLoading", "isDestructive", "children", "onSubmit", "allowCancel", "onCancel"]);
+    var onClose = react.useModalContext().onClose;
+    var handleCancel = function () {
+        if (onCancel) {
+            onCancel();
+        }
+        onClose();
+    };
+    return (React__default["default"].createElement(react.ModalFooter, __assign({}, rest, { pb: 6 }),
+        React__default["default"].createElement(react.Flex, { w: "100%" },
+            allowCancel && (React__default["default"].createElement(Button, { variant: "tertiary", onClick: handleCancel }, "Cancel")),
+            React__default["default"].createElement(react.Spacer, null),
+            React__default["default"].createElement(Button, { onClick: onSubmit, isLoading: isLoading, variant: isDestructive ? 'primaryDestructive' : 'primary' }, submitText))));
+};
+
 // @ts-ignore
 var theme = react.extendTheme({
     styles: {
@@ -9400,6 +9462,10 @@ Object.defineProperty(exports, 'WrapItem', {
     enumerable: true,
     get: function () { return react.WrapItem; }
 });
+Object.defineProperty(exports, 'useDisclosure', {
+    enumerable: true,
+    get: function () { return react.useDisclosure; }
+});
 Object.defineProperty(exports, 'useRadioGroup', {
     enumerable: true,
     get: function () { return react.useRadioGroup; }
@@ -9412,6 +9478,7 @@ exports.Avatar = Avatar;
 exports.AvatarConfig = AvatarConfig;
 exports.AvatarGroup = AvatarGroup;
 exports.BetaMenu = BetaMenu;
+exports.BetaModal = modal_component;
 exports.Button = Button;
 exports.ButtonSizeConfig = ButtonSizeConfig;
 exports.ButtonVariantConfig = ButtonVariantConfig;
@@ -9424,6 +9491,11 @@ exports.Logo = Logo;
 exports.MenuConfig = MenuConfig;
 exports.MenuContext = MenuContext;
 exports.MenuItemConfig = MenuItemConfig;
+exports.ModalBody = ModalBody;
+exports.ModalCloseButton = ModalCloseButton;
+exports.ModalFooter = ModalFooter;
+exports.ModalFooterButtons = ModalFooterButtons;
+exports.ModalHeader = ModalHeader;
 exports.NotificationCounter = NotificationCounter;
 exports.Radio = Radio;
 exports.RadioConfig = RadioConfig;