@useloops/design-system 1.4.295 → 1.4.297

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.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react from 'react';
2
- import react__default, { FunctionComponent, Dispatch, SetStateAction, ReactElement, PropsWithChildren, ChangeEvent, FC, ReactNode } from 'react';
2
+ import react__default, { FunctionComponent, Dispatch, SetStateAction, ReactNode, ReactElement, PropsWithChildren, ChangeEvent, FC } from 'react';
3
3
  import * as _mui_material from '@mui/material';
4
- import { SxProps, Theme, CSSObject, AvatarProps as AvatarProps$1, AvatarGroupProps as AvatarGroupProps$1, LinkProps as LinkProps$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, IconButtonProps as IconButtonProps$1, TooltipProps as TooltipProps$1, BoxProps, ButtonGroupProps, TextFieldProps as TextFieldProps$1, PaperProps, PopperProps as PopperProps$1, ClickAwayListenerProps, FadeProps, LinearProgressProps, SelectProps as SelectProps$1, SelectChangeEvent, SkeletonProps as SkeletonProps$1, SwitchProps as SwitchProps$1, ChipProps as ChipProps$1, PaletteMode, Direction } from '@mui/material';
4
+ import { SxProps, Theme, CSSObject, AvatarProps as AvatarProps$1, AvatarGroupProps as AvatarGroupProps$1, LinkProps as LinkProps$1, ButtonProps as ButtonProps$1, CheckboxProps as CheckboxProps$1, ContainerProps, MenuProps as MenuProps$1, MenuItemProps as MenuItemProps$1, TypographyProps as TypographyProps$1, BoxProps, FormControlLabelProps as FormControlLabelProps$1, Breakpoint, IconButtonProps as IconButtonProps$1, TooltipProps as TooltipProps$1, ButtonGroupProps, TextFieldProps as TextFieldProps$1, PaperProps, PopperProps as PopperProps$1, ClickAwayListenerProps, FadeProps, LinearProgressProps, SelectProps as SelectProps$1, SelectChangeEvent, SkeletonProps as SkeletonProps$1, SwitchProps as SwitchProps$1, ChipProps as ChipProps$1, PaletteMode, Direction } from '@mui/material';
5
5
  import { PopupState } from 'material-ui-popup-state/hooks';
6
6
  import * as react_jsx_runtime from 'react/jsx-runtime';
7
7
  import { ChipProps } from '@mui/material/Chip';
@@ -897,6 +897,15 @@ interface AnnualControllerProps {
897
897
  }
898
898
  declare const AnnualController: FunctionComponent<AnnualControllerProps>;
899
899
 
900
+ interface AccordionProps {
901
+ heading?: string;
902
+ items?: {
903
+ heading: string;
904
+ body: ReactNode;
905
+ }[];
906
+ }
907
+ declare const Accordion: FunctionComponent<AccordionProps>;
908
+
900
909
  interface AuthFormHeaderProps {
901
910
  logo?: ReactElement | false | undefined;
902
911
  headerText?: string;
@@ -920,6 +929,14 @@ interface BadgeProps extends PropsWithChildren {
920
929
  }
921
930
  declare const Badge: FunctionComponent<BadgeProps>;
922
931
 
932
+ interface BrandBadgeProps {
933
+ color?: 'purple' | 'peach' | 'red' | 'default';
934
+ name: 'emotion-meh' | 'emotion-good' | 'emotion-great' | 'understanding-unknown' | 'understanding-low' | 'understanding-good' | 'understanding-great' | 'property-secure' | 'property-private';
935
+ size?: number;
936
+ sx?: SxProps;
937
+ }
938
+ declare const BrandBadge: FunctionComponent<BrandBadgeProps>;
939
+
923
940
  interface StyledLinkProps extends LinkProps$1 {
924
941
  disabled?: boolean | undefined;
925
942
  }
@@ -953,6 +970,13 @@ interface BreadcrumbProps {
953
970
  }
954
971
  declare const Breadcrumb: FunctionComponent<BreadcrumbProps>;
955
972
 
973
+ interface BulletGraphicProps {
974
+ name: 'placeholder' | 'variant-test' | 'worldwide' | 'celebrate-collaborate' | 'ai' | 'many-media' | 'qual-and-quant' | 'alert' | 'comment';
975
+ size?: number;
976
+ sx?: SxProps;
977
+ }
978
+ declare const BulletGraphic: FunctionComponent<BulletGraphicProps>;
979
+
956
980
  interface ButtonBaseProps extends ButtonProps$1 {
957
981
  loading?: boolean;
958
982
  sizing: ButtonSizing;
@@ -1066,6 +1090,27 @@ declare const useDropdownMenu: () => {
1066
1090
  anchorEl: HTMLElement | null;
1067
1091
  };
1068
1092
 
1093
+ interface TypographyProps extends Omit<TypographyProps$1, 'ref'> {
1094
+ clamp?: number;
1095
+ component: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p';
1096
+ type?: 'default' | 'button';
1097
+ variation?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
1098
+ weight?: 'default' | 'bold';
1099
+ sx?: SxProps<Theme>;
1100
+ }
1101
+ declare const Typography: react.ForwardRefExoticComponent<TypographyProps & react.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
1102
+
1103
+ interface ExpandableTypographyClampProps extends Partial<TypographyProps> {
1104
+ onShowMoreClick?: ButtonProps['onClick'];
1105
+ slotProps?: {
1106
+ gradientBox?: {
1107
+ background?: string | ((theme: Theme) => string);
1108
+ } & BoxProps;
1109
+ showMoreButton?: ButtonProps;
1110
+ };
1111
+ }
1112
+ declare const ExpandableTypographyClamp: react__default.FC<ExpandableTypographyClampProps>;
1113
+
1069
1114
  interface FormControlLabelProps {
1070
1115
  control: FormControlLabelProps$1['control'];
1071
1116
  checked?: boolean;
@@ -1188,16 +1233,6 @@ interface HtmlProps {
1188
1233
  }
1189
1234
  declare const Html: FunctionComponent<HtmlProps>;
1190
1235
 
1191
- interface TypographyProps extends Omit<TypographyProps$1, 'ref'> {
1192
- clamp?: number;
1193
- component: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p';
1194
- type?: 'default' | 'button';
1195
- variation?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
1196
- weight?: 'default' | 'bold';
1197
- sx?: SxProps<Theme>;
1198
- }
1199
- declare const Typography: react.ForwardRefExoticComponent<TypographyProps & react.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
1200
-
1201
1236
  type HtmlParserProps = {
1202
1237
  children: string;
1203
1238
  typographyProps?: Partial<TypographyProps>;
@@ -1272,7 +1307,7 @@ declare const IconButton: react.ForwardRefExoticComponent<Omit<IconButtonProps,
1272
1307
 
1273
1308
  interface IconButtonGroupProps {
1274
1309
  ButtonGroupProps?: ButtonGroupProps;
1275
- variation?: 'default' | 'toggle';
1310
+ variation?: Exclude<IconButtonVariation, 'outlined'>;
1276
1311
  orientation: ButtonGroupProps['orientation'];
1277
1312
  sizing?: IconButtonProps['sizing'];
1278
1313
  iconColor?: string;
@@ -1728,30 +1763,6 @@ interface VideoModalProps {
1728
1763
  }
1729
1764
  declare const VideoModal: FunctionComponent<VideoModalProps>;
1730
1765
 
1731
- interface BrandBadgeProps {
1732
- color?: 'purple' | 'peach' | 'red' | 'default';
1733
- name: 'emotion-meh' | 'emotion-good' | 'emotion-great' | 'understanding-unknown' | 'understanding-low' | 'understanding-good' | 'understanding-great' | 'property-secure' | 'property-private';
1734
- size?: number;
1735
- sx?: SxProps;
1736
- }
1737
- declare const BrandBadge: FunctionComponent<BrandBadgeProps>;
1738
-
1739
- interface BulletGraphicProps {
1740
- name: 'placeholder' | 'variant-test' | 'worldwide' | 'celebrate-collaborate' | 'ai' | 'many-media' | 'qual-and-quant' | 'alert' | 'comment';
1741
- size?: number;
1742
- sx?: SxProps;
1743
- }
1744
- declare const BulletGraphic: FunctionComponent<BulletGraphicProps>;
1745
-
1746
- interface AccordionProps {
1747
- heading?: string;
1748
- items?: {
1749
- heading: string;
1750
- body: ReactNode;
1751
- }[];
1752
- }
1753
- declare const Accordion: FunctionComponent<AccordionProps>;
1754
-
1755
1766
  interface AssetItemProps {
1756
1767
  thumbnail: string;
1757
1768
  size?: 'sm' | 'lg';
@@ -1772,6 +1783,14 @@ interface AuthContainerSurfaceProps extends SurfaceProps {
1772
1783
  }
1773
1784
  declare const AuthContainerSurface: FunctionComponent<AuthContainerSurfaceProps>;
1774
1785
 
1786
+ type FilteredItemsCardProps = {
1787
+ onClickCta: () => void;
1788
+ primaryText?: string;
1789
+ secondaryText?: string;
1790
+ ctaText?: string;
1791
+ };
1792
+ declare const FilteredItemsCard: FunctionComponent<FilteredItemsCardProps>;
1793
+
1775
1794
  interface HeaderProps {
1776
1795
  backAction?: IconButtonProps['onClick'];
1777
1796
  title?: string;
@@ -2173,4 +2192,4 @@ declare module '@mui/system' {
2173
2192
  }
2174
2193
  }
2175
2194
 
2176
- export { Accordion, type AccordionProps, AnnualController, type AnnualControllerProps, AssetItem, type AssetItemProps, AuthContainerSurface, AuthFormHeader, type AuthFormHeaderProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, BrandBadge, type BrandBadgeProps, Breadcrumb, type BreadcrumbProps, type BreakpointOrNull, BulletGraphic, type BulletGraphicProps, Button, ButtonBase, type ButtonBaseProps, type ButtonProps, type ButtonSizing, 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, type GroupSelectOption, Header, type HeaderProps, Html, HtmlParser, type HtmlParserProps, type HtmlProps, Icon, IconButton, IconButtonBase, type IconButtonBaseProps, IconButtonGroup, type IconButtonGroupProps, 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, LoopItem, LoopItemEmpty, type LoopItemEmptyProps, type LoopItemProps, 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 PlanFeatureTableData, type PlanFeatureTableProps, PlanTierCard, type PlanTierCardProps, 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, type Section, SectionHeader, type SectionHeaderProps, Select, type SelectOption, type SelectProps, type SemanticColor, Skeleton, type SkeletonProps, Slider, type SliderProps, SortableList, type SortableListProps, StarRating, type StarRatingProps, Surface, type SurfaceProps, Switch, type SwitchProps, TestItem, type TestItemProps, TextBarDivider, type TextBarDividerProps, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeContext, type ThemeCtx, ThemeProvider, TickGroup, type TickGroupProps, Toast, type ToastProps, Tooltip, type TooltipProps, TrialCard, type TrialCardProps, Typography, type TypographyProps, UserMenu, type UserMenuProps, VideoModal, type VideoModalProps, backgroundCreator, base, blue, blueRamp, boxShadow, breakpoints, buttonInteraction, chooseArticle, compareArrayMembers, customTheme, darkNeutral, darkNeutralAlpha, defaultInputValidation, easing, elevation, elevationFilter, emailValidation, fonts, generateRamp, getButtonSizing, getButtonTypography, getIconSizing$1 as getIconSizing, green, greenRamp, IconButton_variantHelpers as iconButtonHelpers, iconSizeMap, margin, neutral, neutralAlpha, neutralRamp, outlined$1 as outlined, padding, passwordValidation, peach, peachRamp, primary, purple, purpleRamp, radius, red, redRamp, secondary, semantic, space, subtle, useBreakpoint, useDropdownMenu, usePrevious, useScreenSize, useTheme, useThemeBuilder, yellow, yellowRamp };
2195
+ export { Accordion, type AccordionProps, AnnualController, type AnnualControllerProps, AssetItem, type AssetItemProps, AuthContainerSurface, AuthFormHeader, type AuthFormHeaderProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, BrandBadge, type BrandBadgeProps, Breadcrumb, type BreadcrumbProps, type BreakpointOrNull, BulletGraphic, type BulletGraphicProps, Button, ButtonBase, type ButtonBaseProps, type ButtonProps, type ButtonSizing, 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, ExpandableTypographyClamp, type ExpandableTypographyClampProps, type FieldType, type FieldTypes, FilteredItemsCard, type FilteredItemsCardProps, FontWeight, FormControlLabel, FormGenerator, type FormGeneratorConfig, type FormGeneratorHandler, type GenericSizeMap, GridOverlay, type GridOverlayProps, type GroupSelectOption, Header, type HeaderProps, Html, HtmlParser, type HtmlParserProps, type HtmlProps, Icon, IconButton, IconButtonBase, type IconButtonBaseProps, IconButtonGroup, type IconButtonGroupProps, 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, LoopItem, LoopItemEmpty, type LoopItemEmptyProps, type LoopItemProps, 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 PlanFeatureTableData, type PlanFeatureTableProps, PlanTierCard, type PlanTierCardProps, 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, type Section, SectionHeader, type SectionHeaderProps, Select, type SelectOption, type SelectProps, type SemanticColor, Skeleton, type SkeletonProps, Slider, type SliderProps, SortableList, type SortableListProps, StarRating, type StarRatingProps, Surface, type SurfaceProps, Switch, type SwitchProps, TestItem, type TestItemProps, TextBarDivider, type TextBarDividerProps, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeContext, type ThemeCtx, ThemeProvider, TickGroup, type TickGroupProps, Toast, type ToastProps, Tooltip, type TooltipProps, TrialCard, type TrialCardProps, Typography, type TypographyProps, UserMenu, type UserMenuProps, VideoModal, type VideoModalProps, backgroundCreator, base, blue, blueRamp, boxShadow, breakpoints, buttonInteraction, chooseArticle, compareArrayMembers, customTheme, darkNeutral, darkNeutralAlpha, defaultInputValidation, easing, elevation, elevationFilter, emailValidation, fonts, generateRamp, getButtonSizing, getButtonTypography, getIconSizing$1 as getIconSizing, green, greenRamp, IconButton_variantHelpers as iconButtonHelpers, iconSizeMap, margin, neutral, neutralAlpha, neutralRamp, outlined$1 as outlined, padding, passwordValidation, peach, peachRamp, primary, purple, purpleRamp, radius, red, redRamp, secondary, semantic, space, subtle, useBreakpoint, useDropdownMenu, usePrevious, useScreenSize, useTheme, useThemeBuilder, yellow, yellowRamp };