@livechat/design-system-react-components 1.5.0 → 1.6.1

package/dist/components/DatePicker/RangeDatePicker.stories.d.ts

@@ -1,4 +0,0 @@
-import { IRangeDatePickerProps } from './types';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, IRangeDatePickerProps>;
-export default _default;
-export declare const RangeDatePicker: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, IRangeDatePickerProps>;

package/dist/components/DatePicker/helpers.d.ts

@@ -1,16 +0,0 @@
-import { Modifiers } from 'react-day-picker';
-import { ClassNames } from 'react-day-picker/types/ClassNames';
-import { IRangeDatePickerProps, IRangeDatePickerState, IRangeDatePickerOption } from './types';
-export declare const isDateWithinRange: (date: Date, range: {
-    from?: Date;
-    to?: Date;
-}) => boolean;
-export declare const calculateDatePickerMonth: (initialFromDate?: Date, initialToDate?: Date, toMonth?: Date) => Date;
-export declare const getRangeDatePickerModifiers: (from?: Date, to?: Date) => Partial<Modifiers>;
-export declare const getSelectedOption: (itemId: string | null, options: IRangeDatePickerOption[]) => IRangeDatePickerOption | undefined;
-export declare const isSelectingFirstDay: (from?: Date, to?: Date) => boolean;
-export declare const getInitialStateFromProps: (props: IRangeDatePickerProps) => Partial<IRangeDatePickerState>;
-export declare const getDatePickerClassNames: (range?: boolean, classNames?: ClassNames) => ClassNames & {
-    start: string;
-    end: string;
-};

package/dist/components/DatePicker/hooks.d.ts

@@ -1,6 +0,0 @@
-import { Dispatch, ReducerAction, ReducerState } from 'react';
-import { IRangeDatePickerProps, RangeDatePickerReducer } from './types';
-export declare const useRangeDatePickerState: (props: IRangeDatePickerProps) => [
-    ReducerState<RangeDatePickerReducer>,
-    Dispatch<ReducerAction<RangeDatePickerReducer>>
-];

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

@@ -1,2 +0,0 @@
-export { DatePicker } from './DatePicker';
-export { RangeDatePicker } from './RangeDatePicker';

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

@@ -1,100 +0,0 @@
-import { Reducer, Ref, ReactElement } from 'react';
-import ReactDayPicker, { DayPickerProps } from 'react-day-picker';
-import { ClassNames } from 'react-day-picker/types/ClassNames';
-export interface IDatePickerProps extends Omit<DayPickerProps, 'todayButton' | 'showWeekNumbers'> {
-    innerRef?: Ref<ReactDayPicker>;
-    range?: boolean;
-}
-export interface IDatePickerNavbarProps {
-    showPreviousButton?: boolean;
-    showNextButton?: boolean;
-    month: Date;
-    fromMonth?: Date;
-    toMonth?: Date;
-    numberOfMonths?: number;
-    className?: string;
-    classNames: ClassNames;
-    onPreviousClick?: () => void;
-    onNextClick?: () => void;
-    onMonthChange: (newMonth: Date) => void;
-}
-export declare enum RangeDatePickerAction {
-    NEW_SELECTED_ITEM = "NEW_SELECTED_ITEM",
-    NEW_TEMPORARY_TO_VALUE = "NEW_TEMPORARY_TO_VALUE",
-    CLEAR = "CLEAR",
-    SET_FROM = "SET_FROM",
-    SET_TO = "SET_TO",
-    SELECT_FIRST_DAY = "SELECT_FIRST_DAY",
-    SELECT_SECOND_DAY_AS_FROM = "SELECT_SECOND_DAY_AS_FROM",
-    SELECT_SECOND_DAY_AS_TO = "SELECT_SECOND_DAY_AS_TO",
-    CURRENT_MONTH_CHANGE = "CURRENT_MONTH_CHANGE"
-}
-export type IRangeDatePickerReducerAction = {
-    type: RangeDatePickerAction.NEW_SELECTED_ITEM;
-    payload: {
-        selectedItem: string | null;
-    };
-} | {
-    type: RangeDatePickerAction.NEW_TEMPORARY_TO_VALUE | RangeDatePickerAction.SELECT_FIRST_DAY | RangeDatePickerAction.SELECT_SECOND_DAY_AS_FROM | RangeDatePickerAction.SELECT_SECOND_DAY_AS_TO | RangeDatePickerAction.CURRENT_MONTH_CHANGE;
-    payload: {
-        date: Date;
-    };
-} | {
-    type: RangeDatePickerAction.SET_FROM | RangeDatePickerAction.SET_TO;
-    payload: {
-        date?: Date;
-    };
-};
-export interface IRangeDatePickerState {
-    selectedItem: string | null;
-    from?: Date;
-    to?: Date;
-    temporaryTo?: Date;
-    currentMonth: Date;
-}
-export type RangeDatePickerReducer = Reducer<IRangeDatePickerState, IRangeDatePickerReducerAction>;
-export interface IRangeDatePickerOption {
-    id: string;
-    label: string;
-    isManual?: boolean;
-    value: {
-        from?: Date;
-        to?: Date;
-    } | null;
-}
-interface IRangeDatePickerChildrenPayloadDatePicker {
-    modifiers?: DayPickerProps['modifiers'];
-    initialMonth?: Date;
-    month: Date;
-    range?: boolean;
-    numberOfMonths: number;
-    fromMonth?: Date;
-    toMonth?: Date;
-    selectedDays?: DayPickerProps['selectedDays'];
-    disabledDays?: DayPickerProps['disabledDays'];
-    onDayMouseEnter: DayPickerProps['onDayMouseEnter'];
-    onDayClick(day: Date): void;
-    onMonthChange(month: Date): void;
-}
-export interface IRangeDatePickerChildrenPayload {
-    select: {
-        selected: string | number;
-        onItemSelect(itemKey: string | number): void;
-    };
-    inputs: {
-        fromDate?: Date;
-        toDate?: Date;
-    };
-    datepicker: IRangeDatePickerChildrenPayloadDatePicker;
-    selectedOption?: IRangeDatePickerOption;
-}
-export interface IRangeDatePickerProps {
-    options: IRangeDatePickerOption[];
-    initialSelectedItemKey?: string;
-    initialFromDate?: Date;
-    initialToDate?: Date;
-    toMonth?: Date;
-    onChange: (selected: IRangeDatePickerOption | null) => void;
-    children(payload: IRangeDatePickerChildrenPayload): ReactElement;
-}
-export {};

package/dist/components/DetailsCard/DetailsCard.d.ts

@@ -1,28 +0,0 @@
-import * as React from 'react';
-export interface IDetailsCardProps {
-    /**
-     * The CSS class for accordion container
-     */
-    className?: string;
-    /**
-     * Set the label
-     */
-    label: string;
-    /**
-     * Define if divider should be visible
-     */
-    withDivider?: boolean;
-    /**
-     * Removes the spacing inside the main container
-     */
-    fullSpaceContent?: boolean;
-    /**
-     * Set if card should be open by default
-     */
-    openOnInit?: boolean;
-    /**
-     * Set to hide the label on card open
-     */
-    hideLabelOnOpen?: boolean;
-}
-export declare const DetailsCard: React.FC<IDetailsCardProps>;

package/dist/components/DetailsCard/DetailsCard.spec.d.ts

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

package/dist/components/DetailsCard/DetailsCard.stories.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-import { IDetailsCardProps } from './DetailsCard';
-declare const _default: {
-    title: string;
-    component: React.FC<IDetailsCardProps>;
-    subcomponents: {
-        DetailsCardInfo: React.FC<import("../DetailsCardInfo/DetailsCardInfo").IDetailsCardInfoProps>;
-    };
-};
-export default _default;
-export declare const Default: {
-    (args: IDetailsCardProps): React.ReactElement;
-    args: {
-        label: string;
-    };
-};
-export declare const ExampleUsage: () => React.ReactElement;

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

@@ -1,2 +0,0 @@
-export { DetailsCard } from './DetailsCard';
-export type { IDetailsCardProps } from './DetailsCard';

package/dist/components/DetailsCardInfo/DetailsCardInfo.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export interface IDetailsCardInfoProps {
-    /**
-     * Set the label
-     */
-    label: string;
-}
-export declare const DetailsCardInfo: React.FC<IDetailsCardInfoProps>;

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

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

package/dist/components/FieldDescription/FieldDescription.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-export type FieldDescriptionProps = React.HTMLAttributes<HTMLSpanElement>;
-export declare const FieldDescription: React.FC<FieldDescriptionProps>;

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

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

package/dist/components/FieldError/FieldError.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-export type FieldErrorProps = React.HTMLAttributes<HTMLSpanElement>;
-export declare const FieldError: React.FC<FieldErrorProps>;

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

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

package/dist/components/FieldGroup/FieldGroup.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export interface FieldGroupProps extends React.HTMLAttributes<HTMLDivElement> {
-    description?: React.ReactNode;
-    error?: string;
-    inline?: boolean;
-    stretch?: boolean;
-}
-export declare const FieldGroup: React.FC<React.PropsWithChildren<FieldGroupProps>>;

package/dist/components/FieldGroup/FieldGroup.spec.d.ts

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

package/dist/components/FieldGroup/FieldGroup.stories.d.ts

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { FieldGroupProps } from './FieldGroup';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, FieldGroupProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const FieldGroup: {
-    ({ ...args }: FieldGroupProps): React.ReactElement;
-    args: FieldGroupProps;
-};

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

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

package/dist/components/FileUploadProgress/FileUploadProgress.d.ts

@@ -1,42 +0,0 @@
-import * as React from 'react';
-import { ProgressSize, ProgressStatus } from '../Progress/constants';
-export type UploadProgressActionState = 'visible' | 'hover' | 'hidden';
-export interface FileUploadProgressProps {
-    /**
-     * Define if action buttons should be visible, visible on hover, or hidden
-     */
-    actionsVisibility?: UploadProgressActionState;
-    /**
-     * The CSS class for progress bar
-     */
-    className?: string;
-    /**
-     * Renders given element
-     */
-    icon?: React.ReactNode;
-    /**
-     * Specify the uploading file name
-     */
-    title: string;
-    /**
-     * Specify the value of current file upload progress (0-100)
-     */
-    progressValue: number;
-    /**
-     * Specify the progress bar size
-     */
-    size?: ProgressSize;
-    /**
-     * Specify the uploading file status
-     */
-    status?: ProgressStatus;
-    /**
-     * The event handler for close icon click
-     */
-    onCloseButtonClick?: () => void;
-    /**
-     * The event handler for retry icon click
-     */
-    onRetryButtonClick?: () => void;
-}
-export declare const FileUploadProgress: React.ExoticComponent<FileUploadProgressProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/FileUploadProgress/FileUploadProgress.stories.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-import { FileUploadProgressProps } from './FileUploadProgress';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, FileUploadProgressProps & React.RefAttributes<HTMLInputElement>>;
-export default _default;
-export declare const FileUploadProgress: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, FileUploadProgressProps>;
-export declare const FileUploadProgressWithIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, FileUploadProgressProps>;
-export declare const FileUploadProgressStates: React.FC;

package/dist/components/FileUploadProgress/FileUploadProgressActions.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { ProgressStatus } from '../Progress/constants';
-interface FileUploadProgressActionsProps {
-    status: ProgressStatus;
-    onCloseButtonClick?: () => void;
-    onRetryButtonClick?: () => void;
-}
-export declare const FileUploadProgressActions: React.FC<FileUploadProgressActionsProps>;
-export {};

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

@@ -1,2 +0,0 @@
-export * from './FileUploadProgress';
-export * from './FileUploadProgressActions';

package/dist/components/Form/Form.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-export interface FormProps extends React.HTMLAttributes<HTMLFormElement> {
-    /**
-     * Set form label
-     */
-    labelText?: string;
-    /**
-     * Set form description
-     */
-    helperText?: string;
-    /**
-     * Footer element
-     */
-    formFooter?: React.ReactNode;
-}
-export declare const Form: React.FC<React.PropsWithChildren<FormProps>>;

package/dist/components/Form/Form.spec.d.ts

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

package/dist/components/Form/Form.stories.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { Story } from '@storybook/react';
-import { FormProps } from '../Form';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, FormProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const Form: Story<FormProps>;

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

@@ -1,2 +0,0 @@
-export { Form } from './Form';
-export type { FormProps } from './Form';

package/dist/components/FormField/FormField.d.ts

@@ -1,40 +0,0 @@
-import * as React from 'react';
-export interface FormFieldProps {
-    /**
-     * Define label text
-     */
-    labelText?: string;
-    /**
-     * Renders given element aligned to label, `inline` will affect
-     */
-    labelAdornment?: React.ReactNode;
-    /**
-     * Define to associate the label with the field
-     */
-    labelFor?: string;
-    /**
-     * The CSS class for field container
-     */
-    className?: string;
-    /**
-     * Set the label to inline version
-     */
-    inline?: boolean;
-    /**
-     * Define error text
-     */
-    error?: string;
-    /**
-     * Define the description text
-     */
-    description?: React.ReactNode;
-    /**
-     * Wrapped element
-     */
-    children?: React.ReactNode;
-    /**
-     * Renders given element above the filed
-     */
-    labelRightNode?: React.ReactNode;
-}
-export declare const FormField: React.FC<FormFieldProps>;

package/dist/components/FormField/FormField.spec.d.ts

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

package/dist/components/FormField/FormField.stories.d.ts

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { FormFieldProps } from './FormField';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, FormFieldProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, FormFieldProps>;
-export declare const Examples: () => React.ReactElement;
-export declare const TextFieldWithError: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, FormFieldProps>;

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

@@ -1 +0,0 @@
-export * from './FormField';

package/dist/components/FormGroup/FormGroup.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-export interface FormGroupProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * The CSS class for container
-     */
-    className?: string;
-    /**
-     * Set form label
-     */
-    labelText?: string;
-    /**
-     * Set form description
-     */
-    helperText?: string;
-}
-export declare const FormGroup: React.FC<React.PropsWithChildren<FormGroupProps>>;

package/dist/components/FormGroup/FormGroup.spec.d.ts

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

package/dist/components/FormGroup/FormGroup.stories.d.ts

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { FormGroupProps } from './FormGroup';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, FormGroupProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const FormGroup: {
-    ({ ...args }: FormGroupProps): React.ReactElement;
-    args: FormGroupProps;
-};

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

@@ -1 +0,0 @@
-export * from './FormGroup';

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

@@ -1,32 +0,0 @@
-import * as React from 'react';
-import { IconSource } from './types';
-export type IconSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
-export type IconKind = 'primary' | 'subtle' | 'inverted' | 'inverted-subtle' | 'link' | 'success' | 'warning' | 'error' | 'negative' | 'positive' | 'action-primary' | 'action-negative' | 'action-positive' | 'action-warning' | 'action-neutral';
-export interface IconProps {
-    /**
-     * Specify the source of svg element
-     */
-    source: IconSource;
-    /**
-     * Specify the icon size
-     */
-    size?: IconSize;
-    /**
-     * Specify the icon kind
-     */
-    kind?: IconKind;
-    /**
-     * Specify whether the icon should be disabled
-     */
-    disabled?: boolean;
-    /**
-     * The CSS class for icon
-     */
-    className?: string;
-    /**
-     * Set the icon custom color
-     */
-    customColor?: string;
-}
-export declare const Icon: React.FC<IconProps>;
-export default Icon;

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

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { IconProps } from './Icon';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, IconProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const Icon: {
-    (args: IconProps): React.ReactElement;
-    args: {
-        source: (props: React.SVGProps<SVGSVGElement>) => JSX.Element;
-        size: string;
-        kind: string;
-        disabled: boolean;
-    };
-};

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

@@ -1,2 +0,0 @@
-export * from './Icon';
-export type { IconSource } from './types';

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

@@ -1,2 +0,0 @@
-import * as React from 'react';
-export type IconSource = React.FC<React.SVGProps<SVGSVGElement>>;

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

@@ -1,29 +0,0 @@
-import * as React from 'react';
-interface InputIcon {
-    source: React.ReactElement;
-    place: 'left' | 'right';
-}
-export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
-    /**
-     * Specify the input size
-     */
-    inputSize?: 'xsmall' | 'compact' | 'medium' | 'large';
-    /**
-     * Specify whether the input should be in error state
-     */
-    error?: boolean;
-    /**
-     * Specify whether the input should be disabled
-     */
-    disabled?: boolean;
-    /**
-     * Set the icon and its position
-     */
-    icon?: InputIcon;
-    /**
-     * Set to enable ellipsis
-     */
-    cropOnBlur?: boolean;
-}
-export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
-export {};

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

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

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

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { Story } from '@storybook/react';
-import { InputProps } from './Input';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, InputProps & React.RefAttributes<HTMLInputElement>>;
-export default _default;
-export declare const Default: Story<InputProps>;
-export declare const Sizes: () => React.ReactElement;
-export declare const States: () => React.ReactElement;
-export declare const Types: () => React.ReactElement;
-export declare const WithIcons: () => React.ReactElement;

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

@@ -1 +0,0 @@
-export * from './Input';

package/dist/components/Link/Link.d.ts

@@ -1,14 +0,0 @@
-import * as React from 'react';
-export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
-    bold: boolean;
-}
-/**
- * Simple component which renders an `<a>` element.
- *
- * Place the `<Link>` inside a `<Text>` component or pass a custom className to set the typography styles.
- *
- * Use `<Button kind="link">` to act as a `<button>` - <a target="_self" href="/story/components-button--kinds">see the story</a>.
- *
- * Use `<Button href="">` to display as a `<Button>` - <a target="_self" href="/story/components-button--link">see the story</a>.
- */
-export declare const Link: React.FC<LinkProps>;

package/dist/components/Link/Link.stories.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { LinkProps } from './Link';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, LinkProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const Link: {
-    ({ ...args }: LinkProps): React.ReactElement;
-    args: {
-        bold: boolean;
-    };
-};

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

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

package/dist/components/Loader/Loader.d.ts

@@ -1,20 +0,0 @@
-import * as React from 'react';
-export interface LoaderProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * Specify the loader size
-     */
-    size?: 'small' | 'medium' | 'large';
-    /**
-     * Specify the loader label
-     */
-    label?: string;
-    /**
-     * Set the loader highlight color
-     */
-    primaryColor?: string;
-    /**
-     * Set the loader color
-     */
-    secondaryColor?: string;
-}
-export declare const Loader: React.FC<LoaderProps>;

package/dist/components/Loader/Loader.spec.d.ts

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

package/dist/components/Loader/Loader.stories.d.ts

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { LoaderProps } from './Loader';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, LoaderProps & {
-    children?: React.ReactNode;
-}>;
-export default _default;
-export declare const Default: (args: LoaderProps) => React.ReactElement;
-export declare const Sizes: () => React.ReactElement;
-export declare const Labeled: (args: LoaderProps) => React.ReactElement;
-export declare const CustomColors: (args: LoaderProps) => React.ReactElement;

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

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