mada-design-system 0.3.1 → 0.4.0

package/index.es.d.ts

@@ -34,6 +34,7 @@ import { FormProviderProps } from 'react-hook-form';
 import { GoogleMaterialIcon } from 'google-material-icons/outlined';
 import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
 import { HTMLAttributes } from 'react';
+import { HtmlHTMLAttributes } from 'react';
 import { InputProps as InputProps_2 } from './input';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import * as LabelPrimitive from '@radix-ui/react-label';
@@ -527,7 +528,7 @@ export declare const CardHeader: React_2.ForwardRefExoticComponent<React_2.HTMLA
 
 export declare const CardTitle: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLParagraphElement>>;
 
-export declare function Carousel({ children, className, itemClassName, showDots, showArrows, loop, autoplay, autoplayInterval, containerClassName, maxDots, itemWidth, slidesToShow, showPartial, dir, type, }: Readonly<CustomCarouselProps>): JSX_2.Element;
+export declare function Carousel({ children, className, itemClassName, showDots, showArrows, loop, autoplay, autoplayInterval, containerClassName, maxDots, itemWidth, slidesToShow, showPartial, dir, type, slidesToScroll, }: Readonly<CustomCarouselProps>): JSX_2.Element;
 
 export declare type CarouselApi = UseEmblaCarouselType[1];
 
@@ -766,6 +767,7 @@ declare interface CustomCarouselProps {
     showPartial?: boolean;
     dir?: 'ltr' | 'rtl';
     type?: 'single' | 'multiple';
+    slidesToScroll: number | 'auto';
 }
 
 export declare function DataTable<TData, TValue>({ columns, data, loading, NoDataComponent, itemsPerPage, hasPagination, onClickRow, isFirstRowSelected, ...rest }: DataTableProps<TData, TValue>): JSX_2.Element | null;
@@ -853,6 +855,13 @@ export declare const DialogTitle: React_2.ForwardRefExoticComponent<Omit<DialogP
 
 export declare const DialogTrigger: React_2.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
 
+export declare const DigitalSignature: ({ extension, linkProps, children, ...props }: DigitalSignatureProps) => JSX_2.Element;
+
+declare interface DigitalSignatureProps extends HtmlHTMLAttributes<HTMLDivElement> {
+    extension?: extensions;
+    linkProps?: LinkProps;
+}
+
 declare const dlVariants: (props?: ({
     variant?: "list" | "default" | null | undefined;
     size?: "default" | "sm" | null | undefined;
@@ -933,7 +942,7 @@ export declare const EmptySection: default_2.FC<EmptySectionProps>;
 export declare interface EmptySectionProps extends VariantProps<typeof emptySectionVariants> {
     className?: string;
     title?: string;
-    message?: string;
+    description?: string | default_2.ReactNode;
     icon?: default_2.ReactNode;
     children?: default_2.ReactNode;
     bordered?: boolean;
@@ -944,6 +953,8 @@ declare const emptySectionVariants: (props?: ({
     background?: "gray" | "transparent" | "white" | null | undefined;
 } & ClassProp) | undefined) => string;
 
+declare type extensions = '.gov.sa' | '.edu.sa' | '.org.sa' | '.sch.sa' | '.sa';
+
 declare interface Extra {
     startAdornment?: React_2.ReactNode | string;
     endAdornment?: React_2.ReactNode | string;
@@ -960,20 +971,21 @@ export declare type FileInfo = {
     id: string;
     file: File;
     progress: number;
-    status: 'uploading' | 'success' | 'error';
+    status?: 'uploading' | 'success' | 'error';
     error?: string;
 };
 
-export declare function FileUpload({ acceptedFormats, onFileSelect, multiple, disabled, maxSize, maxFiles, customError, }: FileUploadProps): JSX_2.Element;
+export declare function FileUpload({ acceptedFormats, onFileSelect, multiple, disabled, maxSize, maxFiles, customError, isInvalid, isRequired, label, browseLabel, description, value, onChange, }: FileUploadProps): JSX_2.Element;
 
-declare interface FileUploadProps {
-    acceptedFormats?: AcceptedFormatsType;
-    onFileSelect?: (files: FileInfo[], updateCallback: (id: string, progress: number) => void) => void;
+declare interface FileUploadProps extends SharedProps {
     multiple?: boolean;
-    maxSize?: number;
-    disabled?: boolean;
     maxFiles?: number;
     customError?: string;
+    isInvalid?: boolean;
+    value?: FileInfo[];
+    acceptedFormats?: AcceptedFormatsType;
+    onFileSelect?: (files: FileInfo[], updateCallback: (id: string, progress: number, status?: FileInfo['status'], error?: string) => void) => void;
+    onChange: (files: FileInfo[]) => void;
 }
 
 export declare const FilterGroup: default_2.ForwardRefExoticComponent<FilterGroupProps & default_2.RefAttributes<HTMLDivElement>>;
@@ -989,6 +1001,10 @@ declare interface FilterGroupProps extends default_2.HTMLAttributes<HTMLDivEleme
     resetButtonLabel?: string;
     /** Additional props for the reset button */
     resetButtonProps?: ButtonProps;
+    /** Additional props for the filter button */
+    filterButtonProps?: ButtonProps;
+    /** Icon for the filter button */
+    filterIcon?: default_2.ReactNode;
 }
 
 export declare const FilterSelect: default_2.MemoExoticComponent<({ multi, data, placeholder, disabled, isLoading, rounded, size, name, defaultOpen }: FilterSelectProps) => JSX_2.Element>;
@@ -1112,7 +1128,7 @@ export declare const Heading: default_2.ForwardRefExoticComponent<{
     as?: AllowedElements | undefined;
     asChild?: boolean;
     children?: ReactNode;
-} & Omit<default_2.DetailedHTMLProps<default_2.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & default_2.RefAttributes<"symbol" | "object" | "code" | "map" | "filter" | "search" | "big" | "link" | "small" | "sub" | "sup" | "stop" | "label" | "s" | "dd" | "a" | "button" | "div" | "form" | "h2" | "h3" | "img" | "input" | "li" | "nav" | "ol" | "p" | "select" | "span" | "svg" | "ul" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "cite" | "col" | "colgroup" | "data" | "datalist" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "h1" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "ins" | "kbd" | "keygen" | "legend" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "noindex" | "noscript" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "samp" | "slot" | "script" | "section" | "source" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "var" | "video" | "wbr" | "webview" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | default_2.ComponentClass<any, any> | default_2.FunctionComponent<any>>>;
+} & Omit<default_2.DetailedHTMLProps<default_2.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & default_2.RefAttributes<"symbol" | "object" | "code" | "map" | "filter" | "search" | "big" | "link" | "small" | "sub" | "sup" | "stop" | "label" | "s" | "dd" | "a" | "button" | "div" | "form" | "h2" | "h3" | "img" | "input" | "li" | "nav" | "ol" | "p" | "span" | "svg" | "ul" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "cite" | "col" | "colgroup" | "data" | "datalist" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "h1" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "ins" | "kbd" | "keygen" | "legend" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "noindex" | "noscript" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "samp" | "slot" | "script" | "section" | "select" | "source" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "var" | "video" | "wbr" | "webview" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | default_2.ComponentClass<any, any> | default_2.FunctionComponent<any>>>;
 
 export declare const HoverCard: React_2.FC<HoverCardPrimitive.HoverCardProps>;
 
@@ -1250,6 +1266,23 @@ export declare const linkVariants: (props?: ({
     disabled?: boolean | null | undefined;
 } & ClassProp) | undefined) => string;
 
+export declare const List: {
+    ({ children, variant, colors, items, icon, className, ...props }: ListProps): JSX_2.Element;
+    displayName: string;
+};
+
+export declare const ListItem: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLLIElement> & default_2.RefAttributes<HTMLLIElement>>;
+
+declare type ListProps = default_2.HTMLAttributes<HTMLUListElement> & VariantProps<typeof listVariants> & {
+    items?: string[] | default_2.ReactNode[];
+    icon?: default_2.ReactNode;
+};
+
+declare const listVariants: (props?: ({
+    variant?: "ordered" | "unordered" | "with-icon" | null | undefined;
+    colors?: "primary" | "neutral" | "onColor" | null | undefined;
+} & ClassProp) | undefined) => string;
+
 declare namespace Local_DTO_2 {
     type User = {
         ProfilePicture?: string;
@@ -1392,7 +1425,7 @@ declare namespace Local_DTO_2 {
     };
 }
 
-export declare function MultiSelect<T extends ValueType>({ placeholder, options, selectedValues, onChange, disabled, size, dataTestId, rounded, variant, colors, isLoading, className, checkboxSize, }: Readonly<MultiSelectProps<T>>): JSX_2.Element;
+export declare function MultiSelect<T extends ValueType>({ placeholder, options, selectedValues, onChange, disabled, size, dataTestId, rounded, variant, colors, isLoading, className, checkboxSize, threshold, }: Readonly<MultiSelectProps<T>>): JSX_2.Element;
 
 export declare interface MultiSelectProps<T extends ValueType> extends VariantProps<typeof selectVariants> {
     placeholder: string;
@@ -1404,6 +1437,7 @@ export declare interface MultiSelectProps<T extends ValueType> extends VariantPr
     className?: string;
     isLoading?: boolean;
     checkboxSize?: 'default' | 'sm' | 'xs';
+    threshold?: number;
 }
 
 export declare const NavigationAction: React_2.ForwardRefExoticComponent<React_2.HtmlHTMLAttributes<HTMLButtonElement> & {
@@ -1706,6 +1740,15 @@ export declare const Separator: React_2.ForwardRefExoticComponent<Omit<Separator
 
 export declare const setLanguage: (lang: string) => void;
 
+declare interface SharedProps {
+    maxSize?: number;
+    description?: string | ReactNode;
+    label?: string;
+    browseLabel?: string;
+    isRequired?: boolean;
+    disabled?: boolean;
+}
+
 export declare const Sheet: default_2.FC<DialogPrimitive.DialogProps>;
 
 export declare const SheetBody: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;
@@ -1930,6 +1973,7 @@ declare interface State {
 export declare const Step: React_2.ForwardRefExoticComponent<Omit<React_2.DetailedHTMLProps<React_2.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     'data-index'?: number;
     lastStep?: boolean;
+    progressClassName?: string;
 } & React_2.RefAttributes<HTMLDivElement>>;
 
 export declare const StepDescription: React_2.ForwardRefExoticComponent<React_2.HtmlHTMLAttributes<HTMLParagraphElement> & React_2.RefAttributes<HTMLParagraphElement>>;
@@ -2057,6 +2101,23 @@ ColorContrast: string;
 SignLanguage: string;
 VoiceCommands: string;
 };
+DigitalSignatureContent: {
+secureTitle: string;
+secureDesc: string;
+registered: string;
+howCheck: string;
+officialSite: string;
+govSaTitle: string;
+govSaDesc: string;
+eduSaTitle: string;
+eduSaDesc: string;
+orgSaTitle: string;
+orgSaDesc: string;
+saTitle: string;
+saDesc: string;
+schSaTitle: string;
+schSaDesc: string;
+};
 } | {
 messages: {
 exceedlimitedField: string;
@@ -2164,6 +2225,23 @@ ColorContrast: string;
 SignLanguage: string;
 VoiceCommands: string;
 };
+DigitalSignatureContent: {
+secureTitle: string;
+secureDesc: string;
+registered: string;
+howCheck: string;
+officialSite: string;
+govSaTitle: string;
+govSaDesc: string;
+eduSaTitle: string;
+eduSaDesc: string;
+orgSaTitle: string;
+orgSaDesc: string;
+saTitle: string;
+saDesc: string;
+schSaTitle: string;
+schSaDesc: string;
+};
 }>;
 
 export { SubmitHandler }
@@ -2212,7 +2290,7 @@ export declare const tabVariants: (props?: ({
     orientation?: "horizontal" | "vertical" | null | undefined;
 } & ClassProp) | undefined) => string;
 
-declare const Text_2: default_2.ForwardRefExoticComponent<TextProps<AllowedElements_2> & default_2.RefAttributes<"symbol" | "object" | "code" | "map" | "filter" | "search" | "big" | "link" | "small" | "sub" | "sup" | "stop" | "label" | "s" | "dd" | "a" | "button" | "div" | "form" | "h2" | "h3" | "img" | "input" | "li" | "nav" | "ol" | "p" | "select" | "span" | "svg" | "ul" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "cite" | "col" | "colgroup" | "data" | "datalist" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "h1" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "ins" | "kbd" | "keygen" | "legend" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "noindex" | "noscript" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "samp" | "slot" | "script" | "section" | "source" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "var" | "video" | "wbr" | "webview" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | default_2.ComponentClass<any, any> | default_2.FunctionComponent<any>>>;
+declare const Text_2: default_2.ForwardRefExoticComponent<TextProps<AllowedElements_2> & default_2.RefAttributes<"symbol" | "object" | "code" | "map" | "filter" | "search" | "big" | "link" | "small" | "sub" | "sup" | "stop" | "label" | "s" | "dd" | "a" | "button" | "div" | "form" | "h2" | "h3" | "img" | "input" | "li" | "nav" | "ol" | "p" | "span" | "svg" | "ul" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "cite" | "col" | "colgroup" | "data" | "datalist" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "h1" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "ins" | "kbd" | "keygen" | "legend" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "noindex" | "noscript" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "samp" | "slot" | "script" | "section" | "select" | "source" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "var" | "video" | "wbr" | "webview" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | default_2.ComponentClass<any, any> | default_2.FunctionComponent<any>>>;
 export { Text_2 as Text }
 
 export declare const Textarea: React_2.ForwardRefExoticComponent<TextareaProps & React_2.RefAttributes<HTMLTextAreaElement>>;