gd-design-library 0.2.0 → 0.3.1

package/components/core/DropdownItem/DropdownItem.types.d.ts

@@ -1,16 +1,15 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { Theme } from '../../../hooks/useTheme';
-import { OnSelectProps } from '../types/events.types';
+import { PropsWithChildren } from 'react';
+import { OnSelectProps, CommonCssComponentStyledProps } from '../..';
+import { Theme } from '../../../hooks';
 export interface DropdownItemProps<T> extends PropsWithChildren {
+    theme?: Theme;
     onSelect?: (props: OnSelectProps) => T;
     disabled?: boolean;
-    children: ReactNode;
     value?: unknown;
     itemIndex?: number;
     name?: string;
     customClass?: string;
-    theme?: Theme;
 }
-export interface StyledDropdownItemProps {
-    theme?: Theme;
+export interface DropdownItemStyledProps extends CommonCssComponentStyledProps {
+    $disabled?: boolean;
 }

package/components/core/DropdownItem/DropdownItemStyled.d.ts

@@ -0,0 +1,2 @@
+import { DropdownItemStyledProps } from './DropdownItem.types';
+export declare const DropdownItemStyled: import('react').ForwardRefExoticComponent<Omit<DropdownItemStyledProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/components/core/DropdownItem/DropdownItemStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@emotion/react/jsx-runtime"),u=require("react"),t=require("../../../utils/helpers.js"),a=u.forwardRef((s,r)=>{const{theme:{select:e}={},$disabled:o,...c}=s,l=t.get(e,"item.default",{}),d=t.get(e,"item.disabled",{}),n=[l,o?d:{}];return i.jsx("div",{css:n,...c,ref:r})});exports.DropdownItemStyled=a;

package/components/core/DropdownItem/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="DropdownItem";exports.COMPONENT_NAME=e;

package/components/core/Form/Form.d.ts

@@ -1,5 +1,2 @@
 import { FormProps } from './Form.types';
-declare const Form: import('react').ForwardRefExoticComponent<FormProps & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLFormElement>>;
-export default Form;
+export declare const Form: import('react').ForwardRefExoticComponent<FormProps & import('react').RefAttributes<HTMLFormElement>>;

package/components/core/Form/Form.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("@emotion/react/jsx-runtime"),a=require("react"),s=require("../../../utils/helpers.js"),j=require("../../../hooks/useTheme/useTheme.js"),m=require("./constants.js"),n=require("./utils.js"),q=require("./FormStyled.js"),b=a.forwardRef((d,h)=>{const{children:f,ariaLabelBy:c,describedBy:l,role:i,onSubmit:r,onChange:o,...g}=d,{theme:y}=j.useTheme(),O=a.useCallback(e=>{if(!o)return;const t=s.get(e,"target"),N=n.transformFormDataToObjectWithValues(s.get(t,"form")),u=n.transformFormElementDataToObjectWithValues(t);o({event:e,changedControlNames:Object.keys(u),controlValues:u,formData:N})},[o]),C=a.useCallback(e=>{if(!r)return;const t=n.transformFormDataToObjectWithValues(s.get(e,"target"));r({event:e,formData:t})},[r]);return T.jsx(q.FormStyled,{ref:h,onSubmit:C,onChange:O,theme:y,"data-testid":m.COMPONENT_NAME,...c?{"aria-labelledby":c}:{},...l?{"aria-describedby":l}:{},...i?{"aria-role":i}:{},...g,children:f})});b.displayName=m.COMPONENT_NAME;exports.Form=b;

package/components/core/Form/Form.types.d.ts

@@ -1,5 +1,5 @@
-import { FormEvent } from 'react';
-import { CommonCoreComponentProps } from '../..';
+import { FormEvent, PropsWithChildren } from 'react';
+import { CommonCssComponentProps, CommonCssComponentStyledProps } from '../..';
 export type FormFieldValue = string | number | boolean;
 export type FormFieldsData = Record<string, {
     value: FormFieldValue;
@@ -15,10 +15,15 @@ export type FormOnSubmitEventData = {
     event: FormEvent<Element>;
     formData: FormFieldsData;
 };
-export interface FormProps extends CommonCoreComponentProps {
-    onSubmit?: (formOnSubmitEventData: FormOnSubmitEventData) => void;
-    onChange?: (formOnChangeEventData: FormOnChangeEventData) => void;
+export interface FormAriaProps {
     ariaLabelBy?: string;
     describedBy?: string;
-    role?: string;
+}
+export interface FormEventHandlers {
+    onFormSubmit?: (formOnSubmitEventData: FormOnSubmitEventData) => void;
+    onFormChange?: (formOnChangeEventData: FormOnChangeEventData) => void;
+}
+export interface FormProps extends CommonCssComponentProps<HTMLFormElement>, FormAriaProps, FormEventHandlers, PropsWithChildren {
+}
+export interface FormStyledProps extends CommonCssComponentStyledProps<HTMLFormElement>, PropsWithChildren {
 }

package/components/core/Form/FormStyled.d.ts

@@ -0,0 +1,2 @@
+import { FormStyledProps } from './Form.types';
+export declare const FormStyled: import('react').ForwardRefExoticComponent<Omit<FormStyledProps, "ref"> & import('react').RefAttributes<HTMLFormElement>>;

package/components/core/Form/FormStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@emotion/react/jsx-runtime"),n=require("react"),u=require("../../../utils/helpers.js"),l=n.forwardRef((e,t)=>{const{theme:{form:r}={},styles:s={}}=e,o=[u.get(r,"default",{}),s];return c.jsx("form",{css:o,...e,ref:t})});exports.FormStyled=l;

package/components/core/Form/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Form";exports.COMPONENT_NAME=e;

package/components/core/Form/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Form } from './Form';
+export * from './Form';
 export * from './Form.types';

package/components/core/Form/utils.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../utils/helpers.js");require("react");const i=require("../../../types/input.js"),u=require("../../../types/button.js"),l=r=>Array.from(e.get(r,"elements",[])).reduce((a,t)=>m(t,a),{}),m=(r,s={})=>{const a=e.get(r,"tagName","").toLowerCase(),t=e.get(r,"name"),c=e.get(r,"type"),o=e.get(r,"checked"),n=e.get(r,"value");if(!(a===u.ButtonTypes.Button||c===u.ButtonTypes.Submit||!t))switch(c){case i.InputVariantType.Checkbox:e.set(s,t,{value:n,isChecked:o});break;case i.InputVariantType.Radio:o&&e.set(s,t,{value:n,isChecked:o}),e.get(s,[t,"isChecked"],!1)||e.set(s,t,{value:"",isChecked:o});break;default:e.set(s,t,{value:n});break}return s};exports.transformFormDataToObjectWithValues=l;exports.transformFormElementDataToObjectWithValues=m;

package/components/core/Icon/Icon.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("@emotion/react/jsx-runtime"),h=require("react"),n=require("../../../utils/helpers.js"),N=require("../../../hooks/useTheme/useTheme.js"),r=require("./constants.js");let c={};const C=e=>{c={...c,...e}},u=h.forwardRef((e,a)=>{const{name:t,width:g,height:m,fill:s,fillSvg:o,...f}=e,{theme:I}=N.useTheme(),i=n.get(I,"colors",{}),l={...r.IconsList,...c}[t];return l?d.jsx(l,{ref:a,"data-testid":`${r.COMPONENT_NAME}-${t}`,width:g,height:m,fill:s&&n.get(i,s,s),fillSvg:o&&n.get(i,o,o),...f}):(console.warn(`Icon "${String(t)}" not found.`),null)});u.displayName=r.COMPONENT_NAME;exports.Icon=u;exports.registerCustomIcons=C;

package/components/core/Icon/constants.d.ts

@@ -6,32 +6,33 @@ export declare const IconsList: {
         fillSvg?: string | undefined;
         fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
-    success: ({ width, height, color, fillSvg, ...rest }: {
+    success: ({ width, height, fillSvg, fill, ...rest }: {
         [x: string]: any;
         width?: number | undefined;
         height?: number | undefined;
-        color?: string | undefined;
         fillSvg?: string | undefined;
+        fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
-    error: ({ width, height, color, fillSvg, ...rest }: {
+    error: ({ width, height, fillSvg, fill, ...rest }: {
         [x: string]: any;
         width?: number | undefined;
         height?: number | undefined;
-        color?: string | undefined;
         fillSvg?: string | undefined;
+        fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
-    warning: ({ width, height, color, fillSvg, ...rest }: {
+    warning: ({ width, height, fillSvg, fill, ...rest }: {
         [x: string]: any;
         width?: number | undefined;
         height?: number | undefined;
-        color?: string | undefined;
         fillSvg?: string | undefined;
+        fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
-    info: ({ width, height, color, ...rest }: {
+    info: ({ width, height, fillSvg, fill, ...rest }: {
         [x: string]: any;
         width?: number | undefined;
         height?: number | undefined;
-        color?: string | undefined;
+        fillSvg?: string | undefined;
+        fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
     dot: ({ width, height, fillSvg, fill, ...rest }: {
         [x: string]: any;
@@ -264,5 +265,40 @@ export declare const IconsList: {
         fillSvg?: string | undefined;
         fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
+    volumeUp: ({ width, height, fillSvg, fill, ...rest }: {
+        [x: string]: any;
+        width?: number | undefined;
+        height?: number | undefined;
+        fillSvg?: string | undefined;
+        fill?: string | undefined;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
+    contentCopy: ({ width, height, fillSvg, fill, ...rest }: {
+        [x: string]: any;
+        width?: number | undefined;
+        height?: number | undefined;
+        fillSvg?: string | undefined;
+        fill?: string | undefined;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
+    thumbUp: ({ width, height, fillSvg, fill, ...rest }: {
+        [x: string]: any;
+        width?: number | undefined;
+        height?: number | undefined;
+        fillSvg?: string | undefined;
+        fill?: string | undefined;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
+    thumbDown: ({ width, height, fillSvg, fill, ...rest }: {
+        [x: string]: any;
+        width?: number | undefined;
+        height?: number | undefined;
+        fillSvg?: string | undefined;
+        fill?: string | undefined;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
+    fileCopy: ({ width, height, fillSvg, fill, ...rest }: {
+        [x: string]: any;
+        width?: number | undefined;
+        height?: number | undefined;
+        fillSvg?: string | undefined;
+        fill?: string | undefined;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
 };
 export declare const COMPONENT_NAME = "Icon";

package/components/core/Icon/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../assets/icons/star.js"),o=require("../../../assets/icons/cross.js"),r=require("../../../assets/icons/toast_success.js"),n=require("../../../assets/icons/toast_warning.js"),t=require("../../../assets/icons/toast_error.js"),c=require("../../../assets/icons/toast_info.js"),i=require("../../../assets/icons/dot.js"),s=require("../../../assets/icons/check.js"),u=require("../../../assets/icons/attachment.js"),a=require("../../../assets/icons/arrow-down.js"),l=require("../../../assets/icons/chevron-right.js"),I=require("../../../assets/icons/chevron-left.js"),q=require("../../../assets/icons/mobile_menu_button.js"),p=require("../../../assets/icons/home.js"),h=require("../../../assets/icons/slash.js"),d=require("../../../assets/icons/arrow-forward.js"),m=require("../../../assets/icons/local_shipping.js"),g=require("../../../assets/icons/favorite.js"),f=require("../../../assets/icons/favorite_outlined.js"),w=require("../../../assets/icons/delete_outlined.js"),C=require("../../../assets/icons/account_circle.js"),O=require("../../../assets/icons/shopping_bag.js"),y=require("../../../assets/icons/error_outline.js"),_=require("../../../assets/icons/starOutlined.js"),b=require("../../../assets/icons/minus.js"),v=require("../../../assets/icons/plus.js"),T=require("../../../assets/icons/filter.js"),S=require("../../../assets/icons/ruler.js"),F=require("../../../assets/icons/processing.js"),M=require("../../../assets/icons/paymentCard.js");require("@emotion/react/jsx-runtime");const D=require("../../../assets/icons/eye.js"),E=require("../../../assets/icons/upload.js"),P=require("../../../assets/icons/search.js"),U=require("../../../assets/icons/wifiTethering.js"),A=require("../../../assets/icons/portrait.js"),L=require("../../../assets/icons/folder.js"),N=require("../../../assets/icons/folderOpen.js"),R=require("../../../assets/icons/edit.js"),k=require("../../../assets/icons/volume-up.js"),B=require("../../../assets/icons/content-copy.js"),W=require("../../../assets/icons/thumb-up.js"),j=require("../../../assets/icons/thumb-down.js"),H=require("../../../assets/icons/file-copy.js"),V={cross:o.CrossIcon,success:r.ToastSuccessIcon,error:t.ToastErrorIcon,warning:n.ToastWarningIcon,info:c.ToastInfoIcon,dot:i.DotIcon,check:s.CheckIcon,arrowDown:a.ArrowDownIcon,arrowRight:l.ChevronRightIcon,arrowLeft:I.ChevronLeftIcon,mobileMenu:q.MobileMenuIcon,home:p.HomeIcon,slash:h.SlashIcon,arrowForward:d.ArrowForwardIcon,localShipping:m.LocalShippingIcon,favorite:g.FavoriteIcon,favoriteOutlined:f.FavoriteOutlinedIcon,deleteOutlined:w.DeleteOutlinedIcon,accountCircle:C.AccountCircleIcon,shoppingBag:O.ShoppingBagIcon,errorOutline:y.ErrorOutlineIcon,star:e.StarIcon,starOutlined:_.StarOutlinedIcon,minus:b.MinusIcon,plus:v.PlusIcon,filter:T.FilterIcon,ruler:S.RulerIcon,processing:F.ProcessingIcon,paymentCard:M.PaymentCardIcon,eye:D.EyeIcon,attachment:u.AttachmentIcon,upload:E.UploadIcon,folder:L.FolderIcon,folderOpen:N.FolderOpenIcon,wifiTethering:U.WifiTetheringIcon,portrait:A.PortraitIcon,search:P.SearchIcon,edit:R.EditIcon,volumeUp:k.VolumeUpIcon,contentCopy:B.ContentCopyIcon,thumbUp:W.ThumbUpIcon,thumbDown:j.ThumbDownIcon,fileCopy:H.FileCopyIcon},x="Icon";exports.COMPONENT_NAME=x;exports.IconsList=V;

package/components/core/Icon/utils.d.ts

@@ -0,0 +1,3 @@
+import { ComponentProps } from 'react';
+import { IconProps } from '.';
+export declare const createLazyIcon: () => ({ ...props }: ComponentProps<"svg"> & IconProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/core/Image/Image.d.ts

@@ -1,3 +1,2 @@
 import { ImageProps } from './Image.types';
-declare const Image: ({ id, src, alt, width, height, className, placeholder, caption, onClick, objectFit, styles, }: ImageProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-export default Image;
+export declare const Image: import('react').ForwardRefExoticComponent<ImageProps & import('react').RefAttributes<HTMLImageElement>>;

package/components/core/Image/Image.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@emotion/react/jsx-runtime"),N=require("react"),P=require("../../../hooks/useTheme/useTheme.js"),f=require("../Skeleton/Skeleton.js"),t=require("./constants.js"),a=require("./ImageStyled.js"),h=N.forwardRef((g,m)=>{const{id:p,src:E,alt:M,width:i,height:n,placeholder:c,caption:l,onClick:O,onLoad:r,onError:o,objectFit:S,styles:y,...C}=g,[d,u]=N.useState(!0),{theme:s}=P.useTheme(),j=()=>{u(!1),r==null||r()},T=()=>{u(!1),o==null||o()};return e.jsxs(a.ImageWrapperStyled,{"data-testid":`${t.COMPONENT_NAME}-wrapper`,id:p,width:i,height:n,theme:s,...C,children:[d&&c&&e.jsx(a.PlaceholderStyled,{"data-testid":`${t.COMPONENT_NAME}-placeholder`,theme:s,children:e.jsx(f.Skeleton,{height:"100%",children:c})}),e.jsx(a.ImageStyled,{"data-testid":t.COMPONENT_NAME,theme:s,src:E,alt:M,width:i,height:n,objectFit:S,$isLoading:d,onLoad:j,onError:T,onClick:O,styles:y,ref:m}),l&&e.jsx(a.CaptionStyled,{"data-testid":`${t.COMPONENT_NAME}-caption`,theme:s,children:l})]})});h.displayName=t.COMPONENT_NAME;exports.Image=h;

package/components/core/Image/Image.types.d.ts

@@ -1,6 +1,5 @@
-import { CommonComponentProps } from '../..';
-import { Theme } from '../../../hooks/useTheme';
-export interface ImageProps extends CommonComponentProps {
+import { CommonCssComponentProps, CommonCssComponentStyledProps } from '../..';
+export interface ImageProps extends CommonCssComponentProps {
     id?: string;
     src?: string;
     alt?: string;
@@ -10,18 +9,18 @@ export interface ImageProps extends CommonComponentProps {
     placeholder?: string;
     caption?: string;
     onClick?: () => void;
+    onError?: () => void;
+    onLoad?: () => void;
     objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
 }
-export interface StyledImageWrapperProps extends Pick<ImageProps, 'width' | 'height' | 'id' | 'className'> {
-    theme: Theme;
+export interface ImageWrapperStyledProps extends Pick<ImageProps, 'width' | 'height' | 'id' | 'className'>, CommonCssComponentStyledProps {
 }
-export interface StyledImageProps extends Pick<ImageProps, 'objectFit'> {
-    theme: Theme;
+export interface ImageStyledProps extends Pick<ImageProps, 'objectFit'>, CommonCssComponentStyledProps<HTMLImageElement> {
     $isLoading?: boolean;
+    src?: string;
+    alt?: string;
+    width?: number;
+    height?: number;
 }
-export interface StyledImagePlaceholderProps {
-    theme: Theme;
-}
-export interface StyledImageCaptionProps {
-    theme: Theme;
-}
+export type ImagePlaceholderStyledProps = CommonCssComponentStyledProps;
+export type ImageCaptionStyledProps = CommonCssComponentStyledProps;

package/components/core/Image/ImageStyled.d.ts

@@ -0,0 +1,5 @@
+import { ImageWrapperStyledProps, ImageStyledProps, ImagePlaceholderStyledProps, ImageCaptionStyledProps } from './Image.types';
+export declare const ImageWrapperStyled: (props: ImageWrapperStyledProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const ImageStyled: import('react').ForwardRefExoticComponent<Omit<ImageStyledProps, "ref"> & import('react').RefAttributes<HTMLImageElement>>;
+export declare const PlaceholderStyled: (props: ImagePlaceholderStyledProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const CaptionStyled: (props: ImageCaptionStyledProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/core/Image/ImageStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@emotion/react/jsx-runtime"),d=require("react"),c=require("../../../utils/helpers.js"),l=s=>{const{width:e,height:t,theme:{image:r}={},...i}=s,n=[c.get(r,"wrapper",{}),{width:`${e?`${e}px`:"100%"}`,height:`${t?`${t}px`:"100%"}`}];return o.jsx("div",{css:n,...i})},p=d.forwardRef((s,e)=>{const{objectFit:t="cover",$isLoading:r,theme:{image:i}={},...n}=s,a=[c.get(i,"default",{}),{objectFit:t,opacity:`${r?0:1}`}];return o.jsx("img",{css:a,...n,ref:e})}),g=s=>{const{theme:{image:e}={},...t}=s,r=[c.get(e,"placeholder",{})];return o.jsx("div",{css:r,...t})},m=s=>{const{theme:{image:e}={},...t}=s,r=[c.get(e,"caption",{})];return o.jsx("figcaption",{css:r,...t})};exports.CaptionStyled=m;exports.ImageStyled=p;exports.ImageWrapperStyled=l;exports.PlaceholderStyled=g;

package/components/core/Image/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Image";exports.COMPONENT_NAME=e;

package/components/core/Image/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Image } from './Image';
+export * from './Image';
 export * from './Image.types';

package/components/core/InlineNotification/InlineNotification.d.ts

@@ -1,4 +1,2 @@
 import { InlineNotificationProps } from './InlineNotification.types';
-export declare const InlineNotification: import('react').ForwardRefExoticComponent<InlineNotificationProps & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
+export declare const InlineNotification: import('react').ForwardRefExoticComponent<InlineNotificationProps & import('react').RefAttributes<HTMLDivElement>>;

package/components/core/InlineNotification/InlineNotification.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@emotion/react/jsx-runtime"),q=require("react"),l=require("../../../utils/helpers.js"),v=require("../../../utils/common.js"),I=require("../../../hooks/useTheme/useTheme.js"),O=require("../Icon/Icon.js"),e=require("./constants.js"),u=require("./InlineNotificationStyled.js"),N=q.forwardRef((d,m)=>{const{variant:i=e.DEFAULT_VARIANT,className:f,styles:T,children:n,...y}=d,{theme:s}=I.useTheme(),t=l.get(s,["inlineNotification",i,"icon"],{name:""}),a=v.isChildPrimitive(n),{ariaLive:o,role:c}=l.get(e.accessibilityValues,i,e.accessibilityValues.default);return r.jsxs(u.InlineNotificationStyled,{ref:m,"data-testid":e.COMPONENT_NAME,$variant:i,className:f,styles:T,theme:s,...o?{"aria-live":o}:{},...c?{role:c}:{},...y,children:[(t==null?void 0:t.name)&&r.jsx(O.Icon,{...t}),a&&r.jsx(u.InlineNotificationMessageStyled,{"data-testid":e.CONTENT_COMPONENT,$variant:i,theme:s,children:n}),!a&&n]})});N.displayName=e.COMPONENT_NAME;exports.InlineNotification=N;

package/components/core/InlineNotification/InlineNotification.types.d.ts

@@ -5,5 +5,5 @@ export interface InlineNotificationProps extends CommonCssComponentProps, PropsW
     variant?: InlineNotificationVariant;
 }
 export interface InlineNotificationsStyledProps<T = HTMLDivElement> extends CommonCssComponentStyledProps<T>, PropsWithChildren {
-    $variant?: InlineNotificationVariant;
+    $variant: InlineNotificationVariant;
 }

package/components/core/InlineNotification/InlineNotificationStyled.d.ts

@@ -1,3 +1,3 @@
 import { InlineNotificationsStyledProps } from './InlineNotification.types';
-export declare const InlineNotificationStyled: (props: InlineNotificationsStyledProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const InlineNotificationStyled: import('react').ForwardRefExoticComponent<Omit<InlineNotificationsStyledProps<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export declare const InlineNotificationMessageStyled: (props: InlineNotificationsStyledProps<HTMLSpanElement>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/core/InlineNotification/InlineNotificationStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@emotion/react/jsx-runtime"),d=require("react"),n=require("../../../utils/helpers.js"),f=d.forwardRef((s,t)=>{const{theme:{inlineNotification:e}={},$variant:i,styles:o={},...c}=s,r=n.get(e,"default.wrapper",{}),a=n.get(e,[i,"wrapper"],{}),u=[r,a,o];return l.jsx("div",{css:u,...c,ref:t})}),y=s=>{const{theme:{inlineNotification:t}={},$variant:e,styles:i={},...o}=s,c=n.get(t,"default.content",{}),r=n.get(t,[e,"content"],{}),a=[c,r,i];return l.jsx("span",{css:a,...o})};exports.InlineNotificationMessageStyled=y;exports.InlineNotificationStyled=f;

package/components/core/InlineNotification/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a="InlineNotification",t="InlineNotificationComponent",e={ariaLive:"polite",role:"status"},i={ariaLive:"assertive",role:"alert"},s={default:e,success:e,info:e,error:i,warning:i},r="basic";exports.COMPONENT_NAME=a;exports.CONTENT_COMPONENT=t;exports.DEFAULT_VARIANT=r;exports.accessibilityValues=s;exports.defaultAriaValues=e;exports.errorAriaValues=i;

package/components/core/Input/Input.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@emotion/react/jsx-runtime"),U=require("react"),C=require("../../../hooks/useTheme/useTheme.js"),w=require("../../../types/common.js"),e=require("./constants.js"),H=require("./useInputHandlers.js"),d=require("./InputWrapper/InputWrapper.js"),c=require("./InputAdornment/InputAdornment.js"),p=require("./InputHelper/InputHelper.js"),v=require("./InputStyled.js"),P=U.forwardRef((I,O)=>{const{theme:m}=C.useTheme(),{width:E,className:S=e.DEFAULT_PROPS.className,styles:T=e.DEFAULT_PROPS.styles,variant:s=e.DEFAULT_PROPS.variant,color:a=e.DEFAULT_PROPS.color,disabled:_=e.DEFAULT_PROPS.disabled,readOnly:h=e.DEFAULT_PROPS.readOnly,ariaRequired:N=e.DEFAULT_PROPS.ariaRequired,role:A=e.DEFAULT_PROPS.role,tabIndex:b=e.DEFAULT_PROPS.tabIndex,ariaDescribedBy:o,debounceCallbackTime:x,onChange:D,onKeyDown:q,onMouseDown:y,onBlur:R,adornmentStart:i,adornmentEnd:u,label:n,helperText:t,...j}=I,l=!e.FOCUS_EXCLUDED_LIST.includes(s),F=!!(n||t),{handlers:M,isMouseInteraction:L}=H.useInputHandlers({onKeyDown:q,onBlur:R,onMouseDown:y,onChange:D,debounceCallbackTime:x});return r.jsxs(d.InputWrapper,{as:"label",withGap:F,className:S,width:E,styles:T,children:[n&&r.jsx(p.InputHelper,{children:n}),r.jsxs(d.InputWrapper,{children:[i&&r.jsx(c.InputAdornment,{children:i}),r.jsx(v.InputStyled,{$isMouseInteraction:L&&l,$color:a,ref:O,disabled:_,role:A,theme:m,type:s,readOnly:h,tabIndex:b,"aria-required":N,"data-testid":e.COMPONENT_NAME,...M,...o?{"aria-describedby":o}:{},...j}),l&&r.jsxs(r.Fragment,{children:[r.jsx("div",{className:`${e.COMPONENT_NAME}__border`}),r.jsx("div",{className:`${e.COMPONENT_NAME}__outline`})]}),u&&r.jsx(c.InputAdornment,{children:u})]}),t&&r.jsx(p.InputHelper,{color:a,size:w.SizeVariant.Sm,children:t})]})});P.displayName=e.COMPONENT_NAME;exports.Input=P;

package/components/core/Input/Input.types.d.ts

@@ -1,41 +1,12 @@
-import { ChangeEvent, FocusEvent, MouseEvent, KeyboardEvent, ReactNode, ElementType } from 'react';
-import { CommonComponentProps, CommonCoreComponentProps, CommonStyledComponentProps, CommonCoreStyledComponentProps, SizeVariant } from '../..';
-import { EnumOrPrimitive } from '../../../types';
-export declare enum InputVariantType {
-    Text = "text",
-    Password = "password",
-    Email = "email",
-    Search = "search",
-    Url = "url",
-    Tel = "tel",
-    Date = "date",
-    Time = "time",
-    Month = "month",
-    Week = "week",
-    Color = "color",
-    Range = "range",
-    Number = "number",
-    Radio = "radio",
-    Checkbox = "checkbox"
-}
-export declare enum InputColorVariant {
-    Primary = "primary",
-    Success = "success",
-    Warning = "warning",
-    Error = "error"
-}
-export declare enum InputRole {
-    Textbox = "textbox",
-    Checkbox = "checkbox",
-    Radio = "radio",
-    Radiogroup = "radiogroup",
-    Combobox = "combobox"
-}
-export interface BaseInputFieldProps extends CommonCoreComponentProps<InputVariantType, InputColorVariant> {
+import { ChangeEvent, FocusEvent, MouseEvent, KeyboardEvent, ReactNode, ElementType, PropsWithChildren } from 'react';
+import { EnumOrPrimitive, InputColorVariant, InputRole, InputVariantType, SizeVariant } from '../../../types';
+import { CommonCssComponentProps, CommonCssComponentStyledProps } from '../..';
+export interface BaseInputFieldProps extends CommonCssComponentProps<HTMLInputElement> {
     readOnly?: boolean;
     id?: string;
     name?: string;
-    type?: EnumOrPrimitive<InputVariantType>;
+    variant?: EnumOrPrimitive<InputVariantType>;
+    color?: EnumOrPrimitive<InputColorVariant>;
     label?: string;
     placeholder?: string;
     value?: string | number;
@@ -72,21 +43,31 @@ export type InputFieldProps = (BaseInputFieldProps | RadioButtonProps | Checkbox
     adornmentStart?: ReactNode;
     adornmentEnd?: ReactNode;
 };
-export interface InputWrapperProps extends CommonComponentProps {
+export interface InputAdornmentProps extends CommonCssComponentProps, PropsWithChildren {
+}
+export interface InputWrapperProps extends CommonCssComponentProps<HTMLBaseElement>, PropsWithChildren {
     as?: keyof HTMLElementTagNameMap | ElementType;
     width?: string;
     withGap?: boolean;
 }
-export interface InputHelperProps extends CommonCoreComponentProps<never, InputColorVariant> {
+export interface InputHelperProps extends CommonCssComponentProps, PropsWithChildren {
+    color?: EnumOrPrimitive<InputColorVariant>;
     size?: EnumOrPrimitive<SizeVariant>;
 }
-export interface StyledInputProps extends CommonCoreStyledComponentProps<InputVariantType, InputColorVariant> {
-    $isMouseInteraction: boolean;
-}
-export interface StyledInputWrapperProps extends CommonStyledComponentProps {
+export interface InputWrapperPropsStyled extends CommonCssComponentStyledProps<HTMLBaseElement>, PropsWithChildren {
+    $as?: keyof HTMLElementTagNameMap | ElementType;
     $width?: string;
     $withGap?: boolean;
 }
-export interface StyledInputHelperProps extends CommonCoreStyledComponentProps<never, InputColorVariant> {
+export interface InputHelperPropsStyled extends CommonCssComponentStyledProps, PropsWithChildren {
+    $color?: EnumOrPrimitive<InputColorVariant>;
     $size?: EnumOrPrimitive<SizeVariant>;
 }
+export interface InputPropsStyled extends CommonCssComponentStyledProps<HTMLInputElement> {
+    $isMouseInteraction: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    type?: EnumOrPrimitive<InputVariantType>;
+    $variant?: EnumOrPrimitive<InputVariantType>;
+    $color?: EnumOrPrimitive<InputColorVariant>;
+}

package/components/core/Input/InputAdornment/InputAdornment.d.ts

@@ -1,4 +1,2 @@
-import { CommonComponentProps } from '../../..';
-export declare const InputAdornment: import('react').ForwardRefExoticComponent<CommonComponentProps & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
+import { InputAdornmentProps } from '../Input.types';
+export declare const InputAdornment: import('react').ForwardRefExoticComponent<InputAdornmentProps & import('react').RefAttributes<HTMLDivElement>>;

package/components/core/Input/InputAdornment/InputAdornment.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@emotion/react/jsx-runtime"),c=require("react"),d=require("../../../../hooks/useTheme/useTheme.js"),e=require("./constants.js"),i=require("./InputAdornmentStyled.js"),t=c.forwardRef((n,r)=>{const{theme:s}=d.useTheme(),{children:o}=n;return u.jsx(i.InputAdornmentStyled,{ref:r,theme:s,"data-testid":e.COMPONENT_NAME,children:o})});t.displayName=e.COMPONENT_NAME;exports.InputAdornment=t;

package/components/core/Input/InputAdornment/InputAdornmentStyled.d.ts

@@ -0,0 +1,2 @@
+import { CommonCssComponentStyledProps } from '../../..';
+export declare const InputAdornmentStyled: (props: CommonCssComponentStyledProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/core/Input/InputAdornment/InputAdornmentStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("@emotion/react/jsx-runtime"),o=require("../../../../utils/helpers.js");require("react");const u=e=>{const{theme:{input:t}={},...n}=e,r=[o.get(t,"adornment.default",{})];return s.jsx("div",{css:r,...n})};exports.InputAdornmentStyled=u;

package/components/core/Input/InputAdornment/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t="InputAdornment";exports.COMPONENT_NAME=t;

package/components/core/Input/InputHelper/InputHelper.d.ts

@@ -1,4 +1,2 @@
 import { InputHelperProps } from '../Input.types';
-export declare const InputHelper: import('react').ForwardRefExoticComponent<InputHelperProps & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
+export declare const InputHelper: import('react').ForwardRefExoticComponent<InputHelperProps & import('react').RefAttributes<HTMLDivElement>>;

package/components/core/Input/InputHelper/InputHelper.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@emotion/react/jsx-runtime"),l=require("react"),a=require("../../../../hooks/useTheme/useTheme.js"),p=require("../../../../types/common.js"),d=require("../../../../types/input.js"),e=require("./constants.js"),m=require("./InputHelperStyled.js"),r=l.forwardRef((t,n)=>{const{theme:o}=a.useTheme(),{children:s,size:i=p.SizeVariant.Md,color:u=d.InputColorVariant.Primary}=t;return c.jsx(m.InputHelperStyled,{$size:i,$color:u,ref:n,theme:o,"data-testid":e.COMPONENT_NAME,children:s})});r.displayName=e.COMPONENT_NAME;exports.InputHelper=r;

package/components/core/Input/InputHelper/InputHelperStyled.d.ts

@@ -0,0 +1,2 @@
+import { InputHelperPropsStyled } from '../Input.types';
+export declare const InputHelperStyled: (props: InputHelperPropsStyled) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/core/Input/InputHelper/InputHelperStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@emotion/react/jsx-runtime"),e=require("../../../../utils/helpers.js");require("react");const i=s=>{const{theme:{input:n}={},$color:o,$size:t,...l}=s,r=e.get(n,"helper",{}),u=[e.get(r,["default",t],{}),e.get(r,[o,t],{})];return c.jsx("div",{css:u,...l})};exports.InputHelperStyled=i;

package/components/core/Input/InputHelper/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="InputHelper";exports.COMPONENT_NAME=e;

package/components/core/Input/InputStyled.d.ts

@@ -0,0 +1,2 @@
+import { InputPropsStyled } from './Input.types';
+export declare const InputStyled: import('react').ForwardRefExoticComponent<Omit<InputPropsStyled, "ref"> & import('react').RefAttributes<HTMLInputElement>>;

package/components/core/Input/InputStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@emotion/react/jsx-runtime"),p=require("react"),e=require("../../../utils/helpers.js"),a=p.forwardRef((n,o)=>{const{theme:{input:r}={},$isMouseInteraction:s,$color:u,...c}=n,t=e.get(r,"input",{}),i=[e.get(t,"default",{}),e.get(t,[s?"mouseInteraction":"defaultInteraction"],{}),e.get(t,u,{})];return l.jsx("input",{css:i,...c,ref:o})});exports.InputStyled=a;

package/components/core/Input/InputWrapper/InputWrapper.d.ts

@@ -1,4 +1,2 @@
 import { InputWrapperProps } from '../Input.types';
-export declare const InputWrapper: import('react').ForwardRefExoticComponent<InputWrapperProps & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
+export declare const InputWrapper: import('react').ForwardRefExoticComponent<InputWrapperProps & import('react').RefAttributes<HTMLBaseElement>>;

package/components/core/Input/InputWrapper/InputWrapper.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@emotion/react/jsx-runtime"),d=require("react"),h=require("../../../../hooks/useTheme/useTheme.js"),e=require("./constants.js"),l=require("./InputWrapperStyled.js"),t=d.forwardRef((r,s)=>{const{theme:n}=h.useTheme(),{children:a,as:i=e.DEFAULT_AS_ELEMENT,width:u,withGap:p,...c}=r;return o.jsx(l.InputWrapperStyled,{$as:i,$width:u,$withGap:p,ref:s,theme:n,"data-testid":e.COMPONENT_NAME,...c,children:a})});t.displayName=e.COMPONENT_NAME;exports.InputWrapper=t;

package/components/core/Input/InputWrapper/InputWrapperStyled.d.ts

@@ -0,0 +1,2 @@
+import { InputWrapperPropsStyled } from '../Input.types';
+export declare const InputWrapperStyled: (props: InputWrapperPropsStyled) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/core/Input/InputWrapper/InputWrapperStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@emotion/react/jsx-runtime"),e=require("../../../../utils/helpers.js");require("react");const a=s=>{const{theme:{input:n}={},$width:t,$as:p="div",$withGap:o,styles:i={},...u}=s,r=e.get(n,"wrapper",{}),c=[e.get(r,"default",{}),o?e.get(r,"withGap",{}):{},t?{width:t}:{},i];return l.jsx(p,{css:c,...u})};exports.InputWrapperStyled=a;

package/components/core/Input/InputWrapper/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E="InputWrapper",t="div";exports.COMPONENT_NAME=E;exports.DEFAULT_AS_ELEMENT=t;

package/components/core/Input/constants.d.ts

@@ -1,16 +1,14 @@
-import { CSSObject } from 'styled-components';
-import { TabIndex } from '../../../types';
-import { InputColorVariant, InputRole, InputVariantType } from './Input.types';
+import { TabIndex, InputColorVariant, InputRole, InputVariantType } from '../../../types';
 export declare const COMPONENT_NAME = "Input";
 export declare const DEFAULT_PROPS: {
     variant: InputVariantType;
     color: InputColorVariant;
-    classNames: string;
+    className: string;
     disabled: boolean;
     readOnly: boolean;
     ariaRequired: boolean;
     role: InputRole;
     tabIndex: TabIndex;
-    styles: CSSObject;
+    styles: {};
 };
 export declare const FOCUS_EXCLUDED_LIST: InputVariantType[];

package/components/core/Input/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../../types/accesability.js"),e=require("../../../types/input.js"),t="Input",n={variant:e.InputVariantType.Text,color:e.InputColorVariant.Primary,className:"",disabled:!1,readOnly:!1,ariaRequired:!1,role:e.InputRole.Textbox,tabIndex:a.TabIndex.Default,styles:{}},r=[e.InputVariantType.Checkbox,e.InputVariantType.Radio,e.InputVariantType.Range];exports.COMPONENT_NAME=t;exports.DEFAULT_PROPS=n;exports.FOCUS_EXCLUDED_LIST=r;

package/components/core/Input/useInputHandlers.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),I=require("../../../constants/keyboard.js"),n=require("../../../utils/helpers.js"),S=({onMouseDown:s,onChange:u,onKeyDown:t,onBlur:r,debounceCallbackTime:c})=>{const[i,d]=a.useState(!1),f=a.useCallback(e=>{d(!0),s==null||s(e)},[s]),l=a.useCallback(e=>{e.key===I.KEYBOARD_KEYS.TAB&&d(!1),t==null||t(e)},[t]),b=a.useCallback(e=>{d(!1),r==null||r(e)},[r]),p=typeof c=="number"&&t?n.debounce(l,c):l,h=typeof c=="number"&&u?n.debounce(u,c):u;return{handlers:{onMouseDown:f,onKeyDown:p,onBlur:b,onChange:h},isMouseInteraction:i}};exports.useInputHandlers=S;

package/components/core/InputFile/InputFile.d.ts

@@ -1,20 +1,6 @@
 import { InputFileProps } from './InputFile.types';
 /**
- * Props for the {@link InputFile} component.
- *
- * @typedef {Object} InputFileProps
- * @property {CSSObject} [styles]               - Override styles for the wrapper container.
- * @property {string} [accept]                  - Comma-separated list of accepted file types (e.g. `"image/*"`).
- * @property {string} [capture]                 - Hint for device’s capture mechanism (e.g. `"user"`, `"environment"`).
- * @property {boolean} [multiple=false]         - Whether to allow selection of multiple files.
- * @property {boolean} [disabled=false]         - Disables both the file input and button.
- * @property {(event: ChangeEvent<HTMLInputElement>) => void} [onChange] - Callback invoked when file(s) are selected.
- * @property {(event: MouseEvent<HTMLInputElement>) => void} [onClick]   - Callback invoked when the button is clicked.
- * @property {import('@components/core/Button').ButtonProps} [buttonProps] - Passthrough props for the underlying `Button`.
- * @property {string} [label]                   - Text label to display in the upload button.
- */
-/**
- * A styled wrapper around a visually-hidden `<input type="file">` and an outlined design-system `Button`.
+ * A styled wrapper around a visually hidden `<input type="file">` and an outlined design-system `Button`.
  *
  * @remarks
  * - Use `accept` to restrict selectable file types.
@@ -45,6 +31,4 @@ import { InputFileProps } from './InputFile.types';
  * }
  * ```
  */
-export declare const InputFile: import('react').ForwardRefExoticComponent<InputFileProps & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
+export declare const InputFile: import('react').ForwardRefExoticComponent<InputFileProps & import('react').RefAttributes<HTMLDivElement>>;

package/components/core/InputFile/InputFile.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@emotion/react/jsx-runtime"),i=require("react"),_=require("../../../types/button.js"),b=require("../../../hooks/useTheme/useTheme.js"),j=require("../Button/Button.js"),c=require("./constants.js"),d=require("./InputFileStyled.js"),p=i.forwardRef((I,l)=>{const{styles:h={},accept:m,capture:E,multiple:N,disabled:e,onChange:t,onClick:n,isIcon:q,children:y=c.INPUT_FILE_DEFAULT_LABEL_VALUE,buttonProps:F,...T}=I,{theme:o}=b.useTheme(),r=i.useRef(null);i.useImperativeHandle(l,()=>r.current);const f=s=>{var a;e||((a=r.current)==null||a.click(),n==null||n(s))},O=s=>{t==null||t(s)};return u.jsxs(d.InputFileWrapperStyled,{theme:o,styles:h,ref:l,"data-testid":c.COMPONENT_NAME,children:[u.jsx(d.InputFileStyled,{ref:r,theme:o,accept:m,capture:E,multiple:N,disabled:e,onChange:O,...T}),u.jsx(j.Button,{isIcon:q,variant:_.ButtonVariant.Outlined,disabled:e,onClick:f,...F,children:y})]})});p.displayName=c.COMPONENT_NAME;exports.InputFile=p;

package/components/core/InputFile/InputFile.types.d.ts

@@ -1,8 +1,18 @@
-import { ChangeEvent, InputHTMLAttributes } from 'react';
-import { ButtonProps, CommonComponentProps, CommonStyledComponentProps } from '../..';
-export interface InputFileProps extends CommonComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> {
-    buttonProps?: Partial<Omit<ButtonProps, 'onClick'>>;
+import { ChangeEvent, PropsWithChildren } from 'react';
+import { ButtonProps, CommonCssComponentProps, CommonCssComponentStyledProps } from '../..';
+export interface InputFileProps extends PropsWithChildren, CommonCssComponentProps<HTMLInputElement> {
+    accept?: string;
+    capture?: boolean | 'user' | 'environment';
+    multiple?: boolean;
+    disabled?: boolean;
+    buttonProps?: ButtonProps;
     onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
     isIcon?: boolean;
 }
-export type InputFileStyledProps = CommonStyledComponentProps;
+export interface InputFileStyledProps extends CommonCssComponentStyledProps<HTMLInputElement> {
+    accept?: string;
+    capture?: boolean | 'user' | 'environment';
+    multiple?: boolean;
+    disabled?: boolean;
+}
+export type InputFileWrapperStyledProps = CommonCssComponentStyledProps;

package/components/core/InputFile/InputFileStyled.d.ts

@@ -0,0 +1,3 @@
+import { InputFileStyledProps, InputFileWrapperStyledProps } from './InputFile.types';
+export declare const InputFileWrapperStyled: import('react').ForwardRefExoticComponent<Omit<InputFileWrapperStyledProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const InputFileStyled: import('react').ForwardRefExoticComponent<Omit<InputFileStyledProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;

package/components/core/InputFile/InputFileStyled.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@emotion/react/jsx-runtime"),u=require("react"),i=require("../../../utils/helpers.js"),p=require("./constants.js"),c=u.forwardRef((e,t)=>{const{theme:{inputfile:r}={},styles:s={},...o}=e,l=[i.get(r,"default",{}),s];return n.jsx("div",{css:l,...o,ref:t})}),d=u.forwardRef((e,t)=>{const{theme:{inputfile:r}={},...s}=e;return n.jsx("input",{type:p.INPUT_FILE_TYPE,css:i.get(r,"input",{}),...s,ref:t})});exports.InputFileStyled=d;exports.InputFileWrapperStyled=c;

package/components/core/InputFile/constants.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E="InputFile",_="Browse Files",L="file";exports.COMPONENT_NAME=E;exports.INPUT_FILE_DEFAULT_LABEL_VALUE=_;exports.INPUT_FILE_TYPE=L;

package/components/core/Label/Label.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("@emotion/react/jsx-runtime"),b=require("react"),m=require("../../../hooks/useTheme/useTheme.js"),r=require("./constants.js"),N=require("./LabelStyled.js"),s=b.forwardRef((a,l)=>{const{className:n="",htmlFor:e,onClick:o,ariaLabel:t,children:c,...i}=a,{theme:u}=m.useTheme();return d.jsx(N.LabelStyled,{ref:l,theme:u,className:n,onClick:o,"data-testid":r.COMPONENT_NAME,...e?{htmlFor:e}:{},...t?{"aria-label":t}:{},...i,children:c})});s.displayName=r.COMPONENT_NAME;exports.Label=s;