@livechat/design-system-react-components 1.24.2 → 1.26.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { IconSource } from './types';
3
- export type IconSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
3
+ export type IconSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge';
4
4
  export type IconKind = 'primary' | 'subtle' | 'inverted' | 'inverted-subtle' | 'link' | 'success' | 'warning' | 'error' | 'negative' | 'positive' | 'action-primary' | 'action-negative' | 'action-positive' | 'action-warning' | 'action-neutral' | 'lock-black';
5
5
  export interface IconProps {
6
6
  /**
@@ -1,3 +1,2 @@
1
1
  import { ProgressStatus } from './constants';
2
2
  export declare function getPercentNumber(status: ProgressStatus, percent?: number): number;
3
- export declare function getProgressStatus(status: ProgressStatus, percent: number): ProgressStatus;
@@ -1,4 +1,3 @@
1
1
  export type ProgressStatus = 'normal' | 'error' | 'success';
2
2
  export type ProgressSize = 'small' | 'medium' | 'large';
3
- export declare const PROGRESS_STATUSES: ProgressStatus[];
4
3
  export declare const PROGRESS_SIZES: ProgressSize[];
@@ -6,10 +6,26 @@ type HTMLProps = (React.AnchorHTMLAttributes<HTMLAnchorElement> & {
6
6
  href?: never;
7
7
  });
8
8
  export type TabProps = HTMLProps & {
9
+ /**
10
+ * Set to display numeric counter with given number
11
+ */
9
12
  count?: number;
13
+ /**
14
+ * Set to display selected state
15
+ */
10
16
  isSelected?: boolean;
17
+ /**
18
+ * Set to display numeric counter as badge
19
+ */
11
20
  asBadge?: boolean;
21
+ /**
22
+ * Specify the button size
23
+ */
12
24
  size?: Size;
25
+ /**
26
+ * Renders given element
27
+ */
28
+ icon?: React.ReactElement;
13
29
  };
14
30
  export declare const Tab: React.FC<React.PropsWithChildren<TabProps>>;
15
31
  export {};
@@ -2,7 +2,6 @@ import { CSSProperties } from 'react';
2
2
  import { IconKind } from '../Icon';
3
3
  import { TooltipTheme } from './types';
4
4
  export declare function getIconType(theme: TooltipTheme): IconKind;
5
- export declare const sleep: (milliseconds: number) => Promise<void>;
6
5
  export declare function getArrowPositionStyles(arrowOffsetY?: number, arrowOffsetX?: number, arrowY?: number, arrowX?: number): CSSProperties | undefined;
7
6
  export declare const getArrowTokens: (tooltipStyle: string | undefined) => {
8
7
  stroke: string;
@@ -1,10 +1,3 @@
1
1
  import * as React from 'react';
2
- import { TooltipTheme } from '../types';
3
- export declare const Info: React.FC<{
4
- className?: string;
5
- header?: string;
6
- text: string;
7
- closeWithX?: boolean;
8
- theme?: TooltipTheme;
9
- handleCloseAction?: (ev: React.MouseEvent) => void;
10
- }>;
2
+ import { ITooltipInfoProps } from '../types';
3
+ export declare const Info: React.FC<ITooltipInfoProps>;
@@ -1,15 +1,3 @@
1
1
  import * as React from 'react';
2
- import { TooltipButton, TooltipTheme } from '../types';
3
- export declare const Interactive: React.FC<{
4
- header?: string;
5
- text: string;
6
- image?: {
7
- src: string;
8
- alt: string;
9
- };
10
- closeWithX?: boolean;
11
- theme?: TooltipTheme;
12
- handleCloseAction?: (ev: React.MouseEvent) => void;
13
- primaryButton: TooltipButton;
14
- secondaryButton: TooltipButton;
15
- }>;
2
+ import { ITooltipInteractiveProps } from '../types';
3
+ export declare const Interactive: React.FC<ITooltipInteractiveProps>;
@@ -1,4 +1,4 @@
1
1
  export { Tooltip } from './Tooltip';
2
2
  export { Simple, Info, Interactive, Reports } from './components';
3
3
  export { UserGuide } from './components/UserGuide';
4
- export type { ITooltipProps } from './types';
4
+ export type { ITooltipProps, ITooltipInfoProps, ITooltipInteractiveProps, } from './types';
@@ -1,12 +1,11 @@
1
1
  import * as React from 'react';
2
2
  import { Placement, VirtualElement, UseDismissProps, Strategy, UseClickProps } from '@floating-ui/react';
3
- import { ButtonKind } from '../Button';
3
+ import { ButtonProps } from '../Button';
4
4
  export type TooltipTheme = 'invert' | 'important' | undefined;
5
5
  export type TooltipButton = {
6
6
  handleClick: () => void;
7
7
  label: string;
8
- kind?: ButtonKind;
9
- };
8
+ } & Omit<ButtonProps, 'onClick'>;
10
9
  export interface ITooltipProps {
11
10
  /**
12
11
  * The CSS class for tooltip
@@ -127,3 +126,66 @@ export interface ITooltipProps {
127
126
  */
128
127
  floatingStrategy?: Strategy;
129
128
  }
129
+ export interface ITooltipInfoProps {
130
+ /**
131
+ * The CSS class for Info tooltip
132
+ */
133
+ className?: string;
134
+ /**
135
+ * The Info tooltip header
136
+ */
137
+ header?: string;
138
+ /**
139
+ * The Info tooltip text
140
+ */
141
+ text: string;
142
+ /**
143
+ * Set to show close button
144
+ */
145
+ closeWithX?: boolean;
146
+ /**
147
+ * The Info tooltip theme
148
+ */
149
+ theme?: TooltipTheme;
150
+ /**
151
+ * The Info tooltip close button action
152
+ */
153
+ handleCloseAction?: (ev: React.MouseEvent) => void;
154
+ }
155
+ export interface ITooltipInteractiveProps {
156
+ /**
157
+ * The Interactive tooltip header
158
+ */
159
+ header?: string;
160
+ /**
161
+ * The Interactive tooltip text
162
+ */
163
+ text: string;
164
+ /**
165
+ * The Interactive tooltip image
166
+ */
167
+ image?: {
168
+ src: string;
169
+ alt: string;
170
+ };
171
+ /**
172
+ * Set to show close button
173
+ */
174
+ closeWithX?: boolean;
175
+ /**
176
+ * The Interactive tooltip theme
177
+ */
178
+ theme?: TooltipTheme;
179
+ /**
180
+ * The Interactive tooltip close button action
181
+ */
182
+ handleCloseAction?: (ev: React.MouseEvent) => void;
183
+ /**
184
+ * The Interactive tooltip primary button props
185
+ */
186
+ primaryButton: TooltipButton;
187
+ /**
188
+ * The Interactive tooltip secondary button props
189
+ */
190
+ secondaryButton?: TooltipButton;
191
+ }
@@ -1,4 +1,4 @@
1
- export type TTextSize = 'xs' | 'sm' | 'md';
1
+ export type TTextSize = 'xs' | 'sm' | 'md' | 'lg';
2
2
  export type THeadingSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
3
3
  export type TDisplaySize = 'sm' | 'md' | 'lg' | 'max';
4
4
  export type TTextAlign = 'left' | 'right' | 'center' | 'justify';