@orfium/ictinus 5.5.0 → 5.5.2

package/dist/src/components/Button/Button.stories.d.ts

@@ -0,0 +1,102 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<{
+        type?: import('./Button.types').ButtonTypes;
+        size?: import('../../utils/types').ComponentSizes;
+        isBlock?: boolean;
+        isLoading?: boolean;
+        isDisabled?: boolean;
+        isIconButton?: boolean;
+        shape?: import('../IconButton').IconButtonShape;
+        htmlType?: "button" | "reset" | "submit";
+        sx?: {
+            container?: import('@emotion/serialize').CSSObject;
+        };
+    } & import('../..').TestProps & import('../ButtonBase').EventButtonProps & Partial<Omit<import('react').ButtonHTMLAttributes<HTMLButtonElement>, "type" | "disabled" | "onClick" | "onBlur" | "css" | "size">> & {
+        iconRightName?: import('../Icon').AcceptedIconNames;
+        iconLeftName?: import('../Icon').AcceptedIconNames;
+        avatar?: Pick<import('../Avatar').AvatarProps, "color" | "src"> & {
+            label?: string;
+        };
+    } & import('react').RefAttributes<HTMLButtonElement>>;
+    args: {
+        label: string;
+        type: string;
+        size: string;
+    };
+    argTypes: {
+        hasAvatar: {
+            type: string;
+        };
+        avatarLabel: {
+            type: string;
+        };
+    };
+    parameters: {
+        design: {
+            type: string;
+            name: string;
+            url: string;
+        }[];
+    };
+};
+export default _default;
+export declare const ButtonTypes: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const LoadingButton: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const ButtonsWithIcons: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+    args: {
+        iconLeftName: string;
+        iconRightName: string;
+    };
+};
+export declare const ButtonsWithAvatars: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const BlockButton: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const ButtonPlayground: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};

package/dist/src/components/Button/Button.style.d.ts

@@ -0,0 +1,8 @@
+import { Theme } from 'theme';
+
+export declare const buttonSpanStyle: () => (theme: Theme) => {
+    display: string;
+    alignItems: string;
+    justifyContent: string;
+    gap: string;
+};

package/dist/src/components/Button/Button.tokens.d.ts

@@ -0,0 +1,6 @@
+import { default as button } from '../../theme/tokens/components/variables/button';
+import { DotKeys } from '../../theme/tokens/utils';
+import { Theme } from '../../theme';
+
+export type ButtonTokens = DotKeys<typeof button>;
+export declare const getButtonTokens: (theme: Theme) => (path: "normal.size" | "normal.padding" | "compact.size" | "compact.padding", fn?: (val: string) => unknown) => any;

package/dist/src/components/Button/Button.types.d.ts

@@ -0,0 +1,4 @@
+/** All button types. Used by Button component */
+export type ButtonTypes = 'primary' | 'secondary' | 'tertiary' | 'danger';
+/** The 3 main button types: primary, secondary, tertiary. This is used by IconButton and DropdownButton components */
+export type PrimitiveButtonTypes = Exclude<ButtonTypes, 'danger'>;

package/dist/src/components/Button/ButtonLoader/ButtonLoader.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { TestProps } from 'utils/types';
+
+export type ButtonLoaderProps = TestProps;
+declare const ButtonLoader: React.FCC<ButtonLoaderProps>;
+export default ButtonLoader;

package/dist/src/components/Button/ButtonLoader/ButtonLoader.style.d.ts

@@ -0,0 +1,6 @@
+import { SerializedStyles } from '@emotion/react';
+import { Theme } from 'theme';
+
+export declare const loaderWrapperStyle: () => SerializedStyles;
+export declare const barWrapperStyle: () => (theme: Theme) => SerializedStyles;
+export declare const barStyle: () => SerializedStyles;

package/dist/src/components/Button/ButtonLoader/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ButtonLoader';
+export * from './ButtonLoader';

package/dist/src/components/Button/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Button';
+export * from './Button';

package/dist/src/components/ButtonBase/ButtonBase.d.ts

@@ -0,0 +1,57 @@
+import { CSSObject } from '@emotion/serialize';
+import { default as React } from 'react';
+import { ClickEvent } from '../../hooks/useLoading';
+import { CommonButtonProps } from '../../utils/common';
+import { ComponentSizes, TestProps } from '../../utils/types';
+import { ButtonTypes } from '../Button/Button.types';
+import { IconButtonShape } from '../IconButton';
+
+export type EventButtonProps = {
+    onClick?: (event: ClickEvent) => void;
+    onBlur?: () => void;
+};
+export type ButtonBaseProps = {
+    /** The type of the button */
+    type?: ButtonTypes;
+    /** The size of button */
+    size?: ComponentSizes;
+    /** This property will make the button fit to its parent width. Defaults to false */
+    isBlock?: boolean;
+    /** Property indicating if the component is loading */
+    isLoading?: boolean;
+    /** Define if the button is in disabled state */
+    isDisabled?: boolean;
+    /** Define if the button is an icon button */
+    isIconButton?: boolean;
+    /** Define the radius type of the icon button */
+    shape?: IconButtonShape;
+    /** Defines the button type */
+    htmlType?: 'submit' | 'reset' | 'button';
+    /** Sx prop to override specific properties */
+    sx?: {
+        container?: CSSObject;
+    };
+} & TestProps & EventButtonProps & CommonButtonProps;
+declare const ButtonBase: React.ForwardRefExoticComponent<{
+    /** The type of the button */
+    type?: ButtonTypes;
+    /** The size of button */
+    size?: ComponentSizes;
+    /** This property will make the button fit to its parent width. Defaults to false */
+    isBlock?: boolean;
+    /** Property indicating if the component is loading */
+    isLoading?: boolean;
+    /** Define if the button is in disabled state */
+    isDisabled?: boolean;
+    /** Define if the button is an icon button */
+    isIconButton?: boolean;
+    /** Define the radius type of the icon button */
+    shape?: IconButtonShape;
+    /** Defines the button type */
+    htmlType?: 'submit' | 'reset' | 'button';
+    /** Sx prop to override specific properties */
+    sx?: {
+        container?: CSSObject;
+    };
+} & TestProps & EventButtonProps & Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "disabled" | "onClick" | "onBlur" | "css" | "size">> & React.RefAttributes<HTMLButtonElement>>;
+export default ButtonBase;

package/dist/src/components/ButtonBase/ButtonBase.style.d.ts

@@ -0,0 +1,13 @@
+import { SerializedStyles } from '@emotion/react';
+import { ButtonBaseProps } from './ButtonBase';
+import { Theme } from '../../theme';
+
+export declare const buttonWrapperStyle: ({ isBlock, }: Pick<ButtonBaseProps, 'isBlock'>) => SerializedStyles;
+export declare const buttonBaseStyle: ({ type, size, isBlock, isLoading, isDisabled, isIconButton, shape, sx, }: Omit<ButtonBaseProps, 'htmlType' | 'ref'>) => (theme: Theme) => SerializedStyles;
+export declare const buttonSpanStyle: () => () => {
+    display: string;
+    alignItems: string;
+};
+export declare const iconStyle: () => () => {
+    display: string;
+};

package/dist/src/components/ButtonBase/constants.d.ts

@@ -0,0 +1,7 @@
+import { SemanticColorsKey } from '../../theme/tokens/semantic/colors';
+import { SemanticTypographyKey } from '../../theme/tokens/semantic/typography';
+import { ComponentSizes } from 'types';
+import { ButtonTypes } from '../Button/Button.types';
+
+export declare const buttonColorToSemColor: Record<ButtonTypes, Record<string, SemanticColorsKey>>;
+export declare const typographySizes: Record<ComponentSizes, SemanticTypographyKey>;

package/dist/src/components/ButtonBase/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ButtonBase';
+export * from './ButtonBase';

package/dist/src/components/Card/Card.d.ts

@@ -0,0 +1,14 @@
+import { Elevation } from 'index';
+import { default as React } from 'react';
+import { SpacingKey } from '../../theme/globals/spacing';
+
+export type CardProps = {
+    /** Elevation of Card */
+    elevated?: keyof Elevation;
+    /** Transparency of Card: if false the Card's background is white, otherwise it's transparent */
+    isTransparent?: boolean;
+    /** Border radius of Card: if not provided it defaults to 0 */
+    radius?: SpacingKey;
+};
+declare const Card: React.FC<React.PropsWithChildren<CardProps>>;
+export default Card;

package/dist/src/components/Card/Card.stories.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import('react').FC<import('react').PropsWithChildren<import('./Card').CardProps>>;
+    parameters: {
+        design: {
+            type: string;
+            name: string;
+            url: string;
+        }[];
+    };
+    args: {
+        elevated: string;
+        radius: string;
+    };
+};
+export default _default;
+export declare const CardWithElevation: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    controls: {
+        include: string[];
+    };
+};

package/dist/src/components/Card/Card.style.d.ts

@@ -0,0 +1,5 @@
+import { SerializedStyles } from '@emotion/react';
+import { CardProps } from './Card';
+import { Theme } from '../../theme';
+
+export declare const cardStyle: ({ elevated, isTransparent, radius }: CardProps) => (theme: Theme) => SerializedStyles;

package/dist/src/components/Card/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Card';
+export * from './Card';

package/dist/src/components/Chart/BarChart/BarChart.d.ts

@@ -0,0 +1,26 @@
+import { default as React } from 'react';
+
+export type HoverInfo = {
+    name: string;
+    value?: string | number;
+    percentage?: string;
+    [prop: string]: number | string | undefined;
+};
+type Option = {
+    color?: string;
+    coloringOption?: 'all' | 'bar';
+    hoverInfo?: HoverInfo[];
+};
+export type Data = {
+    name: string;
+    subcategory?: string;
+    value?: number;
+    barLabel?: string;
+    options?: Option;
+};
+export type BarChartProps = {
+    /** This property defines the data to be shown in the Line Chart */
+    data: Data[];
+};
+declare const BarChart: React.FCC<BarChartProps>;
+export default BarChart;

package/dist/src/components/Chart/BarChart/components/CustomLabel/CustomLabel.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { LabelProps } from 'recharts';
+
+interface CustomLabelProps extends LabelProps {
+    colors: Record<string, string>;
+    index?: number;
+}
+declare const CustomLabel: React.FCC<CustomLabelProps>;
+export default CustomLabel;

package/dist/src/components/Chart/BarChart/components/CustomLabel/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CustomLabel';

package/dist/src/components/Chart/BarChart/components/CustomTooltip/CustomTooltip.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+
+type CustomTooltipProps = {
+    content: React.ReactNode;
+    fill: string;
+};
+declare const CustomTooltip: React.FCC<CustomTooltipProps>;
+export default CustomTooltip;

package/dist/src/components/Chart/BarChart/components/CustomTooltip/CustomTooltip.style.d.ts

@@ -0,0 +1,6 @@
+import { SerializedStyles } from '@emotion/react';
+import { Theme } from 'theme';
+
+export declare const tickStyle: (fill: string) => () => SerializedStyles;
+export declare const tooltipStyle: () => (theme: Theme) => SerializedStyles;
+export declare const tooltipArrowStyle: () => (theme: Theme) => SerializedStyles;

package/dist/src/components/Chart/BarChart/components/CustomTooltip/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CustomTooltip';

package/dist/src/components/Chart/BarChart/components/CustomTooltipContent/CustomTooltipContent.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { TooltipProps } from 'recharts';
+import { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent';
+
+declare const CustomTooltipContent: React.FCC<TooltipProps<ValueType, NameType>>;
+export default CustomTooltipContent;

package/dist/src/components/Chart/BarChart/components/CustomTooltipContent/CustomTooltipContent.style.d.ts

@@ -0,0 +1,39 @@
+import { Theme } from 'theme';
+
+export declare const tooltipStyle: () => (theme: Theme) => {
+    fontSize: string;
+    padding: string;
+    margin: string;
+    color: string;
+    background: string;
+    opacity: string;
+    borderRadius: string;
+    minWidth: string;
+    whiteSpace: "nowrap";
+};
+export declare const tooltipHrStyle: () => (theme: Theme) => {
+    margin: string;
+    height: string;
+    borderWidth: number;
+    backgroundColor: string;
+    opacity: string;
+};
+export declare const tooltipUlStyle: () => () => {
+    padding: string;
+    margin: string;
+};
+export declare const tooltipLiStyle: () => (theme: Theme) => {
+    listStyleType: string;
+    color: string;
+    width: string;
+    display: string;
+    justifyContent: string;
+    height: string;
+    padding: string;
+    'div:last-child': {
+        marginLeft: string;
+        span: {
+            marginLeft: string;
+        };
+    };
+};

package/dist/src/components/Chart/BarChart/components/CustomTooltipContent/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CustomTooltipContent';

package/dist/src/components/Chart/BarChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './BarChart';

package/dist/src/components/Chart/BarChart/utils.d.ts

@@ -0,0 +1,11 @@
+import { Data } from './BarChart';
+
+type Values = {
+    maxDomainValue: number;
+    tickCount: number;
+};
+export declare const getValues: (max: number | undefined) => Values;
+export declare const customTickFormatter: (tickValue: number, maxDomainValue: number) => string;
+export declare const getBarColors: (data: Data[], defaultColor: string) => string[];
+export declare const getColoringOptions: (data: Data[], operator?: (cur: Data) => string) => {};
+export {};

package/dist/src/components/Chart/Chart.stories.d.ts

@@ -0,0 +1,55 @@
+declare const _default: {
+    title: string;
+    argTypes: {
+        labelX: {
+            type: string;
+        };
+        labelY: {
+            type: string;
+        };
+        isLegendVisible: {
+            type: string;
+        };
+        value: {
+            type: string;
+        };
+        units: {
+            type: string;
+        };
+    };
+    args: {
+        value: string;
+        units: string;
+        labelX: string;
+        labelY: string;
+        isLegendVisible: boolean;
+    };
+};
+export default _default;
+export declare const LineChartStory: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const BarChart: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const DonutChart: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};

package/dist/src/components/Chart/DonutChart/DonutChart.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+
+type Data = {
+    name: string;
+    value: number;
+    color?: string;
+};
+export type DonutChartProps = {
+    /** This property defines the data to be shown in the Donut Chart */
+    data: Data[];
+    /** This property defines the value to be shown in the Donut Chart label */
+    value?: string | number;
+    /** This property defines the units to be shown in the Donut Chart label*/
+    units?: string;
+};
+declare const DonutChart: React.FCC<DonutChartProps>;
+export default DonutChart;

package/dist/src/components/Chart/DonutChart/components/CustomLabel/CustomLabel.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { LabelProps } from 'recharts';
+
+type CustomLabelProps = LabelProps & {
+    value?: string | number;
+    units?: string;
+};
+declare const CustomLabel: React.FCC<CustomLabelProps>;
+export default CustomLabel;

package/dist/src/components/Chart/DonutChart/components/CustomLabel/CustomLabel.style.d.ts

@@ -0,0 +1,5 @@
+import { SerializedStyles } from '@emotion/react';
+import { Theme } from 'theme';
+
+export declare const flexContainer: () => () => SerializedStyles;
+export declare const labelUnitStyle: () => (theme: Theme) => SerializedStyles;

package/dist/src/components/Chart/DonutChart/components/CustomLabel/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CustomLabel';

package/dist/src/components/Chart/DonutChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './DonutChart';

package/dist/src/components/Chart/LineChart/LineChart.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+import { Data } from './utils';
+
+export type LineChartProps = {
+    /** This property defines the data to be shown in the Line Chart */
+    data: Data[];
+    /** Property indicating the label name to be displayed for X axis */
+    labelX?: string;
+    /** Property indicating the label name to be displayed for Y axis */
+    labelY?: string;
+    /**  Define if the legend will be displayed */
+    isLegendVisible?: boolean;
+    /** Function passed as property, so that the user can select colors for each line. If no function is passed or no color is picked for one or more lines, color will be selected randomly  */
+    color?: (dataLabel: string) => string;
+};
+declare const LineChart: React.FC<LineChartProps>;
+export default LineChart;

package/dist/src/components/Chart/LineChart/LineChart.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/components/Chart/LineChart/components/CustomTooltip/CustomTooltip.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { TooltipProps } from 'recharts';
+import { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent';
+
+declare const CustomTooltip: React.FCC<TooltipProps<ValueType, NameType>>;
+export default CustomTooltip;

package/dist/src/components/Chart/LineChart/components/CustomTooltip/CustomTooltip.style.d.ts

@@ -0,0 +1,32 @@
+import { Theme } from 'theme';
+
+export declare const tooltipStyle: () => (theme: Theme) => {
+    fontSize: string;
+    padding: string;
+    color: string;
+    background: string;
+    opacity: string;
+    borderRadius: string;
+    minWidth: string;
+    whiteSpace: "nowrap";
+};
+export declare const tooltipHrStyle: () => (theme: Theme) => {
+    margin: string;
+    height: string;
+    borderWidth: number;
+    backgroundColor: string;
+    opacity: string;
+};
+export declare const tooltipUlStyle: () => () => {
+    padding: number;
+    margin: number;
+};
+export declare const tooltipLiStyle: () => (theme: Theme) => {
+    listStyleType: string;
+    color: string;
+    width: string;
+    display: string;
+    justifyContent: string;
+    height: string;
+    padding: string;
+};

package/dist/src/components/Chart/LineChart/components/CustomTooltip/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CustomTooltip';

package/dist/src/components/Chart/LineChart/components/GradientLine/GradientLine.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+
+type GradientLineProps = {
+    dataLabel: string;
+    color: string;
+};
+declare const _default: React.MemoExoticComponent<({ dataLabel, color }: GradientLineProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export default _default;

package/dist/src/components/Chart/LineChart/components/GradientLine/index.d.ts

@@ -0,0 +1 @@
+export { default } from './GradientLine';

package/dist/src/components/Chart/LineChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './LineChart';

package/dist/src/components/Chart/LineChart/mockedData.d.ts

@@ -0,0 +1,11 @@
+export declare const initData: ({
+    name: string;
+    hidden: number;
+    claimed: number;
+    amt: number;
+} | {
+    name: string;
+    hidden: number;
+    claimed: number;
+    amt?: undefined;
+})[];

package/dist/src/components/Chart/LineChart/story.utils.d.ts

@@ -0,0 +1 @@
+export declare const color: (dataLabel: string) => "" | "#00008B" | "#FFA500" | "#FF0000";

package/dist/src/components/Chart/LineChart/utils.d.ts

@@ -0,0 +1,14 @@
+import { Theme } from 'theme';
+
+export type Data = {
+    name: string;
+    [prop: string]: number | string | undefined;
+};
+type ColorPickerProps = {
+    theme: Theme;
+    uniqueKeyNames: string[];
+    color?: (dataLabel: string) => string;
+};
+export declare const getKeyNames: (data: Data[]) => string[];
+export declare const colorPicker: ({ theme, uniqueKeyNames, color, }: ColorPickerProps) => Record<string, string>;
+export {};

package/dist/src/components/Chart/Wrapper.d.ts

@@ -0,0 +1,8 @@
+import { CategoricalChartProps } from 'recharts/types/chart/generateCategoricalChart';
+
+type ChartProps = CategoricalChartProps;
+type ChartWrapperProps = ChartProps & {
+    aspect?: number;
+};
+declare function Wrapper(Component: any): ({ children, ...rest }: ChartWrapperProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default Wrapper;