@livechat/design-system-react-components 2.2.2 → 2.3.0

package/dist/foundations/design-token.d.ts

@@ -0,0 +1,374 @@
+export declare const DesignToken: {
+    /** @deprecated */
+    Background: string;
+    Background01: string;
+    Background02: string;
+    Background03: string;
+    /** @deprecated */
+    SurfaceBasicDefault: string;
+    SurfacePrimaryDefault: string;
+    /** @deprecated */
+    SurfaceBasicSubtle: string;
+    SurfaceSecondaryDefault: string;
+    SurfaceSecondaryHover: string;
+    SurfaceSecondaryActive: string;
+    SurfaceSecondaryDisabled: string;
+    /** @deprecated */
+    SurfacePrimaryHoverOpacity: string;
+    /** @deprecated */
+    SurfaceBasicHover: string;
+    SurfacePrimaryHover: string;
+    /** @deprecated */
+    SurfaceBasicActive: string;
+    SurfacePrimaryActive: string;
+    SurfacePrimaryActiveColored: string;
+    /** @deprecated */
+    SurfaceBasicDisabled: string;
+    SurfacePrimaryDisabled: string;
+    SurfaceTertiaryDefault: string;
+    /** @deprecated */
+    SurfaceSecondarySubtle: string;
+    SurfaceModerateDefault: string;
+    SurfaceModerateHover: string;
+    SurfaceModerateActive: string;
+    SurfaceTertiaryHover: string;
+    SurfaceTertiaryActive: string;
+    SurfaceTertiaryDisabled: string;
+    /** @deprecated */
+    SurfaceFeedbackInfo: string;
+    SurfaceAccentEmphasisLowInfo: string;
+    /** @deprecated */
+    SurfaceFeedbackNegative: string;
+    SurfaceAccentEmphasisLowNegative: string;
+    /** @deprecated */
+    SurfaceFeedbackWarning: string;
+    SurfaceAccentEmphasisLowWarning: string;
+    /** @deprecated */
+    SurfaceFeedbackPositive: string;
+    SurfaceAccentEmphasisLowPositive: string;
+    SurfaceAccentEmphasisLowPurple: string;
+    SurfaceAccentEmphasisMinInfo: string;
+    SurfaceAccentEmphasisMinNegative: string;
+    SurfaceAccentEmphasisMinWarning: string;
+    SurfaceAccentEmphasisMinPositive: string;
+    SurfaceAccentEmphasisMinPurple: string;
+    SurfaceAccentOndarkNegativeDefault: string;
+    SurfaceAccentOndarkNegativeHover: string;
+    SurfaceAccentOndarkWarningDefault: string;
+    SurfaceAccentOndarkWarningHover: string;
+    SurfaceAccentOndarkInfoDefault: string;
+    SurfaceAccentOndarkInfoHover: string;
+    SurfaceAccentOndarkPositiveDefault: string;
+    SurfaceAccentOndarkPositiveHover: string;
+    SurfaceAccentEmphasisSubtleNegative: string;
+    SurfaceAccentEmphasisSubtleWarning: string;
+    SurfaceAccentEmphasisSubtleInfo: string;
+    SurfaceAccentEmphasisSubtlePositive: string;
+    /** @deprecated */
+    SurfaceInvertDefault: string;
+    SurfaceInvertPrimary: string;
+    /** @deprecated */
+    SurfaceInvertSubtle: string;
+    SurfaceInvertSecondary: string;
+    SurfaceInvertDisabled: string;
+    SurfaceLockedDefault: string;
+    SurfaceLockedHover: string;
+    SurfaceLockedActive: string;
+    SurfaceLockedDisabled: string;
+    SurfaceLockedWhite: string;
+    SurfaceLockedBlack: string;
+    SurfaceAccentEmphasisMediumNegative: string;
+    SurfaceAccentEmphasisMediumPositive: string;
+    SurfaceAccentEmphasisHighInfo: string;
+    SurfaceAccentEmphasisHighNegative: string;
+    SurfaceAccentEmphasisHighWarning: string;
+    SurfaceAccentEmphasisHighPositive: string;
+    SurfaceAccentEmphasisHighPurple: string;
+    SurfaceOpacityBasicHover: string;
+    SurfaceOpacityBasicActive: string;
+    SurfaceOpacityInvertHover: string;
+    SurfaceOpacityInvertActive: string;
+    /** @deprecated */
+    SurfaceOverlay: string;
+    SurfaceGradient01: string;
+    SurfaceGradient02: string;
+    SurfaceGradient03: string;
+    SurfaceGradient04: string;
+    SurfaceGradient05: string;
+    SurfaceGradient06: string;
+    SurfaceGradient07: string;
+    SurfaceGradient08: string;
+    SurfaceGradient09: string;
+    SurfaceGradient10: string;
+    SurfaceGradient11: string;
+    SurfaceGradient12: string;
+    SurfaceGradient13: string;
+    SurfaceGradient14: string;
+    SurfaceOtherOverlay: string;
+    SurfaceOtherAgent: string;
+    SurfaceOtherAgentHover: string;
+    SurfaceOtherSkeleton: string;
+    /** @deprecated */
+    SurfaceOtherInternalNote: string;
+    SurfaceOtherInternalNoteHover: string;
+    SurfaceOtherVisitor: string;
+    SurfaceOtherVisitorHover: string;
+    /** @deprecated */
+    ContentDefault: string;
+    ContentBasicPrimary: string;
+    /** @deprecated */
+    ContentSubtle: string;
+    ContentBasicSecondary: string;
+    /** @deprecated */
+    ContentDisabled: string;
+    ContentBasicDisabled: string;
+    ContentBasicNegative: string;
+    ContentBasicWarning: string;
+    ContentBasicPositive: string;
+    ContentBasicInfo: string;
+    ContentBasicPurple: string;
+    ContentBasicGradient01: string;
+    /** @deprecated */
+    ContentWhiteLocked: string;
+    ContentLockedWhite: string;
+    /** @deprecated */
+    ContentBlackLocked: string;
+    ContentLockedBlack: string;
+    ContentLockedDefault: string;
+    ContentLockedHover: string;
+    ContentLockedActive: string;
+    ContentLockedDisabled: string;
+    /** @deprecated */
+    ContentInvertDefault: string;
+    ContentInvertPrimary: string;
+    /** @deprecated */
+    ContentInvertSubtle: string;
+    ContentInvertSecondary: string;
+    ContentInvertDisabled: string;
+    ContentInvertGradient01: string;
+    /** @deprecated */
+    BorderDefault: string;
+    BorderBasicPrimary: string;
+    BorderBasicSecondary: string;
+    /** @deprecated */
+    BorderSubtle: string;
+    BorderBasicTertiary: string;
+    /** @deprecated */
+    BorderHover: string;
+    BorderBasicHover: string;
+    /** @deprecated */
+    BorderDisabled: string;
+    BorderBasicDisabled: string;
+    BorderBasicNegative: string;
+    BorderBasicWarning: string;
+    BorderBasicPositive: string;
+    BorderBasicInfo: string;
+    BorderBasicPurple: string;
+    BorderBasicContrast: string;
+    /** @deprecated */
+    BorderInvertDefault: string;
+    BorderInvertPrimary: string;
+    /** @deprecated */
+    BorderInvertSubtle: string;
+    BorderInvertSecondary: string;
+    BorderInvertHover: string;
+    BorderInvertDisabled: string;
+    /** @deprecated */
+    ColorActionActive: string;
+    ActionPrimaryActive: string;
+    /** @deprecated */
+    ColorActionHover: string;
+    ActionPrimaryHover: string;
+    /** @deprecated */
+    ColorActionDefault: string;
+    ActionPrimaryDefault: string;
+    ColorActionDefaultRgb: string;
+    /** @deprecated */
+    ColorActionDisabled: string;
+    ActionPrimaryDisabled: string;
+    /** @deprecated */
+    ColorNegativeActive: string;
+    ActionNegativeActive: string;
+    /** @deprecated */
+    ColorNegativeHover: string;
+    ActionNegativeHover: string;
+    /** @deprecated */
+    ColorNegativeDefault: string;
+    ActionNegativeDefault: string;
+    /** @deprecated */
+    ColorNegativeDisabled: string;
+    ActionNegativeDisabled: string;
+    /** @deprecated */
+    ColorWarningDefault: string;
+    ActionWarningDefault: string;
+    /** @deprecated */
+    ColorWarningHover: string;
+    ActionWarningHover: string;
+    ActionWarningDisabled: string;
+    /** @deprecated */
+    ColorPositiveDefault: string;
+    ActionPositiveDefault: string;
+    /** @deprecated */
+    ColorPositiveHover: string;
+    ActionPositiveHover: string;
+    /** @deprecated */
+    ColorPositiveDisabled: string;
+    ActionPositiveDisabled: string;
+    ActionNeutralDefault: string;
+    ActionNeutralHover: string;
+    ActionNeutralDisabled: string;
+    ActionHighContrastDefault: string;
+    ActionHighContrastHover: string;
+    ActionHighContrastActive: string;
+    ActionHighContrastDisabled: string;
+    /** @deprecated */
+    ColorBot: string;
+    SurfaceOtherBot: string;
+    SurfaceOtherBotHover: string;
+    ColorBlack: string;
+    ColorWhite: string;
+    DecorBlue900: string;
+    DecorBlue800: string;
+    DecorBlue700: string;
+    DecorBlue600: string;
+    DecorBlue500: string;
+    DecorBlue400: string;
+    DecorBlue300: string;
+    DecorBlue200: string;
+    DecorBlue100: string;
+    DecorBlue50: string;
+    DecorOrange900: string;
+    DecorOrange800: string;
+    DecorOrange700: string;
+    DecorOrange600: string;
+    DecorOrange500: string;
+    DecorOrange400: string;
+    DecorOrange300: string;
+    DecorOrange200: string;
+    DecorOrange100: string;
+    DecorOrange50: string;
+    DecorYellow900: string;
+    DecorYellow800: string;
+    DecorYellow700: string;
+    DecorYellow600: string;
+    DecorYellow500: string;
+    DecorYellow400: string;
+    DecorYellow300: string;
+    DecorYellow200: string;
+    DecorYellow100: string;
+    DecorYellow50: string;
+    DecorGray950: string;
+    DecorGray900: string;
+    DecorGray800: string;
+    DecorGray700: string;
+    DecorGray600: string;
+    DecorGray500: string;
+    DecorGray400: string;
+    DecorGray300: string;
+    DecorGray200: string;
+    DecorGray150: string;
+    DecorGray100: string;
+    DecorGray75: string;
+    DecorGray50: string;
+    DecorGray40: string;
+    DecorGray20: string;
+    DecorGreen900: string;
+    DecorGreen800: string;
+    DecorGreen700: string;
+    DecorGreen600: string;
+    DecorGreen500: string;
+    DecorGreen400: string;
+    DecorGreen300: string;
+    DecorGreen200: string;
+    DecorGreen100: string;
+    DecorGreen50: string;
+    DecorRed900: string;
+    DecorRed800: string;
+    DecorRed700: string;
+    DecorRed600: string;
+    DecorRed500: string;
+    DecorRed400: string;
+    DecorRed300: string;
+    DecorRed200: string;
+    DecorRed100: string;
+    DecorRed50: string;
+    DecorPurple900: string;
+    DecorPurple800: string;
+    DecorPurple700: string;
+    DecorPurple600: string;
+    DecorPurple500: string;
+    DecorPurple400: string;
+    DecorPurple300: string;
+    DecorPurple200: string;
+    DecorPurple100: string;
+    DecorPurple50: string;
+    DecorBrown50: string;
+    DecorBrown300: string;
+    ProductsLivechat: string;
+    ProductsHelpdesk: string;
+    ProductsChatbot: string;
+    ProductsKnowledgebase: string;
+    IllustrationsPrimary: string;
+    IllustrationsSecondary: string;
+    IllustrationsStroke: string;
+    TagSurface01: string;
+    TagContent01: string;
+    BtnBasicBackgroundEnabled: string;
+    BtnBasicBackgroundHover: string;
+    BtnBasicBackgroundDisabled: string;
+    BtnBasicBackgroundActive: string;
+    BtnBasicBackgroundLoading: string;
+    BtnSecondaryBackgroundEnabled: string;
+    BtnSecondaryBackgroundHover: string;
+    BtnSecondaryBackgroundDisabled: string;
+    BtnSecondaryBackgroundActive: string;
+    BtnSecondaryBackgroundLoading: string;
+    BtnPlainIconBackgroundHover: string;
+    BtnPlainIconBackgroundActive: string;
+    PickerListBackground: string;
+    PickerListGroupBackground: string;
+    PickerListOptionBackgroundHover: string;
+    PickerListOptionBackgroundActiveHover: string;
+    PickerListOptionBackgroundFocus: string;
+    PickerListOptionBackgroundActive: string;
+    PopoverBackground: string;
+    SurfaceAvatar1: string;
+    SurfaceAvatar2: string;
+    SurfaceAvatar3: string;
+    SurfaceAvatar4: string;
+    SurfaceAvatar5: string;
+    SurfaceAvatar6: string;
+    SurfaceAvatar7: string;
+    SurfaceAvatar8: string;
+    SurfaceAvatar9: string;
+    SurfaceAvatar10: string;
+    NavbarBackground: string;
+    TooltipBackgroundBasic: string;
+    TooltipBackgroundInvert: string;
+    TooltipBorder: string;
+    TooltipBorderForSvg: string;
+    AnimatedGradientValue1: string;
+    AnimatedGradientValue2: string;
+    AnimatedGradientValue3: string;
+    ContentBasicInternalNote: string;
+    ContentBasicBot: string;
+    ActionLockDefault: string;
+    ActionLockHover: string;
+    ActionLockActive: string;
+    ActionLockDisabled: string;
+    SurfaceOtherInternalNoteMessageArea: string;
+    SurfaceOtherInternalNoteDefault: string;
+    ContentBasicInternalNoteMessagePlaceholder: string;
+    ContentBasicInternalNoteMessageActive: string;
+    OnePopoverMessageBackgroundDefault: string;
+    OnePopoverBorderDefault: string;
+    OnePopoverBorderActive: string;
+    OneTooltipBackground: string;
+    ContentBasicAutofill: string;
+    ProductsHello: string;
+    ProductsPlatform: string;
+    SurfaceCheckListItemOpenBackground: string;
+    SurfaceCheckListBackground: string;
+    ContentBasicPlaceholder: string;
+};
+export type DesignTokenKey = keyof typeof DesignToken;

package/dist/foundations/index.d.ts

@@ -0,0 +1,5 @@
+export { DesignToken } from './design-token';
+export { SpacingToken } from './spacing-token';
+export { ShadowToken } from './shadow-token';
+export { RadiusToken } from './radius-token';
+export { TransitionDurationToken, TransitionTimingToken, TransitionDelayToken, } from './transition-token';

package/dist/foundations/radius-token.d.ts

@@ -0,0 +1,13 @@
+export declare const RadiusToken: {
+    Radius0: string;
+    Radius1: string;
+    Radius2: string;
+    Radius3: string;
+    Radius4: string;
+    0: string;
+    1: string;
+    2: string;
+    3: string;
+    4: string;
+};
+export type RadiusTokenKey = keyof typeof RadiusToken;

package/dist/foundations/shadow-token.d.ts

@@ -0,0 +1,24 @@
+export declare const ShadowToken: {
+    Float: string;
+    PopOver: string;
+    Modal: string;
+    Tooltip: string;
+    TooltipArrowBottom: string;
+    TooltipArrowTop: string;
+    TooltipArrowRight: string;
+    TooltipArrowLeft: string;
+    TooltipArrow: string;
+    Focus: string;
+    DividerBottom: string;
+    DividerTop: string;
+    DividerBottomLeft: string;
+    DividerTopLeft: string;
+    DividerTopRight: string;
+    DividerBottomRight: string;
+    MessageBox: string;
+    FixedRight: string;
+    FixedLeft: string;
+    FixedTop: string;
+    FixedBottom: string;
+};
+export type ShadowTokenKey = keyof typeof ShadowToken;

package/dist/foundations/spacing-token.d.ts

@@ -0,0 +1,22 @@
+export declare const SpacingToken: {
+    Spacing0: string;
+    Spacing05: string;
+    Spacing1: string;
+    Spacing2: string;
+    Spacing3: string;
+    Spacing4: string;
+    Spacing5: string;
+    Spacing6: string;
+    Spacing7: string;
+    Spacing8: string;
+    Spacing9: string;
+    Spacing10: string;
+    Spacing11: string;
+    Spacing12: string;
+    Spacing14: string;
+    Spacing16: string;
+    Spacing18: string;
+    Spacing20: string;
+    Spacing24: string;
+};
+export type SpacingTokenKey = keyof typeof SpacingToken;

package/dist/foundations/transition-token.d.ts

@@ -0,0 +1,17 @@
+export declare const TransitionDurationToken: {
+    Fast1: string;
+    Fast2: string;
+    Moderate1: string;
+};
+export type TransitionDurationTokenKey = keyof typeof TransitionDurationToken;
+export declare const TransitionTimingToken: {
+    EaseIn: string;
+    EaseOut: string;
+};
+export type TransitionTimingTokenKey = keyof typeof TransitionTimingToken;
+export declare const TransitionDelayToken: {
+    Instant: string;
+    Moderate: string;
+    Slow: string;
+};
+export type TransitionDelayTokenKey = keyof typeof TransitionDelayToken;

package/dist/hooks/helpers.d.ts

@@ -0,0 +1,3 @@
+import { NODE } from './types';
+
+export declare const resizeCallback: (node: NODE, handler: (newSize: DOMRectReadOnly) => void) => void;

package/dist/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export { useAnimations } from './useAnimations';
+export { useHeightResizer } from './useHeightResizer';
+export { useMobileViewDetector } from './useMobileViewDetector';

package/dist/hooks/types.d.ts

@@ -0,0 +1,13 @@
+export type NODE = HTMLDivElement | null;
+export type CALLBACK = (newSize: DOMRectReadOnly) => void;
+export interface IUseHeightResizer {
+    size: number;
+    handleResizeRef: (node: NODE) => void;
+}
+export interface IUseMobileViewDetectorProps {
+    mobileBreakpoint: number;
+}
+export interface IUseMobileViewDetector {
+    isMobile: boolean;
+    handleResizeRef: (node: NODE) => void;
+}

package/dist/hooks/useAnimations.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+interface UseAnimationsProps {
+    isVisible: boolean;
+    elementRef: React.RefObject<HTMLDivElement>;
+}
+interface IUseAnimations {
+    isOpen: boolean;
+    isMounted: boolean;
+    setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
+}
+export declare const useAnimations: ({ isVisible, elementRef, }: UseAnimationsProps) => IUseAnimations;
+export {};

package/dist/hooks/useHeightResizer.d.ts

@@ -0,0 +1,3 @@
+import { IUseHeightResizer } from './types';
+
+export declare const useHeightResizer: () => IUseHeightResizer;

package/dist/hooks/useMobileViewDetector.d.ts

@@ -0,0 +1,3 @@
+import { IUseMobileViewDetector, IUseMobileViewDetectorProps } from './types';
+
+export declare const useMobileViewDetector: ({ mobileBreakpoint, }: IUseMobileViewDetectorProps) => IUseMobileViewDetector;

package/dist/hooks/useSharedResizeObserver.d.ts

@@ -0,0 +1,6 @@
+import { CALLBACK, NODE } from './types';
+
+export declare const useSharedResizeObserver: {
+    observe: (node: NODE, callback: CALLBACK) => void;
+    unobserve: (node: NODE) => void;
+};