@purple/phoenix-components 4.28.0 → 4.30.0

package/dist/index.d.ts

@@ -3,6 +3,7 @@ import React__default, { HTMLAttributes, ReactElement, InputHTMLAttributes, JSXE
 import * as styled_components from 'styled-components';
 import { IntrinsicElementsKeys } from 'styled-components';
 import { LayoutProps, FlexboxProps, GridProps, BackgroundColorProps, BackgroundProps, OpacityProps, PositionProps, BorderProps } from 'styled-system';
+import * as CSS from 'csstype';
 import { DayPickerProps } from 'react-day-picker';
 import { Props } from 'tippy.js';
 import { OptionTypeBase, NamedProps } from 'react-select';
@@ -39,8 +40,6 @@ interface PaddingProps {
 
 declare const ColorTheme: readonly ["primary", "success", "warning", "error", "info", "neutral"];
 declare type ColorTheme = typeof ColorTheme[number];
-declare const ButtonColorTheme: readonly ["primary", "success", "error", "neutral"];
-declare type ButtonColorTheme = typeof ButtonColorTheme[number];
 
 declare const TextAlignment: readonly ["left", "center", "right", "justify"];
 declare type TextAlignment = typeof TextAlignment[number];
@@ -57,7 +56,11 @@ interface TextAlignProp {
     textAlign?: TextAlignment;
 }
 
-interface BoxProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'>, LayoutProps, FlexboxProps, GridProps, MarginProps, PaddingProps, BackgroundColorProps, BackgroundProps, OpacityProps, PositionProps, TextAlignProp, BorderProps, GenericComponentProps {
+interface CommonBoxProps {
+    gap?: CSS.Property.Gap;
+}
+
+interface BoxProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'>, LayoutProps, FlexboxProps, GridProps, MarginProps, PaddingProps, BackgroundColorProps, BackgroundProps, OpacityProps, PositionProps, TextAlignProp, BorderProps, GenericComponentProps, CommonBoxProps {
     element?: IntrinsicElementsKeys;
 }
 declare const Box: React__default.FC<BoxProps>;
@@ -152,6 +155,7 @@ declare const PhoenixIconsOutlinedSrc: {
     readonly wrench: string;
 };
 declare const PhoenixIconsColoredSrc: {
+    readonly 'browser-primary': string;
     readonly 'calendar-primary': string;
     readonly 'camera-primary': string;
     readonly 'driving-licence-primary': string;
@@ -173,6 +177,7 @@ declare const PhoenixIconsColoredSrc: {
     readonly 'trash-error': string;
 };
 declare const PhoenixIconsSrc: {
+    readonly 'browser-primary': string;
     readonly 'calendar-primary': string;
     readonly 'camera-primary': string;
     readonly 'driving-licence-primary': string;
@@ -270,15 +275,15 @@ declare const PhoenixIconsSrc: {
 };
 declare const PhoenixIconsOutlined: ("filter" | "search" | "revert" | "document" | "list" | "email" | "copy" | "download" | "actions" | "add-circle" | "android" | "angled-arrow-left" | "angled-arrow-right" | "apple" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "asterisk" | "bell" | "browser" | "bullet-point" | "burger" | "calendar" | "camera" | "chat" | "check" | "check-circle" | "clock" | "cog" | "cross" | "deposit" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "dots-handle-reorder" | "driving-licence" | "edit" | "ellipsis" | "exclamation" | "exit" | "external" | "eye" | "forward-arrow" | "gift" | "history" | "house" | "id-card" | "info-circle" | "language" | "later" | "lock" | "paper" | "passport" | "photo-user" | "pin" | "play-circle" | "profile" | "question-circle" | "refresh" | "refund" | "scales" | "star" | "smartphone" | "star-circle" | "stopwatch" | "subtract-circle" | "times-circle" | "transfer" | "trash" | "upload" | "windows" | "withdrawal" | "wrench")[];
 declare type PhoenixIconsOutlined = keyof typeof PhoenixIconsOutlinedSrc;
-declare const PhoenixIconsColored: ("calendar-primary" | "camera-primary" | "driving-licence-primary" | "email-primary" | "exclamation-error" | "exclamation-warning" | "house-primary" | "id-card-primary" | "lock-primary" | "lock-success" | "paper-primary" | "passport-primary" | "photo-user-primary" | "pin-primary" | "question-circle-primary" | "smartphone-primary" | "star-primary" | "star-warning" | "trash-error")[];
+declare const PhoenixIconsColored: ("browser-primary" | "calendar-primary" | "camera-primary" | "driving-licence-primary" | "email-primary" | "exclamation-error" | "exclamation-warning" | "house-primary" | "id-card-primary" | "lock-primary" | "lock-success" | "paper-primary" | "passport-primary" | "photo-user-primary" | "pin-primary" | "question-circle-primary" | "smartphone-primary" | "star-primary" | "star-warning" | "trash-error")[];
 declare type PhoenixIconsColored = keyof typeof PhoenixIconsColoredSrc;
-declare const PhoenixIcons: ("filter" | "search" | "revert" | "document" | "list" | "email" | "copy" | "download" | "actions" | "add-circle" | "android" | "angled-arrow-left" | "angled-arrow-right" | "apple" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "asterisk" | "bell" | "browser" | "bullet-point" | "burger" | "calendar" | "camera" | "chat" | "check" | "check-circle" | "clock" | "cog" | "cross" | "deposit" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "dots-handle-reorder" | "driving-licence" | "edit" | "ellipsis" | "exclamation" | "exit" | "external" | "eye" | "forward-arrow" | "gift" | "history" | "house" | "id-card" | "info-circle" | "language" | "later" | "lock" | "paper" | "passport" | "photo-user" | "pin" | "play-circle" | "profile" | "question-circle" | "refresh" | "refund" | "scales" | "star" | "smartphone" | "star-circle" | "stopwatch" | "subtract-circle" | "times-circle" | "transfer" | "trash" | "upload" | "windows" | "withdrawal" | "wrench" | "calendar-primary" | "camera-primary" | "driving-licence-primary" | "email-primary" | "exclamation-error" | "exclamation-warning" | "house-primary" | "id-card-primary" | "lock-primary" | "lock-success" | "paper-primary" | "passport-primary" | "photo-user-primary" | "pin-primary" | "question-circle-primary" | "smartphone-primary" | "star-primary" | "star-warning" | "trash-error")[];
+declare const PhoenixIcons: ("filter" | "search" | "revert" | "document" | "list" | "email" | "copy" | "download" | "actions" | "add-circle" | "android" | "angled-arrow-left" | "angled-arrow-right" | "apple" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "asterisk" | "bell" | "browser" | "bullet-point" | "burger" | "calendar" | "camera" | "chat" | "check" | "check-circle" | "clock" | "cog" | "cross" | "deposit" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "dots-handle-reorder" | "driving-licence" | "edit" | "ellipsis" | "exclamation" | "exit" | "external" | "eye" | "forward-arrow" | "gift" | "history" | "house" | "id-card" | "info-circle" | "language" | "later" | "lock" | "paper" | "passport" | "photo-user" | "pin" | "play-circle" | "profile" | "question-circle" | "refresh" | "refund" | "scales" | "star" | "smartphone" | "star-circle" | "stopwatch" | "subtract-circle" | "times-circle" | "transfer" | "trash" | "upload" | "windows" | "withdrawal" | "wrench" | "browser-primary" | "calendar-primary" | "camera-primary" | "driving-licence-primary" | "email-primary" | "exclamation-error" | "exclamation-warning" | "house-primary" | "id-card-primary" | "lock-primary" | "lock-success" | "paper-primary" | "passport-primary" | "photo-user-primary" | "pin-primary" | "question-circle-primary" | "smartphone-primary" | "star-primary" | "star-warning" | "trash-error")[];
 declare type PhoenixIcons = keyof typeof PhoenixIconsSrc;
 
 declare type IconType = PhoenixIconsOutlined | React.ReactElement | string;
 
 interface CommonButtonProps extends MarginProps {
-    colorTheme?: ButtonColorTheme;
+    colorTheme?: ColorTheme;
     size?: ComponentSize;
     minimal?: boolean;
     light?: boolean;
@@ -309,7 +314,7 @@ declare type FormControlErrorType = ReactElement | string | boolean;
 
 interface CheckboxRadioCommonProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'>, GenericComponentProps {
     RTL?: boolean;
-    colorTheme?: ButtonColorTheme;
+    colorTheme?: ColorTheme;
     size?: ComponentSizeMediumLarge;
     label?: React__default.ReactNode;
     warning?: FormControlWarningType;
@@ -530,6 +535,11 @@ declare const MultiSlider: React__default.FC<MultiSliderProps>;
 interface NoticeProps extends GenericComponentProps, MarginProps, PaddingProps {
     colorTheme?: ColorTheme;
     buttonText?: string;
+    buttonLoading?: boolean;
+    buttonIcon?: IconType;
+    buttonIconAlignment?: IconAlignment;
+    buttonTestId?: string;
+    closeTestId?: string;
     onClick?: (event: React__default.MouseEvent) => void;
     onClose?: (event: React__default.MouseEvent) => void;
     breakpoint?: number;
@@ -607,7 +617,7 @@ interface SelectPickerProps extends GenericComponentProps {
     warning?: string;
     onMouseOver?: (event: React__default.MouseEvent) => void;
     onMouseLeave?: (event: React__default.MouseEvent) => void;
-    colorTheme?: ButtonColorTheme;
+    colorTheme?: ColorTheme;
     size?: ComponentSizeMediumLarge;
     imageSize?: string;
 }
@@ -642,7 +652,7 @@ interface SpinnerProps extends MarginProps, GenericComponentProps {
 }
 declare const Spinner: React__default.FC<SpinnerProps>;
 
-interface TabProps extends Omit<React__default.AnchorHTMLAttributes<HTMLAnchorElement>, 'tabIndex'> {
+interface TabProps extends Omit<React__default.AnchorHTMLAttributes<HTMLAnchorElement>, 'tabIndex'>, GenericComponentProps {
     animate?: boolean;
     selected?: boolean;
     disabled?: boolean;
@@ -663,7 +673,7 @@ declare const TabList: React__default.FC<TabListProps> & {
     tabsRole: 'TabList';
 };
 
-interface TagProps extends GenericComponentProps {
+interface TagProps extends GenericComponentProps, MarginProps {
     colorTheme?: ColorTheme;
     size?: ComponentSizeSmallMedium;
 }
@@ -734,11 +744,21 @@ declare const prefixedTheme: {
             };
             warning: {
                 dark: string;
+                darkHoverBackground: string;
+                darkDisabledBackground: string;
                 light: string;
+                lightHoverBackground: string;
+                lightDisabledBackground: string;
+                lightDisabledColor: string;
             };
             info: {
                 dark: string;
+                darkHoverBackground: string;
+                darkDisabledBackground: string;
                 light: string;
+                lightHoverBackground: string;
+                lightDisabledBackground: string;
+                lightDisabledColor: string;
             };
             gray: {
                 _0: string;
@@ -942,4 +962,4 @@ declare const prefixedTheme: {
 
 declare const GlobalStyles: styled_components.GlobalStyleComponent<{}, styled_components.DefaultTheme>;
 
-export { Box, BoxProps, Button, ButtonColorTheme, ButtonGroup, ButtonGroupProps, ButtonProps, Card, CardProps, Checkbox, CheckboxProps, ClosableButton, ClosableButtonProps, ClosableItem, ClosableItemProps, Collapsible, CollapsibleCard, CollapsibleCardProps, CollapsibleProps, ColorTheme, ComponentSize, ComponentSizeMediumLarge, ComponentSizeSmallMedium, ComponentSizeSmallMediumLarge, DateInput, DateInputProps, DatePicker, DatePickerProps, DateRangePicker, DateRangePickerProps, DateRangeValue, DateValue, Dropdown, DropdownProps, FileUpload, FileUploadProps, FileWithPreview, Flex, GlobalStyles, Grid, Heading, HeadingProps, HeadingSizes, HorizontalDivider, HorizontalDividerProps, Icon, IconAlignment, IconProps, IconType, Label, LabelProps, Link, LinkButton, LinkButtonProps, LinkProps, List, ListItem, ListItemProps, ListProps, Menu, MenuDivider, MenuItem, MenuItemProps, MenuProps, Modal, ModalProps, MultiSlider, MultiSliderProps, MultiSliderValue, Notice, NoticeProps, NumberInput, NumberInputProps, Paragraph, ParagraphProps, PhoenixIcons, PhoenixIconsColored, PhoenixIconsColoredSrc, PhoenixIconsOutlined, PhoenixIconsOutlinedSrc, PhoenixIconsSrc, Radio, RadioProps, Select, SelectNative, SelectNativeProps, SelectOption, SelectPicker, SelectPickerOption, SelectPickerProps, SelectProps, Slider, SliderProps, SliderValue, Spacer, SpacerProps, Spacing, Spinner, SpinnerProps, Tab, TabFunctionProps, TabList, TabListProps, TabProps, Tag, TagProps, Text, TextArea, TextAreaProps, TextColor, TextInput, TextInputProps, TextProps, prefixedTheme as Theme, TimezonePicker, TimezonePickerProps, Tooltip, TooltipProps, getOptions as getTimezoneOptions };
+export { Box, BoxProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, Card, CardProps, Checkbox, CheckboxProps, ClosableButton, ClosableButtonProps, ClosableItem, ClosableItemProps, Collapsible, CollapsibleCard, CollapsibleCardProps, CollapsibleProps, ColorTheme, ComponentSize, ComponentSizeMediumLarge, ComponentSizeSmallMedium, ComponentSizeSmallMediumLarge, DateInput, DateInputProps, DatePicker, DatePickerProps, DateRangePicker, DateRangePickerProps, DateRangeValue, DateValue, Dropdown, DropdownProps, FileUpload, FileUploadProps, FileWithPreview, Flex, GlobalStyles, Grid, Heading, HeadingProps, HeadingSizes, HorizontalDivider, HorizontalDividerProps, Icon, IconAlignment, IconProps, IconType, Label, LabelProps, Link, LinkButton, LinkButtonProps, LinkProps, List, ListItem, ListItemProps, ListProps, Menu, MenuDivider, MenuItem, MenuItemProps, MenuProps, Modal, ModalProps, MultiSlider, MultiSliderProps, MultiSliderValue, Notice, NoticeProps, NumberInput, NumberInputProps, Paragraph, ParagraphProps, PhoenixIcons, PhoenixIconsColored, PhoenixIconsColoredSrc, PhoenixIconsOutlined, PhoenixIconsOutlinedSrc, PhoenixIconsSrc, Radio, RadioProps, Select, SelectNative, SelectNativeProps, SelectOption, SelectPicker, SelectPickerOption, SelectPickerProps, SelectProps, Slider, SliderProps, SliderValue, Spacer, SpacerProps, Spacing, Spinner, SpinnerProps, Tab, TabFunctionProps, TabList, TabListProps, TabProps, Tag, TagProps, Text, TextArea, TextAreaProps, TextColor, TextInput, TextInputProps, TextProps, prefixedTheme as Theme, TimezonePicker, TimezonePickerProps, Tooltip, TooltipProps, getOptions as getTimezoneOptions };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@purple/phoenix-components",
-	"version": "4.28.0",
+	"version": "4.30.0",
 	"description": "",
 	"main": "dist/bundle.umd.js",
 	"module": "dist/bundle.esm.js",