@nuskin/foundation-ui-components 3.0.0 → 4.0.0

package/dist/index.d.mts

@@ -1,8 +1,8 @@
 import * as react from 'react';
-import react__default, { ReactElement, HTMLProps, PropsWithChildren, ReactNode, SyntheticEvent, HTMLAttributes } from 'react';
+import react__default, { ReactElement, HTMLProps, PropsWithChildren, ReactNode, MouseEventHandler, HTMLAttributes, SyntheticEvent } from 'react';
 import { FoundationTheme } from '@nuskin/foundation-theme';
 import * as _mui_material from '@mui/material';
-import { SvgIconProps as SvgIconProps$1, AutocompleteChangeReason, AutocompleteChangeDetails, ComponentsProps, ButtonProps, TextFieldProps, InputLabelProps, RadioGroupProps } from '@mui/material';
+import { SvgIconProps as SvgIconProps$1, ComponentsProps, AutocompleteChangeReason, AutocompleteChangeDetails, ButtonProps, TextFieldProps, InputLabelProps, RadioGroupProps } from '@mui/material';
 import { SvgIconProps } from '@mui/material/SvgIcon';
 import * as _emotion_styled from '@emotion/styled';
 import * as _emotion_react from '@emotion/react';
@@ -10,6 +10,7 @@ import * as _mui_material_OverridableComponent from '@mui/material/OverridableCo
 import * as _mui_material_Card from '@mui/material/Card';
 import * as _mui_material_CardMedia from '@mui/material/CardMedia';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Settings } from 'react-slick';
 import { CheckboxProps } from '@material-ui/core/Checkbox';
 import { React as React$1 } from 'React';
 import * as notistack from 'notistack';
@@ -259,7 +260,7 @@ type CommonAccordionType = {
 type NsAccordionHeaderProps = AdditionalProps & {
     title: string | ReactNode;
     // eslint-disable-next-line no-unused-vars
-    onClick: (...args: any[]) => void;
+    onClick: MouseEventHandler<HTMLElement>;
     /** a flag for the header, based on which header can change properties */
     isOpen: boolean;
     /** NsIcon's icon name to be shown in opened state */
@@ -290,7 +291,7 @@ type NsToggleSectionProps = AdditionalProps & {
 type NsAccordionItemProps = AdditionalProps & {
     isOpen: boolean;
     // eslint-disable-next-line no-unused-vars
-    toggleOpen(index: number, isOpen: boolean): void;
+    toggleOpen: MouseEventHandler<HTMLElement>;
     title: string | ReactNode;
     headerTypographyVariant?: Variants;
     /** NsIcon's icon name to be shown in opened state */
@@ -334,7 +335,7 @@ type NsAutocompleteProps = {
     id?: string;
     options: OptionsProps[];
     loading?: boolean;
-    OptionsUI: react__default.ComponentType<any>;
+    OptionsUI?: react__default.ComponentType<ComponentBoxProps & ListUiProps>;
     noOptionsText?: string;
     /*
         Callback fired when the input value changes.
@@ -681,34 +682,34 @@ type NsAwardCardProps = {
 };
 declare function NsAwardCard({ title, awardName, mediaOutlet, backgroundImageDetail, className, fontColor, }: NsAwardCardProps): ReactElement;
 
-type NsCarouselProps<T = any> = {
+type NsCarouselProps<T = unknown> = {
     entries: T[];
     // eslint-disable-next-line no-unused-vars
     renderEntry(entry: T, index: number): ReactNode;
     allEntryLink?: string;
     allEntryLabel?: string;
-    settings: any;
+    settings: Settings;
     showControlButtons?: boolean;
     ariaLabel?: string;
     ariaLabelledBy?: string;
 };
 
-type NsScrollingCarouselProps<T = any> = {
-    slides: T;
+type NsScrollingCarouselProps<T = unknown> = {
+    slides: T[];
     // eslint-disable-next-line no-unused-vars
     renderSlide(slide: T, index: number): ReactNode;
     /* time it takes while scrolling */
     scrollSeconds: number;
     /* time for which slide stays still before scrolling */
     stillSeconds: number;
-    settings: any;
+    settings: Settings;
     /* value in number, specifying how much the dots should be from bottom of slides container */
     dotsBottomPixel?: number;
 } & AdditionalProps;
 
-declare function NsCarousel<T = any>({ entries, renderEntry, allEntryLink, settings, allEntryLabel, showControlButtons, ariaLabel, ariaLabelledBy, }: NsCarouselProps<T>): ReactElement;
+declare function NsCarousel<T = unknown>({ entries, renderEntry, allEntryLink, settings, allEntryLabel, showControlButtons, ariaLabel, ariaLabelledBy, }: NsCarouselProps<T>): ReactElement;
 
-declare const NsScrollingCarousel: ({ slides, scrollSeconds, stillSeconds, renderSlide, settings, dotsBottomPixel, additionalProps, }: NsScrollingCarouselProps) => ReactElement;
+declare const NsScrollingCarousel: <T>({ slides, scrollSeconds, stillSeconds, renderSlide, settings, dotsBottomPixel, additionalProps, }: NsScrollingCarouselProps<T>) => ReactElement;
 
 declare const defaultCarouselSettings: {
     dots: boolean;
@@ -863,7 +864,7 @@ declare const NsGridColumns: ({ columnClass, children, gap, isFullWidth, additio
 
 interface DropdownProps extends AdditionalProps {
     selectedLabel: ReactNode;
-    onSelect: (arg: ReactNode) => void; // eslint-disable-line
+    onSelect: (value: string) => void;
     children: ReactNode[];
     disabled?: boolean;
     type?: 'outlined' | 'unfilled';
@@ -969,7 +970,7 @@ type NsInputFieldProps = Omit<
 declare const NsInputField: (props: NsInputFieldProps) => ReactElement;
 
 type NsLabelProps = PropsWithChildren &
-    Omit<InputLabelProps, 'sx' | 'classes' | 'color' | 'margin' | 'variant' | 'classes'> & {
+    Omit<InputLabelProps, 'sx' | 'classes' | 'color' | 'margin' | 'variant' | 'size'> & {
         /** purpose of showOptional props is to show additional text 'optional' in the label,
          *  if required = false and this flag is true */
         showOptional?: boolean;
@@ -1129,7 +1130,7 @@ interface SelectProps {
     rules?: Array;
     hasArrows?: boolean;
     options: LabelValueType[];
-    RenderOption?(x: any): any; // eslint-disable-line
+    RenderOption?(props: RenderSelectOptionArgType): ReactNode; // eslint-disable-line
 }
 
 interface SelectOptionProps {

package/dist/index.d.ts

@@ -1,8 +1,8 @@
 import * as react from 'react';
-import react__default, { ReactElement, HTMLProps, PropsWithChildren, ReactNode, SyntheticEvent, HTMLAttributes } from 'react';
+import react__default, { ReactElement, HTMLProps, PropsWithChildren, ReactNode, MouseEventHandler, HTMLAttributes, SyntheticEvent } from 'react';
 import { FoundationTheme } from '@nuskin/foundation-theme';
 import * as _mui_material from '@mui/material';
-import { SvgIconProps as SvgIconProps$1, AutocompleteChangeReason, AutocompleteChangeDetails, ComponentsProps, ButtonProps, TextFieldProps, InputLabelProps, RadioGroupProps } from '@mui/material';
+import { SvgIconProps as SvgIconProps$1, ComponentsProps, AutocompleteChangeReason, AutocompleteChangeDetails, ButtonProps, TextFieldProps, InputLabelProps, RadioGroupProps } from '@mui/material';
 import { SvgIconProps } from '@mui/material/SvgIcon';
 import * as _emotion_styled from '@emotion/styled';
 import * as _emotion_react from '@emotion/react';
@@ -10,6 +10,7 @@ import * as _mui_material_OverridableComponent from '@mui/material/OverridableCo
 import * as _mui_material_Card from '@mui/material/Card';
 import * as _mui_material_CardMedia from '@mui/material/CardMedia';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Settings } from 'react-slick';
 import { CheckboxProps } from '@material-ui/core/Checkbox';
 import { React as React$1 } from 'React';
 import * as notistack from 'notistack';
@@ -259,7 +260,7 @@ type CommonAccordionType = {
 type NsAccordionHeaderProps = AdditionalProps & {
     title: string | ReactNode;
     // eslint-disable-next-line no-unused-vars
-    onClick: (...args: any[]) => void;
+    onClick: MouseEventHandler<HTMLElement>;
     /** a flag for the header, based on which header can change properties */
     isOpen: boolean;
     /** NsIcon's icon name to be shown in opened state */
@@ -290,7 +291,7 @@ type NsToggleSectionProps = AdditionalProps & {
 type NsAccordionItemProps = AdditionalProps & {
     isOpen: boolean;
     // eslint-disable-next-line no-unused-vars
-    toggleOpen(index: number, isOpen: boolean): void;
+    toggleOpen: MouseEventHandler<HTMLElement>;
     title: string | ReactNode;
     headerTypographyVariant?: Variants;
     /** NsIcon's icon name to be shown in opened state */
@@ -334,7 +335,7 @@ type NsAutocompleteProps = {
     id?: string;
     options: OptionsProps[];
     loading?: boolean;
-    OptionsUI: react__default.ComponentType<any>;
+    OptionsUI?: react__default.ComponentType<ComponentBoxProps & ListUiProps>;
     noOptionsText?: string;
     /*
         Callback fired when the input value changes.
@@ -681,34 +682,34 @@ type NsAwardCardProps = {
 };
 declare function NsAwardCard({ title, awardName, mediaOutlet, backgroundImageDetail, className, fontColor, }: NsAwardCardProps): ReactElement;
 
-type NsCarouselProps<T = any> = {
+type NsCarouselProps<T = unknown> = {
     entries: T[];
     // eslint-disable-next-line no-unused-vars
     renderEntry(entry: T, index: number): ReactNode;
     allEntryLink?: string;
     allEntryLabel?: string;
-    settings: any;
+    settings: Settings;
     showControlButtons?: boolean;
     ariaLabel?: string;
     ariaLabelledBy?: string;
 };
 
-type NsScrollingCarouselProps<T = any> = {
-    slides: T;
+type NsScrollingCarouselProps<T = unknown> = {
+    slides: T[];
     // eslint-disable-next-line no-unused-vars
     renderSlide(slide: T, index: number): ReactNode;
     /* time it takes while scrolling */
     scrollSeconds: number;
     /* time for which slide stays still before scrolling */
     stillSeconds: number;
-    settings: any;
+    settings: Settings;
     /* value in number, specifying how much the dots should be from bottom of slides container */
     dotsBottomPixel?: number;
 } & AdditionalProps;
 
-declare function NsCarousel<T = any>({ entries, renderEntry, allEntryLink, settings, allEntryLabel, showControlButtons, ariaLabel, ariaLabelledBy, }: NsCarouselProps<T>): ReactElement;
+declare function NsCarousel<T = unknown>({ entries, renderEntry, allEntryLink, settings, allEntryLabel, showControlButtons, ariaLabel, ariaLabelledBy, }: NsCarouselProps<T>): ReactElement;
 
-declare const NsScrollingCarousel: ({ slides, scrollSeconds, stillSeconds, renderSlide, settings, dotsBottomPixel, additionalProps, }: NsScrollingCarouselProps) => ReactElement;
+declare const NsScrollingCarousel: <T>({ slides, scrollSeconds, stillSeconds, renderSlide, settings, dotsBottomPixel, additionalProps, }: NsScrollingCarouselProps<T>) => ReactElement;
 
 declare const defaultCarouselSettings: {
     dots: boolean;
@@ -863,7 +864,7 @@ declare const NsGridColumns: ({ columnClass, children, gap, isFullWidth, additio
 
 interface DropdownProps extends AdditionalProps {
     selectedLabel: ReactNode;
-    onSelect: (arg: ReactNode) => void; // eslint-disable-line
+    onSelect: (value: string) => void;
     children: ReactNode[];
     disabled?: boolean;
     type?: 'outlined' | 'unfilled';
@@ -969,7 +970,7 @@ type NsInputFieldProps = Omit<
 declare const NsInputField: (props: NsInputFieldProps) => ReactElement;
 
 type NsLabelProps = PropsWithChildren &
-    Omit<InputLabelProps, 'sx' | 'classes' | 'color' | 'margin' | 'variant' | 'classes'> & {
+    Omit<InputLabelProps, 'sx' | 'classes' | 'color' | 'margin' | 'variant' | 'size'> & {
         /** purpose of showOptional props is to show additional text 'optional' in the label,
          *  if required = false and this flag is true */
         showOptional?: boolean;
@@ -1129,7 +1130,7 @@ interface SelectProps {
     rules?: Array;
     hasArrows?: boolean;
     options: LabelValueType[];
-    RenderOption?(x: any): any; // eslint-disable-line
+    RenderOption?(props: RenderSelectOptionArgType): ReactNode; // eslint-disable-line
 }
 
 interface SelectOptionProps {