@commonsku/styles 1.16.7 → 1.16.9

package/dist/index.d.ts

@@ -229,18 +229,32 @@ declare const sizes: {
 };
 declare type TSize$1 = keyof typeof sizes;
 declare type ButtonPreset = 'edit' | 'delete' | 'add' | 'remove' | 'close' | 'drag';
-declare type ButtonVariant = 'primary' | 'secondary' | 'cta' | 'error' | 'disabled' | 'text' | 'primary-light' | 'text-error';
+declare type ButtonVariant = 'primary' | 'secondary' | 'cta' | 'error' | 'disabled' | 'text' | 'primary-light' | 'text-error' | 'error-light' | 'text-error-light' | 'custom';
 declare type ButtonProps = {
     secondary?: boolean;
     cta?: boolean;
     size?: TSize$1;
     variant?: ButtonVariant;
+    variantColor?: string;
+    variantBg?: string;
+    variantBorderColor?: string;
+    variantHoverColor?: string;
+    variantHoverBg?: string;
+    variantHoverBorderColor?: string;
+    style?: CSSObject;
 } & SharedStyleTypes & SizerTypes;
 declare const Button: StyledComponent<"button", any, {
     secondary?: boolean | undefined;
     cta?: boolean | undefined;
     size?: "tiny" | "small" | "medium" | "large" | "huge" | undefined;
     variant?: ButtonVariant | undefined;
+    variantColor?: string | undefined;
+    variantBg?: string | undefined;
+    variantBorderColor?: string | undefined;
+    variantHoverColor?: string | undefined;
+    variantHoverBg?: string | undefined;
+    variantHoverBorderColor?: string | undefined;
+    style?: CSSObject | undefined;
 } & SharedStyleTypes & SizerTypes, never>;
 declare const ButtonsGroup: StyledComponent<"div", any, SharedStyleTypes & SizerTypes, never>;
 declare type IconFuncProps = {
@@ -255,13 +269,20 @@ declare type IconButtonProps = React$1.PropsWithChildren<ButtonProps & {
     };
     iconPosition?: 'left' | 'right' | 'top' | 'bottom';
     preset?: ButtonPreset;
-    style?: React$1.CSSProperties;
+    style?: CSSObject;
 }> & React$1.ButtonHTMLAttributes<HTMLButtonElement>;
 declare const IconButton: React$1.ForwardRefExoticComponent<{
     secondary?: boolean | undefined;
     cta?: boolean | undefined;
     size?: "tiny" | "small" | "medium" | "large" | "huge" | undefined;
     variant?: ButtonVariant | undefined;
+    variantColor?: string | undefined;
+    variantBg?: string | undefined;
+    variantBorderColor?: string | undefined;
+    variantHoverColor?: string | undefined;
+    variantHoverBg?: string | undefined;
+    variantHoverBorderColor?: string | undefined;
+    style?: CSSObject | undefined;
 } & SharedStyleTypes & SizerTypes & {
     Icon?: TButtonIcon | React$1.ReactElement<IconFuncProps, string | React$1.JSXElementConstructor<any>> | undefined;
     iconProps?: {
@@ -269,7 +290,7 @@ declare const IconButton: React$1.ForwardRefExoticComponent<{
     } | undefined;
     iconPosition?: "left" | "right" | "bottom" | "top" | undefined;
     preset?: ButtonPreset | undefined;
-    style?: React$1.CSSProperties | undefined;
+    style?: CSSObject | undefined;
 } & {
     children?: React$1.ReactNode;
 } & React$1.ButtonHTMLAttributes<HTMLButtonElement> & React$1.RefAttributes<HTMLButtonElement>>;
@@ -2726,14 +2747,19 @@ declare type DoneButtonProps = {
 } & SharedStyleTypes & SizerTypes;
 declare function DoneButton({ size, variant, style, ...Props }: DoneButtonProps): JSX.Element;
 
-declare type AlertNotificationProps = React$1.PropsWithChildren<{
-    alertType?: "neutral" | "success" | "error";
-    style?: React$1.CSSProperties;
+declare type NotificationExtraContentProps = {
     learnMore?: boolean;
     href?: string;
     linkText?: string;
-}> & SharedStyleTypes & SizerTypes;
-declare function AlertNotification({ alertType, learnMore, href, linkText, children, style, ...props }: AlertNotificationProps): JSX.Element;
+};
+declare type NotificationIconProps = {
+    alertType?: "neutral" | "success" | "error";
+};
+declare type AlertNotificationProps = React$1.PropsWithChildren<{
+    style?: React$1.CSSProperties;
+}> & NotificationIconProps & NotificationExtraContentProps & SharedStyleTypes & SizerTypes;
+declare const AlertNotification: ({ href, linkText, children, alertType, learnMore, style, ...props }: AlertNotificationProps) => JSX.Element;
+//# sourceMappingURL=AlertNotification.d.ts.map
 
 declare type IconFuncProps$1 = {
     color: string;
@@ -3327,6 +3353,13 @@ declare function HistoryIcon({ color, size, altText, ...props }: HistoryIcon): J
 declare type HandleIcon = SVGIconProps;
 declare function HandleIcon({ color, size, altText, ...props }: HandleIcon): JSX.Element;
 
+declare type ShoppingCartIconProps = SVGIconProps;
+declare function ShoppingCartIcon({ color, size, altText, ...props }: ShoppingCartIconProps): JSX.Element;
+//# sourceMappingURL=ShoppingCartIcon.d.ts.map
+
+declare type AddShoppingCartIconProps = SVGIconProps;
+declare function AddShoppingCartIcon({ color, size, altText, ...props }: AddShoppingCartIconProps): JSX.Element;
+
 declare type CommunityIconProps = SVGIconProps;
 declare function CommunityIcon({ size, altText, ...props }: CommunityIconProps): JSX.Element;
 
@@ -3348,6 +3381,18 @@ declare function OrderStatusIcon({ color, size, altText, ...props }: OrderStatus
 declare type EPOIconProps = SVGIconProps;
 declare function EPOIcon({ color, size, altText, ...props }: EPOIconProps): JSX.Element;
 
+declare type HelpIconProps = SVGIconProps;
+declare function HelpIcon({ color, size, altText, ...props }: HelpIconProps): JSX.Element;
+
+declare type FileUploadIconProps = SVGIconProps;
+declare function FileUploadIcon({ color, size, altText, ...props }: FileUploadIconProps): JSX.Element;
+
+declare type ArrowIconDirection$1 = 'left' | 'right' | 'down' | 'up';
+declare type DoubleArrowIconProps = SVGIconProps & {
+    direction?: ArrowIconDirection$1;
+};
+declare function DoubleArrowIcon({ color, direction, size, altText, ...props }: DoubleArrowIconProps): JSX.Element;
+
 declare const datepickerStyles = "\n.commonsku-styles-datepicker {\n  &.react-datepicker-wrapper {\n    width: 100%;\n  }\n\n  .react-datepicker__input-container {\n    display: block;\n    width: 100%;\n  }\n\n  .react-datepicker {\n    border: 1px solid var(--color-primary1-60);\n    outline: none;\n    box-shadow: 1px  1px 0px var(--color-primary1-60),\n              -1px -1px 0px var(--color-primary1-60),\n              1px -1px 0px var(--color-primary1-60),\n              -1px  1px 0px var(--color-primary1-60);\n  }\n\n  .react-datepicker__current-month,\n  .react-datepicker-time__header,\n  .react-datepicker-year-header,\n  .react-datepicker__header {\n    padding-top: 8px;\n    padding-bottom: 8px;\n  }\n\n  .react-datepicker__header,\n  .react-datepicker__today-button {\n    background: var(--color-neutrals-20);\n    padding-top: 8px;\n    padding-bottom: 8px;\n  }\n\n  .react-datepicker__header {\n    border-bottom: none;\n  }\n\n  .react-datepicker__today-button {\n    border-top: none;\n  }\n\n  .react-datepicker__day {\n    outline: none;\n  }\n\n  .react-datepicker__day :not(\n    .react-datepicker__day--outside-month,\n    .react-datepicker__day--selected\n  ) {\n    color: var(--color-neutrals-90);\n  }\n\n  .react-datepicker__day:hover :not(.react-datepicker__day--selected),\n  .react-datepicker__month-text:hover,\n  .react-datepicker__quarter-text:hover,\n  .react-datepicker__year-text:hover {\n    background-color: var(--color-neutrals-20);\n  }\n\n  .react-datepicker__day--outside-month {\n    color: var(--color-neutrals-70);\n  }\n\n  .react-datepicker__day--weekend {\n    color: var(--color-errors-main);\n  }\n\n  .react-datepicker__day--selected,\n  .react-datepicker__day--keyboard-selected,\n  .react-datepicker__month-text--keyboard-selected,\n  .react-datepicker__quarter-text--keyboard-selected,\n  .react-datepicker__year-text--keyboard-selected\n   {\n    background-color: var(--color-primary1-60);\n    color: #fff;\n  }\n\n  .react-datepicker__triangle {\n    border-bottom-color: var(--color-neutrals-20) !important;\n  }\n\n  .react-datepicker__triangle::before {\n    border-bottom-color: var(--color-primary1-60) !important;\n    border-top-color: var(--color-primary1-60) !important;\n  }\n\n  .react-datepicker__month-select,\n  .react-datepicker__year-select {\n    height: 30px;\n    border: 2px solid var(--color-primary1-60);\n    padding: 3px;\n    border-radius: 5px;\n    outline: none;\n  }\n\n  .react-datepicker__navigation {\n    border: 0.45rem solid transparent;\n\n    &.react-datepicker__navigation--next {\n      border-left: 7px solid var(--color-primary1-60);\n      margin-top: 8px;\n    }\n  \n    &.react-datepicker__navigation--previous {\n      border-right: 7px solid var(--color-primary1-60);\n      margin-top: 8px;\n    }\n  }\n}\n";
 //# sourceMappingURL=datepickerStyles.d.ts.map
 
@@ -3651,14 +3696,16 @@ declare type SimpleWindowedTableProps = {
         className?: string;
         style?: React$1.CSSProperties;
     };
+    headerGroupStyle?: React$1.CSSProperties;
     TableFooter?: React$1.ReactNode;
     className?: string;
     hideFooter?: boolean;
+    clearRowFullWidth?: boolean;
     NoRowsFound?: (props: React$1.PropsWithChildren<{
         [key: string]: any;
     }>) => React$1.ReactElement;
 };
-declare function SimpleWindowedTable({ columns, data, itemSize, height, minWidth, maxWidth, defaultSort, onClickRow, onScroll, onUpdateData, useTableProps, tableHeaderProps, tableFooterProps, hideFooter, className, NoRowsFound, }: SimpleWindowedTableProps): JSX.Element;
+declare function SimpleWindowedTable({ columns, data, itemSize, height, minWidth, maxWidth, defaultSort, onClickRow, onScroll, onUpdateData, useTableProps, tableHeaderProps, tableFooterProps, headerGroupStyle, hideFooter, clearRowFullWidth, className, NoRowsFound, }: SimpleWindowedTableProps): JSX.Element;
 
 declare function useDelayUnmount(isMounted: boolean, delayTime: number): boolean;
 //# sourceMappingURL=useDelayUnmount.d.ts.map
@@ -3689,4 +3736,4 @@ declare const useClickOutside: <T extends HTMLElement = HTMLElement>(props: {
 declare const useFallbackRef: <T>(forwardedRef: ForwardedRef<T>) => MutableRefObject<T | null>;
 //# sourceMappingURL=useFallbackRef.d.ts.map
 
-export { AddIcon, AddNoteIcon, AddTaskIcon, AlertIcon, AlertNotification, ArrowIcon, Artwork, ArtworkProps, SKUAsyncSelect as AsyncSelect, Avatar, AvatarColor, AvatarShape, AvatarSize, AwaitingProofIcon, Backdrop, Background, Badge, BaseCskuProps, BotIcon, Box, BulletIcon, Button, ButtonPreset, ButtonProps, ButtonVariant, ButtonsGroup, Calendar, CalendarDayBody, CalendarDaysBody, CalendarDaysHeader, CalendarIcon, CalendarTask, CalendarTaskProps, CalendarWrapper, CancelButton, ChangeRequestedIcon, ChatIcon, CheckMark, CheckboxIcon, CheckboxLabel, CheckmarkIcon, ChevronIcon, CircleProgressIcon, ClientApprovedIcon, ClipboardIcon, ClockIcon, Col, ColPropTypes, CollaborateIcon, CollapseStyled, CollapseStyledProps, CollapseWrapper, CollapseWrapperProps, Collapsible, CollapsibleArrowIcon, CollapsibleLabel, CollapsiblePanel, CollapsiblePanelProps, CollapsiblePanelTitle, CollapsiblePanelTitleProps, CollapsiblePanels, CollapsiblePanelsProps, CollapsibleProps, Collapsible$1 as CollapsibleV2, Collapsibles, Column, ColumnSelectIcon, CommentIcon, CommunityIcon, CompletedCheckmarkIcon, ConfirmPopup, ConnectedIcon, ConnectedPlusIcon, CouponIcon, SKUCreatableSelect as CreatableSelect, CreditCardIcon, Csku, CskuProps, CustomDateInput, Datepicker, DatepickerPorps, DaysBodyWrapper, DaysHeaderWrapper, DefaultCalendarFooter, DefaultCalendarHeader, DefaultStar, DollarIcon, DoneButton, Dot, DownloadIcon, DragIcon, DraggableTasksCalendar, DropArea, DropAreaProps, DropDownContent, Dropdown, DropdownItem, DropdownProps, DropzoneTypes, Dropzoned, DropzonedPreviews, EPOIcon, EditIcon, EllipsisIcon, EpsIcon, ErrorBoundary, EstimateCircleIcon, EyeIcon, FeedPost, FilledChevronIcon, FolderIcon, GalleryIcon, GearIcon, GlobalStyle, Grid, GridCell, GridIcon, GridItem, GridItemProps, GridProps, GridRow, GridTable, GridTableContainer, H1, H2, H3, H4, H5, H6, HandleIcon, HeaderWrapper, HeadlessTable, HistoryIcon, IconButton, IconButtonProps, IconDoc, Img, InfoIcon, Input, InputIconLabel, InputIconLabelContainer, InputProps, InputStepper, InputStepperStyled, IntegrationsIcon, InventoryIcon, Label, LabeledAsyncSelect, LabeledCheckbox, LabeledCheckboxProps, LabeledCreatableSelect, LabeledIconInput, LabeledInput, LabeledMultiProgress, LabeledProgress, LabeledRadio, LabeledRadioGroup, LabeledRadioInButton, LabeledRadioInButtonGroup, LabeledRadioProps, LabeledSelect, LabeledTextarea, LightIndicator, Link, LinkWithIcon, ListIcon, Loading, LockIcon, MailIcon, MarketingStatusIcon, MenuIcon, MultiProgress, NavConnectIcon, NavFinanceIcon, NavManagementIcon, NavProdIcon, NavResourcesIcon, NavSalesIcon, NoteIcon, Number, NumberInput, OpportunityCircleIcon, OrderStatusIcon, Overlay, Padding, Page, PanelContact, PanelTileContact, PendingApprovalIcon, PercentIcon, PinIcon, Popup, PopupHeader, PopupProps, PresentationCircleIcon, Product, Progress, PromostandardsIcon, ProofReceivedIcon, ProofingCompleteIcon, Publisher, Radio, RadioIcon, RadioLabel, RadioProps, ReceiptLongIcon, ResponsiveTable, Row, RowPropTypes, SHARED_STYLE_MAPS, SalesArrowIcon, SalesOrderCircleIcon, SearchIcon, SKUSelect as Select, SharedStyleTypes, SharedStyles, ShopIcon, ShowPopup, SidePanel, SimpleWindowedTable, SimpleWindowedTableProps, SimpleWindowedTableStyles, SizerCss, SizerTypes, SizerWrapper, Sparkles, Spinner, StarIcon, StarRating, StateDropdown, StatusDropdown, StyledCalendarTaskBody, StyledDayBody, StyledDayText, StyledDropArea, StyledDropdown, StyledPanel, StyledTask, SubtractIcon, SVG as SvgIcon, TBody, TButtonIcon, TD, TDropdownItem, TH, THSorted, THead, TR, TSize$1 as TSize, TSizeOffset, TSizeOffsetRight, TSizeStyle, TTab, Tab, TabBar, Table, TableIcon, Tabs, TabsProps, TargetIcon, Task, TaskBody, TaskIcon, TaskLabel, TaskName, TaskProps, TasksCalendar, TasksCalendarDayBody, TasksCalendarFooter, TasksCalendarHeader, TemplateIcon, Text, TextProp, Textarea, Theme, Thermometer, TilesIcon, Toggle, ToggleLink, TrashIcon, UserIcon, UsersIcon, VirtualTable, VirtualTableStyles, Wrapper, XIcon, colors, createMeasurementStyle, datepickerStyles, fontFamilies, fontStyles, fonts, getColor, getFontStyle, getThemeColor, getThemeFontFamily, getThemeFontSize, getThemeFontStyle, getThemeProperty, parseCskuStyles, sizes, themeOptions, toggleSizes, useCalendar, useClickOutside, useDelayUnmount, useFallbackRef, useLongPress, usePrefersReducedMotion, useRandomInterval, useWindowSize };
+export { AddIcon, AddNoteIcon, AddShoppingCartIcon, AddTaskIcon, AlertIcon, AlertNotification, ArrowIcon, Artwork, ArtworkProps, SKUAsyncSelect as AsyncSelect, Avatar, AvatarColor, AvatarShape, AvatarSize, AwaitingProofIcon, Backdrop, Background, Badge, BaseCskuProps, BotIcon, Box, BulletIcon, Button, ButtonPreset, ButtonProps, ButtonVariant, ButtonsGroup, Calendar, CalendarDayBody, CalendarDaysBody, CalendarDaysHeader, CalendarIcon, CalendarTask, CalendarTaskProps, CalendarWrapper, CancelButton, ChangeRequestedIcon, ChatIcon, CheckMark, CheckboxIcon, CheckboxLabel, CheckmarkIcon, ChevronIcon, CircleProgressIcon, ClientApprovedIcon, ClipboardIcon, ClockIcon, Col, ColPropTypes, CollaborateIcon, CollapseStyled, CollapseStyledProps, CollapseWrapper, CollapseWrapperProps, Collapsible, CollapsibleArrowIcon, CollapsibleLabel, CollapsiblePanel, CollapsiblePanelProps, CollapsiblePanelTitle, CollapsiblePanelTitleProps, CollapsiblePanels, CollapsiblePanelsProps, CollapsibleProps, Collapsible$1 as CollapsibleV2, Collapsibles, Column, ColumnSelectIcon, CommentIcon, CommunityIcon, CompletedCheckmarkIcon, ConfirmPopup, ConnectedIcon, ConnectedPlusIcon, CouponIcon, SKUCreatableSelect as CreatableSelect, CreditCardIcon, Csku, CskuProps, CustomDateInput, Datepicker, DatepickerPorps, DaysBodyWrapper, DaysHeaderWrapper, DefaultCalendarFooter, DefaultCalendarHeader, DefaultStar, DollarIcon, DoneButton, Dot, DoubleArrowIcon, DownloadIcon, DragIcon, DraggableTasksCalendar, DropArea, DropAreaProps, DropDownContent, Dropdown, DropdownItem, DropdownProps, DropzoneTypes, Dropzoned, DropzonedPreviews, EPOIcon, EditIcon, EllipsisIcon, EpsIcon, ErrorBoundary, EstimateCircleIcon, EyeIcon, FeedPost, FileUploadIcon, FilledChevronIcon, FolderIcon, GalleryIcon, GearIcon, GlobalStyle, Grid, GridCell, GridIcon, GridItem, GridItemProps, GridProps, GridRow, GridTable, GridTableContainer, H1, H2, H3, H4, H5, H6, HandleIcon, HeaderWrapper, HeadlessTable, HelpIcon, HistoryIcon, IconButton, IconButtonProps, IconDoc, Img, InfoIcon, Input, InputIconLabel, InputIconLabelContainer, InputProps, InputStepper, InputStepperStyled, IntegrationsIcon, InventoryIcon, Label, LabeledAsyncSelect, LabeledCheckbox, LabeledCheckboxProps, LabeledCreatableSelect, LabeledIconInput, LabeledInput, LabeledMultiProgress, LabeledProgress, LabeledRadio, LabeledRadioGroup, LabeledRadioInButton, LabeledRadioInButtonGroup, LabeledRadioProps, LabeledSelect, LabeledTextarea, LightIndicator, Link, LinkWithIcon, ListIcon, Loading, LockIcon, MailIcon, MarketingStatusIcon, MenuIcon, MultiProgress, NavConnectIcon, NavFinanceIcon, NavManagementIcon, NavProdIcon, NavResourcesIcon, NavSalesIcon, NoteIcon, Number, NumberInput, OpportunityCircleIcon, OrderStatusIcon, Overlay, Padding, Page, PanelContact, PanelTileContact, PendingApprovalIcon, PercentIcon, PinIcon, Popup, PopupHeader, PopupProps, PresentationCircleIcon, Product, Progress, PromostandardsIcon, ProofReceivedIcon, ProofingCompleteIcon, Publisher, Radio, RadioIcon, RadioLabel, RadioProps, ReceiptLongIcon, ResponsiveTable, Row, RowPropTypes, SHARED_STYLE_MAPS, SalesArrowIcon, SalesOrderCircleIcon, SearchIcon, SKUSelect as Select, SharedStyleTypes, SharedStyles, ShopIcon, ShoppingCartIcon, ShowPopup, SidePanel, SimpleWindowedTable, SimpleWindowedTableProps, SimpleWindowedTableStyles, SizerCss, SizerTypes, SizerWrapper, Sparkles, Spinner, StarIcon, StarRating, StateDropdown, StatusDropdown, StyledCalendarTaskBody, StyledDayBody, StyledDayText, StyledDropArea, StyledDropdown, StyledPanel, StyledTask, SubtractIcon, SVG as SvgIcon, TBody, TButtonIcon, TD, TDropdownItem, TH, THSorted, THead, TR, TSize$1 as TSize, TSizeOffset, TSizeOffsetRight, TSizeStyle, TTab, Tab, TabBar, Table, TableIcon, Tabs, TabsProps, TargetIcon, Task, TaskBody, TaskIcon, TaskLabel, TaskName, TaskProps, TasksCalendar, TasksCalendarDayBody, TasksCalendarFooter, TasksCalendarHeader, TemplateIcon, Text, TextProp, Textarea, Theme, Thermometer, TilesIcon, Toggle, ToggleLink, TrashIcon, UserIcon, UsersIcon, VirtualTable, VirtualTableStyles, Wrapper, XIcon, colors, createMeasurementStyle, datepickerStyles, fontFamilies, fontStyles, fonts, getColor, getFontStyle, getThemeColor, getThemeFontFamily, getThemeFontSize, getThemeFontStyle, getThemeProperty, parseCskuStyles, sizes, themeOptions, toggleSizes, useCalendar, useClickOutside, useDelayUnmount, useFallbackRef, useLongPress, usePrefersReducedMotion, useRandomInterval, useWindowSize };