@useloops/design-system 1.4.189 → 1.4.191

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 import * as _mui_material from '@mui/material';
-import { SxProps, Theme, PaperProps, PopperProps as PopperProps$1, AvatarGroupProps as AvatarGroupProps$1, ButtonProps as ButtonProps$1, CheckboxProps as CheckboxProps$1, ContainerProps, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, FormControlLabelProps as FormControlLabelProps$1, Breakpoint, TypographyProps as TypographyProps$1, TooltipProps as TooltipProps$1, IconButtonProps as IconButtonProps$1, ButtonGroupProps, TextFieldProps as TextFieldProps$1, LinkProps as LinkProps$1, ClickAwayListenerProps, FadeProps, LinearProgressProps, SelectProps as SelectProps$1, SelectChangeEvent, SwitchProps as SwitchProps$1, PaletteMode, Direction } from '@mui/material';
+import { SxProps, Theme, PaperProps, PopperProps as PopperProps$1, AvatarGroupProps as AvatarGroupProps$1, ButtonProps as ButtonProps$1, CheckboxProps as CheckboxProps$1, ContainerProps, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, FormControlLabelProps as FormControlLabelProps$1, Breakpoint, TypographyProps as TypographyProps$1, TooltipProps as TooltipProps$1, IconButtonProps as IconButtonProps$1, CSSObject, ButtonGroupProps, TextFieldProps as TextFieldProps$1, LinkProps as LinkProps$1, ClickAwayListenerProps, FadeProps, LinearProgressProps, SelectProps as SelectProps$1, SelectChangeEvent, SwitchProps as SwitchProps$1, SkeletonProps as SkeletonProps$1, PaletteMode, Direction } from '@mui/material';
 import react, { FunctionComponent, PropsWithChildren, FC, ReactNode, ReactElement, ChangeEvent, Dispatch, SetStateAction } from 'react';
+import { PopupState } from 'material-ui-popup-state/hooks';
 import { SubmitHandler } from 'react-hook-form';
 import { Theme as Theme$1 } from '@mui/material/styles';
 import { NumericFormatProps } from 'react-number-format';
@@ -10,7 +11,6 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { UniqueIdentifier } from '@dnd-kit/core';
 import { Mark } from '@mui/material/Slider/useSlider.types';
 import { LazyLoadImageProps } from 'react-lazy-load-image-component';
-import { PopupState } from 'material-ui-popup-state/hooks';
 
 interface ColorRange$1 {
     0: string;
@@ -507,7 +507,7 @@ interface IconProps {
 }
 declare const Icon: FunctionComponent<IconProps>;
 
-type IconName = 'brand-wordmark' | 'brand-logomark' | 'menu' | 'menu-open' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'arrow-left' | 'arrow-right' | 'search' | 'close' | 'more-horizontal' | 'more-vertical' | 'home' | 'home-filled' | 'settings' | 'controls' | 'help' | 'filter-list' | 'open-in-new' | 'nav-toggle' | 'nav-collapse' | 'nav-expand' | 'play-circle' | 'play-video' | 'email' | 'document' | 'folder' | 'attach-file' | 'photo-add' | 'upload' | 'upload-cloud' | 'time' | 'time-filled' | 'zoom-in' | 'zoom-out' | 'add' | 'remove' | 'test' | 'dashboard' | 'list-view' | 'grid-view' | 'grid-view-filled' | 'eye' | 'eye-off' | 'notification' | 'pound' | 'euro' | 'dollar' | 'send' | 'comment' | 'chat' | 'error' | 'warning' | 'lightbulb' | 'check-circle' | 'thumb-up' | 'info' | 'info-filled' | 'cancel' | 'compress' | 'expand' | 'unfold' | 'drag-handle' | 'focus' | 'lock' | 'copy' | 'edit' | 'delete' | 'check' | 'star' | 'star-half' | 'star-filled' | 'ai' | 'work' | 'gift' | 'social-medium-single-colour' | 'social-linkedin-single-colour' | 'social-youtube-single-colour' | 'social-linkedin-full-colour' | 'social-google-full-colour' | 'badge-tick' | 'badge-tick-in-circle' | 'badge-cross' | 'badge-cross-in-circle' | 'badge-hyphen' | 'badge-hyphen-in-circle' | 'badge-question' | 'badge-question-in-circle';
+type IconName = 'brand-wordmark' | 'brand-logomark' | 'menu' | 'menu-open' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'arrow-left' | 'arrow-right' | 'search' | 'close' | 'more-horizontal' | 'more-vertical' | 'home' | 'home-filled' | 'settings' | 'controls' | 'help' | 'filter-list' | 'open-in-new' | 'nav-toggle' | 'nav-collapse' | 'nav-expand' | 'play-circle' | 'play-video' | 'email' | 'document' | 'folder' | 'attach-file' | 'photo-add' | 'upload' | 'upload-cloud' | 'time' | 'time-filled' | 'zoom-in' | 'zoom-out' | 'add' | 'remove' | 'test' | 'dashboard' | 'list-view' | 'grid-view' | 'grid-view-filled' | 'eye' | 'eye-off' | 'notification' | 'pound' | 'euro' | 'dollar' | 'send' | 'comment' | 'chat' | 'error' | 'warning' | 'lightbulb' | 'check-circle' | 'thumb-up' | 'info' | 'info-filled' | 'cancel' | 'compress' | 'expand' | 'unfold' | 'drag-handle' | 'focus' | 'lock' | 'copy' | 'edit' | 'delete' | 'check' | 'alert-dot' | 'star' | 'star-half' | 'star-filled' | 'ai' | 'work' | 'gift' | 'social-medium-single-colour' | 'social-linkedin-single-colour' | 'social-youtube-single-colour' | 'social-linkedin-full-colour' | 'social-google-full-colour' | 'badge-tick' | 'badge-tick-in-circle' | 'badge-cross' | 'badge-cross-in-circle' | 'badge-hyphen' | 'badge-hyphen-in-circle' | 'badge-question' | 'badge-question-in-circle';
 
 interface CustomTheme {
     palette: {
@@ -692,6 +692,8 @@ interface NavigationButtonProps {
     danger?: boolean;
     fullWidth?: boolean;
     href?: string;
+    target?: '_blank' | '_self' | '_parent' | '_top';
+    external?: boolean;
     icon?: IconName;
     label?: string;
     navigationSizing?: NavigationSizing;
@@ -703,6 +705,7 @@ declare const NavigationButton: FunctionComponent<NavigationButtonProps>;
 interface MenuItemProps {
     active?: boolean;
     children?: MenuItemProps[];
+    baseState?: PopupState;
     closeOnClick?: boolean;
     danger?: boolean;
     divider?: boolean;
@@ -729,7 +732,7 @@ declare const UserMenu: FunctionComponent<UserMenuProps>;
 type NavigationSizing = 'sm' | 'lg';
 interface NavigationProps {
     isMobile?: boolean;
-    logoLink?: string;
+    logoLink?: () => void;
     nudgeProps?: NudgeProps$1;
     primaryMenuItemProps?: NavigationButtonProps[];
     secondaryMenuItemProps?: NavigationButtonProps[];
@@ -815,6 +818,7 @@ declare const Projects: FunctionComponent<ProjectsProps>;
 
 interface SectionHeaderProps {
     buttons?: ReactNode;
+    loading?: boolean;
     subtitle?: string;
     title?: string;
 }
@@ -1117,6 +1121,7 @@ declare const FormGenerator: FormGeneratorProps;
 
 interface GridOverlayProps {
     breakpoint?: Breakpoint;
+    position?: 'fixed' | 'absolute';
 }
 declare const GridOverlay: FunctionComponent<GridOverlayProps>;
 
@@ -1179,6 +1184,41 @@ interface IconButtonProps {
 }
 declare const IconButton: ({ icon, loading, tooltipMessage, sizing, slotProps, ...rest }: IconButtonProps) => react_jsx_runtime.JSX.Element;
 
+declare const defaultStyle: (theme: Theme) => CSSObject;
+declare const toggle: (theme: Theme) => CSSObject;
+declare const outlined: (theme: Theme) => CSSObject;
+declare const raised: (theme: Theme) => CSSObject;
+declare const getIconButtonRadius: (shape: IconButtonShapeMap, theme: Theme) => CSSObject;
+declare const buttonSizeMap: {
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+};
+declare const getIconButtonSizing: (sizing: IconButtonSizing) => CSSObject;
+declare const IconSizeMap: {
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+};
+declare const getIconSizing: (sizing: IconButtonSizing) => CSSObject;
+
+declare const IconButton_variantHelpers_IconSizeMap: typeof IconSizeMap;
+declare const IconButton_variantHelpers_buttonSizeMap: typeof buttonSizeMap;
+declare const IconButton_variantHelpers_defaultStyle: typeof defaultStyle;
+declare const IconButton_variantHelpers_getIconButtonRadius: typeof getIconButtonRadius;
+declare const IconButton_variantHelpers_getIconButtonSizing: typeof getIconButtonSizing;
+declare const IconButton_variantHelpers_getIconSizing: typeof getIconSizing;
+declare const IconButton_variantHelpers_outlined: typeof outlined;
+declare const IconButton_variantHelpers_raised: typeof raised;
+declare const IconButton_variantHelpers_toggle: typeof toggle;
+declare namespace IconButton_variantHelpers {
+  export { IconButton_variantHelpers_IconSizeMap as IconSizeMap, IconButton_variantHelpers_buttonSizeMap as buttonSizeMap, IconButton_variantHelpers_defaultStyle as defaultStyle, IconButton_variantHelpers_getIconButtonRadius as getIconButtonRadius, IconButton_variantHelpers_getIconButtonSizing as getIconButtonSizing, IconButton_variantHelpers_getIconSizing as getIconSizing, IconButton_variantHelpers_outlined as outlined, IconButton_variantHelpers_raised as raised, IconButton_variantHelpers_toggle as toggle };
+}
+
 interface IconButtonGroupProps extends PropsWithChildren {
     ButtonGroupProps?: ButtonGroupProps;
     variation?: 'default' | 'toggle';
@@ -1542,6 +1582,18 @@ interface ToastProps {
 }
 declare const Toast: FunctionComponent<ToastProps>;
 
+interface SkeletonProps {
+    animation?: SkeletonProps$1['animation'];
+    children?: SkeletonProps$1['children'];
+    height?: SkeletonProps$1['height'];
+    sx?: SkeletonProps$1['sx'];
+    variant?: SkeletonProps$1['variant'];
+    width?: SkeletonProps$1['width'];
+    component?: SkeletonProps$1['component'];
+    ref?: SkeletonProps$1['ref'];
+}
+declare const Skeleton: FunctionComponent<SkeletonProps>;
+
 type SupportedCurrency = 'gbp' | 'eur' | 'usd';
 type SupportedFrequency = 'monthly' | 'annual';
 interface AnnualControllerProps {
@@ -1965,4 +2017,4 @@ declare module '@mui/system' {
     }
 }
 
-export { AnnualController, type AnnualControllerProps, AuthContainerSurface, AuthFormHeader, type AuthFormHeaderProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbProps, type BreakpointOrNull, Button, type ButtonProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ColorBackgroundContainer, type ColorBackgroundContainerProps, type ColorRange$1 as ColorRange, type ColorRangeAlpha$1 as ColorRangeAlpha, CustomField, type CustomFieldProps, DEFAULT_MAX_INPUT_LENGTH, Differential, type DifferentialProps, DropdownMenu, type FieldType, type FieldTypes, FontWeight, FormControlLabel, FormGenerator, type FormGeneratorConfig, type FormGeneratorHandler, type GenericSizeMap, GridOverlay, type GridOverlayProps, Header, type HeaderProps, Html, HtmlParser, type HtmlParserProps, type HtmlProps, Icon, IconButton, IconButtonGroup, type IconButtonProps, type IconName, Image, type ImageProps, InputFieldBase, type InputFieldBaseProps, InputLabel, InputLabelHelp, type InputLabelHelpProps, type InputLabelProps, Likert, type LikertProps, Link, type LinkProps, Loader, type LoaderProps, Logo, LoopsAiButton, type LoopsAiButtonProps, Markdown, type MarkdownProps, Menu, type MenuProps, Navigation, NavigationButton, type NavigationButtonProps, type NavigationProps, type NavigationSizing, Nudge, type NudgeProps, NumberField, type NumberFieldProps, OnboardingCard, type OnboardingCardProps, type OnboardingItem, Pill, type PillProps, PlanFeatureTable, type PlanFeatureTableProps, PlanTierCard, type PlanTierCardProps, PlanTierCardScale, type PlanTierCardScaleProps, Popper, type PopperProps, PoweredByWatermarkLogo, Progress, ProgressBar, type ProgressBarProps, type ProgressProps, ProjectItem, ProjectItemEmpty, type ProjectItemEmptyProps, type ProjectItemProps, Projects, type ProjectsProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rank, type RankProps, RichTextField, type RichTextFieldProps, SectionHeader, type SectionHeaderProps, Select, type SelectProps, type SemanticColor, Slider, type SliderProps, SortableList, type SortableListProps, StarRating, type StarRatingProps, Surface, type SurfaceProps, Switch, type SwitchProps, TextBarDivider, type TextBarDividerProps, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeProvider, TickGroup, type TickGroupProps, Toast, type ToastProps, Tooltip, type TooltipProps, Typography, type TypographyProps, UserMenu, type UserMenuProps, backgroundCreator, base, blue, blueRamp, boxShadow, breakpoints, chooseArticle, compareArrayMembers, darkNeutral, darkNeutralAlpha, defaultInputValidation, easing, elevation, elevationFilter, emailValidation, fonts, generateRamp, green, greenRamp, iconSizeMap, margin, neutral, neutralAlpha, neutralRamp, padding, passwordValidation, peach, peachRamp, purple, purpleRamp, radius, red, redRamp, semantic, space, useBreakpoint, useDropdownMenu, usePrevious, useScreenSize, yellow, yellowRamp };
+export { AnnualController, type AnnualControllerProps, AuthContainerSurface, AuthFormHeader, type AuthFormHeaderProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbProps, type BreakpointOrNull, Button, type ButtonProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ColorBackgroundContainer, type ColorBackgroundContainerProps, type ColorRange$1 as ColorRange, type ColorRangeAlpha$1 as ColorRangeAlpha, CustomField, type CustomFieldProps, DEFAULT_MAX_INPUT_LENGTH, Differential, type DifferentialProps, DropdownMenu, type FieldType, type FieldTypes, FontWeight, FormControlLabel, FormGenerator, type FormGeneratorConfig, type FormGeneratorHandler, type GenericSizeMap, GridOverlay, type GridOverlayProps, Header, type HeaderProps, Html, HtmlParser, type HtmlParserProps, type HtmlProps, Icon, IconButton, IconButtonGroup, type IconButtonProps, type IconName, Image, type ImageProps, InputFieldBase, type InputFieldBaseProps, InputLabel, InputLabelHelp, type InputLabelHelpProps, type InputLabelProps, Likert, type LikertProps, Link, type LinkProps, Loader, type LoaderProps, Logo, LoopsAiButton, type LoopsAiButtonProps, Markdown, type MarkdownProps, Menu, type MenuProps, Navigation, NavigationButton, type NavigationButtonProps, type NavigationProps, type NavigationSizing, Nudge, type NudgeProps, NumberField, type NumberFieldProps, OnboardingCard, type OnboardingCardProps, type OnboardingItem, Pill, type PillProps, PlanFeatureTable, type PlanFeatureTableProps, PlanTierCard, type PlanTierCardProps, PlanTierCardScale, type PlanTierCardScaleProps, Popper, type PopperProps, PoweredByWatermarkLogo, Progress, ProgressBar, type ProgressBarProps, type ProgressProps, ProjectItem, ProjectItemEmpty, type ProjectItemEmptyProps, type ProjectItemProps, Projects, type ProjectsProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rank, type RankProps, RichTextField, type RichTextFieldProps, SectionHeader, type SectionHeaderProps, Select, type SelectProps, type SemanticColor, Skeleton, type SkeletonProps, Slider, type SliderProps, SortableList, type SortableListProps, StarRating, type StarRatingProps, Surface, type SurfaceProps, Switch, type SwitchProps, TextBarDivider, type TextBarDividerProps, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeProvider, TickGroup, type TickGroupProps, Toast, type ToastProps, Tooltip, type TooltipProps, Typography, type TypographyProps, UserMenu, type UserMenuProps, backgroundCreator, base, blue, blueRamp, boxShadow, breakpoints, chooseArticle, compareArrayMembers, darkNeutral, darkNeutralAlpha, defaultInputValidation, easing, elevation, elevationFilter, emailValidation, fonts, generateRamp, green, greenRamp, IconButton_variantHelpers as iconButtonHelpers, iconSizeMap, margin, neutral, neutralAlpha, neutralRamp, padding, passwordValidation, peach, peachRamp, purple, purpleRamp, radius, red, redRamp, semantic, space, useBreakpoint, useDropdownMenu, usePrevious, useScreenSize, yellow, yellowRamp };