@orfium/ictinus 5.5.0 → 5.5.2

package/dist/src/components/Search/Search.test.d.ts

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

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

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

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

@@ -0,0 +1,11 @@
+import { FilterProps, SingleFilterProps } from '../Filter';
+import { TextFieldProps } from '../TextField';
+
+export type filterConfig = Pick<FilterProps & SingleFilterProps, 'selectedFilter' | 'onChange' | 'onClear' | 'defaultValue' | 'label' | 'items'>;
+export type SearchFilterConfig = {
+    filterConfig?: filterConfig;
+};
+export type SearchProps = {
+    /** A callback that's called when the user clicks the 'clear' icon */
+    onClear: () => void;
+} & Omit<TextFieldProps, 'label' | 'size' | 'mask' | 'isMulti' | 'tags' | 'onMultiValueDelete' | 'onMultiValueClearAll' | 'status' | 'suffix' | 'isInteractive'> & SearchFilterConfig;

package/dist/src/components/Search/StatefulSearch.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+import { SearchProps } from './Search.types';
+
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<Partial<SearchProps> & React.RefAttributes<HTMLInputElement>>>;
+export default _default;

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

@@ -0,0 +1,5 @@
+export declare const LABEL = "Friends";
+export declare const options: {
+    label: string;
+    value: string;
+}[];

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

@@ -0,0 +1,3 @@
+export { default } from './Search';
+export { default as StatefulSearch } from './StatefulSearch';
+export * from './Search.types';

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

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { SelectOption, SelectProps } from './types';
+
+export declare const emptyValue: SelectOption;
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLInputElement>>>;
+export default _default;

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

@@ -0,0 +1,123 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<import('./types').SelectProps & import('react').RefAttributes<HTMLInputElement>>>;
+    parameters: {
+        design: {
+            type: string;
+            name: string;
+            url: string;
+        }[];
+    };
+    args: {
+        hintMessage: string;
+        label: string;
+        isSearchable: boolean;
+    };
+    argTypes: {
+        status: {
+            type: string;
+            options: string[];
+        };
+    };
+};
+export default _default;
+export declare const SelectSizes: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const SimpleSelect: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const SearchableSelect: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const SelectWithUncontrolledState: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+    name: string;
+};
+export declare const SimpleSelectWithGroups: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const SelectWithAsyncSearch: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const SelectWithEdgeCase: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const MultiSelect: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const SelectStatuses: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+    name: string;
+};
+export declare const DisabledSelect: {
+    render: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            disable: boolean;
+        };
+    };
+};
+export declare const Playground: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};

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

@@ -0,0 +1,5 @@
+import { SerializedStyles } from '@emotion/react';
+import { Theme } from '../../theme';
+
+export declare const selectWrapper: () => (theme: Theme) => SerializedStyles;
+export declare const suffixContainer: (isOpen: boolean, isSearchable: boolean) => () => SerializedStyles;

package/dist/src/components/Select/Select.test.d.ts

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

package/dist/src/components/Select/StatefulSelect.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+import { SelectProps } from './types';
+
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLInputElement>>>;
+export default _default;

package/dist/src/components/Select/components/SelectMenu/SelectMenu.d.ts

@@ -0,0 +1,27 @@
+import { CSSObject } from '@emotion/react';
+import { default as React } from 'react';
+import { ComponentSizes } from 'types';
+import { SelectOption } from '../../types';
+import { TextInputBaseProps } from '../../../TextInputBase';
+
+export type SelectMenuProps = {
+    filteredOptions: SelectOption[];
+    handleOptionClick: (option: SelectOption) => void;
+    selectedOption: SelectOption;
+    isLoading?: boolean;
+    isVirtualized?: boolean;
+    hasSelectAllOption?: boolean;
+    size?: ComponentSizes;
+    sx?: CSSObject;
+} & Pick<TextInputBaseProps, 'status'>;
+declare const SelectMenu: React.ForwardRefExoticComponent<{
+    filteredOptions: SelectOption[];
+    handleOptionClick: (option: SelectOption) => void;
+    selectedOption: SelectOption;
+    isLoading?: boolean;
+    isVirtualized?: boolean;
+    hasSelectAllOption?: boolean;
+    size?: ComponentSizes;
+    sx?: CSSObject;
+} & Pick<TextInputBaseProps, "status"> & React.RefAttributes<HTMLUListElement>>;
+export default SelectMenu;

package/dist/src/components/Select/components/SelectMenu/SelectMenu.style.d.ts

@@ -0,0 +1,12 @@
+import { SerializedStyles } from '@emotion/react';
+import { Theme } from 'theme';
+import { SelectMenuProps } from './SelectMenu';
+import { TextFieldProps } from '../../../TextField/TextField';
+
+export declare const optionStyle: ({ isSelected, hasNoResultsExist, }: {
+    isSelected: boolean;
+    hasNoResultsExist?: boolean;
+} & Omit<TextFieldProps, 'ref' | 'label'>) => (theme: Theme) => SerializedStyles;
+export declare const menuStyle: ({ status, isVirtualized, height, sx, }: SelectMenuProps & Omit<TextFieldProps, 'ref' | 'label'> & {
+    height: number;
+}) => (theme: Theme) => SerializedStyles;

package/dist/src/components/Select/components/SelectMenu/index.d.ts

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

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

@@ -0,0 +1,45 @@
+import { SelectOption } from './types';
+
+export declare const SELECT_ALL_OPTION: SelectOption;
+/** Stories */
+export declare const options: ({
+    value: string;
+    label: string;
+    isDisabled?: undefined;
+} | {
+    value: string;
+    label: string;
+    isDisabled: boolean;
+})[];
+export declare const optionsWithHelperInDisabled: ({
+    value: string;
+    label: string;
+    helperText?: undefined;
+    isDisabled?: undefined;
+} | {
+    value: string;
+    label: string;
+    helperText: string;
+    isDisabled: boolean;
+})[];
+export declare const groupOptions: ({
+    value: string;
+    label: string;
+    options: {
+        value: string;
+        label: string;
+    }[];
+} | {
+    value: string;
+    label: string;
+    options?: undefined;
+})[];
+export declare const defaultValue: {
+    value: string;
+    label: string;
+    isDisabled?: undefined;
+} | {
+    value: string;
+    label: string;
+    isDisabled: boolean;
+};

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

@@ -0,0 +1,4 @@
+export { default } from './Select';
+export { default as StatefulSelect } from './StatefulSelect';
+export * from './Select';
+export * from './types';

package/dist/src/components/Select/storyUtils.d.ts

@@ -0,0 +1,6 @@
+import { SelectOption } from './types';
+
+export declare const options: SelectOption[];
+export declare const optionsWithHelperInDisabled: SelectOption[];
+export declare const groupOptions: SelectOption[];
+export declare const defaultValue: SelectOption;

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

@@ -0,0 +1,66 @@
+import { InputHTMLAttributes } from 'react';
+import { TestProps } from '../../utils/types';
+import { IconProps } from '../Icon';
+import { TextFieldProps } from '../TextField';
+
+export type SelectOptionValues = {
+    value: string | number;
+    label: string;
+    /** refer to Icon component for more details */
+    iconProps?: IconProps;
+};
+export type SelectOptionBase = {
+    isDisabled?: boolean;
+    /** helper text that show under item text */
+    helperText?: string;
+    tooltipInfo?: string;
+    options?: SelectOption[];
+    isCreated?: boolean;
+};
+export type SelectOption = SelectOptionBase & SelectOptionValues;
+type InputProps = Partial<Omit<InputHTMLAttributes<HTMLInputElement>, 'size' & 'onChange'>>;
+export type MultiSelectProps = {
+    /** The function that is used to return the selected options */
+    onChange?: (selectedOption: SelectOption[]) => void;
+    /** If true the user can select multiple options */
+    isMulti: true;
+    /** The selected options in case of multiSelect */
+    /** @TODO merge selectedOption with selectedOptions in v5 */
+    selectedOption?: SelectOption[];
+};
+export type SingleSelectProps = {
+    /** The function that is used to return the selected options */
+    onChange?: (selectedOption?: SelectOption) => void;
+    /** If false the user can select one option */
+    isMulti?: never;
+    /** the value of the select if select is controlled */
+    selectedOption?: SelectOption;
+};
+export type SelectProps = {
+    /** Options for the select dropdown */
+    options: SelectOption[];
+    /** if the component is used asynchronously */
+    isAsync?: boolean;
+    /** the function to fetch new options */
+    asyncSearch?: (term: string) => void;
+    /** after how many characters to start searching (default = 0) */
+    minCharactersToSearch?: number;
+    /** if searched text should be highlighted in available options */
+    hasHighlightSearch?: boolean;
+    /** if the options are searchable */
+    isSearchable?: boolean;
+    /** data-testid suffix */
+    dataTestId?: string;
+    /** if component is loading */
+    isLoading?: boolean;
+    /** if options list is virtualized */
+    isVirtualized?: boolean;
+    /**
+     * If true, then in the case of a searched option that is not found in the Options list of MultiSelect,
+     * the user can create this option.
+     * */
+    isCreatable?: boolean;
+    /** Whether the MultiSelect should have a Select All option */
+    hasSelectAllOption?: boolean;
+} & (MultiSelectProps | SingleSelectProps) & Omit<TextFieldProps, 'onChange' | 'mask'> & Omit<InputProps, 'onChange' | 'size'> & TestProps;
+export {};

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

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+import { TestProps } from '../../utils/types';
+
+export type SliderProps = {
+    /** Determines if the Slider is disabled or not */
+    isDisabled?: boolean;
+    /** Determines if the Slider will show increments along its track */
+    hasIncrements?: boolean;
+    /** Called when a thumb is moved, provides new values */
+    onChange: (values: number[]) => void;
+    /** Called when a change is finished (mouse/touch up, or keyup), provides current values.
+     * Use this event when you have to make for example ajax request with new values. */
+    onBlur?: (values: number[]) => void;
+    /** Determines the position of the rendered thumbs and the type of the Slider. 1 value means it's a Selector,
+     * while 2 values mean it's a Range. Defaults to [0, 100] */
+    values: [number] | [number, number];
+};
+export declare const STEP_WITH_INCREMENTS = 20;
+export declare const MIN = 0;
+export declare const MAX = 100;
+declare const Slider: React.FC<SliderProps & TestProps>;
+export default Slider;

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

@@ -0,0 +1,42 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import('react').FC<import('./Slider').SliderProps & import('../..').TestProps>;
+};
+export default _default;
+export declare const RangeSliderDontTest: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const RangeSliderWithIncrementsDontTest: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const SelectorSliderDontTest: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};
+export declare const SelectorSliderWithIncrementsDontTest: {
+    render: (args: any) => import("@emotion/react/jsx-runtime").JSX.Element;
+    name: string;
+    parameters: {
+        controls: {
+            include: string[];
+        };
+    };
+};

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare const Container: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const InputsContainer: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const InputContainer: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/src/components/Slider/components/SliderMark/SliderMark.d.ts

@@ -0,0 +1,13 @@
+import { FCC } from 'react';
+import { IMarkProps } from 'react-range/lib/types';
+import { TestProps } from '../../../../utils/types';
+
+export type SliderMarkProps = {
+    values: number[];
+    isDisabled: boolean;
+    index: number;
+    isSelector: boolean;
+    restProps: IMarkProps;
+};
+declare const SliderMark: FCC<SliderMarkProps & TestProps>;
+export default SliderMark;

package/dist/src/components/Slider/components/SliderMark/SliderMark.style.d.ts

@@ -0,0 +1,17 @@
+import { CSSProperties } from 'react';
+
+export declare const Mark: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+} & {
+    background: string;
+    isDisabled: boolean;
+    labelValue: string;
+    restStyleProps: CSSProperties;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const MarkHoverCircle: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+} & {
+    isDisabled: boolean;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/src/components/Slider/components/SliderMark/index.d.ts

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

package/dist/src/components/Slider/components/SliderThumb/SliderThumb.d.ts

@@ -0,0 +1,12 @@
+import { FCC } from 'react';
+import { IThumbProps } from 'react-range/lib/types';
+import { TestProps } from '../../../../utils/types';
+
+export interface SliderThumbProps {
+    isDisabled: boolean;
+    value: number;
+    initialValue: number | undefined;
+    restProps: IThumbProps;
+}
+declare const SliderThumb: FCC<SliderThumbProps & TestProps>;
+export default SliderThumb;

package/dist/src/components/Slider/components/SliderThumb/SliderThumb.style.d.ts

@@ -0,0 +1,10 @@
+import { CSSProperties } from 'react';
+
+export declare const Thumb: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+} & {
+    isDisabled: boolean;
+    isChanged: boolean;
+    restStyleProps: CSSProperties;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/src/components/Slider/components/SliderThumb/index.d.ts

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

package/dist/src/components/Slider/components/SliderTrack/SliderTrack.d.ts

@@ -0,0 +1,12 @@
+import { FCC } from 'react';
+import { ITrackProps } from 'react-range/lib/types';
+import { TestProps } from '../../../../utils/types';
+
+export type SliderTrackProps = {
+    values: number[];
+    isDisabled: boolean;
+    isSelector: boolean;
+    restProps: ITrackProps;
+};
+declare const SliderTrack: FCC<SliderTrackProps & TestProps>;
+export default SliderTrack;

package/dist/src/components/Slider/components/SliderTrack/SliderTrack.style.d.ts

@@ -0,0 +1,10 @@
+import { CSSProperties } from 'react';
+
+export declare const Track: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: import('react').ElementType<any, keyof import("react").JSX.IntrinsicElements>;
+} & {
+    background: string;
+    restStyleProps: CSSProperties;
+    isDisabled: boolean;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/src/components/Slider/components/SliderTrack/index.d.ts

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

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

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

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

@@ -0,0 +1,70 @@
+import { default as React } from 'react';
+import { ExtendedColumn, Sort, SortingOrder } from './types';
+
+export type ContentComponent<T> = (data: Cell<T>) => React.ReactNode;
+export type Cell<T> = {
+    /** the content of the cell to be displayed. You can pass also custom component. `ContentComponent: (data: Cell<T>) => React.ReactNode`. The type defines that will be a function that returns cell to use cell data.  */
+    content: number | string | ContentComponent<T>;
+    /** the truncated tooltip content, you can override it or it will take the content @default content */
+    tooltipContent?: string;
+    /** show or not the truncated tooltip @default true if the text is truncated */
+    hasTruncatedTooltip?: boolean;
+    /** the colSpan of the cell to be displayed */
+    colSpan?: number;
+    /** the type of the cell to be displayed @default normal */
+    type?: 'financial' | 'normal';
+    /** the alignment of the cell to be displayed */
+    align?: 'left' | 'right';
+    /** the width of the cell to be displayed */
+    widthPercentage?: number;
+};
+export type Row<T> = {
+    /** the id of the row */
+    id: string | number;
+    /** the cells of the row, see Cell type for each */
+    cells: Cell<T>[];
+    /** the expanded content of the row, if its expandable */
+    expanded?: ({ row, isSelected, isExpanded, }: {
+        row: Row<T>;
+        isSelected: boolean;
+        isExpanded: boolean;
+    }) => React.ReactNode;
+    rowSpan?: number;
+};
+export type Selection = string | number;
+export type TableType = 'normal' | 'nested-header';
+export type TableProps<T> = {
+    /** The data for the table that needs to display. */
+    data: Row<T>[];
+    /** An array of titles or objects to define columns. */
+    columns: (string | ExtendedColumn)[];
+    /** Boolean defining if the header is fixed or not. */
+    hasFixedHeader?: boolean;
+    /** Boolean defining if the CTA's container is fixed or not. */
+    hasFixedCTA?: boolean;
+    /** Type of the table which determine the headers display. */
+    type?: TableType;
+    /** Boolean defining the padding all over the table cells and rows. */
+    isPadded?: boolean;
+    /** Function that once provided on each check will return the selection. */
+    onCheck?: (data: Selection[]) => void;
+    /** Function that once provided will provide the currently selected sorting configuration */
+    onSort?: (column: string, order: SortingOrder) => void;
+    /** Initial sorting column and order. Should be provided along with onSort */
+    initialSort?: Sort;
+    /** If provided sort will only work with this option (asc or desc only). By default supports bidirectional sort*/
+    sortDir?: SortingOrder;
+    /** Top left text on the table - showing a counter, text etc. */
+    topLeftText?: string | React.ReactElement;
+    /** Top right area to define a custom component for buttons or other usage. */
+    topRightArea?: (data: Row<T>[], selectionData?: Selection[]) => React.ReactNode;
+    /** Action cell width for Table with Expandable Rows (in %)*/
+    actionWidth?: number;
+    /** If true, table's expandable rows will be expanded on initial render. */
+    isInitiallyExpanded?: boolean;
+    /** Data test id prefix for all th/td elements */
+    dataTestIdPrefix?: string;
+};
+declare function Table<T>({ data, columns, type, hasFixedHeader, hasFixedCTA, onCheck, isPadded, onSort, initialSort, sortDir, topLeftText, topRightArea, actionWidth, isInitiallyExpanded, dataTestIdPrefix, }: TableProps<T>): import("@emotion/react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof Table>;
+export default _default;