@luscii-healthtech/web-ui 2.48.0 → 2.48.2

package/README.md

@@ -51,6 +51,15 @@ When you create new components, you must add them to storybook as well. Stories
 /stories
 ```
 
+### Adding icons
+
+Add new icons by:
+
+- Add the svg file(s) in `src/components/Icons/icons`
+- Run `yarn icons`
+
+The icons are optimized by SVGO and transformed into React components by [SVGR](https://react-svgr.com) which are placed in `src/components/Icons`.
+
 ## CI setup
 
 #### Branching

package/dist/components/ButtonV2/ButtonProps.type.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { IconProps } from "../Icons/types/IconProps.type";
+import type { IconKey, IconProps } from "../Icons/types/IconProps.type";
 import { TextColor, TextHoverColor } from "../Text/Text";
 /**
  * Properties that are present in all variants of the button
@@ -8,7 +8,7 @@ import { TextColor, TextHoverColor } from "../Text/Text";
 export interface BaseButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
     onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
     text?: string;
-    icon?: React.FunctionComponent<IconProps>;
+    icon?: React.FunctionComponent<IconProps> | IconKey;
     isDisabled?: boolean;
     className?: string;
 }

package/dist/components/ConfirmationDialog/ConfirmationDialogTitle.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
-import { ConfirmationDialogTitleProps } from "./types/ConfirmationDialog.types";
+import type { ConfirmationDialogTitleProps } from "./types/ConfirmationDialog.types";
 export declare const ConfirmationDialogTitle: React.FC<ConfirmationDialogTitleProps>;

package/dist/components/ConfirmationDialog/types/ConfirmationDialog.types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { IconProps } from "../../Icons/types/IconProps.type";
+import type { IconKey, IconProps } from "../../Icons/types/IconProps.type";
 import type { NotificationBannerColor } from "../../NotificationBanner/NotificationBanner";
 interface ConfirmationDialogTexts {
     message: string | string[];
@@ -23,7 +23,7 @@ export interface ConfirmationDialogProps {
     isProcessing?: boolean;
     withTitle?: {
         title: string;
-        icon?: React.FC<IconProps>;
+        icon?: React.FC<IconProps> | IconKey;
     };
     choices?: {
         defaultChoice?: ConfirmationDialogChoice["value"];

package/dist/components/Icon/Icon.d.ts

@@ -3,4 +3,11 @@ import { IconProps, IconKey } from "../Icons/types/IconProps.type";
 export declare const Icon: React.FC<{
     name: IconKey;
 } & IconProps>;
+/**
+ * This is a temporary component to transition the way we pass icons to components.
+ * Once all components are passed an IconKey instead of a function component we can replace it with the Icon component.
+ */
+export declare const IconComponentOrKey: React.FC<{
+    name: React.FunctionComponent<IconProps> | IconKey;
+} & IconProps>;
 export default Icon;

package/dist/components/Icons/AddIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const AddIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/AlertsIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const AlertsIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/BellIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const BellIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ChartIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ChartIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ChartLineColoredIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ChartLineColoredIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ChatBoxIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ChatBoxIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/CheckIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const CheckIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ChevronDoubleIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ChevronDoubleIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ChevronDownIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ChevronDownIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ChevronRightIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ChevronRightIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/CrossIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const CrossIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/DeleteIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const DeleteIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/DownArrowIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const DownArrowIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/DragIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const DragIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/EditIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const EditIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/EmptyIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const EmptyIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/EmptyStateDashboardIcon.d.ts

@@ -1 +1,3 @@
-export declare const EmptyStateDashboardIcon: () => JSX.Element;
+import { IconProps } from "./types/IconProps.type";
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ExclamationMarkIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const ExclamationMarkIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/EyeIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const EyeIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/GearColoredIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const GearColoredIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/GearIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const GearIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/GroupColoredIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const GroupColoredIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/GroupIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const GroupIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/HamburgerIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const HamburgerIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/HeartIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const HeartIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/ImageIcon.d.ts

@@ -1,3 +1,3 @@
-import React from "react";
 import { IconProps } from "./types/IconProps.type";
-export declare const ImageIcon: React.VoidFunctionComponent<IconProps>;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/InfoIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const InfoIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/LeftArrowIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const LeftArrowIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/LightBulbIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const LightBulbIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/LinkIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const LinkIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/LockIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const LockIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/MessagesIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const MessagesIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/NotesIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const NotesIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/PinIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const PinIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/PrintIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const PrintIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/RightArrowIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const RightArrowIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/SearchCancelIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const SearchCancelIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/SearchIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const SearchIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/SmallCircleIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const SmallCircleIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/SmallDiamondIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const SmallDiamondIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/SmallSquareIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const SmallSquareIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/SpaceRocketIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const SpaceRocketIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/StarIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const StarIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/StatusColoredIcon.d.ts

@@ -1,2 +1,3 @@
 import { IconProps } from "./types/IconProps.type";
-export declare const StatusColoredIcon: (props: IconProps) => JSX.Element;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/WarningIcon.d.ts

@@ -1,3 +1,3 @@
-import React from "react";
 import { IconProps } from "./types/IconProps.type";
-export declare const WarningIcon: React.VoidFunctionComponent<IconProps>;
+declare const _default: (props: IconProps) => JSX.Element;
+export default _default;

package/dist/components/Icons/iconWrapper/iconWrapper.d.ts

@@ -0,0 +1,4 @@
+import { HTMLAttributes } from "react";
+import { IconProps } from "../types/IconProps.type";
+declare const iconWrapper: (SVGComponent: (props: IconProps & Pick<HTMLAttributes<SVGElement>, "role">) => JSX.Element) => (props: IconProps) => JSX.Element;
+export default iconWrapper;

package/dist/components/Icons/iconWrapper/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./iconWrapper";

package/dist/components/Icons/index.d.ts

@@ -1,40 +1,45 @@
-export { AddIcon } from "./AddIcon";
-export { AlertsIcon } from "./AlertsIcon";
-export { BellIcon } from "./BellIcon";
-export { ChartIcon } from "./ChartIcon";
-export { ChartLineColoredIcon } from "./ChartLineColoredIcon";
-export { ChatBoxIcon } from "./ChatBoxIcon";
-export { CheckIcon } from "./CheckIcon";
-export { ChevronDoubleIcon } from "./ChevronDoubleIcon";
-export { CrossIcon } from "./CrossIcon";
-export { DeleteIcon } from "./DeleteIcon";
-export { DownArrowIcon } from "./DownArrowIcon";
-export { DragIcon } from "./DragIcon";
-export { EditIcon } from "./EditIcon";
-export { EmptyStateDashboardIcon } from "./EmptyStateDashboardIcon";
-export { ExclamationMarkIcon } from "./ExclamationMarkIcon";
-export { EyeIcon } from "./EyeIcon";
-export { GearIcon } from "./GearIcon";
-export { GearColoredIcon } from "./GearColoredIcon";
-export { GroupIcon } from "./GroupIcon";
-export { GroupColoredIcon } from "./GroupColoredIcon";
-export { HeartIcon } from "./HeartIcon";
-export { LeftArrowIcon } from "./LeftArrowIcon";
-export { LinkIcon } from "./LinkIcon";
-export { LightBulbIcon } from "./LightBulbIcon";
-export { LockIcon } from "./LockIcon";
-export { MessagesIcon } from "./MessagesIcon";
-export { NotesIcon } from "./NotesIcon";
-export { PinIcon } from "./PinIcon";
-export { PrintIcon } from "./PrintIcon";
-export { RightArrowIcon } from "./RightArrowIcon";
-export { SmallCircleIcon } from "./SmallCircleIcon";
-export { SmallDiamondIcon } from "./SmallDiamondIcon";
-export { SmallSquareIcon } from "./SmallSquareIcon";
-export { SpaceRocketIcon } from "./SpaceRocketIcon";
-export { StarIcon } from "./StarIcon";
-export { HamburgerIcon } from "./HamburgerIcon";
-export { SearchIcon } from "./SearchIcon";
-export { SearchCancelIcon } from "./SearchCancelIcon";
-export { InfoIcon } from "./InfoIcon";
-export { StatusColoredIcon } from "./StatusColoredIcon";
+export { default as AddIcon } from "./AddIcon";
+export { default as AlertsIcon } from "./AlertsIcon";
+export { default as BellIcon } from "./BellIcon";
+export { default as ChartIcon } from "./ChartIcon";
+export { default as ChartLineColoredIcon } from "./ChartLineColoredIcon";
+export { default as ChatBoxIcon } from "./ChatBoxIcon";
+export { default as CheckIcon } from "./CheckIcon";
+export { default as ChevronDoubleIcon } from "./ChevronDoubleIcon";
+export { default as ChevronDownIcon } from "./ChevronDownIcon";
+export { default as ChevronRightIcon } from "./ChevronRightIcon";
+export { default as CrossIcon } from "./CrossIcon";
+export { default as DeleteIcon } from "./DeleteIcon";
+export { default as DownArrowIcon } from "./DownArrowIcon";
+export { default as DragIcon } from "./DragIcon";
+export { default as EditIcon } from "./EditIcon";
+export { default as EmptyIcon } from "./EmptyIcon";
+export { default as EmptyStateDashboardIcon } from "./EmptyStateDashboardIcon";
+export { default as ExclamationMarkIcon } from "./ExclamationMarkIcon";
+export { default as EyeIcon } from "./EyeIcon";
+export { default as GearColoredIcon } from "./GearColoredIcon";
+export { default as GearIcon } from "./GearIcon";
+export { default as GroupColoredIcon } from "./GroupColoredIcon";
+export { default as GroupIcon } from "./GroupIcon";
+export { default as HamburgerIcon } from "./HamburgerIcon";
+export { default as HeartIcon } from "./HeartIcon";
+export { default as ImageIcon } from "./ImageIcon";
+export { default as InfoIcon } from "./InfoIcon";
+export { default as LeftArrowIcon } from "./LeftArrowIcon";
+export { default as LightBulbIcon } from "./LightBulbIcon";
+export { default as LinkIcon } from "./LinkIcon";
+export { default as LockIcon } from "./LockIcon";
+export { default as MessagesIcon } from "./MessagesIcon";
+export { default as NotesIcon } from "./NotesIcon";
+export { default as PinIcon } from "./PinIcon";
+export { default as PrintIcon } from "./PrintIcon";
+export { default as RightArrowIcon } from "./RightArrowIcon";
+export { default as SearchCancelIcon } from "./SearchCancelIcon";
+export { default as SearchIcon } from "./SearchIcon";
+export { default as SmallCircleIcon } from "./SmallCircleIcon";
+export { default as SmallDiamondIcon } from "./SmallDiamondIcon";
+export { default as SmallSquareIcon } from "./SmallSquareIcon";
+export { default as SpaceRocketIcon } from "./SpaceRocketIcon";
+export { default as StarIcon } from "./StarIcon";
+export { default as StatusColoredIcon } from "./StatusColoredIcon";
+export { default as WarningIcon } from "./WarningIcon";

package/dist/components/Icons/templates/component.d.ts

@@ -0,0 +1,3 @@
+declare const template: (variables: any, { tpl }: {
+    tpl: any;
+}) => any;

package/dist/components/Icons/templates/index.d.ts

@@ -0,0 +1,2 @@
+declare const path: any;
+declare function defaultIndexTemplate(filePaths: any): string;

package/dist/components/Input/Input.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { AllowedTextInputTypes } from "../Form/form.types";
-import { IconProps } from "../Icons/types/IconProps.type";
+import type { IconKey, IconProps } from "../Icons/types/IconProps.type";
 import { FormFieldWidth } from "../Form/form.types";
 import "./Input.css";
 export declare const INPUT_TYPES: Record<string, AllowedTextInputTypes>;
@@ -27,7 +27,7 @@ export interface InputProps extends CustomHTMLInputProps {
     isDisabled?: boolean;
     withPrefix?: string;
     withSuffix?: string;
-    icon?: React.VoidFunctionComponent<IconProps>;
+    icon?: React.FC<IconProps> | IconKey;
     width?: FormFieldWidth;
     /**
      * Check the `asFormField` prop of this component to understand why this signature.

package/dist/components/Toaster/Toaster.d.ts

@@ -12,6 +12,6 @@ export declare const TOASTER_TYPE_OPTIONS: {
     readonly SUCCESS: "success";
     readonly FAILURE: "failure";
 };
-export declare type ToasterType = typeof TOASTER_TYPE_OPTIONS[keyof typeof TOASTER_TYPE_OPTIONS];
+export declare type ToasterType = (typeof TOASTER_TYPE_OPTIONS)[keyof typeof TOASTER_TYPE_OPTIONS];
 declare const Toaster: React.VoidFunctionComponent<ToasterProps>;
 export default Toaster;