@livechat/design-system-react-components 1.4.0 → 1.6.0

package/dist/components/ActionBar/ActionBar.d.ts

@@ -1,25 +1,3 @@
 import * as React from 'react';
-import { IActionBarOption } from './ActionBarItem';
-export interface IActionBarProps {
-    /**
-     * The CSS class for menu container
-     */
-    className?: string;
-    /**
-     * The unique id key
-     */
-    id?: string;
-    /**
-     * Array of action bar options
-     */
-    options: IActionBarOption[];
-    /**
-     * Set the key for active element
-     */
-    activeOptionKey?: string | null;
-    /**
-     * Set 'scroll' to disable menu and enable scroll
-     */
-    type?: 'menu' | 'scroll';
-}
+import { IActionBarProps } from './types';
 export declare const ActionBar: React.FC<IActionBarProps>;

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 declare const _default: {
     title: string;
-    component: React.FC<import("./ActionBar").IActionBarProps>;
+    component: React.FC<import("./types").IActionBarProps>;
     parameters: {
         layout: string;
     };

package/dist/components/ActionBar/ActionBarItem.d.ts

@@ -1,15 +1,3 @@
 import * as React from 'react';
-export type IActionBarOption = {
-    key: string;
-    element: React.ReactElement;
-    label: string;
-    showTooltip?: boolean;
-    onClick: () => void;
-};
-interface ActionBarItem {
-    option: IActionBarOption;
-    menuItemsKeys: string[];
-    activeOptionKey?: string | null;
-}
-export declare const ActionBarItem: React.FC<ActionBarItem>;
-export {};
+import { IActionBarItem } from './types';
+export declare const ActionBarItem: React.FC<IActionBarItem>;

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

@@ -1,2 +1,2 @@
 export { ActionBar } from './ActionBar';
-export type { IActionBarProps } from './ActionBar';
+export type { IActionBarProps } from './types';

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

@@ -0,0 +1,40 @@
+import * as React from 'react';
+export interface IActionBarProps {
+    /**
+     * The CSS class for menu container
+     */
+    className?: string;
+    /**
+     * The unique id key
+     */
+    id?: string;
+    /**
+     * Array of action bar options
+     */
+    options: IActionBarOption[];
+    /**
+     * Set the key for active element
+     */
+    activeOptionKey?: string | null;
+    /**
+     * Set 'scroll' to disable menu and enable scroll
+     */
+    type?: 'menu' | 'scroll';
+    /**
+     * Set the bar buttons verticaly
+     */
+    vertical?: boolean;
+}
+export interface IActionBarOption {
+    key: string;
+    element: React.ReactElement;
+    label: string;
+    showTooltip?: boolean;
+    onClick: () => void;
+}
+export interface IActionBarItem {
+    option: IActionBarOption;
+    menuItemsKeys: string[];
+    activeOptionKey?: string | null;
+    vertical?: boolean;
+}

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

@@ -1,9 +1,13 @@
 import * as React from 'react';
 export interface IDetailsCardProps {
     /**
-     * The CSS class for accordion container
+     * The CSS class for card container
      */
     className?: string;
+    /**
+     * Additional element for the label
+     */
+    leftNode?: React.ReactNode;
     /**
      * Set the label
      */

package/dist/components/Popover/Popover.d.ts

@@ -1,38 +1,3 @@
 import * as React from 'react';
-import { Placement, flip } from '@floating-ui/react-dom';
-export interface IPopoverProps {
-    children?: React.ReactNode;
-    /**
-     * The CSS class for popover container
-     */
-    className?: string;
-    /**
-     * The CSS class for trigger container
-     */
-    triggerClassName?: string;
-    /**
-     * The popover placement related to the trigger element
-     */
-    placement?: Placement;
-    /**
-     * Set popover visibility
-     */
-    isVisible?: boolean;
-    /**
-     * Set the popover placement to keep it in view
-     */
-    flipOptions?: Parameters<typeof flip>[0];
-    /**
-     * Set `false` if the menu is not to be closed with a esc press
-     */
-    closeOnEsc?: boolean;
-    /**
-     * Trigger element
-     */
-    triggerRenderer: () => React.ReactNode;
-    /**
-     * Optional callback called after popover close
-     */
-    onClose?: () => void;
-}
+import { IPopoverProps } from './types';
 export declare const Popover: React.FC<IPopoverProps>;

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

@@ -1,13 +1,16 @@
 import * as React from 'react';
-import { IPopoverProps } from './Popover';
+import { StoryFn } from '@storybook/react';
+import type { IPopoverProps } from './types';
 declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, IPopoverProps & {
     children?: React.ReactNode;
 }>;
 export default _default;
 export declare const Default: {
     (args: IPopoverProps): React.ReactElement;
+    decorators: ((Story: StoryFn) => React.JSX.Element)[];
     args: {
         placement: string;
-        isVisible: boolean;
+        isVisible: undefined;
+        openedOnInit: boolean;
     };
 };

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

@@ -1 +1,2 @@
 export * from './Popover';
+export type { IPopoverProps } from './types';

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

@@ -0,0 +1,59 @@
+import * as React from 'react';
+import { Placement, UseClickProps, UseDismissProps, FlipOptions } from '@floating-ui/react';
+export interface IPopoverProps {
+    children?: React.ReactNode;
+    /**
+     * The CSS class for popover container
+     */
+    className?: string;
+    /**
+     * The CSS class for trigger container
+     */
+    triggerClassName?: string;
+    /**
+     * The popover placement related to the trigger element
+     */
+    placement?: Placement;
+    /**
+     * Optional handler called on tooltip hide
+     */
+    onClose?: () => void;
+    /**
+     * Optional handler called on tooltip show
+     */
+    onOpen?: () => void;
+    /**
+     * Set popover visibility
+     */
+    isVisible?: boolean;
+    /**
+     * Will open menu on component initialization
+     */
+    openedOnInit?: boolean;
+    /**
+     * Set the popover placement to keep it in view
+     */
+    flipOptions?: FlipOptions;
+    /**
+     * Set the popover offset
+     */
+    offsetSize?: number;
+    /**
+     * Set `false` if the menu is not to be closed with an esc press
+     */
+    closeOnEsc?: boolean;
+    /**
+     * Trigger element
+     */
+    triggerRenderer: React.ReactElement | (() => React.ReactNode);
+    /**
+     * Set the `floating-ui` useDismiss hook params if you need more control
+     * https://floating-ui.com/docs/usedismiss
+     */
+    useDismissHookProps?: UseDismissProps;
+    /**
+     * Set the `floating-ui` useClick hook params if you need more control
+     * https://floating-ui.com/docs/useclick
+     */
+    useClickHookProps?: UseClickProps;
+}