@goodhood-web/ui 1.12.0-development.3 → 1.12.0-development.31

package/lib/Atoms/Badges/LabelPill/LabelPill.types.d.ts

@@ -5,7 +5,7 @@ interface CommonProps {
 }
 export interface TileProps extends CommonProps {
     color?: never;
-    shape: 'tile';
+    shape?: 'tile';
     size: 'small' | 'medium';
 }
 export interface PillProps extends CommonProps {

package/lib/Atoms/Buttons/Button/Button.types.d.ts

@@ -1,10 +1,12 @@
 import { ButtonOwnProps } from '@mui/base';
-import { AriaRole, ForwardedRef, MouseEvent, ReactNode } from 'react';
+import { AriaRole, ForwardedRef, MouseEvent, ReactElement, ReactNode } from 'react';
+import { IconProps } from '../../../Base/Icon/Icon.types';
 
 interface CommonProps {
     ariaLabel?: string;
     ariaLabelledBy?: string;
     className?: string;
+    'data-testid'?: string;
     disabled?: boolean;
     ref?: ForwardedRef<null>;
     role?: AriaRole;
@@ -22,7 +24,9 @@ export interface LinkProps extends CommonProps {
 }
 export interface ButtonVariationProps {
     fullWidth?: boolean;
+    leftIcon?: ReactElement<IconProps>;
     loading?: boolean;
+    rightIcon?: ReactElement<IconProps>;
     size?: 'small' | 'medium' | 'large' | 'extraLarge';
     target?: string;
     text?: string;

package/lib/Atoms/Buttons/ButtonPrimary/ButtonPrimary.d.ts

@@ -1,4 +1,4 @@
 import { ButtonPrimaryProps } from './ButtonPrimary.types';
 
-declare const ButtonPrimary: ({ children, className, color, disabled, fullWidth, loading, size, text, ...props }: ButtonPrimaryProps) => import("react/jsx-runtime").JSX.Element;
+declare const ButtonPrimary: ({ children, className, color, disabled, fullWidth, leftIcon, loading, rightIcon, size, text, ...props }: ButtonPrimaryProps) => import("react/jsx-runtime").JSX.Element;
 export default ButtonPrimary;

package/lib/Atoms/Buttons/ButtonSecondary/ButtonSecondary.d.ts

@@ -1,4 +1,4 @@
 import { ButtonSecondaryProps } from './ButtonSecondary.types';
 
-declare const ButtonSecondary: ({ children, className, color, disabled, fullWidth, loading, size, text, ...props }: ButtonSecondaryProps) => import("react/jsx-runtime").JSX.Element;
+declare const ButtonSecondary: ({ children, className, color, disabled, fullWidth, leftIcon, loading, rightIcon, size, text, ...props }: ButtonSecondaryProps) => import("react/jsx-runtime").JSX.Element;
 export default ButtonSecondary;

package/lib/Atoms/Buttons/ButtonTertiary/ButtonTertiary.d.ts

@@ -1,4 +1,4 @@
 import { ButtonTertiaryProps } from './ButtonTertiary.types';
 
-declare const ButtonTertiary: ({ children, className, color, disabled, fullWidth, loading, size, text, ...props }: ButtonTertiaryProps) => import("react/jsx-runtime").JSX.Element;
+declare const ButtonTertiary: ({ children, className, color, disabled, fullWidth, leftIcon, loading, rightIcon, size, text, ...props }: ButtonTertiaryProps) => import("react/jsx-runtime").JSX.Element;
 export default ButtonTertiary;

package/lib/Atoms/Buttons/CopyLinkButton/CopyLinkButton.d.ts

@@ -0,0 +1,4 @@
+import { CopyLinkButtonProps } from './CopyLinkButton.types';
+
+declare const CopyLinkButton: ({ ariaLabel, iconSize, link, onClick, style, }: CopyLinkButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default CopyLinkButton;

package/lib/Atoms/Buttons/CopyLinkButton/CopyLinkButton.types.d.ts

@@ -0,0 +1,7 @@
+export interface CopyLinkButtonProps {
+    ariaLabel?: string;
+    iconSize?: '24' | '32';
+    link: string;
+    onClick: () => void;
+    style?: 'outline' | 'filled';
+}

package/lib/Atoms/Buttons/IconButton/IconButton.d.ts

@@ -1,4 +1,4 @@
 import { IconButtonProps } from './IconButton.types';
 
-declare const IconButton: ({ className, icon, iconClassName, size, variant, ...baseButtonProps }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const IconButton: ({ className, icon, iconClassName, loading, size, variant, ...baseButtonProps }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default IconButton;

package/lib/Atoms/Buttons/IconButton/IconButton.types.d.ts

@@ -8,17 +8,17 @@ type BaseIconButtonProps = Omit<ButtonProps, 'children' | 'ref' | 'className'> &
 }) & {
     className?: string;
     iconClassName?: string;
+    loading?: boolean;
     type?: 'button' | 'submit' | 'reset';
+    variant?: 'green' | 'white';
 };
-type IconButtonIcon24Props = {
+export type IconButtonIcon24Props = {
     icon: Icon24;
     size?: 'small';
-    variant?: 'circular';
 } & BaseIconButtonProps;
-type IconButtonIcon32Props = {
+export type IconButtonIcon32Props = {
     icon: Icon32;
-    size: 'medium' | 'large';
-    variant?: 'circular';
+    size?: 'medium' | 'large';
 } & BaseIconButtonProps;
 export type IconButtonProps = IconButtonIcon32Props | IconButtonIcon24Props;
 export {};

package/lib/Atoms/Buttons/Tiles/MenuTile/MenuTile.type.d.ts

@@ -1,5 +1,5 @@
-import { ButtonProps } from '@mui/base';
 import { Icon32 } from '../../../../Base/Icon/Icon.types';
+import { ButtonProps } from '../../Button/Button.types';
 
 export default interface MenuTileProps extends Omit<ButtonProps, 'children'> {
     fullWidth?: boolean;

package/lib/Atoms/Content/Thumbnail/Thumbnail.type.d.ts

@@ -4,8 +4,10 @@ export interface ThumbnailProps extends ImageProps {
     className?: string;
     isPlaceholder?: boolean;
 }
-export type TCircularSize = '28' | '32' | '40' | '48' | '56' | '64' | '80' | '120' | '280';
-export type TSquareSize = '24' | '32' | '40' | '48' | '56' | '64' | '80' | '120';
+export declare const circularSizes: readonly ["28", "32", "40", "48", "56", "64", "80", "120", "280"];
+export declare const squareSizes: readonly ["24", "32", "40", "48", "56", "64", "80", "120"];
+export type TCircularSize = (typeof circularSizes)[number];
+export type TSquareSize = (typeof squareSizes)[number];
 export interface ThumbnailCircularProps extends ThumbnailProps {
     shape: 'circular';
     size: TCircularSize;

package/lib/Atoms/Content/UserAvatar/UserAvatar.d.ts

@@ -0,0 +1,4 @@
+import { UserAvatarProps } from './UserAvatar.types';
+
+export declare const UserAvatar: ({ alt, size, userId, userImageSrc, }: UserAvatarProps) => import("react/jsx-runtime").JSX.Element;
+export default UserAvatar;

package/lib/Atoms/Content/UserAvatar/UserAvatar.types.d.ts

@@ -0,0 +1,9 @@
+import { TCircularSize } from '../Thumbnail/Thumbnail.type';
+
+export declare const colors: readonly ["green", "lavender", "orange", "teal"];
+export type UserAvatarProps = {
+    alt: string;
+    size: TCircularSize;
+    userId: number;
+    userImageSrc?: string;
+};

package/lib/Atoms/Dropdowns/DropdownHeader/DropdownHeader.d.ts

@@ -0,0 +1,4 @@
+import { DropdownHeaderProps } from './DropdownHeader.types';
+
+declare const DropdownHeader: ({ icon, text, ...props }: DropdownHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export default DropdownHeader;

package/lib/Atoms/Dropdowns/DropdownHeader/DropdownHeader.types.d.ts

@@ -0,0 +1,7 @@
+import { Icon24 } from '../../../Base/Icon/Icon.types';
+import { ButtonProps } from '../../Buttons/Button/Button.types';
+
+export type DropdownHeaderProps = Pick<ButtonProps, 'onClick' | 'ariaLabel' | 'ariaLabelledBy' | 'disabled' | 'role'> & {
+    icon?: Icon24;
+    text?: string;
+};

package/lib/Atoms/Dropdowns/DropdownOption/DropdownOption.d.ts

@@ -0,0 +1,4 @@
+import { DropdownOptionProps } from './DropdownOption.types';
+
+declare const DropdownOption: ({ alt, isSelected, src, text, ...props }: DropdownOptionProps) => import("react/jsx-runtime").JSX.Element;
+export default DropdownOption;

package/lib/Atoms/Dropdowns/DropdownOption/DropdownOption.types.d.ts

@@ -0,0 +1,8 @@
+import { ButtonProps } from '../../Buttons/Button/Button.types';
+
+export type DropdownOptionProps = Pick<ButtonProps, 'onClick' | 'ariaLabel' | 'ariaLabelledBy' | 'disabled' | 'role'> & {
+    alt?: string;
+    isSelected?: boolean;
+    src?: string;
+    text: string;
+};

package/lib/Atoms/Dropdowns/DropdownOptionsCluster/DropdownOptionsCluster.d.ts

@@ -0,0 +1,4 @@
+import { DropdownOptionsClusterProps } from './DropdownOptionsCluster.types';
+
+declare const DropdownOptionsCluster: ({ children, className }: DropdownOptionsClusterProps) => import("react/jsx-runtime").JSX.Element;
+export default DropdownOptionsCluster;

package/lib/Atoms/Dropdowns/DropdownOptionsCluster/DropdownOptionsCluster.types.d.ts

@@ -0,0 +1,5 @@
+import { PropsWithChildren } from 'react';
+
+export type DropdownOptionsClusterProps = PropsWithChildren<{
+    className?: string;
+}>;

package/lib/Atoms/Inputs/InputDetails/InputDetails.d.ts

@@ -0,0 +1,4 @@
+import { default as InputDetailsProps } from './InputDetails.types';
+
+declare const InputDetails: ({ charCount, charLimit, errorText, hintText, }: InputDetailsProps) => import("react/jsx-runtime").JSX.Element;
+export default InputDetails;

package/lib/Atoms/Inputs/InputDetails/InputDetails.types.d.ts

@@ -0,0 +1,6 @@
+export default interface InputDetailsProps {
+    charCount?: number;
+    charLimit?: number;
+    errorText?: string;
+    hintText?: string;
+}

package/lib/Atoms/Inputs/TextAreaInput/TextAreaInput.d.ts

@@ -0,0 +1,4 @@
+import { TextAreaInputProps } from './TextAreaInput.types';
+
+declare const TextAreaInput: ({ ariaDescribedby, attachment, charLimit, colorScheme, errorText, hintText, id, label, name, ref, showInputHints, size, ...props }: TextAreaInputProps) => import("react/jsx-runtime").JSX.Element;
+export default TextAreaInput;

package/lib/Atoms/Inputs/TextAreaInput/TextAreaInput.types.d.ts

@@ -0,0 +1,7 @@
+import { IconButtonIcon24Props } from '../../Buttons/IconButton/IconButton.types';
+import { CommonTextInputProps } from '../TextInput/TextInput.types';
+
+export interface TextAreaInputProps extends CommonTextInputProps {
+    attachment?: Pick<IconButtonIcon24Props, 'icon' | 'onClick' | 'ariaLabel' | 'disabled'>[];
+    size: 'medium' | 'large';
+}

package/lib/Atoms/Inputs/TextInput/TextInput.d.ts

@@ -1,4 +1,4 @@
 import { TextInputProps } from './TextInput.types';
 
-declare const TextInput: ({ colorScheme, errorMessage, id, label, name, ref, size, ...props }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
+declare const TextInput: ({ ariaDescribedby, charLimit, colorScheme, errorText, hintText, icon, id, inputFieldType, label, name, ref, showInputHints, size, textButton, ...props }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
 export default TextInput;

package/lib/Atoms/Inputs/TextInput/TextInput.types.d.ts

@@ -1,12 +1,23 @@
-import { UseInputParameters } from '@mui/base/useInput';
-import { ForwardedRef } from 'react';
+import { UseInputParameters } from '@mui/base';
+import { ForwardedRef, HTMLInputTypeAttribute } from 'react';
+import { IconProps } from '../../../Base/Icon/Icon.types';
+import { IconButtonIcon24Props } from '../../Buttons/IconButton/IconButton.types';
 
-export interface TextInputProps extends UseInputParameters {
-    colorScheme: 'light' | 'dark';
-    errorMessage?: string;
+export interface CommonTextInputProps extends UseInputParameters {
+    ariaDescribedby?: string;
+    charLimit?: number;
+    colorScheme?: 'outline' | 'filled';
+    errorText?: string;
+    hintText?: string;
     id: string;
     label: string;
     name?: string;
     ref?: ForwardedRef<null>;
-    size: 'small' | 'medium';
+    showInputHints?: boolean;
+}
+export interface TextInputProps extends CommonTextInputProps {
+    icon?: IconProps;
+    inputFieldType?: HTMLInputTypeAttribute;
+    size: 'medium' | 'large' | 'small';
+    textButton?: IconButtonIcon24Props;
 }

package/lib/Base/Icon/Icon.types.d.ts

@@ -6,6 +6,9 @@ import { default as icons32 } from './icons/32x32';
 export type Icon32 = keyof typeof icons32;
 export type Icon24 = keyof typeof icons24;
 export type Icon16 = keyof typeof icons16;
+export declare const iconNames16: string[];
+export declare const iconNames24: string[];
+export declare const iconNames32: string[];
 type BaseIconProps = {
     className?: string;
     role?: Extract<AriaRole, 'presentation' | 'img'>;

package/lib/Base/Icon/icons/24x24/index.d.ts

@@ -41,6 +41,9 @@ declare const IconsMap: {
     readonly comment_bubble: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    readonly copy: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
     readonly cross: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;

package/lib/Base/Icon/icons/32x32/index.d.ts

@@ -74,6 +74,9 @@ declare const IconsMap: {
     readonly confetti: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    readonly copy: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
     readonly couch: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
@@ -128,6 +131,7 @@ declare const IconsMap: {
     readonly gift_filled: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    readonly gift_outline: string;
     readonly globe: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
@@ -149,6 +153,7 @@ declare const IconsMap: {
     readonly heart_handshake_filled: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    readonly heart_handshake_outline: string;
     readonly heart_outline: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
@@ -275,6 +280,7 @@ declare const IconsMap: {
     readonly special_place: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    readonly star: string;
     readonly suitcase: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
     }>;

package/lib/Base/Icon/icons/index.d.ts

@@ -65,6 +65,9 @@ declare const iconsMap: {
         readonly comment_bubble: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
+        readonly copy: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
+            title?: string;
+        }>;
         readonly cross: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
@@ -244,6 +247,9 @@ declare const iconsMap: {
         readonly confetti: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
+        readonly copy: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
+            title?: string;
+        }>;
         readonly couch: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
@@ -298,6 +304,7 @@ declare const iconsMap: {
         readonly gift_filled: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
+        readonly gift_outline: string;
         readonly globe: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
@@ -319,6 +326,7 @@ declare const iconsMap: {
         readonly heart_handshake_filled: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
+        readonly heart_handshake_outline: string;
         readonly heart_outline: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
@@ -445,6 +453,7 @@ declare const iconsMap: {
         readonly special_place: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;
+        readonly star: string;
         readonly suitcase: import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
             title?: string;
         }>;

package/lib/Molecules/Card/Card.d.ts

@@ -1,4 +1,4 @@
 import { CardProps } from './Card.types';
 
-declare const Card: ({ allowedElement, ariaLabel, as: Tag, borderRadius, children, className, role, }: CardProps) => import("react/jsx-runtime").JSX.Element;
+declare const Card: ({ allowedElement, ariaLabel, as: Tag, borderRadius, children, className, role, withoutPadding, }: CardProps) => import("react/jsx-runtime").JSX.Element;
 export default Card;

package/lib/Molecules/Card/Card.types.d.ts

@@ -10,4 +10,5 @@ export interface CardProps {
     children: ReactElement<CardBodyProps | CardHeaderProps> | ReactElement<CardBodyProps | CardHeaderProps>[];
     className?: string;
     role?: string;
+    withoutPadding?: boolean;
 }

package/lib/Molecules/Card/CardBody/CardBody.d.ts

@@ -1,4 +1,4 @@
 import { CardBodyProps } from './CardBody.types';
 
-declare const CardBody: ({ children, className }: CardBodyProps) => import("react/jsx-runtime").JSX.Element;
+declare const CardBody: ({ children, className, withoutPadding }: CardBodyProps) => import("react/jsx-runtime").JSX.Element;
 export default CardBody;

package/lib/Molecules/Card/CardBody/CardBody.types.d.ts

@@ -3,4 +3,5 @@ import { ReactNode } from 'react';
 export interface CardBodyProps {
     children: ReactNode;
     className?: string;
+    withoutPadding?: boolean;
 }

package/lib/Molecules/ListItems/NotificationListItem/NotificationListItem.d.ts

@@ -1,4 +1,4 @@
 import { NotificationListItemProps } from './NotificationListItem.types';
 
-declare const NotificationListItem: ({ defaultIcon, imgSrc, linkText, onNotificationClick, timeAgo, title, unread, }: NotificationListItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const NotificationListItem: ({ linkText, onNotificationClick, primaryImg, secondaryImg, timeAgo, title, unread, }: NotificationListItemProps) => import("react/jsx-runtime").JSX.Element;
 export default NotificationListItem;

package/lib/Molecules/ListItems/NotificationListItem/NotificationListItem.types.d.ts

@@ -1,11 +1,23 @@
 import { default as React } from 'react';
 
+type Shape = 'circular' | 'square';
+export type NotificationListItemImageProps = {
+    icon: React.ReactNode;
+    imageURL: string | null | undefined;
+    shape: Shape;
+};
 export interface NotificationListItemProps {
-    defaultIcon?: React.ReactNode;
-    imgSrc?: string;
     linkText: string;
     onNotificationClick?: () => void;
+    primaryImg: NotificationListItemImageProps;
+    secondaryImg?: NotificationListItemImageProps;
     timeAgo: string;
     title: string;
     unread?: boolean;
 }
+export type ThumbnailProps = {
+    className: string;
+    imgProps: NotificationListItemImageProps;
+    size: '32' | '56';
+};
+export {};

package/lib/Molecules/Notices/EmptyState/EmptyState.types.d.ts

@@ -1,6 +1,8 @@
 import { ReactElement } from 'react';
 import { StickerProps } from '../../../Atoms/Badges/Sticker/Sticker.types';
 import { ButtonPrimaryProps } from '../../../Atoms/Buttons/ButtonPrimary/ButtonPrimary.types';
+import { ButtonSecondaryProps } from '../../../Atoms/Buttons/ButtonSecondary/ButtonSecondary.types';
+import { ButtonTertiaryProps } from '../../../Atoms/Buttons/ButtonTertiary/ButtonTertiary.types';
 import { TextButtonProps } from '../../../Atoms/Buttons/TextButton/TextButton.types';
 
 type TextButton = Omit<TextButtonProps, 'size'> & {
@@ -9,7 +11,13 @@ type TextButton = Omit<TextButtonProps, 'size'> & {
 type ButtonPrimary = Omit<ButtonPrimaryProps, 'size'> & {
     buttonType: 'primary';
 };
-export type ButtonProps = TextButton | ButtonPrimary;
+type ButtonSecondary = Omit<ButtonSecondaryProps, 'size'> & {
+    buttonType: 'secondary';
+};
+type ButtonTertiary = Omit<ButtonTertiaryProps, 'size'> & {
+    buttonType: 'tertiary';
+};
+export type ButtonProps = TextButton | ButtonPrimary | ButtonSecondary | ButtonTertiary;
 export default interface EmptyStateProps {
     buttons?: ButtonProps[];
     customVisual?: ReactElement;

package/lib/Organisms/Modals/Popup/Popup.types.d.ts

@@ -18,8 +18,7 @@ export declare enum OffsetMap {
     sm = 8,
     xl = 24
 }
-type OffsetType = keyof typeof OffsetMap | Partial<{
+export type OffsetType = keyof typeof OffsetMap | Partial<{
     crossAxis: number;
     mainAxis: number;
 }>;
-export {};

package/lib/Organisms/Modals/Sheet/Sheet.types.d.ts

@@ -6,7 +6,7 @@ export interface SheetProps {
     ariaLabel?: string;
     ariaLabelledBy?: string;
     closeButtonText?: string;
-    onClose: () => void;
+    onClose?: () => void;
     open: boolean;
     sheetBody?: ReactElement<CardBodyProps>;
     sheetFooter?: ReactElement<CardHeaderProps>;

package/package.json

@@ -1,21 +1,17 @@
 {
   "name": "@goodhood-web/ui",
-  "version": "1.12.0-development.3",
+  "version": "1.12.0-development.31",
   "main": "./index.js",
   "types": "./index.d.ts",
+  "repository": "https://github.com/good-hood-gmbh/goodhood-web",
   "exports": {
     ".": {
       "import": "./index.mjs",
       "require": "./index.js"
     }
   },
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/",
-    "access": "public"
-  },
-  "private": false,
   "peerDependencies": {
-    "@mui/base": "~5.0.0-beta.47",
-    "@goodhood/design-tokens": "1.0.0-develop.3"
+    "@mui/base": "~5.0.0-beta.58",
+    "@goodhood/design-tokens": "1.0.0-develop.5"
   }
 }